fix: clear stale download overlay after delete

Deleting a download removed the database row but left its entry in the
live-progress map, so the row kept showing Saved and an Offline badge
until the app restarted.
This commit is contained in:
vincent
2026-08-29 03:27:20 +02:00
parent d976d111bf
commit d0bad64d7c
2 changed files with 19 additions and 4 deletions
+3 -2
View File
@@ -73,7 +73,7 @@ export default function App() {
); );
const { items, channels, loading, error, reload } = useFeed(filter); const { items, channels, loading, error, reload } = useFeed(filter);
const live = useDownloads(reload); const { live, clear: clearLive } = useDownloads(reload);
useEffect(() => { useEffect(() => {
let un: (() => void) | undefined; let un: (() => void) | undefined;
@@ -212,7 +212,7 @@ export default function App() {
cancelDownload(item.id).catch((e) => setFailure(String(e))), cancelDownload(item.id).catch((e) => setFailure(String(e))),
onDelete: () => onDelete: () =>
deleteDownload(item.id) deleteDownload(item.id)
.then(() => { reload(); say("Download deleted"); }) .then(() => { clearLive(item.id); reload(); say("Download deleted"); })
.catch((e) => setFailure(String(e))), .catch((e) => setFailure(String(e))),
}; };
return view === "grid" ? ( return view === "grid" ? (
@@ -232,6 +232,7 @@ export default function App() {
onClose={() => setPlaying(null)} onClose={() => setPlaying(null)}
onDelete={async () => { onDelete={async () => {
await deleteDownload(playing.item.id); await deleteDownload(playing.item.id);
clearLive(playing.item.id);
setPlaying(null); setPlaying(null);
reload(); reload();
say("Download deleted"); say("Download deleted");
+16 -2
View File
@@ -1,4 +1,4 @@
import { useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import { onDownloadProgress, onDownloadState } from "../api"; import { onDownloadProgress, onDownloadState } from "../api";
import type { DownloadState } from "../types"; import type { DownloadState } from "../types";
@@ -18,6 +18,20 @@ export interface LiveDownload {
export function useDownloads(onFinished: () => void) { export function useDownloads(onFinished: () => void) {
const [live, setLive] = useState<Record<string, LiveDownload>>({}); const [live, setLive] = useState<Record<string, LiveDownload>>({});
/**
* Drops a video's overlay. Required after deleting a download: the database
* row is gone, but a stale `done` entry here would keep the row showing
* "Saved" until the app restarts.
*/
const clear = useCallback((videoId: string) => {
setLive((prev) => {
if (!(videoId in prev)) return prev;
const next = { ...prev };
delete next[videoId];
return next;
});
}, []);
useEffect(() => { useEffect(() => {
const unlisteners: Array<() => void> = []; const unlisteners: Array<() => void> = [];
@@ -55,5 +69,5 @@ export function useDownloads(onFinished: () => void) {
return () => unlisteners.forEach((u) => u()); return () => unlisteners.forEach((u) => u());
}, [onFinished]); }, [onFinished]);
return live; return { live, clear };
} }