chore: Change output directory structure to make copying files to rep…

…os easier

scripts/fetchIcons.ts

@@ -10,11 +10,12 @@ import { generateHash } from "./utils/hash.js";
 import { ComponentSets } from "./types/figmaTypes.js";
 import { generatePNGs } from "./generators/generatePNGs.js";
 
-export const fontDir = "/font";
 export const iconsDir = "/icons";
-export const definitionsDir = "/definitions";
 export const tempDir = "/temp";
 export const pngDir = "/png";
+export const dartDir = "/dart";
+export const tsDir = "/ts";
+
 /**
  * Main function to run icons action. For slightly more information, see {@link https://miro.com/app/board/uXjVKUMv1ME=/?share_link_id=952145602435 | Miro }
  *
@@ -35,11 +36,11 @@ export default async function main(
   outputDir: string,
   verboseLogs: boolean
 ): Promise<string | undefined> {
-  const fontOutputDir = outputDir + fontDir;
   const iconsOutputDir = outputDir + iconsDir;
-  const definitionsOutputDir = outputDir + definitionsDir;
   const tempOutputDir = outputDir + tempDir;
   const pngOutputDir = outputDir + pngDir;
+  const dartOutputDir = outputDir + dartDir;
+  const tsOutputDir = outputDir + tsDir;
 
   const response = await getFigmaDocument(figmaFileId, figmaToken);
   console.log("✅ - Fetched figma document");
@@ -79,10 +80,10 @@ export default async function main(
   await optimizeSVGs(iconsOutputDir, tempOutputDir, categoryNames);
   console.log("✅ - Optimized SVGs");
 
-  const generateFontResult = await generateFonts(tempOutputDir, fontOutputDir, "zeta-icons");
+  const generateFontResult = await generateFonts(tempOutputDir, "zeta-icons", dartOutputDir, tsOutputDir);
   console.log("✅ - Generated fonts");
 
-  generateDefinitionFiles(outputDir, definitionsOutputDir, generateFontResult, manifest);
+  generateDefinitionFiles(outputDir, generateFontResult, manifest);
   console.log("✅ - Generated definition files.");
 
   generatePNGs(iconsOutputDir, pngOutputDir, categoryNames);

scripts/generators/generateDefinitionFiles.ts

@@ -1,29 +1,28 @@
 import { createFolder } from "../utils/fileUtils.js";
 import { GenerateFontResult, IconManifest } from "../types/customTypes.js";
 import { readFileSync, writeFileSync } from "fs";
+import { dartDir, tsDir } from "../fetchIcons.js";
 
 /**
  * Writes out `icon-manifest.json`, `icons.dart` and `icon-types.ts`.
  *
  * @param {String} outputDir - Location of output directory. Icon manifest is saved here.
- * @param {String} definitionsOutputDir - Location of definitions output.
  * @param {GenerateFontResult} fontData - Object containing body lines for generating definition files.
  * @param {IconManifest} manifest - data to be written to `icon-manifest.json`
  */
-export const generateDefinitionFiles = (
-  outputDir: string,
-  definitionsOutputDir: string,
-  fontData: GenerateFontResult,
-  manifest: IconManifest
-) => {
-  createFolder(definitionsOutputDir);
+export const generateDefinitionFiles = (outputDir: string, fontData: GenerateFontResult, manifest: IconManifest) => {
+  const dartOutputDir = outputDir + dartDir;
+  const tsOutputDir = outputDir + tsDir;
+
+  createFolder(dartOutputDir);
+  createFolder(tsOutputDir);
 
   const dartFile = generateDartFile(fontData);
   const tsFile = generateTSFile(fontData);
   const iconManifestFile = JSON.stringify(Object.fromEntries(manifest));
 
-  writeFileSync(definitionsOutputDir + "/icons.dart", dartFile);
-  writeFileSync(definitionsOutputDir + "/icon-types.ts", tsFile);
+  writeFileSync(dartOutputDir + "/icons.dart", dartFile);
+  writeFileSync(tsOutputDir + "/icon-types.ts", tsFile);
   writeFileSync(outputDir + "/icon-manifest.json", iconManifestFile);
 };
 

scripts/generators/generateFonts.ts

@@ -12,14 +12,17 @@ const GITHUB_URL = "https://raw.githubusercontent.com/ZebraDevs/zeta-icons/main/
  * as this data needs to link up to unicode values generated in this step.
  *
  * @param {string} inputDir - Location of temporary directory containing optimized SVG files.
- * @param {String} fontOutputDir - Location of font output directory.
+ * @param {string} fontName - Name of font to be generated.
+ * @param {string} ttfDir - Location to save TTF font files.
+ * @param {string} woff2Dir - Location to save WOFF2 font files.
  * @returns {Promise<GenerateFontResult>} Object containing body lines for generating definition files.
  * @throws If any font file was not generated.
  */
 export const generateFonts = async (
   inputDir: string,
-  fontOutputDir: string,
-  fontName: string
+  fontName: string,
+  ttfDir: string,
+  woff2Dir: string
 ): Promise<GenerateFontResult> => {
   const fontResult: GenerateFontResult = {
     dartDefinitions: [],
@@ -28,13 +31,15 @@ export const generateFonts = async (
     iconNames: [],
   };
 
-  const baseFontPath = `${fontOutputDir}/${fontName}`;
-  createFolder(fontOutputDir);
+  const ttfPath = `${ttfDir}/${fontName}`;
+  const woff2Path = `${woff2Dir}/${fontName}`;
+  createFolder(ttfDir);
+  createFolder(woff2Dir);
   const roundFonts = await buildFontFile("round", fontResult, inputDir);
 
   if (roundFonts.ttf && roundFonts.woff2) {
-    writeFileSync(`${baseFontPath}-round.ttf`, roundFonts.ttf);
-    writeFileSync(`${baseFontPath}-round.woff2`, roundFonts.woff2);
+    writeFileSync(`${ttfPath}-round.ttf`, roundFonts.ttf);
+    writeFileSync(`${woff2Path}-round.woff2`, roundFonts.woff2);
   } else {
     throw new Error(
       "Failed to build round fonts: " + (!roundFonts.ttf ? "ttf " : "") + !roundFonts.woff2 ? "woff2" : ""
@@ -43,8 +48,8 @@ export const generateFonts = async (
 
   const sharpFonts = await buildFontFile("sharp", fontResult, inputDir);
   if (sharpFonts.ttf && sharpFonts.woff2) {
-    writeFileSync(`${baseFontPath}-sharp.ttf`, sharpFonts.ttf);
-    writeFileSync(`${baseFontPath}-sharp.woff2`, sharpFonts.woff2);
+    writeFileSync(`${ttfPath}-sharp.ttf`, sharpFonts.ttf);
+    writeFileSync(`${woff2Path}-sharp.woff2`, sharpFonts.woff2);
   } else {
     throw new Error(
       "Failed to build sharp fonts: " + (!sharpFonts.ttf ? "ttf " : "") + !sharpFonts.woff2 ? "woff2" : ""

scripts/templates/icons.dart.template

@@ -23,7 +23,7 @@ abstract class ZetaIcons {
 {{sharpIcons}}
 }
 
-  // List of all rounded icons.
+  // List of all icons.
 const Map<String, IconData> icons = {
 {{iconNames}}
 };

test/data/constants.ts

@@ -3,8 +3,8 @@ const baseDir = "./test/outputs";
 export const testOutputDir = `${baseDir}/test-figma`;
 export const testTempOutputDir = `${testOutputDir}/temp`;
 export const testIconsOutputDir = `${testOutputDir}/icons`;
-export const testFontsOutputDir = `${testOutputDir}/fonts`;
-export const testDefinitionsOutputDir = `${testOutputDir}/definitions`;
+export const testDartOutputDir = `${testOutputDir}/dart`;
+export const testTSOutputDir = `${testOutputDir}/ts`;
 
 export const zdsIntegrationOutputDir = `${baseDir}/zds`;
 

test/integration/fetchIcons.test.ts

@@ -1,8 +1,8 @@
 import { assert } from "chai";
 import { ZDS_ASSETS_FILE_ID, ZDS_ASSETS_ICON_PAGE_NAME } from "../../figmaConfig.js";
-import fetchIcons, { definitionsDir, fontDir } from "../../scripts/fetchIcons.js";
+import fetchIcons from "../../scripts/fetchIcons.js";
 import { checkFigmaTokenIsSet } from "../../scripts/utils/figmaUtils.js";
-import { zdsIntegrationOutputDir } from "../data/constants.js";
+import { testDartOutputDir, testTSOutputDir, zdsIntegrationOutputDir } from "../data/constants.js";
 import { existsSync, readFileSync, rmSync } from "fs";
 import { IconManifest } from "../../scripts/types/customTypes.js";
 import { checkFontsExist, checkIconsExist } from "../utils.js";
@@ -41,11 +41,15 @@ describe("fetchIcons", () => {
   });
 
   it("should create fonts", () => {
-    checkFontsExist("zeta-icons", `${zdsIntegrationOutputDir}/${fontDir}`);
+    checkFontsExist(
+      "zeta-icons",
+      `${zdsIntegrationOutputDir}/${testDartOutputDir}`,
+      `${zdsIntegrationOutputDir}/${testTSOutputDir}`
+    );
   });
 
   it("should write definition files", () => {
-    assert.equal(existsSync(`${zdsIntegrationOutputDir}/${definitionsDir}/icons.dart`), true);
-    assert.equal(existsSync(`${zdsIntegrationOutputDir}/${definitionsDir}/icon-types.ts`), true);
+    assert.equal(existsSync(`${zdsIntegrationOutputDir}/${testDartOutputDir}/icons.dart`), true);
+    assert.equal(existsSync(`${zdsIntegrationOutputDir}/${testTSOutputDir}/icon-types.ts`), true);
   });
 });

test/integration/generateDefinitionFiles.test.ts

@@ -2,16 +2,16 @@ import { assert } from "chai";
 import { existsSync } from "fs";
 import { generateDefinitionFiles } from "../../scripts/generators/generateDefinitionFiles.js";
 import { generatedFontDefinitions, manifest } from "../data/index.js";
-import { testDefinitionsOutputDir, testOutputDir } from "../data/constants.js";
+import { testDartOutputDir, testOutputDir, testTSOutputDir } from "../data/constants.js";
 
 describe("generateDefinitionFiles", () => {
   before(async () => {
-    generateDefinitionFiles(testOutputDir, testDefinitionsOutputDir, generatedFontDefinitions, manifest);
+    generateDefinitionFiles(testOutputDir, generatedFontDefinitions, manifest);
   });
 
   it("should write definition files", () => {
-    assert.equal(existsSync(`${testDefinitionsOutputDir}/icons.dart`), true);
-    assert.equal(existsSync(`${testDefinitionsOutputDir}/icon-types.ts`), true);
+    assert.equal(existsSync(`${testDartOutputDir}/icons.dart`), true);
+    assert.equal(existsSync(`${testTSOutputDir}/icon-types.ts`), true);
   });
 
   it("should write the icon manifest", () => {

test/integration/generateFontFiles.test.ts

@@ -1,7 +1,13 @@
 import "./saveSvgs.test.js"; // Ensures saveSVGs is called before running these tests.
 
 import { optimizeSVGs } from "../../scripts/utils/optimizeSvgs.js";
-import { testFontName, testFontsOutputDir, testIconsOutputDir, testTempOutputDir } from "../data/constants.js";
+import {
+  testDartOutputDir,
+  testFontName,
+  testIconsOutputDir,
+  testTempOutputDir,
+  testTSOutputDir,
+} from "../data/constants.js";
 import { categoryNames, generatedFontDefinitions } from "../data/index.js";
 import { GenerateFontResult } from "../../scripts/types/customTypes.js";
 import { generateFonts } from "../../scripts/generators/generateFonts.js";
@@ -13,14 +19,14 @@ describe("generateFontFiles", () => {
 
   before(async () => {
     await optimizeSVGs(testIconsOutputDir, testTempOutputDir, categoryNames);
-    result = await generateFonts(testTempOutputDir, testFontsOutputDir, testFontName);
+    result = await generateFonts(testTempOutputDir, testFontName, testDartOutputDir, testTSOutputDir);
   });
 
   it("should return a correct font generation result", () => {
     assert.deepEqual(result, generatedFontDefinitions);
   });
 
   it("should have created sharp and rounded ttf and woff2 files", () => {
-    checkFontsExist(testFontName, testFontsOutputDir);
+    checkFontsExist(testFontName, testDartOutputDir, testTSOutputDir);
   });
 });

test/regenerateTestFiles.ts

@@ -2,11 +2,12 @@ import { rmSync, rmdirSync, writeFileSync } from "fs";
 import * as dotenv from "dotenv";
 import { getFigmaDocument, getImageFiles } from "../scripts/utils/api.js";
 import {
+  testDartOutputDir,
   testFileId,
-  testFontsOutputDir,
   testIconPageName,
   testIconsOutputDir,
   testOutputDir,
+  testTSOutputDir,
 } from "./data/constants.js";
 import {
   extractCategoryNames,
@@ -61,7 +62,7 @@ async function main() {
     await optimizeSVGs(testIconsOutputDir, tempOutputDir, categoryNames);
     console.log("✅ - Optimized SVGs");
 
-    const generateFontResult = await generateFonts(tempOutputDir, testFontsOutputDir, "zeta-icons");
+    const generateFontResult = await generateFonts(tempOutputDir, "zeta-icons", testDartOutputDir, testTSOutputDir);
     writeFile(generateFontResult, "generatedFontResponse.json");
 
     rmSync(testOutputDir, { recursive: true });

test/utils.ts

@@ -9,11 +9,11 @@ export function checkIconsExist(manifest: IconManifest) {
   });
 }
 
-export function checkFontsExist(fontName: string, dir: string) {
-  assert.equal(fontExists("ttf", "round", fontName, dir), true);
-  assert.equal(fontExists("ttf", "sharp", fontName, dir), true);
-  assert.equal(fontExists("woff2", "round", fontName, dir), true);
-  assert.equal(fontExists("woff2", "sharp", fontName, dir), true);
+export function checkFontsExist(fontName: string, dartDir: string, tsDir: string) {
+  assert.equal(fontExists("ttf", "round", fontName, dartDir), true);
+  assert.equal(fontExists("ttf", "sharp", fontName, dartDir), true);
+  assert.equal(fontExists("woff2", "round", fontName, tsDir), true);
+  assert.equal(fontExists("woff2", "sharp", fontName, tsDir), true);
 }
 
 function fontExists(format: string, type: FontType, fontName: string, dir: string): boolean {