import { QueryClient } from "@tanstack/vue-query";
import { persistQueryClient } from "@tanstack/query-persist-client-core";
import { createSyncStoragePersister } from "@tanstack/query-sync-storage-persister";
import {
  gamesApiListEventGamesOptions,
  polylanSubmitterApiGetUserInfoOptions,
  polylanSubmitterApiGetUserInfoQueryKey,
} from "@/api/@tanstack/vue-query.gen";

// Exported (not just provided by VueQueryPlugin) so Pinia stores can
// fetchQuery() through the same cache.
export const queryClient = new QueryClient();

// Login/logout are full-page redirects, so the user can't change within a
// page load - only refetched once after a reload (see restoreQueryCache).
export const userQuery = () => ({
  ...polylanSubmitterApiGetUserInfoOptions(),
  staleTime: Infinity,
});

// Games only change when staff enable/disable one, a few minutes of
// staleness is fine.
export const eventGamesQuery = (eventPath: string) => ({
  ...gamesApiListEventGamesOptions({ path: { event_path: eventPath } }),
  staleTime: 5 * 60 * 1000,
});

const PERSISTED_QUERIES = new Set(["polylanSubmitterApiGetUserInfo", "gamesApiListEventGames"]);

// Restores user + games from localStorage before the app mounts, so pages
// render right away on reload instead of waiting on the API.
export const restoreQueryCache = (client: QueryClient) =>
  persistQueryClient({
    queryClient: client,
    persister: createSyncStoragePersister({ storage: window.localStorage }),
    dehydrateOptions: {
      shouldDehydrateQuery: (query) =>
        query.state.status === "success" &&
        PERSISTED_QUERIES.has((query.queryKey[0] as { _id: string })._id),
    },
  });

// The restored user is only a placeholder until the real one comes back.
export const onQueryCacheRestored = (client: QueryClient) =>
  client.invalidateQueries({ queryKey: polylanSubmitterApiGetUserInfoQueryKey() });