Skip to content

Feature: Improve teacher feedback for fetch failures and empty classrooms #606

Description

@NewtonLC

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:

Image

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)

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions