update query keys

This commit is contained in:
Nate Kelley 2025-03-28 17:30:02 -06:00
parent 9fbe705d06
commit a4ef5cdf61
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
5 changed files with 50 additions and 39 deletions

View File

@ -28,7 +28,7 @@ const chatsGetList = (
filters?: Omit<Parameters<typeof getListChats>[0], 'page_token' | 'page_size'>
) =>
queryOptions<BusterChatListItem[]>({
queryKey: ['chats', 'list', filters] as const,
queryKey: ['chats', 'list', filters || {}] as const,
staleTime: 60 * 1000, // 1 minute
initialData: [],
initialDataUpdatedAt: 0
@ -46,7 +46,7 @@ const logsGetList = (
filters?: Omit<Parameters<typeof getListLogs>[0], 'page_token' | 'page_size'>
) =>
queryOptions<BusterChatListItem[]>({
queryKey: ['logs', 'list', filters] as const,
queryKey: ['logs', 'list', filters || {}] as const,
staleTime: 60 * 1000, // 1 minute
initialData: [],
initialDataUpdatedAt: 0

View File

@ -6,10 +6,10 @@ import type {
import { dashboardsGetList } from '../buster_rest/dashboards';
const dashboardGetList = (
filters: Omit<Parameters<typeof dashboardsGetList>[0], 'page_token' | 'page_size'>
filters?: Omit<Parameters<typeof dashboardsGetList>[0], 'page_token' | 'page_size'>
) =>
queryOptions<BusterDashboardListItem[]>({
queryKey: ['dashboard', 'list', filters] as const,
queryKey: ['dashboard', 'list', filters || {}] as const,
initialData: [],
staleTime: 60 * 1000,
initialDataUpdatedAt: 0

View File

@ -14,10 +14,10 @@ export const metricsGetMetric = (metricId: string, version_number?: number) => {
};
export const metricsGetList = (
filters: Omit<Parameters<typeof listMetrics>[0], 'page_token' | 'page_size'>
filters?: Omit<Parameters<typeof listMetrics>[0], 'page_token' | 'page_size'>
) =>
queryOptions<BusterMetricListItem[]>({
queryKey: ['metrics', 'list', filters] as const,
queryKey: ['metrics', 'list', filters || {}] as const,
initialData: [],
initialDataUpdatedAt: 0
});

View File

@ -7,25 +7,43 @@ import packageJson from '../../../package.json';
const buster = packageJson.version;
export const PERSIST_TIME = 1000 * 60 * 60 * 24 * 3; // 3 days
const persister = createSyncStoragePersister({
storage: isServer ? undefined : window.localStorage,
throttleTime: 1500 // 1.5 seconds
});
export const PERSIST_TIME = 1000 * 60 * 60 * 24 * 7; // 7 days
export const PERSISTED_QUERIES = [
queryKeys.favoritesGetList.queryKey,
queryKeys.logsGetList({}).queryKey,
queryKeys.chatsGetList({}).queryKey,
queryKeys.dashboardGetList({}).queryKey,
queryKeys.metricsGetList({}).queryKey,
queryKeys.collectionsGetList({}).queryKey
queryKeys.logsGetList().queryKey,
queryKeys.chatsGetList().queryKey,
queryKeys.dashboardGetList().queryKey,
queryKeys.metricsGetList().queryKey,
queryKeys.collectionsGetList().queryKey,
queryKeys.termsGetList.queryKey,
queryKeys.datasetsListQueryOptions().queryKey
].map(hashKey);
export const PERMANENT_QUERIES = [queryKeys.getCurrencies.queryKey].map(hashKey);
const ALL_PERSISTED_QUERIES = [...PERSISTED_QUERIES, ...PERMANENT_QUERIES];
const persister = createSyncStoragePersister({
key: 'buster-query-cache',
storage: isServer ? undefined : window.localStorage,
throttleTime: 1500, // 1.5 seconds,
serialize: (client) => {
/*
* Make persisted queries appear stale on first load by setting the dataUpdatedAt to 1 (NOT 0)
* This way the query will be refetched from the server when it is first mounted AND we
* don't have to deal with the flash of stale data that would otherwise happen.
*/
client.clientState.queries.forEach((query) => {
const isPermanentQuery = PERMANENT_QUERIES.includes(query.queryHash);
if (!isPermanentQuery) {
query.state.dataUpdatedAt = 1;
}
});
return JSON.stringify(client);
}
});
export const persistOptions: PersistQueryClientProviderProps['persistOptions'] = {
persister: persister,
maxAge: PERSIST_TIME,
@ -34,5 +52,12 @@ export const persistOptions: PersistQueryClientProviderProps['persistOptions'] =
return ALL_PERSISTED_QUERIES.includes(query.queryHash);
}
},
hydrateOptions: {
defaultOptions: {
queries: {
initialDataUpdatedAt: 0
}
}
},
buster: buster
};

View File

@ -1,7 +1,7 @@
import { QueryClient, defaultShouldDehydrateQuery, isServer } from '@tanstack/react-query';
import { QueryClient, defaultShouldDehydrateQuery, isServer, Query } from '@tanstack/react-query';
import { useBusterNotifications } from '../BusterNotifications';
import { openErrorNotification as openErrorNotificationMethod } from '../BusterNotifications';
import { PERMANENT_QUERIES } from './createPersister';
import { PERMANENT_QUERIES, PERSISTED_QUERIES } from './createPersister';
type OpenErrorNotification = ReturnType<typeof useBusterNotifications>['openErrorNotification'];
@ -9,8 +9,8 @@ const PREFETCH_STALE_TIME = 1000 * 10; // 10 seconds
const ERROR_RETRY_DELAY = 1 * 1000; // 1 second delay after error
const GC_TIME = 1000 * 60 * 60 * 24 * 3; // 24 hours - matches persistence duration
// Track queries that have already mounted
const mountedQueries = new Set<string>();
// Track which queries have been initialized
const initializedQueries = new Set<string>();
function makeQueryClient(params?: {
openErrorNotification?: OpenErrorNotification;
@ -24,7 +24,9 @@ function makeQueryClient(params?: {
refetchOnWindowFocus: false,
staleTime: PREFETCH_STALE_TIME,
gcTime: GC_TIME,
enabled: (params?.enabled ?? true) && baseEnabled,
enabled: () => {
return (params?.enabled ?? true) && baseEnabled;
},
queryFn: () => Promise.resolve(),
retry: (failureCount, error) => {
if (params?.openErrorNotification) {
@ -32,23 +34,7 @@ function makeQueryClient(params?: {
}
return false;
},
retryDelay: ERROR_RETRY_DELAY,
refetchOnMount: (query) => {
console.log(query.queryHash, query.state.dataUpdatedAt);
if (!query.state.dataUpdatedAt) {
// No data has been fetched yet
return true;
}
if (!mountedQueries.has(query.queryHash) && query.isActive()) {
// First time mounting this query
mountedQueries.add(query.queryHash);
return 'always';
}
// Query has mounted before, use default stale time behavior
return query.state.dataUpdatedAt < Date.now() - PREFETCH_STALE_TIME;
}
retryDelay: ERROR_RETRY_DELAY
},
mutations: {
retry: (failureCount, error) => {