@magentrix-corp/magentrix-cli 1.2.0 → 1.3.0

package/actions/iris/dev.js

@@ -0,0 +1,338 @@
+import chalk from 'chalk';
+import { select, input } from '@inquirer/prompts';
+import { spawn } from 'node:child_process';
+import { existsSync } from 'node:fs';
+import { resolve } from 'node:path';
+import {
+    readVueConfig,
+    formatMissingConfigError,
+    formatConfigErrors,
+    findConfigFile,
+    backupConfigFile,
+    restoreConfigFile,
+    injectAssetsIntoConfig
+} from '../../utils/iris/config-reader.js';
+import { getIrisAssets } from '../../utils/magentrix/api/iris.js';
+import {
+    getLinkedProjectsWithStatus,
+    buildProjectChoices
+} from '../../utils/iris/linker.js';
+import { ensureValidCredentials } from '../../utils/cli/helpers/ensureCredentials.js';
+
+/**
+ * iris-dev command - Start Vue dev server with platform assets injected.
+ *
+ * Options:
+ *   --path <dir>      Specify Vue project path
+ *   --no-inject       Skip asset injection, just run dev server
+ *   --restore         Restore config.ts from backup without running
+ */
+export const irisDev = async (options = {}) => {
+    process.stdout.write('\x1Bc'); // Clear console
+
+    const { path: pathOption, inject = true, restore } = options;
+
+    // Handle --restore option
+    if (restore) {
+        await handleRestore(pathOption);
+        return;
+    }
+
+    // Determine which project to use
+    let projectPath = pathOption;
+    let vueConfig = null;
+
+    if (projectPath) {
+        projectPath = resolve(projectPath);
+
+        if (!existsSync(projectPath)) {
+            console.log(chalk.red(`Error: Path does not exist: ${projectPath}`));
+            return;
+        }
+
+        vueConfig = readVueConfig(projectPath);
+    } else {
+        // Try current directory first
+        const cwdConfig = readVueConfig(process.cwd());
+        if (cwdConfig.found && cwdConfig.errors.length === 0) {
+            projectPath = process.cwd();
+            vueConfig = cwdConfig;
+            console.log(chalk.gray(`Using current directory: ${projectPath}`));
+        } else {
+            // Prompt user to select a project
+            const result = await selectProject();
+            if (!result) return;
+
+            projectPath = result.path;
+            vueConfig = result.config;
+        }
+    }
+
+    // Validate Vue config
+    if (!vueConfig.found) {
+        console.log(chalk.red(formatMissingConfigError(projectPath)));
+        return;
+    }
+
+    if (vueConfig.errors.length > 0) {
+        console.log(chalk.red(formatConfigErrors(vueConfig)));
+        return;
+    }
+
+    const { slug, appName, siteUrl } = vueConfig;
+    const configPath = findConfigFile(projectPath);
+
+    console.log(chalk.blue('\nIris Development Server'));
+    console.log(chalk.gray('─'.repeat(48)));
+    console.log(chalk.white(`  Project: ${chalk.cyan(appName)} (${slug})`));
+    console.log(chalk.white(`  Path: ${chalk.gray(projectPath)}`));
+    if (siteUrl) {
+        console.log(chalk.white(`  Site: ${chalk.gray(siteUrl)}`));
+    }
+    console.log();
+
+    let backupPath = null;
+    let assetsInjected = false;
+
+    // Inject assets if enabled
+    if (inject && siteUrl) {
+        console.log(chalk.blue('Fetching platform assets...'));
+
+        try {
+            // Get credentials for API call
+            const { instanceUrl, token } = await ensureValidCredentials();
+
+            // Use siteUrl from config if different from instanceUrl
+            const targetUrl = siteUrl || instanceUrl;
+
+            const assetsResult = await getIrisAssets(targetUrl, token.value);
+
+            if (assetsResult.success && assetsResult.assets?.length > 0) {
+                console.log(chalk.green(`\u2713 Found ${assetsResult.assets.length} platform assets`));
+
+                // Backup config file
+                console.log(chalk.blue('Backing up config.ts...'));
+                backupPath = backupConfigFile(configPath);
+                console.log(chalk.green(`\u2713 Backup created: ${backupPath}`));
+
+                // Inject assets
+                console.log(chalk.blue('Injecting assets into config.ts...'));
+                const injected = injectAssetsIntoConfig(configPath, assetsResult.assets);
+
+                if (injected) {
+                    assetsInjected = true;
+                    console.log(chalk.green('\u2713 Assets injected'));
+                } else {
+                    console.log(chalk.yellow('Warning: Could not inject assets. Continuing without injection.'));
+                }
+            } else if (assetsResult.error) {
+                console.log(chalk.yellow(`Warning: Could not fetch assets: ${assetsResult.error}`));
+                console.log(chalk.gray('Continuing without asset injection.'));
+            } else {
+                console.log(chalk.yellow('No platform assets found.'));
+            }
+        } catch (err) {
+            console.log(chalk.yellow(`Warning: Error fetching assets: ${err.message}`));
+            console.log(chalk.gray('Continuing without asset injection.'));
+        }
+    } else if (!inject) {
+        console.log(chalk.gray('Skipping asset injection (--no-inject)'));
+    } else if (!siteUrl) {
+        console.log(chalk.yellow('Warning: No siteUrl in config.ts. Cannot fetch platform assets.'));
+    }
+
+    // Start dev server
+    console.log();
+    console.log(chalk.blue('Starting development server...'));
+    console.log(chalk.gray('Press Ctrl+C to stop'));
+    console.log();
+
+    await runDevServer(projectPath, configPath, backupPath, assetsInjected);
+};
+
+/**
+ * Run the Vue development server.
+ */
+async function runDevServer(projectPath, configPath, backupPath, assetsInjected) {
+    return new Promise((resolvePromise) => {
+        const npmCmd = process.platform === 'win32' ? 'npm.cmd' : 'npm';
+
+        const child = spawn(npmCmd, ['run', 'dev'], {
+            cwd: projectPath,
+            stdio: 'inherit',
+            shell: false
+        });
+
+        // Handle cleanup on exit
+        const cleanup = () => {
+            if (assetsInjected && backupPath) {
+                console.log();
+                console.log(chalk.blue('Restoring config.ts from backup...'));
+                const restored = restoreConfigFile(configPath);
+                if (restored) {
+                    console.log(chalk.green('\u2713 config.ts restored'));
+                } else {
+                    console.log(chalk.yellow('Warning: Could not restore config.ts'));
+                    console.log(chalk.gray(`Backup is at: ${backupPath}`));
+                }
+            }
+        };
+
+        // Handle process signals
+        process.on('SIGINT', () => {
+            cleanup();
+            child.kill('SIGINT');
+        });
+
+        process.on('SIGTERM', () => {
+            cleanup();
+            child.kill('SIGTERM');
+        });
+
+        child.on('close', (code) => {
+            // If dev server exited with error, show helpful context first
+            if (code !== 0 && code !== null) {
+                console.log();
+                console.log(chalk.bgYellow.black(' External Process Error '));
+                console.log(chalk.yellow('─'.repeat(48)));
+                console.log(chalk.white('The Vue dev server exited with an error.'));
+                console.log(chalk.gray('This is NOT a MagentrixCLI issue.'));
+                console.log();
+                console.log(chalk.white('Common causes:'));
+                console.log(chalk.gray('  • Permission issues in node_modules/'));
+                console.log(chalk.gray('  • Missing dependencies (run npm install)'));
+                console.log(chalk.gray('  • Port already in use'));
+                console.log(chalk.gray('  • Syntax errors in project files'));
+                console.log();
+                console.log(chalk.white('If you see EACCES/permission errors, try:'));
+                console.log(chalk.cyan(`  sudo chown -R $(whoami) "${projectPath}/node_modules"`));
+                console.log(chalk.yellow('─'.repeat(48)));
+            }
+
+            // Cleanup after showing error context
+            cleanup();
+
+            resolvePromise(code);
+        });
+
+        child.on('error', (err) => {
+            console.log(chalk.red(`Failed to start dev server: ${err.message}`));
+            cleanup();
+            resolvePromise(1);
+        });
+    });
+}
+
+/**
+ * Handle --restore option.
+ */
+async function handleRestore(pathOption) {
+    let projectPath = pathOption;
+
+    if (!projectPath) {
+        // Try current directory
+        const cwdConfig = readVueConfig(process.cwd());
+        if (cwdConfig.found) {
+            projectPath = process.cwd();
+        } else {
+            console.log(chalk.red('No Vue project found in current directory.'));
+            console.log(chalk.gray('Use --path to specify the project path.'));
+            return;
+        }
+    }
+
+    projectPath = resolve(projectPath);
+    const configPath = findConfigFile(projectPath);
+
+    if (!configPath) {
+        console.log(chalk.red('No config.ts found in project.'));
+        return;
+    }
+
+    console.log(chalk.blue('Restoring config.ts from backup...'));
+
+    const restored = restoreConfigFile(configPath);
+
+    if (restored) {
+        console.log(chalk.green('\u2713 config.ts restored from backup'));
+    } else {
+        console.log(chalk.yellow('No backup file found.'));
+        console.log(chalk.gray(`Expected backup at: ${configPath}.bak`));
+    }
+}
+
+/**
+ * Prompt user to select a project.
+ */
+async function selectProject() {
+    const projectsWithStatus = getLinkedProjectsWithStatus();
+
+    // Check if CWD is a Vue project (and not already linked)
+    const cwdConfig = readVueConfig(process.cwd());
+    const inVueProject = cwdConfig.found && cwdConfig.errors.length === 0;
+    const cwdAlreadyLinked = projectsWithStatus.some(p =>
+        resolve(p.path) === resolve(process.cwd())
+    );
+
+    // Build choices using the helper
+    const choices = buildProjectChoices({
+        includeManual: true,
+        includeCancel: true,
+        showInvalid: true
+    });
+
+    // If CWD is a valid Vue project and not linked, add it at the top
+    if (inVueProject && !cwdAlreadyLinked) {
+        choices.unshift({
+            name: `${cwdConfig.appName} (${cwdConfig.slug}) - Current directory (not linked)`,
+            value: { type: 'cwd', path: process.cwd() }
+        });
+    }
+
+    // Check if we have any projects to show
+    const hasProjects = choices.some(c => c.value?.type === 'linked' || c.value?.type === 'cwd');
+
+    if (!hasProjects) {
+        console.log(chalk.yellow('No linked Vue projects found.'));
+        console.log();
+        console.log(chalk.gray('To get started:'));
+        console.log(chalk.white(`  1. Link a Vue project: ${chalk.cyan('magentrix iris-link')}`));
+        console.log(chalk.white(`  2. Or specify path: ${chalk.cyan('magentrix iris-dev --path /path/to/vue-project')}`));
+        console.log();
+    }
+
+    const choice = await select({
+        message: 'Which project do you want to run?',
+        choices
+    });
+
+    if (choice.type === 'cancel') {
+        console.log(chalk.gray('Cancelled.'));
+        return null;
+    }
+
+    if (choice.type === 'manual') {
+        const manualPath = await input({
+            message: 'Enter the path to your Vue project:',
+            validate: (value) => {
+                if (!value.trim()) {
+                    return 'Path is required';
+                }
+                const resolved = resolve(value);
+                if (!existsSync(resolved)) {
+                    return `Path does not exist: ${resolved}`;
+                }
+                return true;
+            }
+        });
+
+        const config = readVueConfig(resolve(manualPath));
+        return { path: resolve(manualPath), config };
+    }
+
+    // Linked project or CWD
+    const config = readVueConfig(choice.path);
+    return { path: choice.path, config };
+}
+
+export default irisDev;

package/actions/iris/index.js

@@ -0,0 +1,6 @@
+// Iris Vue.js App Management Commands
+export { irisLink } from './link.js';
+export { irisDev } from './dev.js';
+export { irisDelete } from './delete.js';
+export { irisRecover } from './recover.js';
+export { vueBuildStage } from './buildStage.js';