Abstract get metadata as json

coder · BrunoQuaresma · Sep 14, 2023 · Sep 11, 2023 · Sep 11, 2023 · Sep 11, 2023
commit 3b47005b296b3552498fc797d20e9faaeb228b8e
diff --git a/site/src/api/queries/appearance.ts b/site/src/api/queries/appearance.ts
@@ -1,11 +1,13 @@
 import { QueryClient } from "@tanstack/react-query";
 import * as API from "api/api";
 import { AppearanceConfig } from "api/typesGenerated";
+import { getMetadataAsJSON } from "utils/metadata";
 
 export const appearance = () => {
   return {
     queryKey: ["appearance"],
-    queryFn: fetchAppearance,
+    queryFn: async () =>
+      getMetadataAsJSON<AppearanceConfig>("appearance") ?? API.getAppearance(),
   };
 };
 
@@ -17,17 +19,3 @@ export const updateAppearance = (queryClient: QueryClient) => {
     },
   };
 };
-
-const fetchAppearance = () => {
-  const appearance = document.querySelector("meta[property=appearance]");
-  if (appearance) {
-    const rawContent = appearance.getAttribute("content");
-    try {
-      return JSON.parse(rawContent as string);
-    } catch (ex) {
-      // Ignore this and fetch as normal!
-    }
-  }
-
-  return API.getAppearance();
-};
diff --git a/site/src/api/queries/buildInfo.ts b/site/src/api/queries/buildInfo.ts
@@ -1,23 +1,11 @@
 import * as API from "api/api";
+import { BuildInfoResponse } from "api/typesGenerated";
+import { getMetadataAsJSON } from "utils/metadata";
 
 export const buildInfo = () => {
   return {
     queryKey: ["buildInfo"],
-    queryFn: fetchBuildInfo,
+    queryFn: async () =>
+      getMetadataAsJSON<BuildInfoResponse>("build-info") ?? API.getBuildInfo(),
   };
 };
-
-const fetchBuildInfo = async () => {
-  // Build info is injected by the Coder server into the HTML document.
-  const buildInfo = document.querySelector("meta[property=build-info]");
-  if (buildInfo) {
-    const rawContent = buildInfo.getAttribute("content");
-    try {
-      return JSON.parse(rawContent as string);
-    } catch (e) {
-      console.warn("Failed to parse build info from document", e);
-    }
-  }
-
-  return API.getBuildInfo();
-};
diff --git a/site/src/api/queries/entitlements.ts b/site/src/api/queries/entitlements.ts
@@ -1,12 +1,15 @@
 import { QueryClient } from "@tanstack/react-query";
 import * as API from "api/api";
+import { Entitlements } from "api/typesGenerated";
+import { getMetadataAsJSON } from "utils/metadata";
 
 const ENTITLEMENTS_QUERY_KEY = ["entitlements"];
 
 export const entitlements = () => {
   return {
     queryKey: ENTITLEMENTS_QUERY_KEY,
-    queryFn: fetchEntitlements,
+    queryFn: async () =>
+      getMetadataAsJSON<Entitlements>("entitlements") ?? API.getEntitlements(),
   };
 };
 
@@ -20,18 +23,3 @@ export const refreshEntitlements = (queryClient: QueryClient) => {
     },
   };
 };
-
-const fetchEntitlements = () => {
-  // Entitlements is injected by the Coder server into the HTML document.
-  const entitlements = document.querySelector("meta[property=entitlements]");
-  if (entitlements) {
-    const rawContent = entitlements.getAttribute("content");
-    try {
-      return JSON.parse(rawContent as string);
-    } catch (e) {
-      console.warn("Failed to parse entitlements from document", e);
-    }
-  }
-
-  return API.getEntitlements();
-};
diff --git a/site/src/api/queries/experiments.ts b/site/src/api/queries/experiments.ts
@@ -1,23 +1,11 @@
 import * as API from "api/api";
+import { Experiments } from "api/typesGenerated";
+import { getMetadataAsJSON } from "utils/metadata";
 
 export const experiments = () => {
   return {
     queryKey: ["experiments"],
-    queryFn: fetchExperiments,
+    queryFn: async () =>
+      getMetadataAsJSON<Experiments>("experiments") ?? API.getExperiments(),
   };
 };
-
-const fetchExperiments = async () => {
-  // Experiments is injected by the Coder server into the HTML document.
-  const experiments = document.querySelector("meta[property=experiments]");
-  if (experiments) {
-    const rawContent = experiments.getAttribute("content");
-    try {
-      return JSON.parse(rawContent as string);
-    } catch (e) {
-      console.warn("Failed to parse experiments from document", e);
-    }
-  }
-
-  return API.getExperiments();
-};
diff --git a/site/src/utils/metadata.ts b/site/src/utils/metadata.ts
@@ -0,0 +1,14 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- It can be any
+export const getMetadataAsJSON = <T extends Record<string, any>>(
+  property: string,
+): T | undefined => {
+  const appearance = document.querySelector(`meta[property=${property}]`);
+  if (appearance) {
+    const rawContent = appearance.getAttribute("content");
+    try {
+      return JSON.parse(rawContent as string);
+    } catch (ex) {
+      throw new Error(`Failed to parse ${property} metadata`);
+    }
+  }
+};