diff --git a/src/Frontend/src/composables/useAuditStoreAutoRefresh.ts b/src/Frontend/src/composables/useAuditStoreAutoRefresh.ts index cc6e390fc..25a6f87cc 100644 --- a/src/Frontend/src/composables/useAuditStoreAutoRefresh.ts +++ b/src/Frontend/src/composables/useAuditStoreAutoRefresh.ts @@ -1,10 +1,6 @@ import { useAuditStore } from "@/stores/AuditStore"; import { useStoreAutoRefresh } from "./useAutoRefresh"; -// Override the refresh method to use checkForSuccessfulMessages, which is more lightweight -const useAuditStoreWithRefresh = () => { - const store = useAuditStore(); - return Object.assign(store, { refresh: store.checkForSuccessfulMessages }); -}; - -export default useStoreAutoRefresh("auditStoreSuccessfulMessages", useAuditStoreWithRefresh, 5000).autoRefresh; +// Use checkForSuccessfulMessages for auto-refresh (lightweight) via customRefresh +// instead of mutating the store's refresh method, which would break AuditList's full fetch +export default useStoreAutoRefresh("auditStoreSuccessfulMessages", useAuditStore, 5000, (store) => store.checkForSuccessfulMessages()).autoRefresh; diff --git a/src/Frontend/src/composables/useAutoRefresh.ts b/src/Frontend/src/composables/useAutoRefresh.ts index 042d5f1fe..8eea50e9d 100644 --- a/src/Frontend/src/composables/useAutoRefresh.ts +++ b/src/Frontend/src/composables/useAutoRefresh.ts @@ -21,14 +21,15 @@ function useAutoRefresh(name: string, refresh: () => Promise, intervalMs: * @param name - Name for logging purposes * @param useStore - Function that returns the Pinia store (called within component lifecycle) * @param intervalMs - Refresh interval in milliseconds + * @param customRefresh - Optional custom refresh function. When provided, this is called instead of store.refresh() during auto-refresh, avoiding the need to mutate the store. * @returns A composable function that sets up auto-refresh and returns the store. Also provides a method to update the refresh interval and a ref indicating when a refresh is happening */ -export function useStoreAutoRefresh Promise }>(name: string, useStore: () => TStore, intervalMs: number) { +export function useStoreAutoRefresh Promise }>(name: string, useStore: () => TStore, intervalMs: number, customRefresh?: (store: TStore) => Promise) { const refresh = () => { if (!store) { return Promise.resolve(); } - return store.refresh(); + return customRefresh ? customRefresh(store) : store.refresh(); }; let store: TStore | null = null; const { refresh: autoRefresh, isRefreshing, updateInterval } = useAutoRefresh(name, refresh, intervalMs);