From 8a0dd4685254d116f0e6fb7d135af814ba4bec60 Mon Sep 17 00:00:00 2001
From: Matthew Ferry <hello@matthew-ferry.com>
Date: Thu, 26 Oct 2023 22:43:30 +0000
Subject: [PATCH 1/2] feat: add build script to auto generate types.ts

---
 CONTRIBUTING.md        |  2 +-
 package.json           |  1 +
 scripts/build-icons.js | 24 ++++++++++++++++++++++++
 3 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 scripts/build-icons.js

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 471102f4b..cc12ddd8f 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -159,7 +159,7 @@ Simply run `pnpm generate component` and follow the prompts, and you'll be well
 ### Adding Icons to LaunchPad
 
 - Add the SVG body content into a new symbol entry with id `lp-icon-{name}` in the `/src/image/sprite.svg` file in the `@launchpad/icons` package.
-- Add its `id` (minus prefix `lp-icon`) to the icons array in `/src/types.ts`.
+- Run `pnpm icons:build` to add its `id` (minus prefix `lp-icon`) to the icons array in `/src/types.ts`.
 - Run `pnpm storybook` and visit the "Icons" page to ensure your icon was generated properly.
 
 ---
diff --git a/package.json b/package.json
index 003b30db7..20b19c73c 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
     "generate": "plop",
     "graph": "nx affected:graph",
+    "icons:build": "node ./scripts/build-icons.js",
     "lint": "eslint '**/*.{ts,tsx,js}' --ignore-pattern '/packages/' --ignore-pattern '/apps/'",
     "lint:ci": "pnpm build:transform && pnpm lint && pnpm lint:packages",
     "lint:packages": "nx affected --target=lint",
diff --git a/scripts/build-icons.js b/scripts/build-icons.js
new file mode 100644
index 000000000..ab81fae9e
--- /dev/null
+++ b/scripts/build-icons.js
@@ -0,0 +1,24 @@
+/* eslint-disable */
+const fs = require('fs');
+const path = require('path');
+
+const iconsPath = path.join(__dirname, '../packages/icons/src/img/sprite.svg');
+const icons = fs.readFileSync(iconsPath, 'utf8');
+const matchResult = icons.match(/id="lp-icon-([a-z-]+)"/g);
+
+if (matchResult) {
+  const ids = matchResult.map((id) => id.slice(12, -1));
+  const stylizedString = JSON.stringify(ids, null, 2).replace(/"/g, "'").slice(0, -2) + ',';
+  const outputPath = path.join(__dirname, '../packages/icons/src/types.ts');
+  const output = `const icons = ${stylizedString}
+] as const;
+type IconName = (typeof icons)[number];
+
+export type { IconName };
+export { icons };
+`;
+
+  fs.writeFileSync(outputPath, `${output}`);
+} else {
+  console.log('No icon IDs found in the SVG file.');
+}

From d4702293c1c8759f1630297770eeb29e4706c57c Mon Sep 17 00:00:00 2001
From: Matthew Ferry <hello@matthew-ferry.com>
Date: Fri, 27 Oct 2023 20:12:25 +0000
Subject: [PATCH 2/2] fix: use typescript for build-icons script

---
 package.json           |  2 +-
 scripts/build-icons.js | 24 ------------------------
 scripts/build-icons.ts | 23 +++++++++++++++++++++++
 3 files changed, 24 insertions(+), 25 deletions(-)
 delete mode 100644 scripts/build-icons.js
 create mode 100644 scripts/build-icons.ts

diff --git a/package.json b/package.json
index 20b19c73c..f1b5ea298 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
     "generate": "plop",
     "graph": "nx affected:graph",
-    "icons:build": "node ./scripts/build-icons.js",
+    "icons:build": "npx ts-node -O '{\"types\": [\"node\"], \"module\": \"nodenext\"}' ./scripts/build-icons.ts",
     "lint": "eslint '**/*.{ts,tsx,js}' --ignore-pattern '/packages/' --ignore-pattern '/apps/'",
     "lint:ci": "pnpm build:transform && pnpm lint && pnpm lint:packages",
     "lint:packages": "nx affected --target=lint",
diff --git a/scripts/build-icons.js b/scripts/build-icons.js
deleted file mode 100644
index ab81fae9e..000000000
--- a/scripts/build-icons.js
+++ /dev/null
@@ -1,24 +0,0 @@
-/* eslint-disable */
-const fs = require('fs');
-const path = require('path');
-
-const iconsPath = path.join(__dirname, '../packages/icons/src/img/sprite.svg');
-const icons = fs.readFileSync(iconsPath, 'utf8');
-const matchResult = icons.match(/id="lp-icon-([a-z-]+)"/g);
-
-if (matchResult) {
-  const ids = matchResult.map((id) => id.slice(12, -1));
-  const stylizedString = JSON.stringify(ids, null, 2).replace(/"/g, "'").slice(0, -2) + ',';
-  const outputPath = path.join(__dirname, '../packages/icons/src/types.ts');
-  const output = `const icons = ${stylizedString}
-] as const;
-type IconName = (typeof icons)[number];
-
-export type { IconName };
-export { icons };
-`;
-
-  fs.writeFileSync(outputPath, `${output}`);
-} else {
-  console.log('No icon IDs found in the SVG file.');
-}
diff --git a/scripts/build-icons.ts b/scripts/build-icons.ts
new file mode 100644
index 000000000..e68b73d95
--- /dev/null
+++ b/scripts/build-icons.ts
@@ -0,0 +1,23 @@
+import fs from 'fs';
+import path from 'path';
+
+const iconsPath: string = path.join(__dirname, '../packages/icons/src/img/sprite.svg');
+const icons: string = fs.readFileSync(iconsPath, 'utf8');
+const matchResult: RegExpMatchArray | null = icons.match(/id="lp-icon-([a-z-]+)"/g);
+
+if (matchResult) {
+  const ids: string[] = matchResult.map((id: string) => id.slice(12, -1));
+  const stylizedString: string = JSON.stringify(ids, null, 2).replace(/"/g, "'").slice(0, -2) + ',';
+  const outputPath: string = path.join(__dirname, '../packages/icons/src/types.ts');
+  const output: string = `const icons = ${stylizedString}
+] as const;
+type IconName = (typeof icons)[number];
+
+export type { IconName };
+export { icons };
+`;
+
+  fs.writeFileSync(outputPath, output, 'utf8');
+} else {
+  console.log('No icon IDs found in the SVG file.');
+}