Fix SpoolBuddy update UI feedback and stale query cache

- Check button now shows spinner on refetch (isFetching vs isLoading)
  - Force Update button shows spinner while triggering
  - Reduced staleTime from 4 minutes to 30 seconds so the UI picks up
    version changes after an update without a long delay
This commit is contained in:
maziggy
2026-03-23 14:48:10 +01:00
parent 0e44e149bd
commit 1f24bd264a
4 changed files with 29 additions and 23 deletions
@@ -64,7 +64,7 @@ export function SpoolBuddyLayout() {
queryFn: () => device ? spoolbuddyApi.checkDaemonUpdate(device.device_id) : Promise.resolve(null),
enabled: !!device,
refetchInterval: 5 * 60 * 1000, // re-check every 5 minutes
staleTime: 4 * 60 * 1000,
staleTime: 30 * 1000,
});
// Update alert based on device state and available updates
@@ -509,10 +509,10 @@ function UpdatesTab({ device }: { device: SpoolBuddyDevice }) {
const isUpdating = device.update_status === 'pending' || device.update_status === 'updating';
const { data: updateResult, isLoading: checking, refetch } = useQuery({
const { data: updateResult, isFetching: checking, refetch } = useQuery({
queryKey: ['spoolbuddy-update-check', device.device_id],
queryFn: () => spoolbuddyApi.checkDaemonUpdate(device.device_id),
staleTime: 4 * 60 * 1000,
staleTime: 30 * 1000,
});
const { data: sshKeyData } = useQuery({
@@ -607,7 +607,7 @@ function UpdatesTab({ device }: { device: SpoolBuddyDevice }) {
<div className="flex gap-2">
<button
onClick={() => refetch()}
disabled={checking}
disabled={checking || applying}
className="flex-1 px-3 py-2 rounded-lg text-xs font-medium bg-zinc-700 text-zinc-300 hover:bg-zinc-600 disabled:opacity-40 transition-colors flex items-center justify-center gap-1"
>
{checking && (
@@ -621,8 +621,14 @@ function UpdatesTab({ device }: { device: SpoolBuddyDevice }) {
<button
onClick={applyUpdate}
disabled={applying || isUpdating || !device.online}
className="px-3 py-2 rounded-lg text-xs font-medium bg-zinc-700 text-zinc-400 hover:bg-zinc-600 hover:text-zinc-200 disabled:opacity-40 transition-colors"
className="px-3 py-2 rounded-lg text-xs font-medium bg-zinc-700 text-zinc-400 hover:bg-zinc-600 hover:text-zinc-200 disabled:opacity-40 transition-colors flex items-center justify-center gap-1"
>
{applying && (
<svg className="w-3 h-3 animate-spin" viewBox="0 0 24 24" fill="none">
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
</svg>
)}
{t('spoolbuddy.settings.forceUpdate', 'Force Update')}
</button>
</div>
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -23,7 +23,7 @@
<!-- Splash screens for iOS -->
<link rel="apple-touch-startup-image" href="/img/android-chrome-512x512.png" />
<script type="module" crossorigin src="/assets/index-DrqpB7p-.js"></script>
<script type="module" crossorigin src="/assets/index-Cj4TkOE2.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-Dzv7xI7m.css">
</head>
<body>