Issue Fetching All Classes from Canvas API in React Project

[grande_ilvr]

Hello everyone,

I'm currently a university student with a fairly rudimentary level of experience with React and JS. I'm developing a Chrome extension using React that interfaces with the Canvas API to retrieve all of my active courses for integration with another REST API. However, I’m encountering an issue where only three out of my total enrolled courses are being displayed on the console. I’m confident that I’m enrolled in more courses (currently 4 for this semester and I took 5 last semester), but the API only returns three in each instance.

Here’s a brief overview of what I’m doing:

Setup:

1. React Component: I have a simple form where I input my Canvas API token and the institution subdomain. When I submit the form, it triggers a call to the getActiveCourses function from the canvasApi.js file.

2. API Class: In my CanvasApi class, I’m using the /courses endpoint to retrieve the courses and then filtering based on start_at and end_at to determine active courses.

I've attached a screenshot of the relevant function (let me know if I ought to remove it)

[seanbeirnes]

Hello @grande_ilvr,

What courses are returned when you console log the result of response.json(), bypassing the active course filtering code below that?

One theory is that your university may lock the visibility of courses to students after they are concluded. In that case, you will still get a course object back in the API, but only with the ID and the access_restricted_by_date field set to "true." Your JavaScript will then be trying to read the "start_at" and "end_at" fields that do not exist. JavaScript considers them "undefined" if they don't exist (and it will not throw an error in this case), so that will make the return statement in the filter function evaluate to "false" because (undefined && undefined) is false.

[grande_ilvr]

Without the active filtering, I wasn't able to see the courses with limited visibility as you theorized. Strangely enough though, I don't see the courses that I'm currently enrolled in either. This occurs at a certain point that I theorize to take place at a specific alphanumeric value (specifically none of my classes that don't start with a 'C' are visible). I expanded upon this theory by the date filtering as well. As is visualized in the screenshot,  Iam able to see courses from both this semester and last semester but only classes that start with the letter 'C'

Should I expand my query? Is pagination available or even necessary in this case?

[seanbeirnes · Accepted solution]

Then it sounds like you do retain access to concluded courses and the problem you are running into is pagination. By default, only the first 10 items of a list are returned in the Canvas API. You can either add a "per_page=#" query parameter (replacing # with a number higher than 10) or you could rewrite your code to look for the "next" link in the link header as described in the Canvas API docs. Alternatively, you could let the API do the filtering part for you by using the "enrollment_state=active" query parameter.

[grande_ilvr]

Thank you so much! I really appreciate it