feat(KB-662): add visibility change listener with debouncing to task refresh

- Add visibilitychange listener in useTasks hook to refresh tasks when tab becomes visible
- Implement 1-second debounce to prevent rapid refetching on visibility changes
- Add comprehensive tests for visibility change behavior including debouncing
- Clean up unused variable in SettingsModal from merge conflict resolution
This commit is contained in:
gsxdsm
2026-04-01 07:05:49 -07:00
parent 02a30a9e96
commit 79ba5013e1
3 changed files with 166 additions and 3 deletions

View File

@@ -30,11 +30,41 @@ export function useTasks() {
const tasksRef = useRef(tasks);
tasksRef.current = tasks;
// Ref to track last visibility fetch time for debouncing (1 second minimum)
const lastVisibilityFetchRef = useRef<number>(0);
const VISIBILITY_FETCH_DEBOUNCE_MS = 1000;
// Fetch initial tasks
useEffect(() => {
api.fetchTasks().then((tasks) => setTasks(tasks.map(normalizeTask))).catch(() => setTasks([]));
}, []);
// Visibility change listener - refresh tasks when tab becomes visible
useEffect(() => {
const handleVisibilityChange = () => {
if (document.visibilityState === "visible") {
const now = Date.now();
const timeSinceLastFetch = now - lastVisibilityFetchRef.current;
// Debounce: only fetch if at least 1 second has passed since last visibility fetch
if (timeSinceLastFetch >= VISIBILITY_FETCH_DEBOUNCE_MS) {
lastVisibilityFetchRef.current = now;
api.fetchTasks()
.then((tasks) => setTasks(tasks.map(normalizeTask)))
.catch(() => {
// Silently ignore fetch errors on visibility change
});
}
}
};
document.addEventListener("visibilitychange", handleVisibilityChange);
return () => {
document.removeEventListener("visibilitychange", handleVisibilityChange);
};
}, []);
// SSE live updates
useEffect(() => {
let closedByCleanup = false;