From b2e838f13cae7c4b8861eca47dd7988457ebbafc Mon Sep 17 00:00:00 2001
From: phantomptr <phantomptr@gmail.com>
Date: Sun, 5 Jul 2026 21:57:40 -0700
Subject: [PATCH] feat(videos): browse + download PS5 gameplay video clips
 (#97)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds a "Video clips" screen mirroring Screenshots for gameplay video
captures — the video counterpart users asked for. Checkbox multi-select,
per-row + bulk download to the host, and an inline <video> preview
(desktop). Clips are already playable formats, so unlike screenshots
there's no .jxr → PNG conversion step.

Full stack, all additive (a new frame — no change to existing paths):
- payload/src/runtime.c: FTX2_FRAME_LIST_VIDEOS (166/167) + walk_videos()
  (walks /user/av_contents/video for .webm/.mp4/.mov, same JSON shape as
  walk_screenshots) + handle_list_videos dispatch. Builds -Werror.
- ftx2-proto: ListVideos/ListVideosAck FrameType variants + decode arm.
- ps5upload-core/saves.rs: list_videos() (reuses ScreenshotList type).
- src-tauri: videos_list Tauri command + registration.
- client/api/ps5.ts: videosList() wrapper.
- client/screens/Videos: the screen (reuses startTransferDownload +
  stale-host guard + host-change reset patterns from Screenshots).
- App.tsx route + Sidebar nav entry.
- en.ts + i18n-known-missing.json: 16 keys, allowlisted for all 17 locales.

HW NOT CONFIRMED: the exact av_contents/video path + extension set is the
documented Sony layout but hasn't been verified against a live console
(mirrors the screenshot bug where a wrong extension listed 0 files). If
the Clips tab is empty with clips present, adjust walk_videos()'s root /
extension filter in runtime.c — clearly commented there.

payload -Werror + engine fmt/clippy/test + client typecheck/lint/763
tests/i18n(18)/build all green. Desktop fmt on my files clean (a stray
local-rustfmt diff in an untouched file is a version-skew false positive;
that file is byte-identical to CI-green main).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 .../src/commands/saves_screenshots.rs         |  13 +-
 client/src-tauri/src/lib.rs                   |   1 +
 client/src/App.tsx                            |   9 +
 client/src/api/ps5.ts                         |   9 +
 client/src/i18n/locales/en.ts                 |  18 +
 client/src/layout/Sidebar.tsx                 |   2 +
 client/src/screens/Videos/index.tsx           | 460 ++++++++++++++++++
 engine/crates/ftx2-proto/src/lib.rs           |   8 +
 engine/crates/ps5upload-core/src/saves.rs     |  22 +
 payload/src/runtime.c                         |  88 ++++
 scripts/i18n-known-missing.json               | 306 +++++++++++-
 11 files changed, 917 insertions(+), 19 deletions(-)
 create mode 100644 client/src/screens/Videos/index.tsx

diff --git a/client/src-tauri/src/commands/saves_screenshots.rs b/client/src-tauri/src/commands/saves_screenshots.rs
index 9e05e19a..3ea858bf 100644
--- a/client/src-tauri/src/commands/saves_screenshots.rs
+++ b/client/src-tauri/src/commands/saves_screenshots.rs
@@ -1,6 +1,6 @@
-//! Tauri command wrappers for save data + screenshot listing.
+//! Tauri command wrappers for save data + screenshot + video-clip listing.
 
-use ps5upload_core::saves::{list_saves, list_screenshots};
+use ps5upload_core::saves::{list_saves, list_screenshots, list_videos};
 use serde_json::Value as JsonValue;
 
 #[tauri::command]
@@ -21,3 +21,12 @@ pub async fn screenshots_list(addr: String) -> Result<JsonValue, String> {
         .map(|s| serde_json::to_value(s).unwrap_or(serde_json::json!({})))
         .map_err(|e| format!("screenshots: {e}"))
 }
+
+#[tauri::command]
+pub async fn videos_list(addr: String) -> Result<JsonValue, String> {
+    tokio::task::spawn_blocking(move || list_videos(&addr))
+        .await
+        .map_err(|e| format!("videos task: {e}"))?
+        .map(|s| serde_json::to_value(s).unwrap_or(serde_json::json!({})))
+        .map_err(|e| format!("videos: {e}"))
+}
diff --git a/client/src-tauri/src/lib.rs b/client/src-tauri/src/lib.rs
index 0a8ca97c..1cae8045 100644
--- a/client/src-tauri/src/lib.rs
+++ b/client/src-tauri/src/lib.rs
@@ -294,6 +294,7 @@ pub fn run() {
             // ── Save data + screenshot listing ──────────────────────
             commands::saves_list,
             commands::screenshots_list,
+            commands::videos_list,
             commands::screenshot_convert,
             // ── Save data .zip backup/restore ───────────────────────
             // The Saves screen uses these to wrap a downloaded save
diff --git a/client/src/App.tsx b/client/src/App.tsx
index 192fe95b..98b749ce 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -40,6 +40,7 @@ const FirstRunScreen = lazy(() => import("./screens/FirstRun"));
 const SavesScreen = lazy(() => import("./screens/Saves"));
 const ProcessesScreen = lazy(() => import("./screens/Processes"));
 const ScreenshotsScreen = lazy(() => import("./screens/Screenshots"));
+const VideosScreen = lazy(() => import("./screens/Videos"));
 const StatsScreen = lazy(() => import("./screens/Stats"));
 const ShellScreen = lazy(() => import("./screens/Shell"));
 const DiskUsageScreen = lazy(() => import("./screens/DiskUsage"));
@@ -212,6 +213,14 @@ export default function App() {
             </Suspense>
           }
         />
+        <Route
+          path="/videos"
+          element={
+            <Suspense fallback={<ScreenLoader />}>
+              <VideosScreen />
+            </Suspense>
+          }
+        />
         <Route
           path="/stats"
           element={
diff --git a/client/src/api/ps5.ts b/client/src/api/ps5.ts
index 9c83a966..c107b50a 100644
--- a/client/src/api/ps5.ts
+++ b/client/src/api/ps5.ts
@@ -1823,6 +1823,15 @@ export async function screenshotsList(addr: string): Promise<ScreenshotList> {
   return invoke<ScreenshotList>("screenshots_list", { addr });
 }
 
+/** List gameplay video clips from the PS5 (`/user/av_contents/video`,
+ *  `.webm`/`.mp4`). Same `{path,size,mtime}` shape as screenshots so the
+ *  Videos screen reuses the row + generic download path. Video clips
+ *  don't need the `.jxr → PNG` conversion screenshots do — they download
+ *  as-is and play in any modern player. */
+export async function videosList(addr: string): Promise<ScreenshotList> {
+  return invoke<ScreenshotList>("videos_list", { addr });
+}
+
 /** Convert a downloaded PS5 screenshot (`.jxr` / JPEG XR — HDR, not
  *  viewable in normal apps) into an SDR PNG. Decoding + HDR→SDR
  *  tone-mapping happen in-process in the Rust backend (jxrlib, no external
diff --git a/client/src/i18n/locales/en.ts b/client/src/i18n/locales/en.ts
index 5d85263b..9a66a7ef 100644
--- a/client/src/i18n/locales/en.ts
+++ b/client/src/i18n/locales/en.ts
@@ -1057,6 +1057,23 @@ screenshots_no_payload: "Connect to your PS5 first.",
 screenshots_select: "Toggle select",
 screenshots_select_all: "Select all",
 screenshots_title: "Screenshots",
+videos_title: "Video clips",
+videos_description:
+  "Gameplay video clips saved on the PS5 (Capture Gallery). Download to your computer, or delete via the File System tab. Clips download as-is — no conversion needed.",
+videos_no_payload: "Connect to your PS5 first.",
+videos_error: "Couldn't list video clips",
+videos_empty: "No clips found — record a gameplay video on the PS5 first.",
+videos_select: "Toggle select",
+videos_select_all: "Select all",
+videos_deselect_all: "Deselect all",
+videos_download: "Download",
+videos_preview: "Preview",
+videos_preview_loading: "Downloading clip…",
+videos_dest_pick: "Pick a folder to download into",
+videos_bulk_dest: "Pick a folder for {n} clips",
+videos_bulk_download: "Download {n}",
+videos_bulk_partial:
+  "Downloaded {ok}; {failed} failed — failed ones stay selected to retry.",
 search_export_csv: "Export CSV",
 search_export_json: "Export JSON",
 search_remove: "Remove saved search",
@@ -1506,6 +1523,7 @@ upload_dest_will_create: "If the destination folder doesn't exist yet on the PS5
 dashboard: "Dashboard",
 saves: "Save data",
 screenshots: "Screenshots",
+videos: "Video clips",
 disk_usage: "Disk usage",
 payloads: "Payloads",
 stats: "Stats",
diff --git a/client/src/layout/Sidebar.tsx b/client/src/layout/Sidebar.tsx
index ba3a9cda..f34a2d0b 100644
--- a/client/src/layout/Sidebar.tsx
+++ b/client/src/layout/Sidebar.tsx
@@ -17,6 +17,7 @@ import {
   Globe,
   Save,
   Image as ImageIcon,
+  Video as VideoIcon,
   Settings as SettingsIcon,
   Info,
   Sun,
@@ -144,6 +145,7 @@ const items: NavItem[] = [
     fallback: "Screenshots",
     icon: ImageIcon,
   },
+  { to: "/videos", key: "videos", fallback: "Video clips", icon: VideoIcon },
 
   // ─ Browse PS5: navigate what's on the console ─
   {
diff --git a/client/src/screens/Videos/index.tsx b/client/src/screens/Videos/index.tsx
new file mode 100644
index 00000000..47795c8b
--- /dev/null
+++ b/client/src/screens/Videos/index.tsx
@@ -0,0 +1,460 @@
+import { useCallback, useEffect, useMemo, useState } from "react";
+import {
+  Video as VideoIcon,
+  RefreshCw,
+  Loader2,
+  Download,
+  CheckSquare,
+  Square,
+  Eye,
+  X,
+} from "lucide-react";
+import { convertFileSrc } from "@tauri-apps/api/core";
+import {
+  waitForJob,
+  videosList,
+  startTransferDownload,
+  saveArchiveMakeTemp,
+  saveArchiveCleanupTemp,
+  type ScreenshotEntry,
+} from "../../api/ps5";
+import { useConnectionStore, PS5_PAYLOAD_PORT } from "../../state/connection";
+import { mgmtAddr } from "../../lib/addr";
+import { useScrollLock } from "../../lib/useScrollLock";
+import { useStaleHostGuard } from "../../lib/staleHostGuard";
+import { PageHeader, Button, EmptyState, ErrorCard } from "../../components";
+import { useTr } from "../../state/lang";
+import { pickPath } from "../../lib/pickPath";
+import { formatBytes } from "../../lib/format";
+import { basename } from "../../lib/uploadDest";
+import { isMobile } from "../../lib/platform";
+
+/** Join a dir + name the same way the screenshot flow does (mirrors
+ *  lib/screenshotConvert.joinDir, kept local so Videos has no dependency on
+ *  the JXR-conversion module it doesn't otherwise need). */
+function joinDir(dir: string, name: string): string {
+  return dir.endsWith("/") ? `${dir}${name}` : `${dir}/${name}`;
+}
+
+/**
+ * Video clips screen — mirrors Screenshots but simpler: PS5 gameplay clips
+ * (`.webm`/`.mp4` under `/user/av_contents/video`) are already playable
+ * formats, so there's no `.jxr → PNG` conversion step. List with checkbox
+ * selection, per-row + bulk download to the host, and an inline `<video>`
+ * preview (desktop only — the preview streams a downloaded copy via
+ * convertFileSrc).
+ *
+ * NB: the on-console video path/extension the payload walks is the
+ * documented Sony layout but hasn't been confirmed against a live console
+ * in-house — if this screen is empty with clips present, the payload's
+ * walk_videos() root/extension filter is what to adjust (see runtime.c).
+ */
+export default function VideosScreen() {
+  const host = useConnectionStore((s) => s.host);
+  const payloadStatus = useConnectionStore((s) => s.payloadStatus);
+  const tr = useTr();
+  const guard = useStaleHostGuard();
+
+  const [items, setItems] = useState<ScreenshotEntry[] | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [selected, setSelected] = useState<Set<string>>(new Set());
+  const [bulkBusy, setBulkBusy] = useState(false);
+  const [busyPaths, setBusyPaths] = useState<Set<string>>(new Set());
+  // Inline <video> preview is desktop-only (streams a downloaded copy from a
+  // scratch dir via convertFileSrc — no mobile file-serving equivalent).
+  const canPreview = !isMobile();
+
+  const allSelected = useMemo(
+    () => !!items && items.length > 0 && selected.size === items.length,
+    [items, selected],
+  );
+
+  function toggleOne(path: string) {
+    setSelected((prev) => {
+      const next = new Set(prev);
+      if (next.has(path)) next.delete(path);
+      else next.add(path);
+      return next;
+    });
+  }
+
+  function toggleAll() {
+    if (!items) return;
+    if (allSelected) setSelected(new Set());
+    else setSelected(new Set(items.map((i) => i.path)));
+  }
+
+  const refresh = useCallback(async () => {
+    if (!host?.trim() || payloadStatus !== "up") return;
+    // Host-stale guard: videosList can take a moment; if the user switches
+    // PS5 mid-list, OLD's clips must not appear under NEW's name.
+    const probe = guard.capture();
+    setLoading(true);
+    setError(null);
+    try {
+      const r = await videosList(mgmtAddr(probe.host));
+      if (probe.isStale()) return;
+      setItems(r.items);
+    } catch (e) {
+      if (probe.isStale()) return;
+      setError(e instanceof Error ? e.message : String(e));
+    } finally {
+      setLoading(false);
+    }
+  }, [host, payloadStatus, guard]);
+
+  useEffect(() => {
+    refresh();
+  }, [refresh]);
+
+  // Clear rendered list + selection the instant the active console changes,
+  // before the new console's videosList resolves — same reasoning as
+  // Screenshots (stops A's rows/selection leaking into B).
+  useEffect(() => {
+    setItems(null);
+    setSelected(new Set());
+    setError(null);
+  }, [host]);
+
+  async function downloadOne(item: ScreenshotEntry) {
+    if (!host?.trim()) return;
+    const dest = await pickPath({
+      mode: "folder",
+      title: tr("videos_dest_pick", undefined, "Pick a folder to download into"),
+    });
+    if (!dest || typeof dest !== "string") return;
+    setBusyPaths((s) => new Set(s).add(item.path));
+    try {
+      const jobId = await startTransferDownload(
+        item.path,
+        dest,
+        `${host.trim()}:${PS5_PAYLOAD_PORT}`,
+        "file",
+      );
+      await waitForJob(jobId);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : String(e));
+    } finally {
+      setBusyPaths((s) => {
+        const next = new Set(s);
+        next.delete(item.path);
+        return next;
+      });
+    }
+  }
+
+  async function downloadSelected() {
+    if (!host?.trim() || selected.size === 0) return;
+    const dest = await pickPath({
+      mode: "folder",
+      title: tr(
+        "videos_bulk_dest",
+        { n: selected.size },
+        `Pick a folder for ${selected.size} clips`,
+      ),
+    });
+    if (!dest || typeof dest !== "string") return;
+    setBulkBusy(true);
+    setError(null);
+    try {
+      // Per-item: one failed clip (transient drop) must not abort the batch.
+      // Keep only the failed paths selected so a re-run retries just those.
+      const failed: string[] = [];
+      let okCount = 0;
+      for (const path of selected) {
+        try {
+          const jobId = await startTransferDownload(
+            path,
+            dest,
+            `${host.trim()}:${PS5_PAYLOAD_PORT}`,
+            "file",
+          );
+          await waitForJob(jobId);
+          okCount++;
+        } catch (e) {
+          failed.push(path);
+          console.warn("[videos] download failed:", path, e);
+        }
+      }
+      setSelected(new Set(failed));
+      if (failed.length > 0) {
+        setError(
+          tr(
+            "videos_bulk_partial",
+            { ok: okCount, failed: failed.length },
+            `Downloaded ${okCount}; ${failed.length} failed — failed ones stay selected to retry.`,
+          ),
+        );
+      }
+    } finally {
+      setBulkBusy(false);
+    }
+  }
+
+  // ─── Inline preview ─────────────────────────────────────────────────
+  const [preview, setPreview] = useState<{
+    item: ScreenshotEntry;
+    url: string | null;
+    tempDir: string | null;
+    loading: boolean;
+    error: string | null;
+  } | null>(null);
+  useScrollLock(!!preview);
+
+  async function openPreview(item: ScreenshotEntry) {
+    if (!host?.trim() || !canPreview) return;
+    setPreview((prev) => {
+      if (prev?.tempDir) void saveArchiveCleanupTemp(prev.tempDir).catch(() => {});
+      return { item, url: null, tempDir: null, loading: true, error: null };
+    });
+    let tempDir: string | null = null;
+    try {
+      tempDir = await saveArchiveMakeTemp("clip-preview");
+      const jobId = await startTransferDownload(
+        item.path,
+        tempDir,
+        `${host.trim()}:${PS5_PAYLOAD_PORT}`,
+        "file",
+      );
+      await waitForJob(jobId);
+      const url = convertFileSrc(joinDir(tempDir, basename(item.path)));
+      const created = tempDir;
+      setPreview((p) => {
+        if (p && p.item.path === item.path) {
+          return { ...p, url, tempDir: created, loading: false };
+        }
+        void saveArchiveCleanupTemp(created).catch(() => {});
+        return p;
+      });
+    } catch (e) {
+      const msg = e instanceof Error ? e.message : String(e);
+      if (tempDir) await saveArchiveCleanupTemp(tempDir).catch(() => {});
+      setPreview((p) =>
+        p && p.item.path === item.path
+          ? { ...p, loading: false, error: msg, tempDir: null }
+          : p,
+      );
+    }
+  }
+
+  function closePreview() {
+    setPreview((p) => {
+      if (p?.tempDir) void saveArchiveCleanupTemp(p.tempDir).catch(() => {});
+      return null;
+    });
+  }
+
+  // Esc closes the preview; clean the scratch dir if the user navigates away
+  // with it open.
+  useEffect(() => {
+    if (!preview) return;
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") closePreview();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [preview]);
+  useEffect(
+    () => () => {
+      // Unmount cleanup handled via closePreview on Esc/close; this catches
+      // navigate-away with a preview still open.
+      setPreview((p) => {
+        if (p?.tempDir) void saveArchiveCleanupTemp(p.tempDir).catch(() => {});
+        return p;
+      });
+    },
+    [],
+  );
+
+  return (
+    <div className="p-6">
+      <PageHeader
+        icon={VideoIcon}
+        title={tr("videos_title", undefined, "Video clips")}
+        count={items?.length}
+        loading={loading}
+        description={tr(
+          "videos_description",
+          undefined,
+          "Gameplay video clips saved on the PS5 (Capture Gallery). Download to your computer, or delete via the File System tab. Clips download as-is — no conversion needed.",
+        )}
+        right={
+          <div className="flex items-center gap-2">
+            {selected.size > 0 && (
+              <Button
+                variant="primary"
+                size="sm"
+                leftIcon={
+                  bulkBusy ? (
+                    <Loader2 size={12} className="animate-spin" />
+                  ) : (
+                    <Download size={12} />
+                  )
+                }
+                onClick={downloadSelected}
+                disabled={bulkBusy}
+              >
+                {tr("videos_bulk_download", { n: selected.size }, `Download ${selected.size}`)}
+              </Button>
+            )}
+            <Button
+              variant="secondary"
+              size="sm"
+              leftIcon={<RefreshCw size={12} />}
+              onClick={refresh}
+              disabled={loading || !host?.trim() || payloadStatus !== "up"}
+            >
+              {tr("refresh", undefined, "Refresh")}
+            </Button>
+          </div>
+        }
+      />
+
+      {payloadStatus !== "up" && (
+        <EmptyState
+          fill
+          icon={VideoIcon}
+          message={tr("videos_no_payload", undefined, "Connect to your PS5 first.")}
+        />
+      )}
+
+      {error && (
+        <div className="mb-4">
+          <ErrorCard
+            title={tr("videos_error", undefined, "Couldn't list video clips")}
+            detail={error}
+          />
+        </div>
+      )}
+
+      {items && items.length === 0 && payloadStatus === "up" && (
+        <EmptyState
+          icon={VideoIcon}
+          message={tr(
+            "videos_empty",
+            undefined,
+            "No clips found — record a gameplay video on the PS5 first.",
+          )}
+        />
+      )}
+
+      <div className="mx-auto max-w-4xl">
+        {items && items.length > 0 && (
+          <button
+            type="button"
+            onClick={toggleAll}
+            className="mb-2 inline-flex items-center gap-1.5 text-xs text-[var(--color-muted)] hover:text-[var(--color-text)]"
+          >
+            {allSelected ? <CheckSquare size={11} /> : <Square size={11} />}
+            {allSelected
+              ? tr("videos_deselect_all", undefined, "Deselect all")
+              : tr("videos_select_all", undefined, "Select all")}
+          </button>
+        )}
+        <ul className="space-y-1">
+          {items?.map((item) => {
+            const isSelected = selected.has(item.path);
+            const rowBusy = busyPaths.has(item.path);
+            return (
+              <li
+                key={item.path}
+                className={`flex items-center gap-3 rounded-md border p-2 text-xs ${
+                  isSelected
+                    ? "border-[var(--color-accent)] bg-[var(--color-surface-2)]"
+                    : "border-[var(--color-border)] bg-[var(--color-surface-2)]"
+                }`}
+              >
+                <button
+                  type="button"
+                  onClick={() => toggleOne(item.path)}
+                  className="text-[var(--color-muted)] hover:text-[var(--color-text)]"
+                  aria-label={tr("videos_select", undefined, "Toggle select")}
+                >
+                  {isSelected ? <CheckSquare size={12} /> : <Square size={12} />}
+                </button>
+                <VideoIcon
+                  size={16}
+                  className="shrink-0 text-[var(--color-muted)]"
+                />
+                <div className="min-w-0 flex-1">
+                  <div className="truncate font-medium text-[var(--color-text)]">
+                    {basename(item.path)}
+                  </div>
+                  <div className="truncate text-[var(--color-muted)]">
+                    {formatBytes(item.size)}
+                  </div>
+                </div>
+                {canPreview && (
+                  <button
+                    type="button"
+                    onClick={() => openPreview(item)}
+                    className="inline-flex items-center gap-1 rounded px-1.5 py-1 text-[var(--color-muted)] hover:text-[var(--color-text)]"
+                    aria-label={tr("videos_preview", undefined, "Preview")}
+                  >
+                    <Eye size={13} />
+                  </button>
+                )}
+                <button
+                  type="button"
+                  onClick={() => void downloadOne(item)}
+                  disabled={rowBusy}
+                  className="inline-flex items-center gap-1 rounded px-1.5 py-1 text-[var(--color-muted)] hover:text-[var(--color-text)] disabled:opacity-50"
+                  aria-label={tr("videos_download", undefined, "Download")}
+                >
+                  {rowBusy ? (
+                    <Loader2 size={13} className="animate-spin" />
+                  ) : (
+                    <Download size={13} />
+                  )}
+                </button>
+              </li>
+            );
+          })}
+        </ul>
+      </div>
+
+      {preview && (
+        <div
+          className="fixed inset-0 z-50 flex items-center justify-center bg-black/80 p-6"
+          onClick={closePreview}
+        >
+          <div
+            className="relative max-h-full max-w-3xl overflow-hidden rounded-lg bg-[var(--color-surface)]"
+            onClick={(e) => e.stopPropagation()}
+          >
+            <button
+              type="button"
+              onClick={closePreview}
+              className="absolute right-2 top-2 z-10 rounded-full bg-black/50 p-1.5 text-white hover:bg-black/70"
+              aria-label={tr("close", undefined, "Close")}
+            >
+              <X size={16} />
+            </button>
+            <div className="flex min-h-[240px] min-w-[320px] items-center justify-center p-2">
+              {preview.loading && (
+                <div className="flex items-center gap-2 text-sm text-[var(--color-muted)]">
+                  <Loader2 size={16} className="animate-spin" />
+                  {tr("videos_preview_loading", undefined, "Downloading clip…")}
+                </div>
+              )}
+              {preview.error && (
+                <div className="max-w-sm text-center text-sm text-[var(--color-danger)]">
+                  {preview.error}
+                </div>
+              )}
+              {preview.url && !preview.loading && (
+                <video
+                  src={preview.url}
+                  controls
+                  autoPlay
+                  className="max-h-[70vh] max-w-full rounded"
+                />
+              )}
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/engine/crates/ftx2-proto/src/lib.rs b/engine/crates/ftx2-proto/src/lib.rs
index dacb336b..9b5fc8cf 100644
--- a/engine/crates/ftx2-proto/src/lib.rs
+++ b/engine/crates/ftx2-proto/src/lib.rs
@@ -510,6 +510,12 @@ pub enum FrameType {
     ProcessListAck = 163,
     ProcessKill = 164,
     ProcessKillAck = 165,
+    /// List gameplay video clips stored on the console. Body empty. ACK
+    /// body: JSON `{"items":[{"path":"...","size":N,"mtime":<i64>}, …]}`,
+    /// same shape as ListScreenshotsAck, where path is a `.webm`/`.mp4`
+    /// under `/user/av_contents/video` (recursive, 5 levels deep).
+    ListVideos = 166,
+    ListVideosAck = 167,
 }
 
 impl FrameType {
@@ -665,6 +671,8 @@ impl FrameType {
             163 => Ok(Self::ProcessListAck),
             164 => Ok(Self::ProcessKill),
             165 => Ok(Self::ProcessKillAck),
+            166 => Ok(Self::ListVideos),
+            167 => Ok(Self::ListVideosAck),
             _ => Err(DecodeError::UnknownFrameType(v)),
         }
     }
diff --git a/engine/crates/ps5upload-core/src/saves.rs b/engine/crates/ps5upload-core/src/saves.rs
index cef5fd44..175acbb8 100644
--- a/engine/crates/ps5upload-core/src/saves.rs
+++ b/engine/crates/ps5upload-core/src/saves.rs
@@ -79,3 +79,25 @@ pub fn list_screenshots(addr: &str) -> Result<ScreenshotList> {
     let parsed: ScreenshotList = serde_json::from_slice(&resp)?;
     Ok(parsed)
 }
+
+/// List gameplay video clips on the console. Same wire/JSON shape as
+/// `list_screenshots` (path/size/mtime) so the client reuses the row
+/// renderer and the generic transfer-download path — the only difference
+/// is the payload walks `/user/av_contents/video` for `.webm`/`.mp4`.
+pub fn list_videos(addr: &str) -> Result<ScreenshotList> {
+    let mut c = Connection::connect(addr)?;
+    c.send_frame(FrameType::ListVideos, &[])?;
+    let (hdr, resp) = c.recv_frame()?;
+    let ft = hdr.frame_type().unwrap_or(FrameType::Error);
+    if ft == FrameType::Error {
+        bail!(
+            "payload rejected LIST_VIDEOS: {}",
+            String::from_utf8_lossy(&resp)
+        );
+    }
+    if ft != FrameType::ListVideosAck {
+        bail!("expected LIST_VIDEOS_ACK, got {ft:?}");
+    }
+    let parsed: ScreenshotList = serde_json::from_slice(&resp)?;
+    Ok(parsed)
+}
diff --git a/payload/src/runtime.c b/payload/src/runtime.c
index d9714acf..d12a63fd 100644
--- a/payload/src/runtime.c
+++ b/payload/src/runtime.c
@@ -349,6 +349,9 @@ extern int posix_fallocate(int fd, off_t offset, off_t len);
 #define FTX2_FRAME_PROCESS_LIST_ACK  163u
 #define FTX2_FRAME_PROCESS_KILL      164u
 #define FTX2_FRAME_PROCESS_KILL_ACK  165u
+/* Video-clip listing (parallels screenshot listing at 94/95). */
+#define FTX2_FRAME_LIST_VIDEOS       166u
+#define FTX2_FRAME_LIST_VIDEOS_ACK   167u
 /* Where we place mount points. Scoped under /mnt/ps5upload/ so it
  * never collides with mount paths owned by other utilities. */
 #define FS_MOUNT_BASE "/mnt/ps5upload"
@@ -10086,6 +10089,59 @@ static int walk_screenshots(const char *root, int depth_left,
     return count;
 }
 
+/* Recursively walk `root` up to `depth_left` levels; append a JSON entry
+ * for each video-clip file found. PS5 stores gameplay video clips under
+ *   /user/av_contents/video/<userId>/<userId>/<batch>/<file>.webm
+ * (WebM is the native container on current firmware; older/imported
+ * clips may be .mp4). Unlike screenshots there is no separate thumbnail
+ * tree to dedup, so this is a plain flat walk — same JSON shape
+ * (path/size/mtime) as walk_screenshots so the client reuses the row
+ * renderer and the generic transfer-download path.
+ *
+ * NB (needs FW confirmation): the exact av_contents/video path + the
+ * .webm/.mp4 extension set are the documented layout but haven't been
+ * verified against a live console in-house — mirror of the screenshot
+ * bug where a wrong extension listed 0 files. If the Clips tab shows
+ * empty on hardware with clips present, adjust the extension filter /
+ * root here. */
+static int walk_videos(const char *root, int depth_left,
+                       char *body, int *n, int cap, int *wrote_one) {
+    if (depth_left <= 0) return 0;
+    DIR *dp = opendir(root);
+    if (!dp) return 0;
+    int count = 0;
+    struct dirent *e;
+    while ((e = readdir(dp)) != NULL) {
+        if (e->d_name[0] == '.') continue;
+        char path[1024];
+        snprintf(path, sizeof(path), "%s/%s", root, e->d_name);
+        struct stat st;
+        if (stat(path, &st) != 0) continue;
+        if (S_ISDIR(st.st_mode)) {
+            count += walk_videos(path, depth_left - 1, body, n, cap, wrote_one);
+            continue;
+        }
+        const char *ext = strrchr(e->d_name, '.');
+        if (!ext) continue;
+        if (strcmp(ext, ".webm") != 0 &&
+            strcmp(ext, ".mp4") != 0 &&
+            strcmp(ext, ".mov") != 0) continue;
+        char esc_path[2048];
+        json_escape_into(path, esc_path, sizeof(esc_path));
+        if (*n >= cap - 2300) break;
+        if (*wrote_one) {
+            body[(*n)++] = ',';
+        }
+        *wrote_one = 1;
+        *n += snprintf(body + *n, cap - *n,
+                       "{\"path\":\"%s\",\"size\":%lld,\"mtime\":%lld}",
+                       esc_path, (long long)st.st_size, (long long)st.st_mtime);
+        count++;
+    }
+    closedir(dp);
+    return count;
+}
+
 /* ── Filesystem search index ──────────────────────────────────────────
  *
  * Build an in-memory index of every regular file under a set of roots,
@@ -14258,6 +14314,35 @@ static int handle_list_screenshots(runtime_state_t *state, int client_fd,
     return rc;
 }
 
+/* List gameplay video clips (parallels handle_list_screenshots). No
+ * thumbnail tree to dedup — a single flat walk of av_contents/video. */
+static int handle_list_videos(runtime_state_t *state, int client_fd,
+                              uint64_t trace_id) {
+    if (!state) return -1;
+    char *resp = malloc(64 * 1024);
+    if (!resp) {
+        const char *err = "{\"err\":\"oom\"}";
+        return send_frame(client_fd, FTX2_FRAME_LIST_VIDEOS_ACK, 0,
+                          trace_id, err, strlen(err));
+    }
+    int cap = 64 * 1024;
+    int n = 0;
+    n += snprintf(resp + n, cap - n, "{\"items\":[");
+    int wrote_one = 0;
+    walk_videos("/user/av_contents/video", 5, resp, &n, cap, &wrote_one);
+    if (n < cap - 2) {
+        resp[n++] = ']';
+        resp[n++] = '}';
+    }
+    int rc = send_frame(client_fd, FTX2_FRAME_LIST_VIDEOS_ACK, 0,
+                        trace_id, resp, (uint64_t)n);
+    free(resp);
+    pthread_mutex_lock(&state->state_mtx);
+    state->command_count += 1;
+    pthread_mutex_unlock(&state->state_mtx);
+    return rc;
+}
+
 static int handle_hw_storage(runtime_state_t *state, int client_fd, uint64_t trace_id) {
     return handle_hw_text_op(state, client_fd, trace_id, hw_storage_get_text,
                               FTX2_FRAME_HW_STORAGE_ACK, "hw_storage_failed");
@@ -16683,6 +16768,9 @@ static int handle_binary_frame(runtime_state_t *state, int client_fd,
     if (hdr.frame_type == FTX2_FRAME_LIST_SCREENSHOTS) {
         return handle_list_screenshots(state, client_fd, hdr.trace_id);
     }
+    if (hdr.frame_type == FTX2_FRAME_LIST_VIDEOS) {
+        return handle_list_videos(state, client_fd, hdr.trace_id);
+    }
     if (hdr.frame_type == FTX2_FRAME_INDEX_START) {
         return handle_index_start(state, client_fd, hdr.trace_id,
                                   request_body, hdr.body_len);
diff --git a/scripts/i18n-known-missing.json b/scripts/i18n-known-missing.json
index ffd8bba8..a67f6a00 100644
--- a/scripts/i18n-known-missing.json
+++ b/scripts/i18n-known-missing.json
@@ -218,7 +218,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -441,7 +457,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -664,7 +696,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -887,7 +935,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -1110,7 +1174,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -1333,7 +1413,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -1556,7 +1652,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -1779,7 +1891,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -2002,7 +2130,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -2225,7 +2369,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -2448,7 +2608,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -2671,7 +2847,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -2894,7 +3086,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -3117,7 +3325,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -3340,7 +3564,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -3563,7 +3803,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   },
@@ -3786,7 +4042,23 @@
       "upload_scanning_archive_hint_v2",
       "upload_starting",
       "upload_target_label",
-      "upload_uploading"
+      "upload_uploading",
+      "videos",
+      "videos_bulk_dest",
+      "videos_bulk_download",
+      "videos_bulk_partial",
+      "videos_description",
+      "videos_deselect_all",
+      "videos_dest_pick",
+      "videos_download",
+      "videos_empty",
+      "videos_error",
+      "videos_no_payload",
+      "videos_preview",
+      "videos_preview_loading",
+      "videos_select",
+      "videos_select_all",
+      "videos_title"
     ],
     "stale": []
   }