From 81c24f3cd47fedfdcff7b6b5bece4cb8d5d13b9d Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Thu, 30 Oct 2025 21:41:54 -0400
Subject: [PATCH] Fix ts icon generation formatting

Improved icon generation to use manual formatting instead of JSON.stringify for better readability and consistency with other icon files.
---
 client/icons/all-icons.md                  |  6 ++---
 client/icons/build_icons.js                |  6 ++---
 client/icons/generate_ts_icons.js          | 30 ++++++++++++++--------
 client/src/components/icons/galaxyIcons.ts |  2 +-
 4 files changed, 26 insertions(+), 18 deletions(-)

diff --git a/client/icons/all-icons.md b/client/icons/all-icons.md
index 07e4054f57a..ab1e9e73b94 100644
--- a/client/icons/all-icons.md
+++ b/client/icons/all-icons.md
@@ -18,8 +18,8 @@ import { galaxyLogo } from "@/components/icons/galaxyIcons";
 
 ---
 
-- **galaxyLogo**: `import { galaxyLogo } from '@/components/icons/galaxyIcons';`
-- **textLarger**: `import { textLarger } from '@/components/icons/galaxyIcons';`
-- **textSmaller**: `import { textSmaller } from '@/components/icons/galaxyIcons';`
+- **galaxyLogo**: `import { galaxyLogo } from "@/components/icons/galaxyIcons";`
+- **textLarger**: `import { textLarger } from "@/components/icons/galaxyIcons";`
+- **textSmaller**: `import { textSmaller } from "@/components/icons/galaxyIcons";`
 
 ---
diff --git a/client/icons/build_icons.js b/client/icons/build_icons.js
index 92118ad8c77..5a04a55339f 100644
--- a/client/icons/build_icons.js
+++ b/client/icons/build_icons.js
@@ -101,16 +101,16 @@ function makeMarkdown(iconDefinitions) {
     content += "## Usage\n\n";
     content += "```vue\n";
     content += "<script setup>\n";
-    content += "import { galaxyLogo } from '@/components/icons/galaxyIcons';\n";
+    content += 'import { galaxyLogo } from "@/components/icons/galaxyIcons";\n';
     content += "</script>\n\n";
     content += "<template>\n";
-    content += '  <FontAwesomeIcon :icon="galaxyLogo" />\n';
+    content += '    <FontAwesomeIcon :icon="galaxyLogo" />\n';
     content += "</template>\n";
     content += "```\n\n";
     content += "---\n\n";
 
     iconDefinitions.forEach((icon) => {
-        content += `- **${icon.iconName}**: \`import { ${icon.iconName} } from '@/components/icons/galaxyIcons';\`\n`;
+        content += `-   **${icon.iconName}**: \`import { ${icon.iconName} } from "@/components/icons/galaxyIcons";\`\n`;
     });
 
     content += "\n---\n";
diff --git a/client/icons/generate_ts_icons.js b/client/icons/generate_ts_icons.js
index b3cbcf77f0e..00963c347fc 100644
--- a/client/icons/generate_ts_icons.js
+++ b/client/icons/generate_ts_icons.js
@@ -23,7 +23,7 @@ function generateIconsTypeScript() {
 
 // Galaxy custom icons
 // Generated from: ${iconsJsonPath}
-// To regenerate, run: npm run icons
+// To regenerate: node icons/generate_ts_icons.js
 
 // Matches FontAwesome's structure
 export interface GalaxyIconDefinition {
@@ -41,21 +41,29 @@ export type IconLike = IconDefinition | GalaxyIconDefinition;
         // Convert icon name to camelCase for JavaScript export
         const exportName = icon.iconName;
 
-        content += `export const ${exportName}: GalaxyIconDefinition = ${JSON.stringify(
-            {
-                iconName: icon.iconName,
-                prefix: icon.prefix,
-                icon: icon.icon,
-            },
-            null,
-            4,
-        )};
+        // Format the icon data manually to match the expected style
+        const iconData = icon.icon;
+        const formattedIcon = `{
+    iconName: "${icon.iconName}",
+    prefix: "${icon.prefix}",
+    icon: [
+        ${iconData[0]},
+        ${iconData[1]},
+        [],
+        "",
+        [
+            ${iconData[4].map((path) => `"${path}"`).join(",\n            ")},
+        ],
+    ],
+};`;
+
+        content += `export const ${exportName}: GalaxyIconDefinition = ${formattedIcon}
 
 `;
     });
 
     // Write the TypeScript file
-    fs.writeFileSync(outputPath, content);
+    fs.writeFileSync(outputPath, content.trimEnd() + "\n");
     console.log(`Generated Galaxy icons TypeScript exports at: ${outputPath}`);
     console.log(`Exported ${icons.length} icons: ${icons.map((i) => i.iconName).join(", ")}`);
 }
diff --git a/client/src/components/icons/galaxyIcons.ts b/client/src/components/icons/galaxyIcons.ts
index c16ac507461..9b56cac3880 100644
--- a/client/src/components/icons/galaxyIcons.ts
+++ b/client/src/components/icons/galaxyIcons.ts
@@ -2,7 +2,7 @@ import type { IconDefinition } from "@fortawesome/fontawesome-svg-core";
 
 // Galaxy custom icons
 // Generated from: /Users/dannon/work/galaxy/client/src/assets/icons.json
-// To regenerate, run: npm run icons
+// To regenerate: node icons/generate_ts_icons.js
 
 // Matches FontAwesome's structure
 export interface GalaxyIconDefinition {