diff --git a/client/src/components/VideosView.jsx b/client/src/components/VideosView.jsx index feda2a5..0454e30 100644 --- a/client/src/components/VideosView.jsx +++ b/client/src/components/VideosView.jsx @@ -44,10 +44,13 @@ function fmtSize(b) { // ── Component ───────────────────────────────────────────────────────────────── +const SHORT_THRESHOLD = 2; // seconds + export default function VideosView({ filters = {} }) { - const [videos, setVideos] = useState(null); - const [playing, setPlaying] = useState(null); - const [error, setError] = useState(null); + const [videos, setVideos] = useState(null); + const [playing, setPlaying] = useState(null); + const [error, setError] = useState(null); + const [showShort, setShowShort] = useState(false); useEffect(() => { setVideos(null); @@ -77,10 +80,36 @@ export default function VideosView({ filters = {} }) { ); } - const groups = groupByMonth(videos); + const shortCount = videos.filter(v => v.duration != null && v.duration <= SHORT_THRESHOLD).length; + const visible = showShort ? videos : videos.filter(v => v.duration == null || v.duration > SHORT_THRESHOLD); + const groups = groupByMonth(visible).filter(g => g.videos.length > 0); return ( <> + {/* Toolbar */} + {shortCount > 0 && ( +