Fixed admin dashboard

code100x · Aug 20, 2024 · 7551f8a · 7551f8a
1 parent 51df739
commit 7551f8a
Show file tree

Hide file tree

Showing 7 changed files with 76 additions and 48 deletions.
diff --git a/src/app/admin/content/[courseId]/[...moduleId]/page.tsx b/src/app/admin/content/[courseId]/[...moduleId]/page.tsx
@@ -13,18 +13,20 @@ export default async function UpdateCourseContent({
   const rest = params.moduleId;
   const course = await getCourse(parseInt(courseId, 10));
   const fullCourseContent = await getFullCourseContent(parseInt(courseId, 10));
+
   const courseContent = findContentById(
     fullCourseContent,
     rest.map((x) => parseInt(x, 10)),
   );
-  const contentType =
-    courseContent?.length === 1 ? courseContent[0]?.type : 'folder';
+  const contentType = courseContent?.folder
+    ? 'folder'
+    : courseContent?.value?.type;
 
   if (contentType === 'video') {
     return (
       <div className="mx-auto max-w-screen-xl justify-between p-4 text-white">
         {/* @ts-ignore */}
-        <UpdateVideoClient content={courseContent[0]} />
+        <UpdateVideoClient content={courseContent.value} />
       </div>
     );
   }
@@ -49,7 +51,7 @@ export default async function UpdateCourseContent({
       <AdminCourseContent
         rest={rest}
         // @ts-ignore
-        courseContent={courseContent?.map((x: any) => ({
+        courseContent={courseContent?.value?.map((x: any) => ({
           title: x?.title || '',
           image: x?.thumbnail || '',
           id: x?.id || 0,

diff --git a/src/app/admin/content/[courseId]/page.tsx b/src/app/admin/content/[courseId]/page.tsx
@@ -16,8 +16,9 @@ export default async function UpdateCourseContent({
     fullCourseContent,
     rest.map((x) => parseInt(x, 10)),
   );
-  const contentType =
-    courseContent?.length === 1 ? courseContent[0]?.type : 'folder';
+  const contentType = courseContent?.folder
+    ? 'folder'
+    : courseContent?.value.type;
 
   if (contentType === 'video') {
     return (
@@ -46,7 +47,7 @@ export default async function UpdateCourseContent({
       <AdminCourseContent
         rest={rest}
         // @ts-ignore
-        courseContent={courseContent?.map((x: any) => ({
+        courseContent={courseContent?.value.map((x: any) => ({
           title: x?.title || '',
           image: x?.thumbnail || '',
           id: x?.id || 0,

diff --git a/src/app/courses/[courseId]/[...moduleId]/page.tsx b/src/app/courses/[courseId]/[...moduleId]/page.tsx
@@ -20,15 +20,12 @@ export default async function Course({
     fullCourseContent,
     rest.map((x) => parseInt(x, 10)),
   );
-  const contentType =
-    courseContent?.length === 1 ? courseContent[0]?.type : 'folder';
   const nextContent = null; //await getNextVideo(Number(rest[rest.length - 1]))
 
   return (
     <CourseView
       rest={rest}
       course={course}
-      contentType={contentType}
       nextContent={nextContent}
       courseContent={courseContent}
       fullCourseContent={fullCourseContent}

diff --git a/src/app/courses/[courseId]/page.tsx b/src/app/courses/[courseId]/page.tsx
@@ -15,15 +15,13 @@ export default async function Course({
   const fullCourseContent = await getFullCourseContent(parseInt(courseId, 10));
 
   const courseContent = findContentById(fullCourseContent, []);
-  const contentType =
-    courseContent?.length === 1 ? courseContent[0]?.type : 'folder';
+
   const nextContent = null;
 
   return (
     <CourseView
       rest={[]}
       course={course}
-      contentType={contentType}
       nextContent={nextContent}
       courseContent={courseContent}
       fullCourseContent={fullCourseContent}

diff --git a/src/components/CourseView.tsx b/src/components/CourseView.tsx
@@ -1,4 +1,4 @@
-import { FullCourseContent } from '@/db/course';
+import { ChildCourseContent, FullCourseContent } from '@/db/course';
 import { ContentRenderer } from './admin/ContentRenderer';
 import { FolderView } from './FolderView';
 import { NotionRenderer } from './NotionRenderer';
@@ -13,19 +13,29 @@ export const CourseView = ({
   fullCourseContent,
   courseContent,
   nextContent,
-  contentType,
   searchParams,
   possiblePath,
 }: {
   fullCourseContent: FullCourseContent[];
   rest: string[];
   course: any;
-  courseContent: any;
+  courseContent:
+    | {
+        folder: true;
+        value: ChildCourseContent[];
+      }
+    | {
+        folder: false;
+        value: ChildCourseContent;
+      }
+    | null;
   nextContent: any;
-  contentType: any;
   searchParams: QueryParams;
   possiblePath: string;
 }) => {
+  const contentType = courseContent?.folder
+    ? 'folder'
+    : courseContent?.value.type;
   return (
     <>
       <div className="mb-2 flex max-h-fit min-h-[2.5rem] items-center px-4">
@@ -37,40 +47,42 @@ export const CourseView = ({
           rest={rest}
         />
       </div>
-      {contentType === 'notion' ? (
-        <NotionRenderer id={courseContent[0]?.id} />
+      {!courseContent?.folder && courseContent?.value.type === 'notion' ? (
+        <NotionRenderer id={courseContent?.value?.id?.toString()} />
       ) : null}
 
-      {contentType === 'video' ? (
+      {!courseContent?.folder && contentType === 'video' ? (
         <ContentRenderer
           nextContent={nextContent}
           content={{
-            thumbnail: courseContent[0]?.thumbnail || '',
-            id: courseContent[0]?.id || 0,
-            title: courseContent[0]?.title || '',
+            thumbnail: courseContent?.value?.thumbnail || '',
+            id: courseContent?.value.id || 0,
+            title: courseContent?.value?.title || '',
             type: contentType || 'video',
-            description: courseContent[0]?.description || '',
+            description: courseContent?.value?.description || '',
             markAsCompleted:
-              courseContent[0]?.videoProgress?.markAsCompleted || false,
-            bookmark: courseContent[0].bookmark,
+              courseContent?.value?.videoProgress?.markAsCompleted || false,
+            bookmark: courseContent?.value.bookmark ?? null,
           }}
         />
       ) : null}
-      {(contentType === 'video' || contentType === 'notion') && (
-        <Comments
-          content={{
-            id: courseContent[0]?.id || 0,
-            courseId: parseInt(course.id, 10) || 0,
-            commentCount: courseContent[0]?.commentsCount || 0,
-            possiblePath,
-          }}
-          searchParams={searchParams}
-        />
-      )}
-      {contentType === 'folder' ? (
+      {!courseContent?.folder &&
+        (contentType === 'video' || contentType === 'notion') && (
+          <Comments
+            content={{
+              id: courseContent?.value?.id || 0,
+              courseId: parseInt(course.id, 10) || 0,
+              //@ts-ignore
+              commentCount: courseContent?.value.commentsCount || 0,
+              possiblePath,
+            }}
+            searchParams={searchParams}
+          />
+        )}
+      {courseContent?.folder ? (
         <FolderView
           rest={rest}
-          courseContent={courseContent?.map((x: any) => ({
+          courseContent={courseContent?.value.map((x: any) => ({
             title: x?.title || '',
             image: x?.thumbnail || '',
             type: x?.type || 'folder',
@@ -79,6 +91,7 @@ export const CourseView = ({
             percentComplete: getFolderPercentCompleted(x?.children),
             videoFullDuration: x?.videoProgress?.videoFullDuration || 0,
             duration: x?.videoProgress?.duration || 0,
+            bookmark: null,
           }))}
           courseId={parseInt(course.id, 10)}
         />

diff --git a/src/db/course.ts b/src/db/course.ts
@@ -256,11 +256,13 @@ interface VideoProgress {
   videoFullDuration: number | null;
 }
 
+export type ChildCourseContent = {
+  videoProgress: VideoProgress | null;
+  bookmark?: Bookmark;
+} & ContentWithMetadata;
+
 export type FullCourseContent = {
-  children?: ({
-    videoProgress: VideoProgress | null;
-    bookmark?: Bookmark;
-  } & ContentWithMetadata)[];
+  children?: ChildCourseContent[];
   videoProgress: VideoProgress | null;
   bookmark?: Bookmark;
 } & ContentWithMetadata;

diff --git a/src/lib/find-content-by-id.ts b/src/lib/find-content-by-id.ts
@@ -1,10 +1,25 @@
-import { FullCourseContent } from '@/db/course';
+import { ChildCourseContent, FullCourseContent } from '@/db/course';
 
+// findContentById
+// This is incorrect.
+// If the place you are in is a folder
+// It returns all the children
+// If the place you are in is a video
+// It returns an array with that video as the first element.
 export default function findContentById(
   contents: FullCourseContent[],
   ids: number[],
-) {
-  if (ids.length === 0) return contents;
+):
+  | {
+      folder: true;
+      value: ChildCourseContent[];
+    }
+  | {
+      folder: false;
+      value: ChildCourseContent;
+    }
+  | null {
+  if (ids.length === 0) return { folder: true, value: contents };
 
   const currentId = ids[0];
   const remainingIds = ids.slice(1);
@@ -15,10 +30,10 @@ export default function findContentById(
     return null;
   } else if (remainingIds.length === 0) {
     if (foundContent.type === 'folder') {
-      return foundContent.children;
+      return { folder: true, value: foundContent.children ?? [] }; // [Object]
     }
 
-    return [foundContent];
+    return { folder: false, value: foundContent };
   }
 
   return findContentById(foundContent?.children || [], remainingIds);