feat: automatically generate index.tsx file (#6)

Automatically generate the `index.tsx` file in the ui package when a new component is added.

Author: davidbeechey

.npmrc

@@ -1 +1,2 @@
 auto-install-peers = true
+enable-pre-post-scripts=true # Enable pre/post scripts (for postui:add)

packages/ui/components/button.tsx renamed to packages/ui/components/ui/button.tsx

@@ -1,4 +1 @@
-import * as React from 'react';
-
-// Components export
-export * from '@ui/components/button';
+export * from './components/ui/button';

packages/ui/index.tsx

@@ -6,9 +6,11 @@
   "license": "MIT",
   "scripts": {
     "lint": "eslint \"**/*.ts*\"",
-    "ui:add": "pnpm dlx shadcn-ui@latest add"
+    "ui:add": "pnpm dlx shadcn-ui@latest add",
+    "postui:add": "ts-node --esm ./scripts/generateIndex.mts"
   },
   "devDependencies": {
+    "@types/node": "^17.0.12",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "autoprefixer": "^10.4.14",

packages/ui/package.json

@@ -0,0 +1,22 @@
+import fs from "fs";
+import path from "path";
+import { fileURLToPath } from "url";
+
+// Get the current file's directory path
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const componentsPath = path.join(__dirname, "../components/ui");
+const indexFilePath = path.join(componentsPath, "../../index.tsx");
+
+// Generate the index.tsx file by looping through all the files in the components folder
+const componentFiles = fs.readdirSync(componentsPath);
+const exportStatements = componentFiles.map((file) => {
+    const componentName = path.basename(file, ".tsx");
+    return `export * from './components/ui/${componentName}';`;
+});
+const indexFileContent = exportStatements.join("\n") + "\n";
+
+fs.writeFileSync(indexFilePath, indexFileContent, "utf8");
+
+console.log("\x1b[32m%s\x1b[0m", "index.tsx file generated successfully.");