fix(video-studio): fold Kilo findings (delete rollback, seed validation, download href, timer/preload hygiene)

- Roll back the optimistic delete and surface an error when DELETE fails,
  instead of silently swallowing the failure.
- Reset `latest` and clear any existing timer at the start of a generate
  run, so a prior result/timer can't leak into a new attempt.
- Serve generated videos through a new GET /api/video/{filename} route and
  point the frontend at it instead of the backend's raw (unservable)
  `path` field.
- Validate the seed input: reject NaN/negative values, clamp to the
  backend's accepted range, and ignore it when blank.
- Use preload="none" for library grid thumbnails instead of "metadata".
- Only fall back to the first video when there's no explicit library
  selection, instead of silently overriding the user's choice.
- Auto-grow the Create prompt textarea with its content, up to a max
  height.

Author: jaylfc

desktop/src/apps/VideoStudioApp.tsx

@@ -28,10 +28,17 @@ function randomSeed(): number {
   return Math.floor(Math.random() * 1_000_000);
 }
 
+// Max seed accepted by the backend (matches routes/video.py's
+// random.randint(0, 2**32 - 1) range).
+const MAX_SEED = 2 ** 32 - 1;
+
 function toGeneratedVideo(raw: Record<string, unknown>): GeneratedVideo {
+  const filename = (raw.filename as string) ?? "";
   return {
-    filename: (raw.filename as string) ?? "",
-    url: (raw.path as string) ?? "",
+    filename,
+    // `raw.path` is the backend's on-disk-style path, not a servable URL --
+    // serve videos through the API's filename-based route instead.
+    url: filename ? `/api/video/${encodeURIComponent(filename)}` : "",
     prompt: (raw.prompt as string) ?? "",
     model: (raw.model as string) ?? "",
     duration: (raw.duration as number) ?? 0,
@@ -108,6 +115,8 @@ export function VideoStudioApp({ windowId: _windowId }: { windowId: string }) {
     setGenerateError(null);
     setNeedsBackend(false);
     setElapsedSeconds(0);
+    setLatest(null);
+    if (timerRef.current) clearInterval(timerRef.current);
     timerRef.current = setInterval(() => {
       setElapsedSeconds((s) => s + 1);
     }, 1000);
@@ -118,9 +127,12 @@ export function VideoStudioApp({ windowId: _windowId }: { windowId: string }) {
       duration,
       resolution,
     };
-    const parsedSeed = seed.trim() ? parseInt(seed, 10) : null;
-    if (parsedSeed !== null && !Number.isNaN(parsedSeed)) {
-      body.seed = parsedSeed;
+    const trimmedSeed = seed.trim();
+    if (trimmedSeed) {
+      const parsedSeed = parseInt(trimmedSeed, 10);
+      if (!Number.isNaN(parsedSeed) && parsedSeed >= 0) {
+        body.seed = Math.min(parsedSeed, MAX_SEED);
+      }
     }
 
     try {
@@ -166,12 +178,32 @@ export function VideoStudioApp({ windowId: _windowId }: { windowId: string }) {
   /* ----------------------------- delete ---------------------------- */
 
   const handleDelete = useCallback((filename: string) => {
-    setVideos((prev) => prev.filter((v) => v.filename !== filename));
+    let removed: GeneratedVideo | undefined;
+    let removedIndex = -1;
+    setVideos((prev) => {
+      removedIndex = prev.findIndex((v) => v.filename === filename);
+      removed = prev[removedIndex];
+      return prev.filter((v) => v.filename !== filename);
+    });
     setSelectedLibraryId((cur) => (cur === filename ? null : cur));
     setLatest((cur) => (cur?.filename === filename ? null : cur));
-    fetch(`/api/video/${encodeURIComponent(filename)}`, {
-      method: "DELETE",
-    }).catch(() => {});
+
+    fetch(`/api/video/${encodeURIComponent(filename)}`, { method: "DELETE" })
+      .then((res) => {
+        if (!res.ok) throw new Error(`Delete failed (${res.status})`);
+      })
+      .catch((e) => {
+        // Roll back the optimistic removal and surface the failure --
+        // don't let a failed delete silently vanish the item.
+        setVideos((prev) => {
+          if (!removed || prev.some((v) => v.filename === filename)) {
+            return prev;
+          }
+          const at = Math.min(removedIndex < 0 ? prev.length : removedIndex, prev.length);
+          return [...prev.slice(0, at), removed, ...prev.slice(at)];
+        });
+        setLibraryError(`Failed to delete video: ${(e as Error).message}`);
+      });
   }, []);
 
   const handleDownload = useCallback((video: GeneratedVideo) => {

desktop/src/apps/videostudio/CreateView.tsx

@@ -1,3 +1,4 @@
+import { useEffect, useRef } from "react";
 import { Clapperboard, Download, ExternalLink } from "lucide-react";
 import {
   Slider,
@@ -78,6 +79,16 @@ export function CreateView(props: CreateViewProps) {
 
   const selectedModel = MODEL_OPTIONS.find((m) => m.id === modelId);
 
+  // Auto-grow the prompt textarea with its content, up to the max-h set
+  // below (CSS then clamps and scrolls beyond that).
+  const promptRef = useRef<HTMLTextAreaElement>(null);
+  useEffect(() => {
+    const el = promptRef.current;
+    if (!el) return;
+    el.style.height = "auto";
+    el.style.height = `${el.scrollHeight}px`;
+  }, [prompt]);
+
   return (
     <div className="flex min-h-0 flex-1 flex-col">
       {/* view header */}
@@ -197,6 +208,7 @@ export function CreateView(props: CreateViewProps) {
           Video prompt
         </label>
         <textarea
+          ref={promptRef}
           id="video-prompt"
           value={prompt}
           onChange={(e) => onPromptChange(e.target.value)}
@@ -208,7 +220,7 @@ export function CreateView(props: CreateViewProps) {
           }}
           placeholder="Describe the video you want to create…"
           rows={1}
-          className="min-h-[50px] flex-1 resize-none rounded-2xl border border-shell-border bg-shell-surface px-4 py-3.5 text-[13.5px] text-shell-text placeholder:text-shell-text-tertiary focus-visible:outline-none focus-visible:border-accent/40 focus-visible:ring-2 focus-visible:ring-accent/20"
+          className="min-h-[50px] max-h-40 flex-1 resize-none overflow-y-auto rounded-2xl border border-shell-border bg-shell-surface px-4 py-3.5 text-[13.5px] text-shell-text placeholder:text-shell-text-tertiary focus-visible:outline-none focus-visible:border-accent/40 focus-visible:ring-2 focus-visible:ring-accent/20"
         />
         <button
           type="button"

desktop/src/apps/videostudio/LibraryView.tsx

@@ -42,8 +42,11 @@ export function LibraryView({
   onDownload,
   onDelete,
 }: LibraryViewProps) {
-  const selected =
-    videos.find((v) => v.filename === selectedId) ?? videos[0] ?? null;
+  // Only fall back to the first video when there is no explicit selection --
+  // don't silently swap in a different clip if the selected one disappears.
+  const selected = selectedId
+    ? (videos.find((v) => v.filename === selectedId) ?? null)
+    : (videos[0] ?? null);
 
   return (
     <div className="flex min-h-0 flex-1 flex-col">
@@ -99,7 +102,7 @@ export function LibraryView({
                     <video
                       src={v.url}
                       muted
-                      preload="metadata"
+                      preload="none"
                       className="h-full w-full object-cover"
                     />
                   ) : (

tinyagentos/routes/video.py

@@ -8,7 +8,7 @@
 
 import httpx
 from fastapi import APIRouter, Request
-from fastapi.responses import JSONResponse
+from fastapi.responses import FileResponse, JSONResponse
 from pydantic import BaseModel
 
 router = APIRouter()
@@ -193,6 +193,25 @@ async def list_videos(request: Request):
     return {"videos": _list_videos(videos_dir)}
 
 
+@router.get("/api/video/{filename}")
+async def serve_video(request: Request, filename: str):
+    """Serve a generated video file for playback/download.
+
+    The ``path`` field returned by generate/list is not itself a mounted
+    static route -- the frontend hits this endpoint by filename instead.
+    """
+    videos_dir = _videos_dir(request)
+
+    if "/" in filename or "\\" in filename or ".." in filename:
+        return JSONResponse({"error": "Invalid filename"}, status_code=400)
+
+    video_path = videos_dir / filename
+    if not video_path.exists():
+        return JSONResponse({"error": f"Video '{filename}' not found"}, status_code=404)
+
+    return FileResponse(video_path, media_type="video/mp4", filename=filename)
+
+
 @router.delete("/api/video/{filename}")
 async def delete_video(request: Request, filename: str):
     """Delete a generated video and its metadata sidecar."""