From a975e2feafb74d38c2ee01f7a0261125ff0cfc37 Mon Sep 17 00:00:00 2001 From: Kinjalk Bajpai <34712617+strawHat121@users.noreply.github.com> Date: Mon, 20 Jan 2025 04:53:19 +0530 Subject: [PATCH] feat: remove live courses support (#1271) Co-authored-by: Kylee Fields <43586156+kyleecodes@users.noreply.github.com> --- components/cards/CourseCard.tsx | 10 -- components/course/CourseIntroduction.tsx | 36 +---- components/course/CourseStatusHeader.tsx | 36 ----- components/storyblok/StoryblokCoursePage.tsx | 132 +++++------------- components/storyblok/StoryblokSessionPage.tsx | 93 +++++------- messages/courses/de.json | 5 - messages/courses/en.json | 5 - messages/courses/es.json | 5 - messages/courses/fr.json | 5 - messages/courses/hi.json | 5 - messages/courses/pt.json | 5 - utils/courseLiveStatus.ts | 18 --- 12 files changed, 74 insertions(+), 281 deletions(-) delete mode 100644 components/course/CourseStatusHeader.tsx delete mode 100644 utils/courseLiveStatus.ts diff --git a/components/cards/CourseCard.tsx b/components/cards/CourseCard.tsx index e5f3c5275..33691d199 100644 --- a/components/cards/CourseCard.tsx +++ b/components/cards/CourseCard.tsx @@ -1,5 +1,4 @@ import KeyboardArrowDown from '@mui/icons-material/KeyboardArrowDown'; -import PendingOutlined from '@mui/icons-material/PendingOutlined'; import { Box, Card, @@ -78,8 +77,6 @@ const CourseCard = (props: CourseCardProps) => { const [expanded, setExpanded] = useState(false); const t = useTranslations('Courses'); - const courseComingSoon: boolean = course.content.coming_soon; - const handleExpandClick = () => { setExpanded(!expanded); }; @@ -136,13 +133,6 @@ const CourseCard = (props: CourseCardProps) => { )} - {courseComingSoon && ( - - - {t('comingSoon')} - - )} - {!!courseProgress && courseProgress !== PROGRESS_STATUS.NOT_STARTED && ( )} diff --git a/components/course/CourseIntroduction.tsx b/components/course/CourseIntroduction.tsx index eb85d7a1f..539357963 100644 --- a/components/course/CourseIntroduction.tsx +++ b/components/course/CourseIntroduction.tsx @@ -2,17 +2,14 @@ import { Box, Link as MuiLink, Typography } from '@mui/material'; import { ISbRichtext } from '@storyblok/react'; import { useTranslations } from 'next-intl'; import { useEffect, useState } from 'react'; -import { render } from 'storyblok-rich-text-react-renderer'; import { COURSE_INTRO_VIDEO_TRANSCRIPT_CLOSED, COURSE_INTRO_VIDEO_TRANSCRIPT_OPENED, } from '../../constants/events'; import { rowStyle } from '../../styles/common'; import { EventUserData, logEvent } from '../../utils/logEvent'; -import { RichTextOptions } from '../../utils/richText'; import Video from '../video/Video'; import VideoTranscriptModal from '../video/VideoTranscriptModal'; -import CourseStatusHeader from './CourseStatusHeader'; const containerStyle = { ...rowStyle, @@ -28,26 +25,11 @@ interface CourseIntroductionProps { video: { url: string }; name: string; video_transcript: ISbRichtext; - live_soon_content: ISbRichtext; - live_now_content: ISbRichtext; - courseLiveSoon?: boolean; - courseLiveNow?: boolean; - liveCourseAccess?: boolean; eventData: EventUserData; } const CourseIntroduction = (props: CourseIntroductionProps) => { - const { - video, - name, - video_transcript, - live_soon_content, - live_now_content, - courseLiveSoon = false, - courseLiveNow = false, - liveCourseAccess = false, - eventData, - } = props; + const { video, name, video_transcript, eventData } = props; const [openTranscriptModal, setOpenTranscriptModal] = useState(null); const t = useTranslations('Courses'); @@ -102,22 +84,8 @@ const CourseIntroduction = (props: CourseIntroductionProps) => { setOpenTranscriptModal={setOpenTranscriptModal} openTranscriptModal={openTranscriptModal} /> - {/* Video position switches column depending on if live content shown */} - {liveCourseAccess && (courseLiveSoon || courseLiveNow) && } - {liveCourseAccess && courseLiveSoon ? ( - - - {render(live_soon_content, RichTextOptions)} - - ) : liveCourseAccess && courseLiveNow ? ( - - - {render(live_now_content, RichTextOptions)} - - ) : ( - - )} + ); }; diff --git a/components/course/CourseStatusHeader.tsx b/components/course/CourseStatusHeader.tsx deleted file mode 100644 index 7f21aa844..000000000 --- a/components/course/CourseStatusHeader.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import Circle from '@mui/icons-material/Circle'; -import Event from '@mui/icons-material/Event'; -import PendingOutlined from '@mui/icons-material/PendingOutlined'; -import { Box, Typography } from '@mui/material'; -import { useTranslations } from 'next-intl'; -import { iconTextRowStyle } from '../../styles/common'; - -interface CourseStatusHeaderProps { - status: 'liveNow' | 'liveSoon' | 'comingSoon'; -} - -const CourseStatusHeader = (props: CourseStatusHeaderProps) => { - const { status } = props; - - const t = useTranslations('Courses'); - - const icon = - status === 'comingSoon' ? ( - - ) : status === 'liveSoon' ? ( - - ) : ( - - ); - - return ( - - {icon} - - {t.rich(status)} - - - ); -}; - -export default CourseStatusHeader; diff --git a/components/storyblok/StoryblokCoursePage.tsx b/components/storyblok/StoryblokCoursePage.tsx index 316368e64..d06de5349 100644 --- a/components/storyblok/StoryblokCoursePage.tsx +++ b/components/storyblok/StoryblokCoursePage.tsx @@ -4,22 +4,18 @@ import Cookies from 'js-cookie'; import { useTranslations } from 'next-intl'; import Head from 'next/head'; import { useEffect, useState } from 'react'; -import { render } from 'storyblok-rich-text-react-renderer'; import SessionCard from '../../components/cards/SessionCard'; import { ContentUnavailable } from '../../components/common/ContentUnavailable'; import Link from '../../components/common/Link'; import CourseHeader from '../../components/course/CourseHeader'; import CourseIntroduction from '../../components/course/CourseIntroduction'; -import CourseStatusHeader from '../../components/course/CourseStatusHeader'; import { PROGRESS_STATUS } from '../../constants/enums'; import { COURSE_OVERVIEW_VIEWED } from '../../constants/events'; import { useTypedSelector } from '../../hooks/store'; import { rowStyle } from '../../styles/common'; -import { courseIsLiveNow, courseIsLiveSoon } from '../../utils/courseLiveStatus'; import { determineCourseProgress } from '../../utils/courseProgress'; import hasAccessToPage from '../../utils/hasAccessToPage'; import { getEventUserData, logEvent } from '../../utils/logEvent'; -import { RichTextOptions } from '../../utils/richText'; import { SignUpBanner } from '../banner/SignUpBanner'; const containerStyle = { @@ -49,12 +45,6 @@ export interface StoryblokCoursePageProps { video_transcript: ISbRichtext; weeks: { name: string; sessions: any }[]; // TODO: replace type with StoryblokSessionPageProps included_for_partners: string[]; - coming_soon: boolean; - coming_soon_content: ISbRichtext; - live_start_date: string; - live_end_date: string; - live_soon_content: ISbRichtext; - live_now_content: ISbRichtext; languages: string[]; // TODO: implement this field - currently uses FF_DISABLED_COURSES env var component: 'Course'; } @@ -73,12 +63,6 @@ const StoryblokCoursePage = (props: StoryblokCoursePageProps) => { video_transcript, weeks, included_for_partners, - coming_soon, - coming_soon_content, - live_start_date, - live_end_date, - live_soon_content, - live_now_content, } = props; const t = useTranslations('Courses'); @@ -119,29 +103,10 @@ const StoryblokCoursePage = (props: StoryblokCoursePageProps) => { const eventUserData = getEventUserData(userCreatedAt, partnerAccesses, partnerAdmin); - const courseComingSoon: boolean = coming_soon; - const courseLiveSoon: boolean = courseIsLiveSoon({ - live_start_date, - live_end_date, - coming_soon, - live_soon_content, - }); - const courseLiveNow: boolean = courseIsLiveNow({ - live_start_date, - live_end_date, - coming_soon, - live_now_content, - }); - // only show live content to public users - const liveCourseAccess = partnerAccesses.length === 0 && !partnerAdmin.id; - const eventData = { ...eventUserData, course_name: name, course_storyblok_id: storyId, - course_coming_soon: courseComingSoon, - course_live_soon: courseLiveSoon, - course_live_now: courseLiveNow, course_progress: courseProgress, }; @@ -170,12 +135,6 @@ const StoryblokCoursePage = (props: StoryblokCoursePageProps) => { video_transcript, weeks, included_for_partners, - coming_soon, - coming_soon_content, - live_start_date, - live_end_date, - live_soon_content, - live_now_content, })} > @@ -196,63 +155,42 @@ const StoryblokCoursePage = (props: StoryblokCoursePageProps) => { courseProgress={courseProgress} /> - {courseComingSoon ? ( - <> - {liveCourseAccess && courseLiveSoon ? ( - - - {render(live_soon_content, RichTextOptions)} - - ) : ( - - - {render(coming_soon_content, RichTextOptions)} - - )} - - ) : ( - <> - {video && ( - - )} - - {weeks.map((week: any) => { - return ( - - - {week.name} - - - {week.sessions.map((session: any) => { - const position = `${t('session')} ${session.position / 10 - 1}`; - - return ( - - ); - })} - + <> + {video && ( + + )} + + {weeks.map((week: any) => { + return ( + + + {week.name} + + + {week.sessions.map((session: any) => { + const position = `${t('session')} ${session.position / 10 - 1}`; + + return ( + + ); + })} - ); - })} - - - )} + + ); + })} + + {!isLoggedIn && } diff --git a/components/storyblok/StoryblokSessionPage.tsx b/components/storyblok/StoryblokSessionPage.tsx index 334f1103e..e5f1c74dc 100644 --- a/components/storyblok/StoryblokSessionPage.tsx +++ b/components/storyblok/StoryblokSessionPage.tsx @@ -10,7 +10,6 @@ import SessionContentCard from '../../components/cards/SessionContentCard'; import { PROGRESS_STATUS } from '../../constants/enums'; import { useTypedSelector } from '../../hooks/store'; import { columnStyle } from '../../styles/common'; -import { courseIsLiveNow, courseIsLiveSoon } from '../../utils/courseLiveStatus'; import { getChatAccess } from '../../utils/getChatAccess'; import { getSessionCompletion } from '../../utils/getSessionCompletion'; import hasAccessToPage from '../../utils/hasAccessToPage'; @@ -50,8 +49,6 @@ export interface StoryblokSessionPageProps { video_outro: ISbRichtext; activity: ISbRichtext; bonus: ISbRichtext | BonusContent[]; - coming_soon: boolean; - coming_soon_content: ISbRichtext; languages: string[]; component: 'Session' | 'session_iba'; included_for_partners: string[]; @@ -74,8 +71,6 @@ const StoryblokSessionPage = (props: StoryblokSessionPageProps) => { video_outro, activity, bonus, - coming_soon, - coming_soon_content, } = props; const t = useTranslations('Courses'); @@ -102,10 +97,6 @@ const StoryblokSessionPage = (props: StoryblokSessionPageProps) => { richtextBonusContent && richtextBonusContent.content && richtextBonusContent.content[0].content; const showMultipleBonusContent = multipleBonusContent && multipleBonusContent.length > 0; - const courseComingSoon: boolean = !isAlternateSessionPage && course.content.coming_soon; - const courseLiveSoon: boolean = !isAlternateSessionPage && courseIsLiveSoon(course); - const courseLiveNow: boolean = !isAlternateSessionPage && courseIsLiveNow(course); - const eventUserData = getEventUserData(userCreatedAt, partnerAccesses, partnerAdmin); const eventData = { ...eventUserData, @@ -114,9 +105,6 @@ const StoryblokSessionPage = (props: StoryblokSessionPageProps) => { session_progress: sessionProgress, course_name: course.name, course_storyblok_id: course.id, - course_coming_soon: courseComingSoon, - course_live_soon: courseLiveSoon, - course_live_now: courseLiveNow, }; useEffect(() => { @@ -154,8 +142,6 @@ const StoryblokSessionPage = (props: StoryblokSessionPageProps) => { video_outro, activity, bonus, - coming_soon, - coming_soon_content, })} > @@ -187,57 +173,52 @@ const StoryblokSessionPage = (props: StoryblokSessionPageProps) => { storyPosition={storyPosition} /> - {coming_soon && ( - {render(coming_soon_content, RichTextOptions)} - )} - {!coming_soon && ( - - - {activity.content && - (activity.content?.length > 1 || activity.content[0].content) && ( - <> - - - <>{render(activity, RichTextOptions)} - - - )} - {showRichtextBonusContent && ( + + + {activity.content && + (activity.content?.length > 1 || activity.content[0].content) && ( <> - <>{render(richtextBonusContent, RichTextOptions)} + <>{render(activity, RichTextOptions)} )} - {showMultipleBonusContent && ( - - )} - {liveChatAccess && } - {sessionProgress !== PROGRESS_STATUS.COMPLETED && ( - - )} - - )} + {showRichtextBonusContent && ( + <> + + + <>{render(richtextBonusContent, RichTextOptions)} + + + )} + {showMultipleBonusContent && ( + + )} + {liveChatAccess && } + {sessionProgress !== PROGRESS_STATUS.COMPLETED && ( + + )} + {sessionId && ( diff --git a/messages/courses/de.json b/messages/courses/de.json index 2e6d87613..980ee7979 100644 --- a/messages/courses/de.json +++ b/messages/courses/de.json @@ -9,11 +9,6 @@ "expandSummary": "Zusammenfassung erweitern für", "navigateToSession": "Zur Session navigieren -", "navigateToCourse": "Zum Kurs navigieren -", - "liveFrom": "Live ab {date}", - "liveUntil": "Live bis {date}", - "liveSoon": "Demnächst live", - "liveNow": "Jetzt live", - "comingSoon": "Demnächst", "noCourses": "Zur Zeit sind keine Kurse verfügbar. Falls Dir das nicht richtig erscheint, kontaktiere das Bloom-Team.", "courseDetail": { "introductionTitle": "Einführung in den Kurs", diff --git a/messages/courses/en.json b/messages/courses/en.json index 8b3dba2e4..fbdad24ea 100644 --- a/messages/courses/en.json +++ b/messages/courses/en.json @@ -9,11 +9,6 @@ "expandSummary": "Expand summary for", "navigateToSession": "Navigate to session -", "navigateToCourse": "Navigate to course -", - "liveFrom": "Live from {date}", - "liveUntil": "Live until {date}", - "liveSoon": "Live soon", - "liveNow": "Live now", - "comingSoon": "Coming soon", "noCourses": "There are no courses to display right now. If this doesn't seem right, try again later or contact the Bloom team.", "courseDetail": { "introductionTitle": "Course introduction", diff --git a/messages/courses/es.json b/messages/courses/es.json index 5a237caae..52248ab7d 100644 --- a/messages/courses/es.json +++ b/messages/courses/es.json @@ -9,11 +9,6 @@ "expandSummary": "Expandir resumen de", "navigateToSession": "Navegar a la sesión -", "navigateToCourse": "Navegar al curso -", - "liveFrom": "En vivo desde {date}", - "liveUntil": "En vivo hasta {date}", - "liveSoon": "Próximamente en vivo", - "liveNow": "En vivo ahora", - "comingSoon": "Próximamente", "noCourses": "En este momento no hay cursos para mostrar. Si esto no parece correcto, inténtalo de nuevo más tarde, o contacta al equipo de Bloom.", "courseDetail": { "introductionTitle": "Introducción al curso", diff --git a/messages/courses/fr.json b/messages/courses/fr.json index 58dcaf990..effc712b5 100644 --- a/messages/courses/fr.json +++ b/messages/courses/fr.json @@ -9,11 +9,6 @@ "expandSummary": "Ouvrir le résumé de", "navigateToSession": "Aller à la session -", "navigateToCourse": "Aller au cours -", - "liveFrom": "Direct du {date}", - "liveUntil": "En direct jusqu'au {date}", - "liveSoon": "Bientôt en direct", - "liveNow": "En direct", - "comingSoon": "Prochainement", "noCourses": "Il n'y a pas de cours disponible pour le moment. Réessayez plus tard ou contactez l'équipe Bloom.", "courseDetail": { "introductionTitle": "Début du cours", diff --git a/messages/courses/hi.json b/messages/courses/hi.json index 5b7aec519..3b6d72477 100644 --- a/messages/courses/hi.json +++ b/messages/courses/hi.json @@ -9,11 +9,6 @@ "expandSummary": "Summary vistaar karein", "navigateToSession": "Session par leke jaiye", "navigateToCourse": "Course pe leke jaiye", - "liveFrom": "Live hoga {date} ko", - "liveUntil": "{date} tak live rahega", - "liveSoon": "Jald he live hoga", - "liveNow": "Live hogaya hai", - "comingSoon": "Jald he aa raha hai", "noCourses": "Abhi dikhane ke liye koi course nahi hai. There are no courses to display right now. Agar yeh sahi nahi lagta, toh dobara prayas karein ya fir Bloom mein team se sampark karien. ", "courseDetail": { "introductionTitle": "Course ka introduction", diff --git a/messages/courses/pt.json b/messages/courses/pt.json index a276703fb..248835094 100644 --- a/messages/courses/pt.json +++ b/messages/courses/pt.json @@ -9,11 +9,6 @@ "expandSummary": "Expandir o resumo de", "navigateToSession": "Ir à sessão -", "navigateToCourse": "Ir ao curso -", - "liveFrom": "Ao vivo desde {date}", - "liveUntil": "Ao vivo até {date}", - "liveSoon": "Live soon", - "liveNow": "Ao vivo agora", - "comingSoon": "Coming soon", "noCourses": "Não há cursos para serem exibidos no momento. Se isso não parecer certo, tente novamente mais tarde ou entre em contato com a equipe do Bloom.", "courseDetail": { "introductionTitle": "Introdução ao curso", diff --git a/utils/courseLiveStatus.ts b/utils/courseLiveStatus.ts deleted file mode 100644 index 805c97bb9..000000000 --- a/utils/courseLiveStatus.ts +++ /dev/null @@ -1,18 +0,0 @@ -export const courseIsLiveSoon = (course: any): boolean => { - return course.live_start_date && - (Date.parse(course.live_start_date) > Date.now() || - (Date.parse(course.live_end_date) > Date.now() && course.coming_soon)) && // catch for late release - course.live_soon_content - ? true - : false; -}; - -export const courseIsLiveNow = (course: any): boolean => { - return !course.coming_soon && // catch for late release - course.live_start_date && - Date.parse(course.live_start_date) < Date.now() && - Date.parse(course.live_end_date) > Date.now() && - course.live_now_content - ? true - : false; -};