refactor: update logic for all metadata query factories (coder#10356)

Parkreiner · web-flow · commit 7732ac475a2a · 2023-10-24T08:42:38.000-04:00
* refactor: simplify metadata patterns

* fix: add return type to me factory

* fix: make sure query key for me is always defined at type level
diff --git a/site/src/api/queries/appearance.ts b/site/src/api/queries/appearance.ts
@@ -6,18 +6,12 @@ import { getMetadataAsJSON } from "utils/metadata";
 const initialAppearanceData = getMetadataAsJSON<AppearanceConfig>("appearance");
 const appearanceConfigKey = ["appearance"] as const;
 
-export const appearance = (queryClient: QueryClient) => {
+export const appearance = (): UseQueryOptions<AppearanceConfig> => {
   return {
-    queryKey: appearanceConfigKey,
-    queryFn: async () => {
-      const cachedData = queryClient.getQueryData(appearanceConfigKey);
-      if (cachedData === undefined && initialAppearanceData !== undefined) {
-        return initialAppearanceData;
-      }
-
-      return API.getAppearance();
-    },
-  } satisfies UseQueryOptions<AppearanceConfig>;
+    queryKey: ["appearance"],
+    initialData: initialAppearanceData,
+    queryFn: () => API.getAppearance(),
+  };
 };
 
 export const updateAppearance = (queryClient: QueryClient) => {
diff --git a/site/src/api/queries/buildInfo.ts b/site/src/api/queries/buildInfo.ts
@@ -1,21 +1,15 @@
-import { QueryClient, type UseQueryOptions } from "react-query";
+import { type UseQueryOptions } from "react-query";
 import { type BuildInfoResponse } from "api/typesGenerated";
 import * as API from "api/api";
 import { getMetadataAsJSON } from "utils/metadata";
 
 const initialBuildInfoData = getMetadataAsJSON<BuildInfoResponse>("build-info");
 const buildInfoKey = ["buildInfo"] as const;
 
-export const buildInfo = (queryClient: QueryClient) => {
+export const buildInfo = (): UseQueryOptions<BuildInfoResponse> => {
   return {
     queryKey: buildInfoKey,
-    queryFn: async () => {
-      const cachedData = queryClient.getQueryData(buildInfoKey);
-      if (cachedData === undefined && initialBuildInfoData !== undefined) {
-        return initialBuildInfoData;
-      }
-
-      return API.getBuildInfo();
-    },
-  } satisfies UseQueryOptions<BuildInfoResponse>;
+    initialData: initialBuildInfoData,
+    queryFn: () => API.getBuildInfo(),
+  };
 };
diff --git a/site/src/api/queries/entitlements.ts b/site/src/api/queries/entitlements.ts
@@ -1,15 +1,16 @@
-import { QueryClient } from "react-query";
+import { QueryClient, UseQueryOptions } from "react-query";
 import * as API from "api/api";
 import { Entitlements } from "api/typesGenerated";
 import { getMetadataAsJSON } from "utils/metadata";
 
-const ENTITLEMENTS_QUERY_KEY = ["entitlements"];
+const initialEntitlementsData = getMetadataAsJSON<Entitlements>("entitlements");
+const ENTITLEMENTS_QUERY_KEY = ["entitlements"] as const;
 
-export const entitlements = () => {
+export const entitlements = (): UseQueryOptions<Entitlements> => {
   return {
     queryKey: ENTITLEMENTS_QUERY_KEY,
-    queryFn: async () =>
-      getMetadataAsJSON<Entitlements>("entitlements") ?? API.getEntitlements(),
+    queryFn: () => API.getEntitlements(),
+    initialData: initialEntitlementsData,
   };
 };
 
diff --git a/site/src/api/queries/experiments.ts b/site/src/api/queries/experiments.ts
@@ -1,22 +1,16 @@
 import * as API from "api/api";
 import { getMetadataAsJSON } from "utils/metadata";
 import { type Experiments } from "api/typesGenerated";
-import { QueryClient, type UseQueryOptions } from "react-query";
+import { type UseQueryOptions } from "react-query";
 
 const initialExperimentsData = getMetadataAsJSON<Experiments>("experiments");
 const experimentsKey = ["experiments"] as const;
 
-export const experiments = (queryClient: QueryClient) => {
+export const experiments = (): UseQueryOptions<Experiments> => {
   return {
     queryKey: experimentsKey,
-    queryFn: async () => {
-      const cachedData = queryClient.getQueryData(experimentsKey);
-      if (cachedData === undefined && initialExperimentsData !== undefined) {
-        return initialExperimentsData;
-      }
-
-      return API.getExperiments();
-    },
+    initialData: initialExperimentsData,
+    queryFn: () => API.getExperiments(),
   } satisfies UseQueryOptions<Experiments>;
 };
 
diff --git a/site/src/api/queries/users.ts b/site/src/api/queries/users.ts
@@ -91,7 +91,9 @@ export const authMethods = () => {
 
 const initialUserData = getMetadataAsJSON<User>("user");
 
-export const me = () => {
+export const me = (): UseQueryOptions<User> & {
+  queryKey: NonNullable<UseQueryOptions<User>["queryKey"]>;
+} => {
   return {
     queryKey: ["me"],
     initialData: initialUserData,
diff --git a/site/src/components/Dashboard/DashboardProvider.tsx b/site/src/components/Dashboard/DashboardProvider.tsx
@@ -1,4 +1,4 @@
-import { useQuery, useQueryClient } from "react-query";
+import { useQuery } from "react-query";
 import { buildInfo } from "api/queries/buildInfo";
 import { experiments } from "api/queries/experiments";
 import { entitlements } from "api/queries/entitlements";
@@ -39,11 +39,10 @@ export const DashboardProviderContext = createContext<
 >(undefined);
 
 export const DashboardProvider: FC<PropsWithChildren> = ({ children }) => {
-  const queryClient = useQueryClient();
-  const buildInfoQuery = useQuery(buildInfo(queryClient));
+  const buildInfoQuery = useQuery(buildInfo());
   const entitlementsQuery = useQuery(entitlements());
-  const experimentsQuery = useQuery(experiments(queryClient));
-  const appearanceQuery = useQuery(appearance(queryClient));
+  const experimentsQuery = useQuery(experiments());
+  const appearanceQuery = useQuery(appearance());
 
   const isLoading =
     !buildInfoQuery.data ||
