code100x · MuraliChowdhary · Apr 4, 2025 · Apr 4, 2025 · Apr 4, 2025
diff --git a/package.json b/package.json
@@ -50,6 +50,7 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "cmdk": "1.0.0",
+    "cms": "file:",
     "date-fns": "^3.6.0",
     "dayjs": "^1.11.10",
     "discord-oauth2": "^2.11.0",
@@ -61,7 +62,7 @@
     "katex": "^0.16.11",
     "lucide-react": "^0.321.0",
     "moment": "^2.30.1",
-    "next": "14.0.2",
+    "next": "^14.0.3",
     "next-auth": "^4.24.5",
     "next-themes": "^0.2.1",
     "nextjs-toploader": "^1.6.11",
@@ -107,5 +108,6 @@
     "typescript": "^5.4.5",
     "vitest": "^1.6.0",
     "vitest-mock-extended": "^1.3.1"
-  }
+  },
+  "packageManager": "[email protected]+sha1.abc117858086cb10ecb54828d180b035cb6c8fdd"
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
@@ -84,7 +84,7 @@ model NotionMetadata {
   @@unique([contentId])
 }
 
-model VideoMetadata {
+model  VideoMetadata {
   id                         Int             @id @default(autoincrement())
   contentId                  Int
   appxVideoId                String?

diff --git a/prisma/seed.ts b/prisma/seed.ts
@@ -140,6 +140,33 @@ async function seedContent() {
         parentId: folderId,
         commentsCount: 0,
       },
+      {
+        type: 'video',
+        title: 'My test video for week 1',
+        hidden: false,
+        thumbnail:
+          'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/images/week-1-orientation.jpg',
+        parentId: folderId,
+        commentsCount: 0,
+      },
+      {
+        type: 'video',
+        title: 'My test video for week 1',
+        hidden: false,
+        thumbnail:
+          'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/images/week-1-orientation.jpg',
+        parentId: folderId,
+        commentsCount: 0,
+      },
+      {
+        type: 'video',
+        title: 'My test video for week 1',
+        hidden: false,
+        thumbnail:
+          'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/images/week-1-orientation.jpg',
+        parentId: folderId,
+        commentsCount: 0,
+      },
     ];
 
     const createdContent = await db.content.createMany({ data: contentData });

diff --git a/src/app/courses/[courseId]/[...moduleId]/page.tsx b/src/app/courses/[courseId]/[...moduleId]/page.tsx
@@ -1,8 +1,8 @@
 import { QueryParams } from '@/actions/types';
 import { CourseView } from '@/components/CourseView';
-import { getCourse, getFullCourseContent } from '@/db/course';
+import { getCourse, getFullCourseContent, getNextVideo, getPrevVideo } from '@/db/course';
 import findContentById from '@/lib/find-content-by-id';
-
+ 
 export default async function Course({
   params,
   searchParams,
@@ -15,18 +15,24 @@ export default async function Course({
   const possiblePath = params.moduleId.join('/');
   const course = await getCourse(parseInt(courseId, 10));
   const fullCourseContent = await getFullCourseContent(parseInt(courseId, 10));
-
+  console.log(fullCourseContent, 'fullCourseContent');
   const courseContent = findContentById(
     fullCourseContent,
     rest.map((x) => parseInt(x, 10)),
   );
-  const nextContent = null; //await getNextVideo(Number(rest[rest.length - 1]))
+
+  console.log(rest, 'rest');
+  console.log(rest.length);
+  const nextContent = await getNextVideo(Number(rest[rest.length - 1]));
+  const prevContent= await getPrevVideo(Number(rest[rest.length - 1]));
+  console.log(courseId, 'courseId');
 
   return (
     <CourseView
       rest={rest}
       course={course}
       nextContent={nextContent}
+      prevContent={prevContent}
       courseContent={courseContent}
       fullCourseContent={fullCourseContent}
       searchParams={searchParams}

diff --git a/src/app/courses/[courseId]/page.tsx b/src/app/courses/[courseId]/page.tsx
@@ -15,14 +15,16 @@ export default async function Course({
   const fullCourseContent = await getFullCourseContent(parseInt(courseId, 10));
 
   const courseContent = findContentById(fullCourseContent, []);
-
-  const nextContent = null;
-
+   console.log(courseContent, 'courseContent');
+  console.log(fullCourseContent, 'fullCourseContent');
+  const nextContent =null;
+  const prevContent=null;
   return (
     <CourseView
       rest={[]}
       course={course}
       nextContent={nextContent}
+      prevContent={prevContent}
       courseContent={courseContent}
       fullCourseContent={fullCourseContent}
       searchParams={searchParams}

diff --git a/src/components/CourseView.tsx b/src/components/CourseView.tsx
@@ -14,6 +14,7 @@ export const CourseView = ({
   fullCourseContent,
   courseContent,
   nextContent,
+  prevContent,
   searchParams,
   possiblePath,
 }: {
@@ -31,6 +32,7 @@ export const CourseView = ({
       }
     | null;
   nextContent: any;
+  prevContent: any;
   searchParams: QueryParams;
   possiblePath: string;
 }) => {
@@ -59,6 +61,7 @@ export const CourseView = ({
       {!courseContent?.folder && (contentType === 'video' || contentType === 'appx') ? (
         <ContentRenderer
           nextContent={nextContent}
+          prevContent={prevContent}
           content={{
             thumbnail: courseContent?.value?.thumbnail || '',
             id: courseContent?.value.id || 0,

diff --git a/src/components/admin/ContentRenderer.tsx b/src/components/admin/ContentRenderer.tsx
@@ -130,12 +130,18 @@ export const getMetadata = async (contentId: number) => {
 export const ContentRenderer = async ({
   content,
   nextContent,
+  prevContent 
 }: {
   nextContent: {
     id: number;
     type: string;
     title: string;
   } | null;
+  prevContent: {
+    id: number;
+    type: string;
+    title: string;
+  } | null;
   content: {
     type: 'video' | 'appx';
     id: number;
@@ -159,6 +165,7 @@ export const ContentRenderer = async ({
     <div>
       <ContentRendererClient
         nextContent={nextContent}
+        prevContent={prevContent}
         metadata={metadata}
         content={{ ...content, appxVideoId, appxCourseId }}
       />

diff --git a/src/components/admin/ContentRendererClient.tsx b/src/components/admin/ContentRendererClient.tsx
@@ -11,12 +11,18 @@ export const ContentRendererClient = ({
   metadata,
   content,
   nextContent,
+  prevContent,
 }: {
   nextContent: {
     id: number;
     type: string;
     title: string;
   } | null;
+  prevContent: {
+    id: number;
+    type: string;
+    title: string;
+  } | null;
   metadata: any;
   content: {
     type: 'video' | 'appx';
@@ -32,8 +38,8 @@ export const ContentRendererClient = ({
   const [showChapters, setShowChapters] = useState(
     metadata?.segments?.length > 0,
   );
+
   const searchParams = useSearchParams();
-
   const router = useRouter();
 
   //@ts-ignore
@@ -73,6 +79,27 @@ export const ContentRendererClient = ({
     setShowChapters((prev) => !prev);
   };
 
+  const handleNavigateToContent = (id?: number) => {
+    if (!id) return;
+
+    const url = new URL(window.location.href);
+    const pathnameParts = url.pathname.split('/');
+    if (!isNaN(Number(pathnameParts[pathnameParts.length - 1]))) {
+      pathnameParts[pathnameParts.length - 1] = id.toString();
+    } else {
+      pathnameParts.push(id.toString());
+    }
+
+    const newPath = pathnameParts.join('/');
+    router.push(newPath);
+  };
+
+  const handleGoToFolder = () => {
+    const segments = window.location.pathname.split("/");  
+    const folderPath = segments.slice(0, 4).join("/");     
+    router.push(folderPath);
+  };
+
   return (
     <div className="flex w-full flex-col gap-2">
       <div className="flex w-full flex-col">
@@ -93,7 +120,7 @@ export const ContentRendererClient = ({
                 overridenative: true,
               },
             },
-            thumbnail: metadata.thumbnail || false, // data.isComposite ? data.thumbnails[0] : null,
+            thumbnail: metadata.thumbnail || false,
             isComposite: true,
             height: 720,
             width: 1280,
@@ -102,7 +129,7 @@ export const ContentRendererClient = ({
             responsive: true,
             sources: [source],
           }}
-          onVideoEnd={() => { }}
+          onVideoEnd={() => {}}
         />
         <div className="flex flex-col gap-4 rounded-xl bg-primary/5 p-4">
           <div className="flex w-full flex-col justify-between gap-2 md:flex-row">
@@ -119,19 +146,13 @@ export const ContentRendererClient = ({
           {!showChapters && metadata.segments?.length > 0 && (
             <button
               className="flex w-fit items-center gap-2"
-              onClick={() => {
-                toggleShowChapters();
-              }}
+              onClick={toggleShowChapters}
             >
               <p>Chapters</p>
               {showChapters ? (
-                <>
-                  <ChevronUp className="size-5 text-neutral-500" />
-                </>
+                <ChevronUp className="size-5 text-neutral-500" />
               ) : (
-                <>
-                  <ChevronDown className="size-5 text-neutral-500" />
-                </>
+                <ChevronDown className="size-5 text-neutral-500" />
               )}
             </button>
           )}
@@ -142,22 +163,49 @@ export const ContentRendererClient = ({
               onCancel={toggleShowChapters}
             />
           )}
+
+          <div className="flex justify-between items-center mt-6 pt-4 border-t border-primary/10">
+
+            {prevContent ? (
+              <Button
+                size="lg"
+                variant="outline"
+                className="flex items-center gap-1"
+                onClick={() => handleNavigateToContent(prevContent?.id)}
+              >
+                ← Previous
+              </Button>
+            ) : (
+              <Button
+              size="lg"
+              variant="outline"
+              className="flex items-center gap-1"
+              onClick={handleGoToFolder}
+            >
+            ← Go to Course Folder 
+            </Button>
+            )}
+
+            {nextContent ? (
+              <Button
+                size="lg"
+                className="flex items-center gap-1"
+                onClick={() => handleNavigateToContent(nextContent?.id)}
+              >
+                Next →
+              </Button>
+            ) : (
+              <Button
+              size="lg"
+              variant="outline"
+              className="flex items-center gap-1"
+              onClick={handleGoToFolder}
+            >
+              Done! Go to  Course Folder →
+            </Button>
+            )}
+          </div>
         </div>
-        {nextContent ? (
-          <Button
-            size={'lg'}
-            onClick={() => {
-              const originalPath = window.location.pathname;
-              const parts = originalPath.split('/');
-              parts.pop();
-              parts.push(nextContent.id.toString());
-              const newPath = parts.join('/');
-              router.push(newPath);
-            }}
-          >
-            {nextContent.title}
-          </Button>
-        ) : null}
       </div>
     </div>
   );

diff --git a/src/db/course.ts b/src/db/course.ts
@@ -166,6 +166,39 @@ export const getNextVideo = async (currentVideoId: number) => {
   return latestContent;
 };
 
+export const getPrevVideo = async (currentVideoId: number) => {
+  if (!currentVideoId) {
+    return null;
+  }
+  const value = await cache.get('getPrevVideo', [currentVideoId.toString()]);
+  if (value) {
+    return value;
+  }
+  const currentContent = await db.content.findFirst({
+    where: {
+      id: currentVideoId,
+    },
+  });
+
+  const latestContent = await db.content.findFirst({
+    orderBy: [
+      {
+        id: 'desc',
+      },
+    ],
+    where: {
+      parentId: {
+        equals: currentContent?.parentId,
+      },
+      id: {
+        lt: currentVideoId,
+      },
+    },
+  });
+  cache.set('getPrevVideo', [currentVideoId.toString()], latestContent);
+  return latestContent;
+};
+
 async function getAllContent(): Promise<
   {
     id: number;
@@ -198,6 +231,8 @@ async function getAllContent(): Promise<
   });
   cache.set('getAllContent', [], allContent);
 
+  //console.log('allContent', allContent);
+
   return allContent;
 }
 
@@ -286,6 +321,8 @@ export const getFullCourseContent = async (
   const courseContent = await getRootCourseContent(courseId);
   const videoProgress = await getVideoProgressForUser(session?.user?.id);
   const bookmarkData = await getBookmarkData();
+
+  console.log('bookmarkData', bookmarkData);
   const contentMap = new Map<string, FullCourseContent>(
     contents.map((content: any) => [
       content.id,