initkit 1.1.0 → 1.2.0

package/src/prompts/questions.js

@@ -54,7 +54,6 @@ function getQuestions(initialProjectName) {
       choices: [
         { name: 'Frontend Only', value: 'frontend' },
         { name: 'Backend Only', value: 'backend' },
-        { name: 'Full Stack', value: 'fullstack' },
         { name: 'Node.js Library/Package', value: 'library' },
       ],
     },
@@ -68,7 +67,6 @@ function getQuestions(initialProjectName) {
         const typeDefaults = {
           frontend: 'my-frontend-app',
           backend: 'my-backend-api',
-          fullstack: 'my-fullstack-app',
           library: 'my-package',
         };
         return typeDefaults[answers.projectType] || 'my-awesome-project';
@@ -119,41 +117,7 @@ function getQuestions(initialProjectName) {
         { name: 'Next.js (React)', value: 'nextjs' },
         { name: 'Vue.js + Vite', value: 'vue' },
       ],
-      when: (answers) => ['frontend', 'fullstack'].includes(answers.projectType),
-    },
-    // Full-stack architecture type
-    {
-      type: 'list',
-      name: 'fullstackType',
-      message: 'Choose your full-stack architecture:',
-      choices: [
-        { name: 'Monorepo (apps/ + packages/)', value: 'monorepo' },
-        { name: 'Traditional (separate client/ + server/)', value: 'traditional' },
-      ],
-      when: (answers) => answers.projectType === 'fullstack',
-    },
-    // Full-stack stack selection
-    {
-      type: 'list',
-      name: 'stack',
-      message: 'Choose your full-stack:',
-      choices: (answers) => {
-        if (answers.fullstackType === 'monorepo') {
-          return [
-            { name: 'Next.js + Express + MongoDB', value: 'Next.js + Express + MongoDB' },
-            { name: 'Next.js + Express + PostgreSQL', value: 'Next.js + Express + PostgreSQL' },
-            { name: 'React + Express + MongoDB', value: 'React + Express + MongoDB' },
-            { name: 'React + Express + PostgreSQL', value: 'React + Express + PostgreSQL' },
-          ];
-        }
-        return [
-          { name: 'MERN (MongoDB + Express + React + Node)', value: 'MERN' },
-          { name: 'PERN (PostgreSQL + Express + React + Node)', value: 'PERN' },
-          { name: 'Next.js + Express', value: 'Next.js + Express' },
-          { name: 'Laravel + React', value: 'Laravel + React' },
-        ];
-      },
-      when: (answers) => answers.projectType === 'fullstack',
+      when: (answers) => answers.projectType === 'frontend',
     },
     // Backend framework selection
     {
@@ -264,6 +228,98 @@ function getQuestions(initialProjectName) {
       ],
       when: (answers) => answers.projectType === 'frontend',
     },
+    // State Management (Frontend)
+    {
+      type: 'list',
+      name: 'stateManagement',
+      message: 'Choose your state management solution:',
+      choices: [
+        { name: 'None (React Context API only)', value: 'none' },
+        { name: 'Redux Toolkit (Official Redux)', value: 'redux-toolkit' },
+        { name: 'Zustand (Lightweight)', value: 'zustand' },
+        { name: 'Jotai (Atomic)', value: 'jotai' },
+        { name: 'Recoil (Atomic)', value: 'recoil' },
+        { name: 'Pinia (Vue)', value: 'pinia' },
+      ],
+      default: 'none',
+      when: (answers) => answers.projectType === 'frontend' && answers.frontend !== 'nextjs',
+    },
+    // UI Component Library (Frontend)
+    {
+      type: 'list',
+      name: 'uiLibrary',
+      message: 'Choose a UI component library (optional):',
+      choices: [
+        { name: 'None', value: 'none' },
+        { name: 'shadcn/ui (Radix + Tailwind)', value: 'shadcn' },
+        { name: 'Material-UI (MUI)', value: 'mui' },
+        { name: 'Ant Design', value: 'antd' },
+        { name: 'Chakra UI', value: 'chakra' },
+        { name: 'Mantine', value: 'mantine' },
+        { name: 'DaisyUI (Tailwind)', value: 'daisyui' },
+      ],
+      default: 'none',
+      when: (answers) => answers.projectType === 'frontend',
+    },
+    // ORM/Database Tool (Backend)
+    {
+      type: 'list',
+      name: 'orm',
+      message: 'Choose an ORM/database tool:',
+      choices: [
+        { name: 'None', value: 'none' },
+        { name: 'Prisma (Type-safe ORM)', value: 'prisma' },
+        { name: 'Drizzle (Lightweight ORM)', value: 'drizzle' },
+        { name: 'TypeORM', value: 'typeorm' },
+        { name: 'Mongoose (MongoDB)', value: 'mongoose' },
+      ],
+      default: 'none',
+      when: (answers) => answers.projectType === 'backend',
+    },
+    // Database Selection (if ORM selected)
+    {
+      type: 'list',
+      name: 'database',
+      message: 'Choose your database:',
+      choices: [
+        { name: 'PostgreSQL', value: 'postgresql' },
+        { name: 'MySQL', value: 'mysql' },
+        { name: 'SQLite', value: 'sqlite' },
+        { name: 'MongoDB', value: 'mongodb' },
+      ],
+      default: 'postgresql',
+      when: (answers) => answers.orm && answers.orm !== 'none' && answers.orm !== 'mongoose',
+    },
+    // Authentication (Frontend/Backend)
+    {
+      type: 'list',
+      name: 'authentication',
+      message: 'Choose an authentication solution:',
+      choices: [
+        { name: 'None', value: 'none' },
+        { name: 'NextAuth.js', value: 'nextauth' },
+        { name: 'Clerk', value: 'clerk' },
+        { name: 'Supabase Auth', value: 'supabase' },
+        { name: 'Auth0', value: 'auth0' },
+        { name: 'Lucia', value: 'lucia' },
+      ],
+      default: 'none',
+      when: (answers) => ['frontend', 'backend'].includes(answers.projectType),
+    },
+    // Testing Frameworks
+    {
+      type: 'checkbox',
+      name: 'testing',
+      message: 'Select testing frameworks:',
+      choices: [
+        { name: 'Vitest (Unit/Integration)', value: 'vitest', checked: false },
+        { name: 'Jest (Unit/Integration)', value: 'jest', checked: false },
+        { name: 'Playwright (E2E)', value: 'playwright', checked: false },
+        { name: 'Cypress (E2E)', value: 'cypress', checked: false },
+        { name: 'React Testing Library', value: 'testing-library', checked: false },
+      ],
+      when: (answers) => ['frontend', 'backend'].includes(answers.projectType),
+    },
     // Additional Libraries (Multi-select)
     {
       type: 'checkbox',
@@ -301,11 +357,11 @@ function getQuestions(initialProjectName) {
 
         let choices = [...commonChoices];
 
-        if (['frontend', 'fullstack'].includes(answers.projectType)) {
+        if (answers.projectType === 'frontend') {
           choices = [...choices, ...frontendChoices];
         }
 
-        if (['backend', 'fullstack'].includes(answers.projectType)) {
+        if (answers.projectType === 'backend') {
           choices = [...choices, ...backendChoices];
         }
 

package/src/utils/addonInstaller.js

@@ -0,0 +1,402 @@
+import { execCommand } from './cliRunner.js';
+import chalk from 'chalk';
+
+/**
+ * Install add-ons/libraries using their official installation methods
+ *
+ * This module installs additional libraries and tools using their
+ * official CLIs and installation commands, ensuring proper setup
+ * and configuration.
+ *
+ * @param {string} projectPath - Project directory
+ * @param {Object} config - User configuration with selected add-ons
+ * @returns {Promise<void>}
+ */
+export async function installAddons(projectPath, config) {
+  const {
+    stateManagement,
+    uiLibrary,
+    database,
+    orm,
+    authentication,
+    testing = [],
+    styling,
+    additionalLibraries = [],
+  } = config;
+
+  // State Management
+  if (stateManagement && stateManagement !== 'none') {
+    console.log(chalk.cyan('\n📦 Installing state management...'));
+    await installStateManagement(projectPath, stateManagement, config);
+  }
+
+  // UI Library
+  if (uiLibrary && uiLibrary !== 'none') {
+    console.log(chalk.cyan('\n🎨 Installing UI library...'));
+    await installUILibrary(projectPath, uiLibrary, config);
+  }
+
+  // Database & ORM
+  if (orm && orm !== 'none') {
+    console.log(chalk.cyan('\n🗄️  Installing ORM...'));
+    await installORM(projectPath, orm, database, config);
+  }
+
+  // Authentication
+  if (authentication && authentication !== 'none') {
+    console.log(chalk.cyan('\n🔐 Installing authentication...'));
+    await installAuthentication(projectPath, authentication, config);
+  }
+
+  // Testing
+  if (testing && testing.length > 0) {
+    console.log(chalk.cyan('\n🧪 Installing testing frameworks...'));
+    await installTesting(projectPath, testing, config);
+  }
+
+  // Additional libraries
+  if (additionalLibraries && additionalLibraries.length > 0) {
+    console.log(chalk.cyan('\n📦 Installing additional libraries...'));
+    for (const lib of additionalLibraries) {
+      await installAdditionalLibrary(projectPath, lib, config);
+    }
+  }
+}
+
+/**
+ * Install state management library
+ */
+async function installStateManagement(projectPath, library, config) {
+  const { packageManager } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  switch (library) {
+    case 'redux-toolkit':
+      console.log(chalk.dim('  Installing Redux Toolkit and React Redux...'));
+      await execCommand(`${installCmd} @reduxjs/toolkit react-redux`, {
+        cwd: projectPath,
+      });
+      // Store setup will be done in template generator
+      break;
+
+    case 'zustand':
+      console.log(chalk.dim('  Installing Zustand...'));
+      await execCommand(`${installCmd} zustand`, { cwd: projectPath });
+      break;
+
+    case 'jotai':
+      console.log(chalk.dim('  Installing Jotai...'));
+      await execCommand(`${installCmd} jotai`, { cwd: projectPath });
+      break;
+
+    case 'recoil':
+      console.log(chalk.dim('  Installing Recoil...'));
+      await execCommand(`${installCmd} recoil`, { cwd: projectPath });
+      break;
+
+    case 'pinia':
+      // Pinia is usually included in Vue setup
+      console.log(chalk.dim('  Pinia will be configured in Vue setup...'));
+      break;
+
+    default:
+      console.log(chalk.yellow(`  Unknown state management: ${library}`));
+  }
+}
+
+/**
+ * Install UI library (some have their own CLIs!)
+ */
+async function installUILibrary(projectPath, library, config) {
+  const { packageManager, language } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  switch (library) {
+    case 'shadcn':
+    case 'shadcn-ui':
+      console.log(chalk.dim('  Running shadcn-ui init...'));
+      // shadcn has its own CLI!
+      await execCommand(`npx shadcn@latest init -y`, { cwd: projectPath });
+      break;
+
+    case 'mui':
+    case 'material-ui':
+      console.log(chalk.dim('  Installing Material-UI...'));
+      await execCommand(
+        `${installCmd} @mui/material @emotion/react @emotion/styled @mui/icons-material`,
+        { cwd: projectPath }
+      );
+      break;
+
+    case 'antd':
+    case 'ant-design':
+      console.log(chalk.dim('  Installing Ant Design...'));
+      await execCommand(`${installCmd} antd`, { cwd: projectPath });
+      break;
+
+    case 'chakra':
+    case 'chakra-ui':
+      console.log(chalk.dim('  Installing Chakra UI...'));
+      await execCommand(
+        `${installCmd} @chakra-ui/react @emotion/react @emotion/styled framer-motion`,
+        { cwd: projectPath }
+      );
+      break;
+
+    case 'mantine':
+      console.log(chalk.dim('  Installing Mantine...'));
+      await execCommand(
+        `${installCmd} @mantine/core @mantine/hooks @mantine/form @mantine/notifications`,
+        { cwd: projectPath }
+      );
+      break;
+
+    case 'daisyui':
+      console.log(chalk.dim('  Installing DaisyUI...'));
+      await execCommand(`${installCmd} -D daisyui`, { cwd: projectPath });
+      break;
+
+    default:
+      console.log(chalk.yellow(`  Unknown UI library: ${library}`));
+  }
+}
+
+/**
+ * Install ORM (Prisma has its own CLI!)
+ */
+async function installORM(projectPath, orm, database, config) {
+  const { packageManager, language } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  switch (orm) {
+    case 'prisma': {
+      console.log(chalk.dim('  Installing Prisma...'));
+      // Prisma has its own init CLI!
+      await execCommand(`${installCmd} -D prisma`, { cwd: projectPath });
+      await execCommand(`${installCmd} @prisma/client`, { cwd: projectPath });
+
+      // Initialize Prisma with database
+      const datasource = getDatasourceForPrisma(database);
+      console.log(chalk.dim(`  Initializing Prisma with ${datasource}...`));
+      await execCommand(`npx prisma init --datasource-provider ${datasource}`, {
+        cwd: projectPath,
+      });
+      break;
+    }
+
+    case 'drizzle': {
+      console.log(chalk.dim('  Installing Drizzle ORM...'));
+      await execCommand(`${installCmd} drizzle-orm`, { cwd: projectPath });
+      await execCommand(`${installCmd} -D drizzle-kit`, { cwd: projectPath });
+
+      // Add database driver
+      const driver = getDriverForDrizzle(database);
+      console.log(chalk.dim(`  Installing database driver: ${driver}...`));
+      await execCommand(`${installCmd} ${driver}`, { cwd: projectPath });
+      break;
+    }
+
+    case 'typeorm': {
+      console.log(chalk.dim('  Installing TypeORM...'));
+      await execCommand(`${installCmd} typeorm reflect-metadata`, {
+        cwd: projectPath,
+      });
+      if (language === 'typescript') {
+        await execCommand(`${installCmd} -D @types/node`, { cwd: projectPath });
+      }
+      // Add database driver
+      const typeormDriver = getDriverForTypeORM(database);
+      if (typeormDriver) {
+        console.log(chalk.dim(`  Installing database driver: ${typeormDriver}...`));
+        await execCommand(`${installCmd} ${typeormDriver}`, {
+          cwd: projectPath,
+        });
+      }
+      break;
+    }
+
+    case 'mongoose':
+      console.log(chalk.dim('  Installing Mongoose...'));
+      await execCommand(`${installCmd} mongoose`, { cwd: projectPath });
+      if (language === 'typescript') {
+        await execCommand(`${installCmd} -D @types/mongoose`, {
+          cwd: projectPath,
+        });
+      }
+      break;
+
+    default:
+      console.log(chalk.yellow(`  Unknown ORM: ${orm}`));
+  }
+}
+
+/**
+ * Install authentication library
+ */
+async function installAuthentication(projectPath, auth, config) {
+  const { packageManager } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  switch (auth) {
+    case 'nextauth':
+    case 'next-auth':
+      console.log(chalk.dim('  Installing NextAuth.js...'));
+      await execCommand(`${installCmd} next-auth`, { cwd: projectPath });
+      break;
+
+    case 'clerk':
+      console.log(chalk.dim('  Installing Clerk...'));
+      await execCommand(`${installCmd} @clerk/nextjs`, { cwd: projectPath });
+      break;
+
+    case 'supabase':
+      console.log(chalk.dim('  Installing Supabase client...'));
+      await execCommand(`${installCmd} @supabase/supabase-js`, {
+        cwd: projectPath,
+      });
+      break;
+
+    case 'auth0':
+      console.log(chalk.dim('  Installing Auth0...'));
+      await execCommand(`${installCmd} @auth0/nextjs-auth0`, {
+        cwd: projectPath,
+      });
+      break;
+
+    case 'lucia':
+      console.log(chalk.dim('  Installing Lucia...'));
+      await execCommand(`${installCmd} lucia`, { cwd: projectPath });
+      break;
+
+    default:
+      console.log(chalk.yellow(`  Unknown authentication library: ${auth}`));
+  }
+}
+
+/**
+ * Install testing frameworks (Playwright has its own CLI!)
+ */
+async function installTesting(projectPath, testingLibs, config) {
+  const { packageManager } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  for (const lib of testingLibs) {
+    switch (lib) {
+      case 'vitest':
+        console.log(chalk.dim('  Installing Vitest...'));
+        await execCommand(`${installCmd} -D vitest`, { cwd: projectPath });
+        await execCommand(`${installCmd} -D @vitest/ui`, { cwd: projectPath });
+        break;
+
+      case 'jest':
+        console.log(chalk.dim('  Installing Jest...'));
+        await execCommand(`${installCmd} -D jest @types/jest`, {
+          cwd: projectPath,
+        });
+        break;
+
+      case 'playwright':
+        console.log(chalk.dim('  Installing Playwright...'));
+        // Playwright has its own init CLI!
+        await execCommand(`npm init playwright@latest`, { cwd: projectPath });
+        break;
+
+      case 'cypress':
+        console.log(chalk.dim('  Installing Cypress...'));
+        await execCommand(`${installCmd} -D cypress`, { cwd: projectPath });
+        break;
+
+      case 'testing-library':
+      case '@testing-library':
+        console.log(chalk.dim('  Installing React Testing Library...'));
+        await execCommand(
+          `${installCmd} -D @testing-library/react @testing-library/jest-dom @testing-library/user-event`,
+          { cwd: projectPath }
+        );
+        break;
+
+      default:
+        console.log(chalk.yellow(`  Unknown testing library: ${lib}`));
+    }
+  }
+}
+
+/**
+ * Install additional library
+ */
+async function installAdditionalLibrary(projectPath, lib, config) {
+  const { packageManager } = config;
+  const installCmd = getInstallCommand(packageManager);
+
+  console.log(chalk.dim(`  Installing ${lib}...`));
+  await execCommand(`${installCmd} ${lib}`, { cwd: projectPath });
+}
+
+/**
+ * Get install command for package manager
+ */
+function getInstallCommand(packageManager) {
+  const commands = {
+    npm: 'npm install',
+    yarn: 'yarn add',
+    pnpm: 'pnpm add',
+    bun: 'bun add',
+  };
+  return commands[packageManager] || 'npm install';
+}
+
+/**
+ * Helper functions for database mappings
+ */
+function getDatasourceForPrisma(database) {
+  if (!database || database === 'none') return 'postgresql';
+
+  const mapping = {
+    postgresql: 'postgresql',
+    postgres: 'postgresql',
+    mysql: 'mysql',
+    sqlite: 'sqlite',
+    mongodb: 'mongodb',
+    sqlserver: 'sqlserver',
+  };
+  return mapping[database.toLowerCase()] || 'postgresql';
+}
+
+function getDriverForDrizzle(database) {
+  if (!database || database === 'none') return 'pg';
+
+  const drivers = {
+    postgresql: 'pg',
+    postgres: 'pg',
+    mysql: 'mysql2',
+    sqlite: 'better-sqlite3',
+  };
+  return drivers[database.toLowerCase()] || 'pg';
+}
+
+function getDriverForTypeORM(database) {
+  if (!database || database === 'none') return null;
+
+  const drivers = {
+    postgresql: 'pg',
+    postgres: 'pg',
+    mysql: 'mysql2',
+    sqlite: 'sqlite3',
+    mongodb: 'mongodb',
+  };
+  return drivers[database.toLowerCase()] || null;
+}
+
+/**
+ * Check if user selected any add-ons
+ */
+export function hasAddons(config) {
+  return !!(
+    (config.stateManagement && config.stateManagement !== 'none') ||
+    (config.uiLibrary && config.uiLibrary !== 'none') ||
+    (config.orm && config.orm !== 'none') ||
+    (config.authentication && config.authentication !== 'none') ||
+    (config.testing && config.testing.length > 0) ||
+    (config.additionalLibraries && config.additionalLibraries.length > 0)
+  );
+}