magicpath-ai 1.3.0-beta.13 → 1.3.0-beta.15

package/dist/commands/add.js

@@ -31,14 +31,14 @@ export function registerAddCommand(program) {
     program
         .command('add')
         .description('Add a MagicPath component to your project')
-        .argument('<generatedName>', 'The generated name of the component (e.g., wispy-river-5234)')
+        .argument('<generatedNames...>', 'One or more generated names of components (e.g., wispy-river-5234 bold-moon-2031)')
         .option('-y, --yes', 'Skip confirmation prompts', false)
         .option('--overwrite', 'Overwrite existing files', false)
         .option('-p, --path <path>', `Custom path for components (default: ${DEFAULT_COMPONENTS_PATH})`)
         .option('-d, --debug', 'Enable debug logging', false)
         .option('--dry-run', 'Show what would happen without writing files', false)
         .option('--inspect', 'Show component source code without installing (implies --dry-run)', false)
-        .action(async (generatedName, options) => {
+        .action(async (generatedNames, options) => {
         try {
             let addOptions;
             try {
@@ -58,7 +58,12 @@ export function registerAddCommand(program) {
             const json = isJsonMode();
             if (json)
                 addOptions.yes = true;
-            logger.debug({ generatedName, options: addOptions });
+            const isBatch = generatedNames.length > 1;
+            // For batch mode, force --yes to avoid repetitive prompts
+            if (isBatch) {
+                addOptions.yes = true;
+            }
+            logger.debug({ generatedNames, options: addOptions });
             const cwd = process.cwd();
             // Check if we're in a valid project directory
             const packageJsonPath = path.join(cwd, 'package.json');
@@ -68,271 +73,381 @@ export function registerAddCommand(program) {
                     suggestion: 'Run this command from the root of your project where package.json is located.',
                 });
             }
-            // Step 1: Fetch component from registry
-            const fetchSpinner = json
-                ? null
-                : brandSpinner(`Fetching component "${generatedName}"...`).start();
-            let componentData;
-            try {
-                componentData = await fetchComponent(generatedName);
-                fetchSpinner?.succeed(`Found component: ${componentData.name}`);
+            // Batch results collector
+            const batchResults = [];
+            if (isBatch && !json) {
+                console.log(`\n  Adding ${generatedNames.length} components...\n`);
             }
-            catch (err) {
-                if (err instanceof AuthRequiredError) {
-                    fetchSpinner?.fail('Not logged in');
-                    if (json) {
-                        throw new MagicPathError('Not authenticated. Set MAGICPATH_TOKEN or run `magicpath-ai login`.', {
-                            code: 'NOT_AUTHENTICATED',
-                            suggestion: 'Run `magicpath-ai login` or set the MAGICPATH_TOKEN environment variable.',
-                        });
+            for (const generatedName of generatedNames) {
+                try {
+                    // Step 1: Fetch component from registry
+                    const fetchSpinner = json
+                        ? null
+                        : brandSpinner(`Fetching component "${generatedName}"...`).start();
+                    let componentData;
+                    try {
+                        componentData = await fetchComponent(generatedName);
+                        fetchSpinner?.succeed(`Found component: ${componentData.name}`);
+                    }
+                    catch (err) {
+                        if (err instanceof AuthRequiredError) {
+                            fetchSpinner?.fail('Not logged in');
+                            if (json || isBatch) {
+                                throw new MagicPathError('Not authenticated. Set MAGICPATH_TOKEN or run `magicpath-ai login`.', {
+                                    code: 'NOT_AUTHENTICATED',
+                                    suggestion: 'Run `magicpath-ai login` or set the MAGICPATH_TOKEN environment variable.',
+                                });
+                            }
+                            const { shouldLogin } = await prompts({
+                                type: 'confirm',
+                                name: 'shouldLogin',
+                                message: 'You need to be logged in to install components. Log in now?',
+                                initial: true,
+                            });
+                            if (!shouldLogin) {
+                                console.log('Installation cancelled.');
+                                return;
+                            }
+                            const loggedIn = await runLoginFlow();
+                            if (!loggedIn) {
+                                console.log('Installation cancelled.');
+                                return;
+                            }
+                            // Retry fetch after login
+                            const retrySpinner = brandSpinner(`Fetching component "${generatedName}"...`).start();
+                            try {
+                                componentData = await fetchComponent(generatedName);
+                                retrySpinner.succeed(`Found component: ${componentData.name}`);
+                            }
+                            catch (retryErr) {
+                                retrySpinner.fail('Failed to fetch component');
+                                if (retryErr instanceof MagicPathError) {
+                                    throw retryErr;
+                                }
+                                throw new MagicPathError('Something went wrong!');
+                            }
+                        }
+                        else {
+                            fetchSpinner?.fail('Failed to fetch component');
+                            if (isBatch) {
+                                const errMsg = err instanceof MagicPathError ? err.message : 'Something went wrong!';
+                                batchResults.push({
+                                    component: generatedName,
+                                    generatedName,
+                                    filesWritten: [],
+                                    dependenciesInstalled: [],
+                                    dryRun: addOptions.dryRun,
+                                    error: errMsg,
+                                });
+                                if (!json)
+                                    console.log(`  ⚠️  Skipping "${generatedName}": ${errMsg}`);
+                                continue;
+                            }
+                            if (err instanceof MagicPathError) {
+                                throw err;
+                            }
+                            throw new MagicPathError('Something went wrong!');
+                        }
                     }
-                    const { shouldLogin } = await prompts({
-                        type: 'confirm',
-                        name: 'shouldLogin',
-                        message: 'You need to be logged in to install components. Log in now?',
-                        initial: true,
+                    // Resolve paths - include component-specific subfolder
+                    const basePath = resolveComponentsPath(addOptions.path, cwd);
+                    const componentFolderName = sanitizeComponentFolderName(componentData.name);
+                    const componentsPath = path.join(basePath, componentFolderName);
+                    const utilsPath = resolveUtilsPath(cwd);
+                    logger.debug({
+                        basePath,
+                        componentFolderName,
+                        componentsPath,
+                        utilsPath,
                     });
-                    if (!shouldLogin) {
-                        console.log('Installation cancelled.');
-                        return;
+                    // Step 2: Check for existing files
+                    const existingFiles = checkExistingFiles(componentData.files, componentsPath);
+                    if (existingFiles.length > 0 && !addOptions.overwrite) {
+                        if (!json) {
+                            console.log('\nThe following files already exist:');
+                            existingFiles.forEach((file) => console.log(`  - ${file}`));
+                        }
+                        if (!addOptions.yes) {
+                            const { shouldOverwrite } = await prompts({
+                                type: 'confirm',
+                                name: 'shouldOverwrite',
+                                message: 'Do you want to overwrite these files?',
+                                initial: false,
+                            });
+                            if (!shouldOverwrite) {
+                                console.log('Installation cancelled.');
+                                return;
+                            }
+                        }
+                        else {
+                            if (isBatch) {
+                                if (!json)
+                                    console.log(`  ⚠️  Skipping "${componentData.name}": files already exist. Use --overwrite.`);
+                                batchResults.push({
+                                    component: componentData.name,
+                                    generatedName: componentData.generatedName,
+                                    filesWritten: [],
+                                    dependenciesInstalled: [],
+                                    dryRun: addOptions.dryRun,
+                                    error: 'Files already exist. Use --overwrite to replace.',
+                                });
+                                continue;
+                            }
+                            if (json) {
+                                throw new MagicPathError(`Files already exist: ${existingFiles.join(', ')}. Use --overwrite to replace.`, {
+                                    code: 'FILES_EXIST',
+                                    suggestion: 'Pass `--overwrite` to replace existing files.',
+                                });
+                            }
+                            console.log('Use --overwrite to replace existing files.');
+                            return;
+                        }
                     }
-                    const loggedIn = await runLoginFlow();
-                    if (!loggedIn) {
-                        console.log('Installation cancelled.');
-                        return;
+                    // Step 3: Confirm installation (unless --yes flag)
+                    if (!addOptions.yes && existingFiles.length === 0) {
+                        console.log(`\nThis will install:`);
+                        console.log(`  Component: ${componentData.name}`);
+                        console.log(`  Files: ${componentData.files.length} file(s) to ${path.relative(cwd, componentsPath) || '.'}`);
+                        console.log(`  Dependencies: ${componentData.dependencies.length} package(s)`);
+                        const { shouldProceed } = await prompts({
+                            type: 'confirm',
+                            name: 'shouldProceed',
+                            message: 'Proceed with installation?',
+                            initial: true,
+                        });
+                        if (!shouldProceed) {
+                            console.log('Installation cancelled.');
+                            return;
+                        }
                     }
-                    // Retry fetch after login
-                    const retrySpinner = brandSpinner(`Fetching component "${generatedName}"...`).start();
-                    try {
-                        componentData = await fetchComponent(generatedName);
-                        retrySpinner.succeed(`Found component: ${componentData.name}`);
+                    // Build result data for JSON output
+                    const filesWritten = componentData.files.map((f) => path.relative(cwd, path.join(componentsPath, f.path)));
+                    // Extract import info
+                    const mainFile = componentData.files[0];
+                    let importStatement;
+                    let usageStr;
+                    if (mainFile) {
+                        const fileName = mainFile.name.replace(/\.tsx?$/, '');
+                        const importPath = addOptions.path
+                            ? `@/${addOptions.path}/${componentFolderName}/${fileName}`
+                            : `@/components/magicpath/${componentFolderName}/${fileName}`;
+                        const exportInfo = extractComponentExports(mainFile.content);
+                        if (exportInfo) {
+                            importStatement = generateImportStatement(exportInfo, importPath);
+                            usageStr = generateUsageExample(exportInfo);
+                        }
+                        else {
+                            importStatement = `import { ${fileName} } from '${importPath}';`;
+                        }
                     }
-                    catch (retryErr) {
-                        retrySpinner.fail('Failed to fetch component');
-                        if (retryErr instanceof MagicPathError) {
-                            throw retryErr;
+                    // Dry run: return what would happen without writing
+                    if (addOptions.dryRun) {
+                        const fileContents = addOptions.inspect || json
+                            ? componentData.files.map((f) => ({
+                                path: f.path,
+                                name: f.name,
+                                content: f.content,
+                            }))
+                            : undefined;
+                        if (!isBatch && json) {
+                            jsonResult({
+                                component: componentData.name,
+                                generatedName: componentData.generatedName,
+                                filesWritten,
+                                files: fileContents,
+                                dependenciesInstalled: componentData.dependencies,
+                                importStatement,
+                                usage: usageStr,
+                                dryRun: true,
+                            });
                         }
-                        throw new MagicPathError('Something went wrong!');
+                        batchResults.push({
+                            component: componentData.name,
+                            generatedName: componentData.generatedName,
+                            filesWritten,
+                            dependenciesInstalled: componentData.dependencies,
+                            importStatement,
+                            usage: usageStr,
+                            dryRun: true,
+                        });
+                        if (!json) {
+                            console.log('\n[Dry run] Would install:');
+                            console.log(`  Component: ${componentData.name}`);
+                            console.log(`  Files: ${filesWritten.join(', ')}`);
+                            console.log(`  Dependencies: ${componentData.dependencies.join(', ') || 'none'}`);
+                            if (importStatement)
+                                console.log(`  Import: ${importStatement}`);
+                            // --inspect: show file contents
+                            if (addOptions.inspect) {
+                                for (const f of componentData.files) {
+                                    console.log(`\n${'─'.repeat(60)}`);
+                                    console.log(`  ${f.path}`);
+                                    console.log(`${'─'.repeat(60)}`);
+                                    console.log(f.content);
+                                }
+                            }
+                        }
+                        continue;
                     }
-                }
-                else {
-                    fetchSpinner?.fail('Failed to fetch component');
-                    if (err instanceof MagicPathError) {
-                        throw err;
+                    // Step 4: Write component files
+                    const writeSpinner = json
+                        ? null
+                        : brandSpinner('Writing component files...').start();
+                    try {
+                        writeComponentFiles(componentData.files, componentsPath, true);
+                        writeSpinner?.succeed(`Wrote ${componentData.files.length} file(s) to ${path.relative(cwd, componentsPath) || '.'}`);
                     }
-                    throw new MagicPathError('Something went wrong!');
-                }
-            }
-            // Resolve paths - include component-specific subfolder
-            const basePath = resolveComponentsPath(addOptions.path, cwd);
-            const componentFolderName = sanitizeComponentFolderName(componentData.name);
-            const componentsPath = path.join(basePath, componentFolderName);
-            const utilsPath = resolveUtilsPath(cwd);
-            logger.debug({
-                basePath,
-                componentFolderName,
-                componentsPath,
-                utilsPath,
-            });
-            // Step 2: Check for existing files
-            const existingFiles = checkExistingFiles(componentData.files, componentsPath);
-            if (existingFiles.length > 0 && !addOptions.overwrite) {
-                if (!json) {
-                    console.log('\nThe following files already exist:');
-                    existingFiles.forEach((file) => console.log(`  - ${file}`));
-                }
-                if (!addOptions.yes) {
-                    const { shouldOverwrite } = await prompts({
-                        type: 'confirm',
-                        name: 'shouldOverwrite',
-                        message: 'Do you want to overwrite these files?',
-                        initial: false,
-                    });
-                    if (!shouldOverwrite) {
-                        console.log('Installation cancelled.');
-                        return;
+                    catch (err) {
+                        writeSpinner?.fail('Failed to write component files');
+                        if (isBatch) {
+                            batchResults.push({
+                                component: componentData.name,
+                                generatedName: componentData.generatedName,
+                                filesWritten: [],
+                                dependenciesInstalled: [],
+                                dryRun: false,
+                                error: 'Failed to write component files.',
+                            });
+                            continue;
+                        }
+                        throw new MagicPathError('Failed to write component files. Please check permissions and try again.');
                     }
-                }
-                else {
-                    if (json) {
-                        throw new MagicPathError(`Files already exist: ${existingFiles.join(', ')}. Use --overwrite to replace.`, {
-                            code: 'FILES_EXIST',
-                            suggestion: 'Pass `--overwrite` to replace existing files.',
-                        });
+                    // Step 5: Install utils if needed
+                    const utilsExists = checkUtilsExists(utilsPath);
+                    if (!utilsExists && componentData.utils.content) {
+                        const utilsSpinner = json
+                            ? null
+                            : brandSpinner('Installing utilities...').start();
+                        try {
+                            writeUtilsFile(componentData.utils.content, utilsPath);
+                            utilsSpinner?.succeed(`Wrote utils.ts to ${path.relative(cwd, utilsPath) || '.'}`);
+                        }
+                        catch (err) {
+                            utilsSpinner?.fail('Failed to write utils file');
+                            logger.debug({ err });
+                            if (!json) {
+                                console.log('  Warning: Could not write utils.ts. You may need to create it manually.');
+                            }
+                        }
                     }
-                    console.log('Use --overwrite to replace existing files.');
-                    return;
-                }
-            }
-            // Step 3: Confirm installation (unless --yes flag)
-            if (!addOptions.yes && existingFiles.length === 0) {
-                console.log(`\nThis will install:`);
-                console.log(`  Component: ${componentData.name}`);
-                console.log(`  Files: ${componentData.files.length} file(s) to ${path.relative(cwd, componentsPath) || '.'}`);
-                console.log(`  Dependencies: ${componentData.dependencies.length} package(s)`);
-                const { shouldProceed } = await prompts({
-                    type: 'confirm',
-                    name: 'shouldProceed',
-                    message: 'Proceed with installation?',
-                    initial: true,
-                });
-                if (!shouldProceed) {
-                    console.log('Installation cancelled.');
-                    return;
-                }
-            }
-            // Build result data for JSON output
-            const filesWritten = componentData.files.map((f) => path.relative(cwd, path.join(componentsPath, f.path)));
-            // Extract import info
-            const mainFile = componentData.files[0];
-            let importStatement;
-            let usageStr;
-            if (mainFile) {
-                const fileName = mainFile.name.replace(/\.tsx?$/, '');
-                const importPath = addOptions.path
-                    ? `@/${addOptions.path}/${componentFolderName}/${fileName}`
-                    : `@/components/magicpath/${componentFolderName}/${fileName}`;
-                const exportInfo = extractComponentExports(mainFile.content);
-                if (exportInfo) {
-                    importStatement = generateImportStatement(exportInfo, importPath);
-                    usageStr = generateUsageExample(exportInfo);
-                }
-                else {
-                    importStatement = `import { ${fileName} } from '${importPath}';`;
-                }
-            }
-            // Dry run: return what would happen without writing
-            if (addOptions.dryRun) {
-                const fileContents = addOptions.inspect || json
-                    ? componentData.files.map((f) => ({
-                        path: f.path,
-                        name: f.name,
-                        content: f.content,
-                    }))
-                    : undefined;
-                if (json) {
-                    jsonResult({
+                    // Step 6: Install dependencies
+                    const installedDeps = [];
+                    if (componentData.dependencies.length > 0) {
+                        try {
+                            const { installed, skipped } = installPackages(componentData.dependencies, cwd);
+                            installedDeps.push(...installed);
+                            if (skipped.length > 0) {
+                                logger.debug({
+                                    message: 'Skipped already installed packages',
+                                    skipped,
+                                });
+                            }
+                        }
+                        catch (err) {
+                            if (err instanceof MagicPathError) {
+                                if (!json)
+                                    console.log(`\n⚠️  ${err.message}`);
+                            }
+                        }
+                    }
+                    batchResults.push({
                         component: componentData.name,
                         generatedName: componentData.generatedName,
                         filesWritten,
-                        files: fileContents,
-                        dependenciesInstalled: componentData.dependencies,
+                        dependenciesInstalled: installedDeps,
                         importStatement,
                         usage: usageStr,
-                        dryRun: true,
+                        dryRun: false,
                     });
-                }
-                console.log('\n[Dry run] Would install:');
-                console.log(`  Component: ${componentData.name}`);
-                console.log(`  Files: ${filesWritten.join(', ')}`);
-                console.log(`  Dependencies: ${componentData.dependencies.join(', ') || 'none'}`);
-                if (importStatement)
-                    console.log(`  Import: ${importStatement}`);
-                // --inspect: show file contents
-                if (addOptions.inspect) {
-                    for (const f of componentData.files) {
-                        console.log(`\n${'─'.repeat(60)}`);
-                        console.log(`  ${f.path}`);
-                        console.log(`${'─'.repeat(60)}`);
-                        console.log(f.content);
+                    // Single-component JSON output (non-batch)
+                    if (!isBatch && json) {
+                        jsonResult({
+                            component: componentData.name,
+                            generatedName: componentData.generatedName,
+                            filesWritten,
+                            dependenciesInstalled: installedDeps,
+                            importStatement,
+                            usage: usageStr,
+                            dryRun: false,
+                        });
                     }
-                }
-                return;
-            }
-            // Step 4: Write component files
-            const writeSpinner = json
-                ? null
-                : brandSpinner('Writing component files...').start();
-            try {
-                writeComponentFiles(componentData.files, componentsPath, true);
-                writeSpinner?.succeed(`Wrote ${componentData.files.length} file(s) to ${path.relative(cwd, componentsPath) || '.'}`);
-            }
-            catch (err) {
-                writeSpinner?.fail('Failed to write component files');
-                throw new MagicPathError('Failed to write component files. Please check permissions and try again.');
-            }
-            // Step 5: Install utils if needed
-            const utilsExists = checkUtilsExists(utilsPath);
-            if (!utilsExists && componentData.utils.content) {
-                const utilsSpinner = json
-                    ? null
-                    : brandSpinner('Installing utilities...').start();
-                try {
-                    writeUtilsFile(componentData.utils.content, utilsPath);
-                    utilsSpinner?.succeed(`Wrote utils.ts to ${path.relative(cwd, utilsPath) || '.'}`);
-                }
-                catch (err) {
-                    utilsSpinner?.fail('Failed to write utils file');
-                    logger.debug({ err });
+                    // Step 7: Show success message and write usage file
                     if (!json) {
-                        console.log('  Warning: Could not write utils.ts. You may need to create it manually.');
+                        console.log(`\n✅ Successfully added "${componentData.name}" to your project!`);
+                        if (!isBatch) {
+                            console.log(`\nUsage:`);
+                        }
                     }
-                }
-            }
-            // Step 6: Install dependencies
-            const installedDeps = [];
-            if (componentData.dependencies.length > 0) {
-                try {
-                    const { installed, skipped } = installPackages(componentData.dependencies, cwd);
-                    installedDeps.push(...installed);
-                    if (skipped.length > 0) {
-                        logger.debug({
-                            message: 'Skipped already installed packages',
-                            skipped,
-                        });
+                    if (mainFile) {
+                        const fileName = mainFile.name.replace(/\.tsx?$/, '');
+                        const importPath = addOptions.path
+                            ? `@/${addOptions.path}/${componentFolderName}/${fileName}`
+                            : `@/components/magicpath/${componentFolderName}/${fileName}`;
+                        const exportInfo = extractComponentExports(mainFile.content);
+                        if (!isBatch && !json) {
+                            if (exportInfo) {
+                                console.log(`  ${generateImportStatement(exportInfo, importPath)}`);
+                                console.log('');
+                                console.log(`  ${generateUsageExample(exportInfo)}`);
+                                if (exportInfo.requiredProps.length > 0) {
+                                    console.log('');
+                                    console.log(`  Required props: ${exportInfo.requiredProps.join(', ')}`);
+                                }
+                            }
+                            else {
+                                console.log(`  import { ${fileName} } from '${importPath}';`);
+                            }
+                        }
+                        try {
+                            writeUsageFile(componentsPath, {
+                                componentName: componentData.name,
+                                importPath,
+                                exportInfo,
+                                fileName,
+                            });
+                            if (!isBatch && !json) {
+                                console.log(`\n📄 Usage documentation written to ${path.relative(cwd, path.join(componentsPath, 'usage.md'))}`);
+                            }
+                        }
+                        catch (err) {
+                            logger.debug({ err });
+                        }
                     }
                 }
                 catch (err) {
-                    if (err instanceof MagicPathError) {
+                    // In batch mode, record error and continue
+                    if (isBatch) {
+                        const errMsg = err instanceof Error ? err.message : String(err);
+                        batchResults.push({
+                            component: generatedName,
+                            generatedName,
+                            filesWritten: [],
+                            dependenciesInstalled: [],
+                            dryRun: addOptions.dryRun,
+                            error: errMsg,
+                        });
                         if (!json)
-                            console.log(`\n⚠️  ${err.message}`);
+                            console.log(`  ⚠️  Failed "${generatedName}": ${errMsg}`);
+                        continue;
                     }
+                    throw err;
                 }
             }
-            // JSON output
-            if (json) {
-                jsonResult({
-                    component: componentData.name,
-                    generatedName: componentData.generatedName,
-                    filesWritten,
-                    dependenciesInstalled: installedDeps,
-                    importStatement,
-                    usage: usageStr,
-                    dryRun: false,
-                });
-            }
-            // Step 7: Show success message and write usage file
-            console.log(`\n✅ Successfully added "${componentData.name}" to your project!`);
-            console.log(`\nUsage:`);
-            if (mainFile) {
-                const fileName = mainFile.name.replace(/\.tsx?$/, '');
-                const importPath = addOptions.path
-                    ? `@/${addOptions.path}/${componentFolderName}/${fileName}`
-                    : `@/components/magicpath/${componentFolderName}/${fileName}`;
-                const exportInfo = extractComponentExports(mainFile.content);
-                if (exportInfo) {
-                    console.log(`  ${generateImportStatement(exportInfo, importPath)}`);
-                    console.log('');
-                    console.log(`  ${generateUsageExample(exportInfo)}`);
-                    if (exportInfo.requiredProps.length > 0) {
-                        console.log('');
-                        console.log(`  Required props: ${exportInfo.requiredProps.join(', ')}`);
-                    }
-                }
-                else {
-                    console.log(`  import { ${fileName} } from '${importPath}';`);
-                }
-                try {
-                    writeUsageFile(componentsPath, {
-                        componentName: componentData.name,
-                        importPath,
-                        exportInfo,
-                        fileName,
+            // Batch summary
+            if (isBatch) {
+                if (json) {
+                    jsonResult({
+                        results: batchResults,
+                        total: batchResults.length,
+                        succeeded: batchResults.filter((r) => !r.error).length,
+                        failed: batchResults.filter((r) => r.error).length,
                     });
-                    console.log(`\n📄 Usage documentation written to ${path.relative(cwd, path.join(componentsPath, 'usage.md'))}`);
                 }
-                catch (err) {
-                    logger.debug({ err });
+                const succeeded = batchResults.filter((r) => !r.error);
+                const failed = batchResults.filter((r) => r.error);
+                console.log(`\n  ${succeeded.length} of ${batchResults.length} component(s) added successfully.`);
+                if (failed.length > 0) {
+                    console.log(`  ${failed.length} failed: ${failed.map((f) => f.generatedName).join(', ')}`);
                 }
             }
         }