fix: handle for no activity or courses student layer 2 dash (#669)

UnlockedLabs · Jan 19, 2025 · 7c81bb0 · 7c81bb0
1 parent 59ddf7a
commit 7c81bb0
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 15 deletions.
diff --git a/frontend/src/Components/dashboard/ResidentWeeklyActivityTable.tsx b/frontend/src/Components/dashboard/ResidentWeeklyActivityTable.tsx
@@ -18,7 +18,7 @@ export default function ResidentWeeklyActivityTable({
                         </tr>
                     </thead>
                     <tbody className="flex flex-col gap-4 mt-4 overflow-auto h-36 scrollbar">
-                        {courses ? (
+                        {courses.length > 0 ? (
                             courses.map(
                                 (course: RecentCourse, index: number) => {
                                     const totalTime = convertSeconds(

diff --git a/frontend/src/Pages/StudentDashboard.tsx b/frontend/src/Pages/StudentDashboard.tsx
@@ -34,19 +34,25 @@ export default function StudentLayer2() {
             <h1 className="text-5xl">Hi, {user.name_first ?? 'Student'}!</h1>
             <h2> Pick Up Where You Left Off</h2>
             <div className="card card-row-padding flex flex-col gap-3">
-                <div className="gap-3 grid grid-cols-4">
-                    {courses
-                        .slice(0, slice)
-                        .map((course: RecentCourse, index: number) => {
-                            return (
-                                <CourseCard
-                                    course={course}
-                                    recent
-                                    key={index}
-                                />
-                            );
-                        })}
-                </div>
+                {courses.length > 0 ? (
+                    <div className="gap-3 grid grid-cols-4">
+                        {courses
+                            .slice(0, slice)
+                            .map((course: RecentCourse, index: number) => {
+                                return (
+                                    <CourseCard
+                                        course={course}
+                                        recent
+                                        key={index}
+                                    />
+                                );
+                            })}
+                    </div>
+                ) : (
+                    <p className="body">
+                        You are not currently enrolled in any courses.
+                    </p>
+                )}
                 {courses.length > 4 && (
                     <button
                         className="flex justify-end text-teal-3 hover:text-teal-4 body"

diff --git a/frontend/src/routeLoaders.ts b/frontend/src/routeLoaders.ts
@@ -74,7 +74,7 @@ export const getStudentLayer2Data: LoaderFunction = async () => {
 
     return json({
         courses: courses.courses,
-        week_activity: activity.activities
+        week_activity: activity.activities || []
     });
 };