From 6af05abf410bbd038ce7fa6915a659defc509071 Mon Sep 17 00:00:00 2001 From: Christophe Besson Date: Mon, 24 Aug 2026 10:04:46 +0200 Subject: feat(node,hub): add Videos group app (poster grid, flat list, TMDB metadata) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Implements docs/mediacenter.md: a "Videos" group application built on the existing files index rather than a separate catalogue. On the node side, new indexer enrichment (technical probe, filename/season parsing, thumbnail generation) runs per-file once an operator has chosen a video_root for the group, plus a TMDB client for on-demand poster/metadata lookups (never client-side, thumbnails delivered over the existing chunk path). On the hub side, a new video-app.js renders a lazily-mounted poster grid or a thumbnail-only flat list, with TMDB entirely optional per group. Along the way: the global apps registry now drives Settings' default-tab picker instead of a hardcoded list, and the video_root is configured from group Settings (like uploads) rather than from Files, with the node refusing to run any TMDB/thumbnail work until one is set. Fixes several bugs found via live testing against a real library, notably a race between two effects writing the same "image ready" state that could leave a poster grid spinning forever on a same-tab revisit — see mediacenter.md §5.4 for the full account of each one. --- .../src/meshbay_hub/static/group-page.js | 37 ++++++++++++++++++---- 1 file changed, 31 insertions(+), 6 deletions(-) (limited to 'packages/meshbay-hub/src/meshbay_hub/static/group-page.js') diff --git a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js index 29f3602..55f8e36 100644 --- a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js +++ b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js @@ -80,6 +80,12 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs, // to the operator in Settings, not enforced from here (indexer.py owns // that). Null until the handshake ack arrives. const [scanSettings, setScanSettings] = useState(null); + // TMDB on/off + whether a custom token is set, node-wide (not per-group) — + // docs/mediacenter.md §5.5. Null until the handshake ack arrives. + const [tmdbConfig, setTmdbConfig] = useState(null); + // Which folder is the Videos app's entry point for this group — '' + // (the default) means the whole group index. Set from Files, per-group. + const [videoRoot, setVideoRoot] = useState(''); // Paired ≠ operator account. `is_node_admin` says the hub account owning this // node is the one connecting; this says the node pinned *this browser's* key // as an operator key. Only the second one lets you sign an invite, and only @@ -127,20 +133,24 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs, cacheGroupIndex(groupId, group ? group.name : groupId, fresh); }, [groupId, group]); - // additions/deletions only (daemon.py _broadcast_index_change, once there - // is a previous snapshot to diff against) — applied on top of whatever - // applyIndex last put in `entries`, instead of replacing the whole table - // for one changed file. + // additions/deletions/updates (daemon.py _broadcast_index_change, once + // there is a previous snapshot to diff against) — applied on top of + // whatever applyIndex last put in `entries`, instead of replacing the + // whole table for one changed file. `updates` is the Videos app's async + // enrichment (duration/thumb_hash/display_title/...) arriving for a file + // already in the table — same id, new fields (see group_index.py diff()). const applyIndexDelta = useCallback((deltaMsg) => { setEntries((prev) => { const deletions = new Set(deltaMsg.deletions || []); const kept = prev.filter((e) => !deletions.has(e.id)); + const updates = new Map((deltaMsg.updates || []).map((e) => [e.id, e])); + const updated = kept.map((e) => updates.get(e.id) || e); // The index is keyed by content hash: an addition whose id is already // present is the same duplicate-content case indexer.py's own // reconcile sweep leaves alone, not a second row for one file. - const keptIds = new Set(kept.map((e) => e.id)); + const keptIds = new Set(updated.map((e) => e.id)); const additions = (deltaMsg.additions || []).filter((e) => !keptIds.has(e.id)); - const fresh = kept.concat(additions); + const fresh = updated.concat(additions); cacheGroupIndex(groupId, group ? group.name : groupId, fresh); return fresh; }); @@ -196,11 +206,19 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs, setMemberUpload(ack.member_upload !== false); setEnabledApps(ack.enabled_apps || null); setScanSettings(ack.scan_settings || null); + setTmdbConfig({ + enabled: ack.tmdb_enabled !== false, + tokenCustomized: !!ack.tmdb_token_customized, + language: ack.tmdb_language || '', + }); + setVideoRoot(ack.video_root || ''); // Changed while we are connected, by an operator who may be someone // else entirely. Without this the button stays until a reconnection, // and a button that is still there is a button people press. transport.onUploadPolicy = (allowed) => setMemberUpload(allowed); transport.onAppsEnabled = (apps) => setEnabledApps(apps); + transport.onTmdbConfig = (cfg) => setTmdbConfig(cfg); + transport.onVideoRoot = (path) => setVideoRoot(path); // The node's own scan (a root added while we were already connected, // or reconcile catching one back up) — never the entries, just // enough to animate the sidebar dot. Guaranteed a final push at the @@ -390,6 +408,8 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs, entries, nodeDirs, nodeRoots, setEntries, setNodeDirs, setNodeRoots, applyIndex, isNodeAdmin, operatorPaired, mayUpload, userId, setError, onPreview, onRefreshIndex: refreshIndex, onActivity: touchActivity, + videoRoot, onVideoRoot: (path) => setVideoRoot(path), + tmdbConfig, }; return html` @@ -503,6 +523,11 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs, onEnabledApps=${(keys) => setEnabledApps(keys)} scanSettings=${scanSettings} onScanSettings=${(s) => setScanSettings(s)} + tmdbConfig=${tmdbConfig} + onTmdbConfig=${(cfg) => setTmdbConfig(cfg)} + entries=${entries} nodeDirs=${nodeDirs} + videoRoot=${videoRoot} + onVideoRoot=${(path) => setVideoRoot(path)} onLeft=${onLeft} onPaired=${() => setOperatorPaired(true)} /> `} -- cgit v1.2.3