Lotus CIandClaude Opus 5.5
146ba4d2ff
Upload atoms now also report into an app-wide `uploadProgressAtom`, and `aggregateUploadProgress` turns every in-flight upload into one taskbar state: byte-weighted percentage while uploading, indeterminate until a size is known, red after a failure (held 4 s, then cleared), none when done. Cancelled uploads just disappear. `useTauriTaskbarProgress` sends it to the native `set_taskbar_progress`, at most ~4 times a second, always ending on the latest state. Verified with a throttled 6 MB upload: 0% → 99% at 250 ms steps, then cleared; with the upload request aborted: 0% → error → cleared after 4 s. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PPmy3tPq869XDW4njjVaKA
63 lines
2.3 KiB
TypeScript
63 lines
2.3 KiB
TypeScript
import { useEffect, useRef } from 'react';
|
|
import { useAtom } from 'jotai';
|
|
import { aggregateUploadProgress, uploadProgressAtom } from '../state/uploadProgress';
|
|
import { invokeTauri, isTauri } from './useTauri';
|
|
|
|
/** Native updates at most ~4 per second. */
|
|
const MIN_INTERVAL_MS = 250;
|
|
/** How long a failed upload keeps the bar red before it clears. */
|
|
const ERROR_HOLD_MS = 4_000;
|
|
|
|
/**
|
|
* [cinny-desktop #10] One taskbar progress bar for all uploads: the combined
|
|
* percentage while files upload, indeterminate until a size is known, red for a
|
|
* few seconds after a failure, cleared when done. No-op in the browser.
|
|
*/
|
|
export function useTauriTaskbarProgress(): void {
|
|
const [entries, setEntries] = useAtom(uploadProgressAtom);
|
|
const lastSent = useRef<string>('');
|
|
const lastAt = useRef(0);
|
|
const pending = useRef<number | undefined>(undefined);
|
|
// The (possibly delayed) send must use the latest uploads, not the ones from
|
|
// when it was scheduled — otherwise the final "done" could be dropped.
|
|
const latest = useRef(entries);
|
|
latest.current = entries;
|
|
|
|
useEffect(() => {
|
|
if (!isTauri()) return undefined;
|
|
const send = () => {
|
|
pending.current = undefined;
|
|
const state = aggregateUploadProgress(latest.current.values(), Date.now());
|
|
const key = JSON.stringify(state);
|
|
if (key === lastSent.current) return;
|
|
lastSent.current = key;
|
|
lastAt.current = Date.now();
|
|
invokeTauri('set_taskbar_progress', {
|
|
status: state.status,
|
|
progress: 'progress' in state ? state.progress : null,
|
|
});
|
|
};
|
|
const wait = MIN_INTERVAL_MS - (Date.now() - lastAt.current);
|
|
if (wait <= 0) send();
|
|
else if (pending.current === undefined) pending.current = window.setTimeout(send, wait);
|
|
return undefined;
|
|
}, [entries]);
|
|
|
|
// Drop failed entries after a moment so the red bar doesn't stick.
|
|
useEffect(() => {
|
|
const failed = Array.from(entries.values()).some((e) => e.failed);
|
|
if (!failed) return undefined;
|
|
const timer = window.setTimeout(() => {
|
|
setEntries((prev) => new Map(Array.from(prev).filter(([, e]) => !e.failed)));
|
|
}, ERROR_HOLD_MS);
|
|
return () => window.clearTimeout(timer);
|
|
}, [entries, setEntries]);
|
|
|
|
useEffect(
|
|
() => () => {
|
|
if (pending.current !== undefined) window.clearTimeout(pending.current);
|
|
},
|
|
[],
|
|
);
|
|
}
|