From f9f0cf213d0dfd899c246e573c57779397099216 Mon Sep 17 00:00:00 2001
From: kieran <kieran@harkin.me>
Date: Wed, 13 Nov 2024 14:37:38 +0000
Subject: [PATCH] fix: planned stream dashboard

---
 src/element/stream-editor/index.tsx | 14 ++++------
 src/pages/dashboard/dashboard.tsx   | 43 ++++++++++++++++++++---------
 src/providers/zsz.ts                |  3 +-
 3 files changed, 36 insertions(+), 24 deletions(-)

diff --git a/src/element/stream-editor/index.tsx b/src/element/stream-editor/index.tsx
index a8fb75c..b5af47b 100644
--- a/src/element/stream-editor/index.tsx
+++ b/src/element/stream-editor/index.tsx
@@ -145,13 +145,7 @@ export function StreamEditor({ ev, onFinish, options }: StreamEditorProps) {
     }
   }
 
-  function toDateTimeString(n: number) {
-    return new Date(n * 1000).toISOString().substring(0, -1);
-  }
-
-  function fromDateTimeString(s: string) {
-    return Math.floor(new Date(s).getTime() / 1000);
-  }
+  const startsDate = new Date(parseInt(start ?? "0") * 1000);
 
   return (
     <>
@@ -209,8 +203,10 @@ export function StreamEditor({ ev, onFinish, options }: StreamEditorProps) {
             <StreamInput label={<FormattedMessage defaultMessage="Start Time" />}>
               <input
                 type="datetime-local"
-                value={toDateTimeString(Number(start ?? "0"))}
-                onChange={e => setStart(fromDateTimeString(e.target.value).toString())}
+                value={`${startsDate.getFullYear().toString().padStart(4, "0")}-${startsDate.getMonth().toString().padStart(2, "0")}-${startsDate.getDate().toString().padStart(2, "0")}T${startsDate.getHours().toString().padStart(2, "0")}:${startsDate.getMinutes().toString().padStart(2, "0")}`}
+                onChange={e => {
+                  setStart((e.target.valueAsNumber / 1000).toString());
+                }}
               />
             </StreamInput>
           )}
diff --git a/src/pages/dashboard/dashboard.tsx b/src/pages/dashboard/dashboard.tsx
index c7a7631..5b87688 100644
--- a/src/pages/dashboard/dashboard.tsx
+++ b/src/pages/dashboard/dashboard.tsx
@@ -49,7 +49,7 @@ export function DashboardForLink({ link }: { link: NostrLink }) {
 
   const provider = useMemo(() => (service ? new NostrStreamProvider("", service) : DefaultProvider), [service]);
   const defaultEndpoint = useMemo(() => {
-    return info?.endpoints.find(a => a.name == (recording ? "Best" : "Good")) ?? info?.endpoints[0];
+    return info?.endpoints?.find(a => a.name == (recording ? "Best" : "Good")) ?? info?.endpoints?.at(0);
   }, [info, recording]);
 
   useEffect(() => {
@@ -84,28 +84,44 @@ export function DashboardForLink({ link }: { link: NostrLink }) {
 
   if (!streamLink && !location.search.includes("setupComplete=true")) return <DashboardIntro />;
 
+  function headingText() {
+    switch (status) {
+      case StreamState.Live:
+        return <FormattedMessage defaultMessage="Started" />;
+      case StreamState.Ended:
+        return <FormattedMessage defaultMessage="Stopped" />;
+      case StreamState.Planned:
+        return <FormattedMessage defaultMessage="Planned" />;
+    }
+  }
+
+  function headingDotStyle() {
+    switch (status) {
+      case StreamState.Live:
+        return "animate-pulse bg-green-500";
+      case StreamState.Ended:
+        return "bg-red-500";
+      case StreamState.Planned:
+        return "bg-yellow-500";
+    }
+  }
+
   return (
     <div
       className={classNames("grid gap-2 h-[calc(100dvh-52px)] w-full", {
         "grid-cols-3": status === StreamState.Live,
         "grid-cols-[20%_80%]": status === StreamState.Ended,
+        "grid-cols-[40%_60%]": status === StreamState.Planned,
       })}>
       <div className="min-h-0 h-full grid grid-rows-[min-content_auto] gap-2">
         <DashboardCard className="flex flex-col gap-4">
           <div className="flex justify-between items-center">
             <h3>
-              <FormattedMessage defaultMessage="Stream" id="uYw2LD" />
+              <FormattedMessage defaultMessage="Stream" />
             </h3>
             <div className="uppercase font-semibold flex items-center gap-2">
-              <div
-                className={`w-3 h-3 rounded-full ${
-                  status === StreamState.Live ? "animate-pulse bg-green-500" : "bg-red-500"
-                }`}></div>
-              {status === StreamState.Live ? (
-                <FormattedMessage defaultMessage="Started" />
-              ) : (
-                <FormattedMessage defaultMessage="Stopped" />
-              )}
+              <div className={`w-3 h-3 rounded-full ${headingDotStyle()}`}></div>
+              {headingText()}
             </div>
           </div>
           {streamLink && status === StreamState.Live && !isMyManual && (
@@ -152,7 +168,7 @@ export function DashboardForLink({ link }: { link: NostrLink }) {
               </div>
             </>
           )}
-          {streamLink && isMyManual && status === StreamState.Live && (
+          {streamLink && isMyManual && (status === StreamState.Live || status === StreamState.Planned) && (
             <>
               <LiveVideoPlayer stream={stream} status={status} poster={image} muted={true} className="w-full" />
               <div className="grid gap-2 grid-cols-3">
@@ -223,7 +239,7 @@ export function DashboardForLink({ link }: { link: NostrLink }) {
             </div>
           </DashboardCard>
         )}
-        {(!streamLink || status === StreamState.Ended) && (
+        {(!streamLink || status !== StreamState.Live) && (
           <DashboardCard className="flex flex-col gap-4">
             <h3>
               <FormattedMessage defaultMessage="Account Setup" />
@@ -266,6 +282,7 @@ export function DashboardForLink({ link }: { link: NostrLink }) {
           </DashboardCard>
         </>
       )}
+      {streamLink && status === StreamState.Planned && <DashboardCard className="overflow-y-auto"></DashboardCard>}
     </div>
   );
 }
diff --git a/src/providers/zsz.ts b/src/providers/zsz.ts
index 606cca3..a4b37df 100644
--- a/src/providers/zsz.ts
+++ b/src/providers/zsz.ts
@@ -1,10 +1,9 @@
 import { base64 } from "@scure/base";
-import { StreamProvider, StreamProviderEndpoint, StreamProviderInfo, StreamProviders } from ".";
+import { StreamProvider, StreamProviderEndpoint, StreamProviders } from ".";
 import { EventKind, EventPublisher, NostrEvent, SystemInterface } from "@snort/system";
 import { Login } from "@/login";
 import { getPublisher } from "@/login";
 import { extractStreamInfo } from "@/utils";
-import { StreamState } from "@/const";
 import { appendDedupe, unixNow } from "@snort/shared";
 import { TimeSync } from "@/time-sync";