add live now panel with time elapsed

frontend/src/pages/StreamControl.tsx

@@ -243,6 +243,23 @@ const StreamControl = () => {
         <div className="px-8 py-10 max-w-5xl mx-auto flex flex-col gap-5">
             <h1 className="text-2xl font-semibold text-gray-900">Stream Control</h1>
 
+            {isStreaming &&
+                <Card className={"bg-card pb-10"}>
+                    <div className={"p-6"}>
+                        <p className={"pb-3 font-heading text-text-strong text-xl"}>Server credentials</p>
+
+                        <p className={"font-body text-muted text-sm p-1"}>Ingest URL</p>
+                        <input
+                            type={"text"}
+                            contentEditable={"false"}
+                            className={"bg-fields rounded-xl focus:outline-none w-full p-3 text-text-strong text-sm font-data"}
+                            readOnly={true}
+                            defaultValue={"rtmp://vodsystem.ddns.net:1935/live"}
+                        />
+                    </div>
+                </Card>
+            }
+
             {/* Hero status bar */}
             <Card className={clsx(
                 "p-6 flex items-center justify-between gap-6 border-l-4",