diff --git a/packages/react/src/components/video/VideoCardCountdownToLive.tsx b/packages/react/src/components/video/VideoCardCountdownToLive.tsx
index d32528f06..226279582 100644
--- a/packages/react/src/components/video/VideoCardCountdownToLive.tsx
+++ b/packages/react/src/components/video/VideoCardCountdownToLive.tsx
@@ -10,8 +10,6 @@ import React from "react";
import { cn } from "@/lib/utils";
import { useInterval } from "usehooks-ts";
-const incr = 0;
-
interface LiveCounterProps {
viewers?: number;
start_date?: string;
@@ -150,6 +148,28 @@ export function VideoCardCountdownToLive({
);
}
+ // Handle missing videos
+ if (video.status === "missing") {
+ if (video.start_actual) {
+ const tick = dayjs(video.start_actual);
+ return (
+
+
+ Streamed at {tick.format("LLL")}
+
+ );
+ }
+ if (video.start_scheduled) {
+ const tick = dayjs(video.start_scheduled);
+ return (
+
+
+ Scheduled for {tick.format("LLL")}
+
+ );
+ }
+ }
+
return null;
}
diff --git a/packages/react/src/hooks/useDuration.ts b/packages/react/src/hooks/useDuration.ts
index b08511d5b..7b2a7daee 100644
--- a/packages/react/src/hooks/useDuration.ts
+++ b/packages/react/src/hooks/useDuration.ts
@@ -12,6 +12,8 @@ export function useDuration({
>) {
const [date] = useSeconds();
+ if (status === "missing") return duration ? duration * 1000 : null;
+
if (status === "past") return duration * 1000;
if (status === "live" && start_actual)