mARTin-B78/My-Weekly-ToDo-List
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: sync spinner disappearing prematurely during concurrent fetches

Browse Source 
When both fetchCalendarEvents and fetchTasks ran in parallel, whichever
finished first would set isSyncing=false, hiding the spinner while the
other was still running. Replaced boolean with a ref-based counter so
the spinner stays visible until all concurrent syncs complete.

v1.3.1

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
mARTin 2026-02-24 00:52:06 +01:00
parent c8080f23ff
commit eb5a4b4232
2 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "my-weekly-todo-list", "name": "my-weekly-todo-list",
"version": "1.3.0", "version": "1.3.1",
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view", "description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {

11
src/components/WeeklyView.tsx
View File

@ -483,6 +483,9 @@ export default function WeeklyView() {
const [viewDays, setViewDays] = useState(7); const [viewDays, setViewDays] = useState(7);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [isSyncing, setIsSyncing] = useState(false); const [isSyncing, setIsSyncing] = useState(false);
const syncCountRef = useRef(0);
const startSync = useCallback(() => { syncCountRef.current++; setIsSyncing(true); }, []);
const endSync = useCallback(() => { syncCountRef.current = Math.max(0, syncCountRef.current - 1); if (syncCountRef.current === 0) setIsSyncing(false); }, []);
const [darkMode, setDarkMode] = useState(false); const [darkMode, setDarkMode] = useState(false);
const [timeFormat, setTimeFormat] = useState("24h"); const [timeFormat, setTimeFormat] = useState("24h");
const [dateFormat, setDateFormat] = useState("yyyy-MM-dd"); const [dateFormat, setDateFormat] = useState("yyyy-MM-dd");
@ -859,7 +862,7 @@ export default function WeeklyView() {
// Fetch calendar events // Fetch calendar events
const fetchCalendarEvents = useCallback(async (forceRefresh = false) => { const fetchCalendarEvents = useCallback(async (forceRefresh = false) => {
setIsSyncing(true); startSync();
try { try {
const response = await fetch("/api/calendar/sync", { const response = await fetch("/api/calendar/sync", {
method: "POST", method: "POST",
@ -890,7 +893,7 @@ export default function WeeklyView() {
} catch (error) { } catch (error) {
console.error("Error fetching calendar events:", error); console.error("Error fetching calendar events:", error);
} finally { } finally {
setIsSyncing(false); endSync();
} }
}, [currentWeekStart]); }, [currentWeekStart]);
@ -1399,7 +1402,7 @@ export default function WeeklyView() {
} }
async function fetchTasks() { async function fetchTasks() {
setIsSyncing(true); startSync();
try { try {
const [tasksResponse, listsResponse] = await Promise.all([ const [tasksResponse, listsResponse] = await Promise.all([
fetch("/api/tasks"), fetch("/api/tasks"),
@ -1489,7 +1492,7 @@ export default function WeeklyView() {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
} finally { } finally {
setIsLoading(false); setIsLoading(false);
setIsSyncing(false); endSync();
} }
} }