diff --git a/src/components/CourseListing.tsx b/src/components/CourseListing.tsx index 91ae72ab31da91d6fe26c99719a030c05110230d..514386888c1d51afe3f4369781cdae6b16f9337c 100644 --- a/src/components/CourseListing.tsx +++ b/src/components/CourseListing.tsx @@ -16,6 +16,8 @@ import type { GetCourseResponse, lecture } from "@/api/api_v1_types"; import { ResourceType } from "@/misc/PromiseHelpers"; import { AuthenticationMethodIcons } from "@/misc/Util"; import { useLanguage } from "./LanguageProvider"; +import { DateTime } from "luxon"; +import LiveLabel, { LectureLiveLabel } from "./LiveLabel"; function ListingHeader({ course }: { course: GetCourseResponse }) { const { editMode } = useEditMode(); @@ -278,11 +280,8 @@ export function LectureListItem({ field_id="title" field_type="string" initialValue={lecture.title} - /> - {/*{livelabel((lecture.live and lecture.time > datetime.now()-timedelta(days=1)), videos|selectattr("livehandle")|list|length)}*/} - {/*% if lecture.chapter_count|d(0) > 0 and ismod() %} - <span className="label label-info" data-toggle="tooltip" title="Nicht freigegebene Kapitel">{{ lecture.chapter_count }}</span> - {% endif %*/} + />{" "} + <LectureLiveLabel lecture={lecture} /> </li> </ul> <ul className="list-unstyled col-sm-3 col-12"> diff --git a/src/components/LiveLabel.tsx b/src/components/LiveLabel.tsx new file mode 100644 index 0000000000000000000000000000000000000000..b5f296a1e5c3476ecdba731674a9a92237f4b322 --- /dev/null +++ b/src/components/LiveLabel.tsx @@ -0,0 +1,16 @@ +import { lecture } from "@/api/api_v1_types"; +import { DateTime } from "luxon"; + +export function LiveLabel({ nowlive }: { nowlive: boolean }) { + return ( + <span className={`badge ${nowlive ? "text-bg-danger" : "text-bg-primary"}`}> + {nowlive ? "Live" : "Livestream planned"} + </span> + ); +} + +export function LectureLiveLabel({ lecture }: { lecture: lecture }) { + if (!lecture.livestream_planned) return null; + if (DateTime.fromISO(lecture.time) < DateTime.now().minus({ days: 1 })) return null; + return <LiveLabel nowlive={typeof lecture.livestream_url === "string"} />; +} diff --git a/src/components/VideoCard.tsx b/src/components/VideoCard.tsx index 52746990c386ba9d6fe6aaaa0f319664068258ad..fe176294b1b22c4c0643f97d320e4c886425a20f 100644 --- a/src/components/VideoCard.tsx +++ b/src/components/VideoCard.tsx @@ -5,6 +5,7 @@ import type { lecture, course } from "@/api/api_v1_types"; import { StylizedText } from "@/components/StylizedText"; import { urlForLecture } from "@/misc/Util"; import { useLanguage } from "./LanguageProvider"; +import LiveLabel, { LectureLiveLabel } from "./LiveLabel"; export function VideoCard({ lecture, @@ -45,7 +46,7 @@ export function VideoCard({ <div className="col-4"> <span> <strong>{course.short_name}</strong>{" "} - {/*{livelabel(0, lecture.livehandle)}*/} + <LectureLiveLabel lecture={lecture} /> </span>{" "} <br /> <br /> @@ -77,7 +78,7 @@ export function VideoCard({ </li> <li> <strong>{course.full_name}</strong> - {/*{livelabel(0, lecture.livehandle)}*/} + {typeof lecture.livestream_url === "string" && <LiveLabel nowlive={true} />} </li> <li>{dateStr}</li> {lecture.speaker ? ( diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 58776a8e45efe3e142673d523623288978e8106f..c97fb61f70af30b4ce443503621aeced6d533aaa 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -20,6 +20,7 @@ import { useLanguage } from "@/components/LanguageProvider"; import { useSearchParams } from "next/navigation"; import { useRouter } from "next/router"; import { VideoCard } from "@/components/VideoCard"; +import LiveLabel, { LectureLiveLabel } from "@/components/LiveLabel"; function FeatureCard({ data, all_featured }: { data: featured; all_featured: featured[] }) { const { editMode } = useEditMode(); @@ -135,10 +136,6 @@ function FeaturedContent({ homepageData }: { homepageData: ResourceType<GetHomep )); } -function LiveLabel({ nowlive }: { nowlive: boolean }) { - return <span className={`label ${nowlive ? "label-danger" : "label-default"}`}>Live</span>; -} - function UpcomingUploads({ homepageData }: { homepageData: ResourceType<GetHomepageResponse> }) { const data = homepageData.read()!; const { language } = useLanguage(); @@ -187,10 +184,8 @@ function UpcomingUploads({ homepageData }: { homepageData: ResourceType<GetHomep <a href={`/${course_data.id_string}#lecture-${lecture.id}`}> {lecture.title} </a> - {` (${lecture.location}) `} - {lecture.livestream_url ? ( - <LiveLabel nowlive={lecture.livestream_url !== null} /> - ) : null} + {lecture.location.length > 0 && ` (${lecture.location})`}{" "} + <LectureLiveLabel lecture={lecture} /> </li> </ul> </li>