Improvements in file organization

Telefonica · Sep 13, 2024 · 9f2b11e · 9f2b11e
1 parent 083f246
commit 9f2b11e
Show file tree

Hide file tree

Showing 7 changed files with 157 additions and 200 deletions.
diff --git a/tokens/figma/update-middleware.mjs b/tokens/figma/update-middleware.mjs
@@ -6,11 +6,18 @@ import {
   updateOrCreateVariables,
   updateOrCreateVariableModeValues,
   hasDefaultMode,
-  generateTempModeId,
+} from "./utils/figma-utils.mjs";
+
+import {
   VARIABLE_TYPES,
   COLLECTION_NAMES,
   MODE_NAMES,
-} from "./utils.mjs";
+} from "./utils/constants.mjs";
+
+import {
+  getFigmaData,
+  postFigmaVariables,
+} from "./utils/api-request.mjs";
 
 function formatBrandName(brand) {
   // Check if the brand is "tu" and return it in uppercase
@@ -39,19 +46,10 @@ async function updateTheme(
   FIGMA_TOKEN
 ) {
   try {
-    // Fetch existing variables and collections from Figma
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/local`,
-      {
-        method: "GET",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-      }
+    const figmaData = await getFigmaData(
+      FILE_KEY,
+      FIGMA_TOKEN
     );
-
-    const figmaData = await response.json();
     const existingVariables =
       figmaData.meta.variables;
     const existingCollections =
@@ -214,26 +212,12 @@ async function updateTheme(
     );
 
     // Update the variables and modes in Figma
-    const updateResponse = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables`,
-      {
-        method: "POST",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(newData),
-      }
+    await postFigmaVariables(
+      FILE_KEY,
+      FIGMA_TOKEN,
+      newData
     );
 
-    if (!updateResponse.ok) {
-      const errorText =
-        await updateResponse.text();
-      throw new Error(
-        `Error updating variables and modes: ${updateResponse.statusText}. Response: ${errorText}`
-      );
-    }
-
     return newData;
   } catch (error) {
     console.error("Error:", error);
@@ -247,19 +231,10 @@ async function updateSkinColorVariables(
   FIGMA_TOKEN
 ) {
   try {
-    // Step 1: Fetch existing data from "Mode" and "Brand" collections
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/local`,
-      {
-        method: "GET",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-      }
+    const figmaData = await getFigmaData(
+      FILE_KEY,
+      FIGMA_TOKEN
     );
-
-    const figmaData = await response.json();
     const themeCollections =
       figmaData.meta.variableCollections;
 
@@ -428,25 +403,12 @@ async function updateSkinColorVariables(
     }
 
     // Step 9: Send the data to update the Brand collection (POST)
-    const updateResponse = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables`,
-      {
-        method: "POST",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(newData),
-      }
-    );
 
-    if (!updateResponse.ok) {
-      const errorText =
-        await updateResponse.text();
-      throw new Error(
-        `Error updating Brand collection: ${updateResponse.statusText}. Response: ${errorText}`
-      );
-    }
+    await postFigmaVariables(
+      FILE_KEY,
+      FIGMA_TOKEN,
+      newData
+    );
 
     return newData; // Returning newData for debugging
   } catch (error) {
@@ -461,18 +423,10 @@ async function updateSkinOtherVariables(
   FILE_KEY,
   FIGMA_TOKEN
 ) {
-  const response = await fetch(
-    `https://api.figma.com/v1/files/${FILE_KEY}/variables/local`,
-    {
-      method: "GET",
-      headers: {
-        "X-Figma-Token": FIGMA_TOKEN,
-        "Content-Type": "application/json",
-      },
-    }
+  const figmaData = await getFigmaData(
+    FILE_KEY,
+    FIGMA_TOKEN
   );
-
-  const figmaData = await response.json();
   const existingVariables =
     figmaData.meta.variables;
   const existingCollections =
@@ -631,24 +585,12 @@ async function updateSkinOtherVariables(
   }
 
   // Make the POST request to update the variables and mode values in the Brand collection
-  const updateResponse = await fetch(
-    `https://api.figma.com/v1/files/${FILE_KEY}/variables`,
-    {
-      method: "POST",
-      headers: {
-        "X-Figma-Token": FIGMA_TOKEN,
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(newData),
-    }
-  );
 
-  if (!updateResponse.ok) {
-    const errorText = await updateResponse.text();
-    throw new Error(
-      `Error updating Brand collection: ${updateResponse.statusText}. Response: ${errorText}`
-    );
-  }
+  await postFigmaVariables(
+    FILE_KEY,
+    FIGMA_TOKEN,
+    newData
+  );
 
   return newData;
 }
@@ -670,22 +612,10 @@ async function postCollections(
       FIGMA_TOKEN
     );
 
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/`,
-      {
-        method: "POST",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(newData),
-      }
-    );
-
-    const data = await response.json();
-    console.log(
-      `Success creating collections for brand ${brand}:`,
-      data
+    await postFigmaVariables(
+      FILE_KEY,
+      FIGMA_TOKEN,
+      newData
     );
   } catch (error) {
     console.error(

diff --git a/tokens/figma/update-skins.mjs b/tokens/figma/update-skins.mjs
@@ -1,12 +1,19 @@
-import fetch from "node-fetch";
 import {
   updateCollections,
   updateOrCreateVariables,
   updateOrCreateVariableModeValues,
-  COLLECTION_NAMES,
+} from "./utils/figma-utils.mjs";
+
+import {
   VARIABLE_TYPES,
+  COLLECTION_NAMES,
   MODE_NAMES,
-} from "./utils.mjs";
+} from "./utils/constants.mjs";
+
+import {
+  getFigmaData,
+  postFigmaVariables,
+} from "./utils/api-request.mjs";
 
 const collectionNames = [
   COLLECTION_NAMES.PALETTE,
@@ -19,19 +26,11 @@ async function updatePalette(
   FIGMA_TOKEN
 ) {
   try {
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/local`,
-      {
-        method: "GET",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-      }
+    const figmaData = await getFigmaData(
+      FILE_KEY,
+      FIGMA_TOKEN
     );
 
-    const figmaData = await response.json();
-
     const existingVariables =
       figmaData.meta.variables;
     const existingCollections =
@@ -127,22 +126,10 @@ async function postCollections(
       FIGMA_TOKEN
     );
 
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/`,
-      {
-        method: "POST",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(newData),
-      }
-    );
-
-    const data = await response.json();
-    console.log(
-      `Success creating collections for brand ${brand}:`,
-      data
+    await postFigmaVariables(
+      FILE_KEY,
+      FIGMA_TOKEN,
+      newData
     );
   } catch (error) {
     console.error(
@@ -166,22 +153,10 @@ async function postPalette(
       FIGMA_TOKEN
     );
 
-    const response = await fetch(
-      `https://api.figma.com/v1/files/${FILE_KEY}/variables/`,
-      {
-        method: "POST",
-        headers: {
-          "X-Figma-Token": FIGMA_TOKEN,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(newData),
-      }
-    );
-
-    const data = await response.json();
-    console.log(
-      `Success updating palette for brand ${brand}:`,
-      data
+    await postFigmaVariables(
+      FILE_KEY,
+      FIGMA_TOKEN,
+      newData
     );
   } catch (error) {
     console.error(

diff --git a/tokens/figma/utils/api-request.mjs b/tokens/figma/utils/api-request.mjs
@@ -0,0 +1,50 @@
+import fetch from "node-fetch";
+
+async function getFigmaData(
+  FILE_KEY,
+  FIGMA_TOKEN
+) {
+  const response = await fetch(
+    `https://api.figma.com/v1/files/${FILE_KEY}/variables/local`,
+    {
+      method: "GET",
+      headers: {
+        "X-Figma-Token": FIGMA_TOKEN,
+        "Content-Type": "application/json",
+      },
+    }
+  );
+  if (!response.ok) {
+    throw new Error(
+      `Error fetching Figma data: ${response.statusText}`
+    );
+  }
+  return response.json();
+}
+
+async function postFigmaVariables(
+  FILE_KEY,
+  FIGMA_TOKEN,
+  newData
+) {
+  const response = await fetch(
+    `https://api.figma.com/v1/files/${FILE_KEY}/variables`,
+    {
+      method: "POST",
+      headers: {
+        "X-Figma-Token": FIGMA_TOKEN,
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(newData),
+    }
+  );
+  if (!response.ok) {
+    const errorText = await response.text();
+    throw new Error(
+      `Error updating variables: ${response.statusText}. Response: ${errorText}`
+    );
+  }
+  return response.json();
+}
+
+export { getFigmaData, postFigmaVariables };
diff --git a/tokens/figma/utils/constants.mjs b/tokens/figma/utils/constants.mjs
@@ -0,0 +1,20 @@
+export const VARIABLE_TYPES = {
+  COLOR: "COLOR",
+  FLOAT: "FLOAT",
+  STRING: "STRING",
+  FONT_WEIGHT: "FONT_WEIGHT",
+  FONT_SIZE: "FONT_SIZE",
+  LINE_HEIGHT: "LINE_HEIGHT",
+};
+
+export const COLLECTION_NAMES = {
+  BRAND: "Brand",
+  COLOR_SCHEME: "Mode",
+  PALETTE: "Palette",
+};
+
+export const MODE_NAMES = {
+  DEFAULT: "Mode 1",
+  LIGHT: "Light",
+  DARK: "Dark",
+};
diff --git a/tokens/figma/extract-json-data.mjs → tokens/figma/utils/extract-json-data.mjs b/tokens/figma/extract-json-data.mjs → tokens/figma/utils/extract-json-data.mjs
@@ -1,6 +1,6 @@
 import fs from "fs";
 import path from "path";
-import { hexToRgba } from "./utils.mjs";
+import hexToRgba from "./hex-to-rgba.mjs";
 
 export const extractSkinJsonData = (
   jsonFiles,