diff --git a/apps/desktop/src/components/grid/DataGridToolbar.vue b/apps/desktop/src/components/grid/DataGridToolbar.vue index 6d0191ef3e..ab952736bd 100644 --- a/apps/desktop/src/components/grid/DataGridToolbar.vue +++ b/apps/desktop/src/components/grid/DataGridToolbar.vue @@ -131,7 +131,7 @@ function actionLabelClass(action: DataGridToolbarActionKey) { {{ autoRefresh?.enabled ? autoRefresh.stopLabel : autoRefresh?.startLabel }} - + {{ autoRefresh?.intervalLabel(seconds) }} diff --git a/apps/desktop/src/components/grid/__tests__/DataGridToolbarIconTooltips.spec.ts b/apps/desktop/src/components/grid/__tests__/DataGridToolbarIconTooltips.spec.ts index 4911ef3b0b..bbc7359c6b 100644 --- a/apps/desktop/src/components/grid/__tests__/DataGridToolbarIconTooltips.spec.ts +++ b/apps/desktop/src/components/grid/__tests__/DataGridToolbarIconTooltips.spec.ts @@ -68,7 +68,7 @@ function mountWithProvider(render: () => ReturnType) { return mounted; } -function mountToolbar() { +function mountToolbar(autoRefreshEnabled = false) { return mountWithProvider(() => h(DataGridToolbar, { compact: true, @@ -78,7 +78,7 @@ function mountToolbar() { shortLabel: "Auto", startLabel: "Start auto-refresh", stopLabel: "Stop auto-refresh", - enabled: false, + enabled: autoRefreshEnabled, intervalSeconds: 30, sweepKey: 0, intervalOptions: [10, 30, 60], @@ -200,6 +200,16 @@ describe("data grid icon-only toolbar tooltips", () => { expect(showsTooltip("Auto-refresh results")).toBe(true); }); + it.each([false, true])("marks the interval as selected only when auto refresh is enabled (%s)", async (enabled) => { + const { host } = mountToolbar(enabled); + await settle(); + await click(toolbarButton(host, "autoRefresh")); + + const intervalItem = [...document.querySelectorAll('[data-slot="dropdown-menu-item"]')].find((item) => item.textContent?.trim() === "Refresh every 30s"); + expect(intervalItem).toBeDefined(); + expect(!!intervalItem!.querySelector("svg")).toBe(enabled); + }); + it("opens the column lookup side panel through its toolbar capability", async () => { const { host, grid } = mountGrid(); await settle(); diff --git a/apps/desktop/src/composables/__tests__/useDataGridAutoRefresh.spec.ts b/apps/desktop/src/composables/__tests__/useDataGridAutoRefresh.spec.ts index 63ea6cc0b8..7c43894450 100644 --- a/apps/desktop/src/composables/__tests__/useDataGridAutoRefresh.spec.ts +++ b/apps/desktop/src/composables/__tests__/useDataGridAutoRefresh.spec.ts @@ -18,6 +18,58 @@ describe("useDataGridAutoRefresh", () => { autoRefresh.stop(); }); + it.each([5, 10, 30, 60, 300])("starts refreshing when the %i second interval is selected", (seconds) => { + vi.useFakeTimers(); + const refresh = vi.fn(); + const autoRefresh = useDataGridAutoRefresh({ canRefresh: computed(() => true), refresh }); + + autoRefresh.setIntervalSeconds(seconds); + + expect(autoRefresh.enabled.value).toBe(true); + vi.advanceTimersByTime(seconds * 1000 - 1); + expect(refresh).not.toHaveBeenCalled(); + vi.advanceTimersByTime(1); + expect(refresh).toHaveBeenCalledOnce(); + vi.advanceTimersByTime(seconds * 1000); + expect(refresh).toHaveBeenCalledTimes(2); + autoRefresh.stop(); + }); + + it("restarts refreshing when the same interval is selected after disabling", () => { + vi.useFakeTimers(); + const refresh = vi.fn(); + const autoRefresh = useDataGridAutoRefresh({ canRefresh: computed(() => true), refresh, initialIntervalSeconds: 5 }); + + autoRefresh.toggle(); + autoRefresh.toggle(); + vi.advanceTimersByTime(5000); + expect(refresh).not.toHaveBeenCalled(); + + autoRefresh.setIntervalSeconds(5); + vi.advanceTimersByTime(5000); + + expect(autoRefresh.enabled.value).toBe(true); + expect(refresh).toHaveBeenCalledOnce(); + autoRefresh.stop(); + }); + + it("replaces the running countdown when a different interval is selected", () => { + vi.useFakeTimers(); + const refresh = vi.fn(); + const autoRefresh = useDataGridAutoRefresh({ canRefresh: computed(() => true), refresh, initialIntervalSeconds: 5 }); + + autoRefresh.toggle(); + vi.advanceTimersByTime(4000); + autoRefresh.setIntervalSeconds(10); + vi.advanceTimersByTime(9999); + expect(refresh).not.toHaveBeenCalled(); + vi.advanceTimersByTime(1); + expect(refresh).toHaveBeenCalledOnce(); + vi.advanceTimersByTime(10000); + expect(refresh).toHaveBeenCalledTimes(2); + autoRefresh.stop(); + }); + it("does not refresh while the operation is unavailable", () => { vi.useFakeTimers(); const refresh = vi.fn(); diff --git a/apps/desktop/src/composables/useDataGridAutoRefresh.ts b/apps/desktop/src/composables/useDataGridAutoRefresh.ts index 529a2a7a80..fb10dc868e 100644 --- a/apps/desktop/src/composables/useDataGridAutoRefresh.ts +++ b/apps/desktop/src/composables/useDataGridAutoRefresh.ts @@ -37,7 +37,9 @@ export function useDataGridAutoRefresh(options: UseDataGridAutoRefreshOptions) { function setIntervalSeconds(seconds: number) { intervalSeconds.value = seconds; - if (enabled.value) start(); + // Selecting an interval also starts auto-refresh, including after a stop. + enabled.value = true; + start(); } function toggle() {