perf(header): poll sync status faster while work is in flight

The header polled every 30s, so the live "syncing" state (now gated on a real
running job) was usually missed between ticks. Poll every 8s while a job is
running or channels are pending, easing back to 30s once everything's settled,
via react-query's functional refetchInterval.
This commit is contained in:
npeter83 2026-06-19 03:24:45 +02:00
parent 8c70d72e9a
commit 00680cae30

View file

@ -1,7 +1,7 @@
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Clock, Database, History, Loader2, Pause, Play } from "lucide-react"; import { Clock, Database, History, Loader2, Pause, Play } from "lucide-react";
import { api } from "../lib/api"; import { api, type MyStatus } from "../lib/api";
import { formatViews } from "../lib/format"; import { formatViews } from "../lib/format";
import Tooltip from "./Tooltip"; import Tooltip from "./Tooltip";
@ -22,11 +22,19 @@ export default function SyncStatus({
queryFn: api.myStatus, queryFn: api.myStatus,
// Track the scheduler near-real-time: poll even when the tab is backgrounded, and // Track the scheduler near-real-time: poll even when the tab is backgrounded, and
// refresh immediately on tab focus (the global default disables focus refetch), so the // refresh immediately on tab focus (the global default disables focus refetch), so the
// "N without full history" count keeps ticking down without a manual reload. // "N without full history" count keeps ticking down without a manual reload. Poll faster
refetchInterval: 30_000, // while a job is running or work is pending — so the live "syncing" state is actually
// caught — and ease back to a slow idle tick once everything's settled.
refetchInterval: (query) => {
const d = query.state.data as MyStatus | undefined;
const busy =
!!d &&
(d.sync_active || d.channels_recent_pending > 0 || d.channels_deep_pending > 0);
return busy ? 8_000 : 30_000;
},
refetchIntervalInBackground: true, refetchIntervalInBackground: true,
refetchOnWindowFocus: true, refetchOnWindowFocus: true,
staleTime: 25_000, staleTime: 5_000,
}); });
const toggle = useMutation({ const toggle = useMutation({