Description
PR #603 fixed a crash that occurred when the student data server was offline. The fix returns [] on any fetch failure, which prevents the crash — but leaves the teacher with a blank dashboard and no explanation. This issue tracks two follow-on UX improvements that build on that fix.
Problem 1 — The teacher can't tell if the fetch failed
fetchStudentData() currently returns [] for three distinct situations:
| Case |
Cause |
Relevant long-term? |
| Missing env var |
MOCK_USER_DATA_URL not set |
No — dev/config only |
| Bad HTTP response |
Server returned 4xx/5xx |
Yes |
| Network error |
Server unreachable |
Yes |
The calling code in pages/dashboard/[id].js receives [] in all cases and passes it straight to DashTabs as data. There's no way to distinguish a failed fetch from an empty class.
Proposed fix:
Return a structured result from fetchStudentData() instead of a bare array:
// Success
return { error: null, data: await response.json() };
// Runtime failures (surface to teacher)
return { error: 'FETCH_FAILED', status: response.status, data: null };
return { error: 'NETWORK_ERROR', data: null };
// Config issue (dev only — keep silent, log only)
console.warn('MOCK_USER_DATA_URL is not defined.');
return { error: 'MISSING_URL', data: null };
[id].js would pass the error code as a prop. For runtime failures, the dashboard UI would render an error message: "We couldn't load your students. Please try refreshing, or contact support at support@freecodecamp.org if the problem persists." The MISSING_URL case should remain a silent console log, as it's dev-facing.
Problem 2 — Empty classrooms show nothing
When a class has no students yet, DashTabs renders a blank page:
Proposed fix:
In getServerSideProps in [id].js, include fccUserIds in the classroom query. If it's empty, the dashboard should not render an empty table. Instead, it should:
- Tell the teacher there are no students in the class yet
- Display the classroom's join link with a copy button
- Instruct the teacher to share the link with their students
Files likely affected
util/student/fetchStudentData.js
pages/dashboard/[id].js
- The component(s) rendered by
DashTabs that display student data
prisma query in pages/dashboard/[id].js (add fccUserIds to the select)
Description
PR #603 fixed a crash that occurred when the student data server was offline. The fix returns
[]on any fetch failure, which prevents the crash — but leaves the teacher with a blank dashboard and no explanation. This issue tracks two follow-on UX improvements that build on that fix.Problem 1 — The teacher can't tell if the fetch failed
fetchStudentData()currently returns[]for three distinct situations:MOCK_USER_DATA_URLnot setThe calling code in
pages/dashboard/[id].jsreceives[]in all cases and passes it straight toDashTabsasdata. There's no way to distinguish a failed fetch from an empty class.Proposed fix:
Return a structured result from
fetchStudentData()instead of a bare array:[id].jswould pass the error code as a prop. For runtime failures, the dashboard UI would render an error message: "We couldn't load your students. Please try refreshing, or contact support at support@freecodecamp.org if the problem persists." TheMISSING_URLcase should remain a silent console log, as it's dev-facing.Problem 2 — Empty classrooms show nothing
When a class has no students yet,
DashTabsrenders a blank page:Proposed fix:
In
getServerSidePropsin[id].js, includefccUserIdsin the classroom query. If it's empty, the dashboard should not render an empty table. Instead, it should:Files likely affected
util/student/fetchStudentData.jspages/dashboard/[id].jsDashTabsthat display student dataprismaquery inpages/dashboard/[id].js(addfccUserIdsto the select)