diff --git a/src/components/ContentCard.tsx b/src/components/ContentCard.tsx index 87345a185..8c8a76c4b 100644 --- a/src/components/ContentCard.tsx +++ b/src/components/ContentCard.tsx @@ -5,6 +5,7 @@ import { formatTime } from '@/lib/utils'; import VideoThumbnail from './videothumbnail'; import CardComponent from './CardComponent'; import { motion } from 'framer-motion'; +import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './ui/tooltip'; export const ContentCard = ({ title, @@ -15,6 +16,7 @@ export const ContentCard = ({ bookmark, contentId, contentDuration, + weeklyContentTitles, }: { type: 'folder' | 'video' | 'notion'; contentId?: number; @@ -27,68 +29,80 @@ export const ContentCard = ({ bookmark?: Bookmark | null; contentDuration?: number; uploadDate?: string; + weeklyContentTitles?: string[]; }) => { return ( - (['Enter', ' '].includes(e.key) && onClick())} - className={`group relative flex h-fit w-full max-w-md cursor-pointer flex-col gap-2 rounded-2xl transition-all duration-300 hover:-translate-y-2`} - > - {markAsCompleted && ( -
- -
- )} - {type === 'video' && ( -
- -
- )} - {type !== 'video' && ( -
- - {!!videoProgressPercent && ( -
-
+ + + + (['Enter', ' '].includes(e.key) && onClick())} + className={`group relative flex h-fit w-full max-w-md cursor-pointer flex-col gap-2 rounded-2xl transition-all duration-300 hover:-translate-y-2`} + > + {markAsCompleted && ( +
+ +
+ )} + {type === 'video' && ( +
+ +
+ )} + {type !== 'video' && ( +
+ + {!!videoProgressPercent && ( +
+
+
+ )} +
+ )} + {type === 'video' && ( +
+ +
+ )} +
+

+ {title} +

+ {bookmark !== undefined && contentId && ( + + )}
- )} -
- )} - {type === 'video' && ( -
- -
- )} -
-

- {title} -

- {bookmark !== undefined && contentId && ( - - )} -
-
+ +
+ { + Array.isArray(weeklyContentTitles) && weeklyContentTitles?.length > 0 && + {weeklyContentTitles?.map((title) =>

{title}

)} +
+ } +
+
); }; diff --git a/src/components/FolderView.tsx b/src/components/FolderView.tsx index e79887df3..c9f24c430 100644 --- a/src/components/FolderView.tsx +++ b/src/components/FolderView.tsx @@ -2,6 +2,7 @@ import { useRouter } from 'next/navigation'; import { ContentCard } from './ContentCard'; import { Bookmark } from '@prisma/client'; +import { CourseContentType } from '@/lib/utils'; export const FolderView = ({ courseContent, @@ -11,7 +12,7 @@ export const FolderView = ({ courseId: number; rest: string[]; courseContent: { - type: 'folder' | 'video' | 'notion'; + type: CourseContentType; title: string; image: string; id: number; @@ -20,6 +21,7 @@ export const FolderView = ({ videoFullDuration?: number; duration?: number; bookmark: Bookmark | null; + weeklyContentTitles?: string[]; }[]; }) => { const router = useRouter(); @@ -62,6 +64,7 @@ export const FolderView = ({ videoProgressPercent={videoProgressPercent} bookmark={content.bookmark} contentDuration={content.videoFullDuration} + weeklyContentTitles={content.weeklyContentTitles} /> ); })} diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 6c5b1e2c7..20036a9f7 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -366,3 +366,5 @@ export const getDisabledFeature = (feature: string): boolean => { .split(',') .includes(feature); }; + +export type CourseContentType = 'folder' | 'video' | 'notion' \ No newline at end of file