refactor: read theme from document.__.theme (#174)

yext · Dec 17, 2024 · 0dfeac0 · 0dfeac0
1 parent 7eae66e
commit 0dfeac0
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 46 deletions.
diff --git a/src/utils/applyTheme.test.ts b/src/utils/applyTheme.test.ts
@@ -6,15 +6,8 @@ describe("buildCssOverridesStyle", () => {
   it("should generate correct CSS with one override in c_theme", () => {
     const document: Document = {
       siteId: 123,
-      _customDataOverrides: {
-        pagesTheme: [
-          {
-            themeConfiguration: {
-              data: JSON.stringify({ "--colors-palette-text": "red" }),
-              siteId: 123,
-            },
-          },
-        ],
+      __: {
+        theme: JSON.stringify({ "--colors-palette-text": "red" }),
       },
     };
     const result = applyTheme(document, themeConfig);
@@ -34,19 +27,12 @@ describe("buildCssOverridesStyle", () => {
   it("should generate correct CSS with multiple overrides in c_theme", () => {
     const document: Document = {
       siteId: 123,
-      _customDataOverrides: {
-        pagesTheme: [
-          {
-            themeConfiguration: {
-              data: JSON.stringify({
-                "--colors-palette-primary-DEFAULT": "hsl(0 68% 51%)",
-                "--colors-palette-primary-foreground": "hsl(0 0% 100%)",
-                "--borderRadius-border-lg": "20px",
-              }),
-              siteId: 123,
-            },
-          },
-        ],
+      __: {
+        theme: JSON.stringify({
+          "--colors-palette-primary-DEFAULT": "hsl(0 68% 51%)",
+          "--colors-palette-primary-foreground": "hsl(0 0% 100%)",
+          "--borderRadius-border-lg": "20px",
+        }),
       },
     };
 
@@ -88,12 +74,8 @@ describe("buildCssOverridesStyle", () => {
 
   it("should ignore saved values that are no longer in the themeConfig", () => {
     const document: Document = {
-      _customDataOverrides: {
-        pagesTheme: [
-          {
-            themeConfiguration: { data: JSON.stringify({ "--absdag": "red" }) },
-          },
-        ],
+      __: {
+        theme: JSON.stringify({ "--absdag": "red" }),
       },
     };
     const result = applyTheme(document, themeConfig);

diff --git a/src/utils/applyTheme.ts b/src/utils/applyTheme.ts
@@ -6,6 +6,12 @@ import { ThemeConfig } from "./themeResolver.ts";
 
 export type Document = {
   [key: string]: any;
+  __?: {
+    layout?: string;
+    theme?: string;
+    codeTemplate?: string;
+    name?: string;
+  };
 };
 
 export const THEME_STYLE_TAG_ID = "visual-editor-theme";
@@ -19,24 +25,8 @@ export const applyTheme = (
 ): string => {
   devLogger.logFunc("applyTheme");
 
-  const savedThemes: Record<string, any>[] =
-    document?._customDataOverrides?.pagesTheme ?? document?._site?.pagesTheme;
-
-  let savedTheme;
-  if (savedThemes?.length > 0) {
-    savedTheme =
-      document.siteId !== 0
-        ? savedThemes.find(
-            (theme) =>
-              Number(theme.themeConfiguration.siteId) === document.siteId
-          )
-        : savedThemes[0]; // siteId is not set on local data documents, so default to the first one
-  }
-
-  let overrides;
-  if (savedTheme?.themeConfiguration) {
-    overrides = JSON.parse(savedTheme.themeConfiguration?.data);
-  }
+  const publishedTheme = document?.__?.theme;
+  const overrides = publishedTheme ? JSON.parse(publishedTheme) : undefined;
 
   if (Object.keys(themeConfig).length > 0) {
     return `${base ?? ""}${googleFontLinkTags}<style id="${THEME_STYLE_TAG_ID}" type="text/css">${internalApplyTheme(overrides, themeConfig)}</style>`;