@magentrix-corp/magentrix-cli 1.3.1 → 1.3.3

package/README.md

@@ -480,7 +480,7 @@ magentrix iris-link
 - `--cleanup` - Remove invalid (non-existent) linked projects
 
 **Menu options:**
-- Link a new Vue project
+- Link a Vue project
 - View all linked projects
 - Unlink a project
 - Cleanup invalid projects
@@ -510,13 +510,13 @@ magentrix iris-dev
 **Options:**
 - `--path <dir>` - Specify Vue project path
 - `--no-inject` - Skip asset injection, just run dev server
-- `--restore` - Restore config.ts from backup without running
+- `--restore` - Restore `.env.development` from backup without running
 
 **Process:**
 1. Fetch platform assets from Magentrix
-2. Backup `config.ts` and inject assets
+2. Backup `.env.development` and inject assets
 3. Run `npm run dev`
-4. Restore `config.ts` on exit (Ctrl+C)
+4. Restore `.env.development` on exit (Ctrl+C)
 
 #### Delete an Iris App
 ```bash
@@ -558,22 +558,33 @@ magentrix iris-recover
 
 ### Vue Project Requirements
 
-Your Vue project must have a `config.ts` file with these required fields:
+Your Vue project needs two configuration files:
+
+**1. `config.ts`** - App metadata (required):
 
 ```typescript
 // src/config.ts
 export const config = {
-  appPath: "my-app",           // App identifier (folder name on server)
-  appName: "My Application",   // Display name in navigation menu
-  siteUrl: "https://yourinstance.magentrix.com",
-  assets: []  // Injected automatically by iris-dev
+  appPath: "my-app",           // Required: App identifier (folder name on server)
+  appName: "My Application",   // Required: Display name in navigation menu
+  appDescription: "",          // Optional: App description
+  appIconId: "",               // Optional: App icon ID
 }
 ```
 
-**Accepted field names:**
+**2. `.env.development`** - Environment variables:
+
+```bash
+VITE_SITE_URL = https://yourinstance.magentrix.com
+VITE_REFRESH_TOKEN = your-api-key
+VITE_ASSETS = '[]'  # Injected automatically by iris-dev
+```
+
+**Accepted field names in config.ts:**
 - Slug: `appPath`, `slug`, or `app_path`
 - Name: `appName`, `app_name`, or `name`
-- URL: `siteUrl`, `site_url`, `baseUrl`, or `base_url`
+- Description: `appDescription` or `app_description`
+- Icon: `appIconId` or `app_icon_id`
 
 ### Typical Development Workflow
 
@@ -639,14 +650,22 @@ cd ~/magentrix-workspace
 magentrix vue-build-stage --path ~/my-vue-app  # ✓ Works!
 ```
 
-#### "Missing required field: slug"
+#### "Missing required field in config.ts: slug (appPath)"
 Your Vue project's `config.ts` is missing the app identifier. Add an `appPath` or `slug` field.
 
-#### "Missing required field: appName"
+#### "Missing required field in config.ts: appName"
 Your Vue project's `config.ts` is missing the display name. Add an `appName` field.
 
-#### Build fails with "VITE_SITE_URL is not defined"
-This is a Vue project configuration issue, not a CLI issue. Check your Vue project's `.env` file or `vite.config.ts` for missing environment variables.
+#### "VITE_SITE_URL not set in .env.development"
+Create a `.env.development` file in your Vue project with `VITE_SITE_URL = https://yourinstance.magentrix.com`.
+
+#### "No .env.development file found"
+The CLI requires a `.env.development` file for environment variables. Create one with:
+```bash
+VITE_SITE_URL = https://yourinstance.magentrix.com
+VITE_REFRESH_TOKEN = your-api-key
+VITE_ASSETS = '[]'
+```
 
 #### "No config.ts found"
 The CLI looks for config in these locations:

package/actions/iris/dev.js

@@ -7,25 +7,28 @@ import {
     readVueConfig,
     formatMissingConfigError,
     formatConfigErrors,
-    findConfigFile,
-    backupConfigFile,
-    restoreConfigFile,
-    injectAssetsIntoConfig
+    backupFile,
+    restoreFile,
+    injectAssets,
+    getInjectionTarget
 } from '../../utils/iris/config-reader.js';
 import { getIrisAssets } from '../../utils/magentrix/api/iris.js';
+import { getAccessToken } from '../../utils/magentrix/api/auth.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.
  *
+ * Assets are injected into .env.development (if exists) or config.ts.
+ * The modified file is backed up and restored when the dev server exits.
+ *
  * Options:
  *   --path <dir>      Specify Vue project path
  *   --no-inject       Skip asset injection, just run dev server
- *   --restore         Restore config.ts from backup without running
+ *   --restore         Restore .env.development or config.ts from backup
  */
 export const irisDev = async (options = {}) => {
     process.stdout.write('\x1Bc'); // Clear console
@@ -80,7 +83,6 @@ export const irisDev = async (options = {}) => {
     }
 
     const { slug, appName, siteUrl } = vueConfig;
-    const configPath = findConfigFile(projectPath);
 
     console.log(chalk.blue('\nIris Development Server'));
     console.log(chalk.gray('─'.repeat(48)));
@@ -93,52 +95,68 @@ export const irisDev = async (options = {}) => {
 
     let backupPath = null;
     let assetsInjected = false;
+    let modifiedFilePath = null;
+    let modifiedFileName = null;
 
     // 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'));
+        // Check if we have the refresh token for authentication
+        if (!vueConfig.refreshToken) {
+            console.log(chalk.yellow('Warning: VITE_REFRESH_TOKEN not set in .env.development'));
+            console.log(chalk.gray('Asset injection requires authentication. Continuing without assets.'));
+        } else {
+            console.log(chalk.blue('Fetching platform assets...'));
+
+            try {
+                // Get access token using the refresh token from .env.development
+                const tokenData = await getAccessToken(vueConfig.refreshToken, siteUrl);
+                const assetsResult = await getIrisAssets(siteUrl, tokenData.token);
+
+                if (assetsResult.success && assetsResult.assets?.length > 0) {
+                    console.log(chalk.green(`\u2713 Found ${assetsResult.assets.length} platform assets`));
+
+                    // Determine which file will be modified
+                    const { targetFile, targetName } = getInjectionTarget(projectPath);
+
+                    if (!targetFile) {
+                        console.log(chalk.yellow('Warning: No .env.development file found. Cannot inject assets.'));
+                        console.log(chalk.gray('Create a .env.development file to enable asset injection.'));
+                    } else {
+                        modifiedFilePath = targetFile;
+                        modifiedFileName = targetName;
+
+                        // Backup before modifying
+                        console.log(chalk.blue(`Backing up ${modifiedFileName}...`));
+                        backupPath = backupFile(modifiedFilePath);
+                        console.log(chalk.green(`\u2713 Backup created`));
+
+                        // Inject assets
+                        console.log(chalk.blue('Injecting assets...'));
+                        const injectResult = injectAssets(projectPath, assetsResult.assets);
+
+                        if (injectResult.success) {
+                            assetsInjected = true;
+                            console.log(chalk.green(`\u2713 Assets injected into ${injectResult.targetName}`));
+                        } 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('Warning: Could not inject assets. Continuing without injection.'));
+                    console.log(chalk.yellow('No platform assets found.'));
                 }
-            } else if (assetsResult.error) {
-                console.log(chalk.yellow(`Warning: Could not fetch assets: ${assetsResult.error}`));
+            } catch (err) {
+                console.log(chalk.yellow(`Warning: Error fetching assets: ${err.message}`));
                 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.'));
+        console.log(chalk.yellow('Warning: No siteUrl found. Cannot fetch platform assets.'));
+        console.log(chalk.gray('Set VITE_SITE_URL in .env.development'));
     }
 
     // Start dev server
@@ -147,13 +165,13 @@ export const irisDev = async (options = {}) => {
     console.log(chalk.gray('Press Ctrl+C to stop'));
     console.log();
 
-    await runDevServer(projectPath, configPath, backupPath, assetsInjected);
+    await runDevServer(projectPath, modifiedFilePath, modifiedFileName, backupPath, assetsInjected);
 };
 
 /**
  * Run the Vue development server.
  */
-async function runDevServer(projectPath, configPath, backupPath, assetsInjected) {
+async function runDevServer(projectPath, modifiedFilePath, modifiedFileName, backupPath, assetsInjected) {
     return new Promise((resolvePromise) => {
         const npmCmd = process.platform === 'win32' ? 'npm.cmd' : 'npm';
 
@@ -165,14 +183,14 @@ async function runDevServer(projectPath, configPath, backupPath, assetsInjected)
 
         // Handle cleanup on exit
         const cleanup = () => {
-            if (assetsInjected && backupPath) {
+            if (assetsInjected && backupPath && modifiedFilePath) {
                 console.log();
-                console.log(chalk.blue('Restoring config.ts from backup...'));
-                const restored = restoreConfigFile(configPath);
+                console.log(chalk.blue(`Restoring ${modifiedFileName} from backup...`));
+                const restored = restoreFile(modifiedFilePath);
                 if (restored) {
-                    console.log(chalk.green('\u2713 config.ts restored'));
+                    console.log(chalk.green(`\u2713 ${modifiedFileName} restored`));
                 } else {
-                    console.log(chalk.yellow('Warning: Could not restore config.ts'));
+                    console.log(chalk.yellow(`Warning: Could not restore ${modifiedFileName}`));
                     console.log(chalk.gray(`Backup is at: ${backupPath}`));
                 }
             }
@@ -242,22 +260,23 @@ async function handleRestore(pathOption) {
     }
 
     projectPath = resolve(projectPath);
-    const configPath = findConfigFile(projectPath);
 
-    if (!configPath) {
-        console.log(chalk.red('No config.ts found in project.'));
+    // Determine which file would be the injection target
+    const { targetFile, targetName } = getInjectionTarget(projectPath);
+
+    if (!targetFile) {
+        console.log(chalk.yellow('No config files found to restore.'));
         return;
     }
 
-    console.log(chalk.blue('Restoring config.ts from backup...'));
-
-    const restored = restoreConfigFile(configPath);
+    console.log(chalk.blue(`Restoring ${targetName} from backup...`));
+    const restored = restoreFile(targetFile);
 
     if (restored) {
-        console.log(chalk.green('\u2713 config.ts restored from backup'));
+        console.log(chalk.green(`\u2713 ${targetName} restored from backup`));
     } else {
         console.log(chalk.yellow('No backup file found.'));
-        console.log(chalk.gray(`Expected backup at: ${configPath}.bak`));
+        console.log(chalk.gray(`Expected backup at: ${targetFile}.bak`));
     }
 }
 

package/actions/iris/link.js

@@ -77,9 +77,9 @@ async function showMainMenu() {
 
     const choices = [
         {
-            name: 'Link a new Vue project',
+            name: 'Link a Vue project',
             value: 'link',
-            description: 'Add a Vue project to the CLI'
+            description: chalk.dim('→ Add a Vue project to the CLI')
         }
     ];
 
@@ -87,12 +87,12 @@ async function showMainMenu() {
         choices.push({
             name: 'View linked projects',
             value: 'list',
-            description: 'Show all linked Vue projects with status'
+            description: chalk.dim('→ Show all linked Vue projects with status')
         });
         choices.push({
             name: 'Unlink a project',
             value: 'unlink',
-            description: 'Remove a Vue project from the CLI'
+            description: chalk.dim('→ Remove a Vue project from the CLI')
         });
     }
 
@@ -100,7 +100,7 @@ async function showMainMenu() {
         choices.push({
             name: `Clean up invalid projects (${invalidCount})`,
             value: 'cleanup',
-            description: 'Remove projects with missing paths'
+            description: chalk.dim('→ Remove projects with missing paths')
         });
     }
 
@@ -152,33 +152,31 @@ async function handleLink(pathOption) {
         if (cwdConfig.found && cwdConfig.errors.length === 0) {
             // Valid Vue project
             choices.push({
-                name: `Current directory - ${cwdConfig.appName} (${cwdConfig.slug})`,
+                name: `Current directory (${cwdPath})`,
                 value: cwdPath,
-                description: cwdPath
+                description: chalk.dim(`→ App: "${cwdConfig.appName}" (${cwdConfig.slug})`)
             });
         } else if (cwdConfig.found && cwdConfig.errors.length > 0) {
             // Has config.ts but with errors
             const errorMsg = cwdConfig.errors[0] || 'Invalid config';
             choices.push({
-                name: `Current directory`,
+                name: `Current directory (${cwdPath})`,
                 value: '__disabled__',
-                disabled: `Config error: ${errorMsg}`,
-                description: cwdPath
+                disabled: `Config error: ${errorMsg}`
             });
         } else {
             // No config.ts found
             choices.push({
-                name: `Current directory`,
+                name: `Current directory (${cwdPath})`,
                 value: '__disabled__',
-                disabled: 'No config.ts found',
-                description: cwdPath
+                disabled: 'No config.ts found'
             });
         }
 
         choices.push({
             name: 'Enter path manually',
             value: '__manual__',
-            description: 'Specify the full path to a Vue project'
+            description: chalk.dim('→ Specify the full path to a Vue project')
         });
 
         choices.push({
@@ -303,7 +301,7 @@ async function handleUnlink(pathOption) {
             return {
                 name: `${prefix}${displayName} (${displaySlug})`,
                 value: p.slug,
-                description: p.path
+                description: chalk.dim(`→ Path: ${p.path}`)
             };
         });
 

package/actions/publish.js

@@ -288,13 +288,17 @@ const handlePublishIrisAppAction = async (instanceUrl, apiKey, action) => {
     // Create zip from the app folder
     const zipBuffer = await createIrisZip(action.appPath, action.slug);
 
-    // Publish via API with app-name parameter
+    // Publish via API with app metadata
     const response = await publishApp(
         instanceUrl,
         apiKey,
         zipBuffer,
         `${action.slug}.zip`,
-        action.appName
+        action.appName,
+        {
+            appDescription: action.appDescription,
+            appIconId: action.appIconId
+        }
     );
 
     return response;
@@ -1190,10 +1194,12 @@ export const runPublish = async (options = {}) => {
             continue;
         }
 
-        // Get app name from linked project config (stored globally) or use slug
+        // Get app metadata from linked project config (stored globally) or use slug
         const linkedProjects = getLinkedProjects();
         const linkedProject = linkedProjects.find(p => p.slug === slug);
         const appName = linkedProject?.appName || slug;
+        const appDescription = linkedProject?.appDescription || null;
+        const appIconId = linkedProject?.appIconId || null;
 
         // Calculate content hash for change detection
         const currentHash = hashIrisAppFolder(appPath);
@@ -1206,6 +1212,8 @@ export const runPublish = async (options = {}) => {
                 action: 'create_iris_app',
                 slug,
                 appName,
+                appDescription,
+                appIconId,
                 appPath,
                 contentHash: currentHash
             });
@@ -1219,6 +1227,8 @@ export const runPublish = async (options = {}) => {
                     action: 'update_iris_app',
                     slug,
                     appName: linkedProject?.appName || cachedApp?.appName || slug,
+                    appDescription,
+                    appIconId,
                     appPath,
                     contentHash: currentHash
                 });

package/actions/pull.js

@@ -2,22 +2,19 @@ import { ensureValidCredentials } from "../utils/cli/helpers/ensureCredentials.j
 import Config from "../utils/config.js";
 import { meqlQuery } from "../utils/magentrix/api/meqlQuery.js";
 import fs from "fs";
-import { withSpinner } from "../utils/spinner.js";
 import { ProgressTracker } from "../utils/progress.js";
 import { createLogger, Logger } from "../utils/logger.js";
-import { EXPORT_ROOT, TYPE_DIR_MAP, IRIS_APPS_DIR } from "../vars/global.js";
+import { EXPORT_ROOT, IRIS_APPS_DIR } from "../vars/global.js";
 import { mapRecordToFile, writeRecords } from "../utils/cli/writeRecords.js";
-import { updateBase, removeFromBase, removeFromBaseBulk } from "../utils/updateFileBase.js";
-import { compareAllFilesAndLogStatus, promptConflictResolution, showCurrentConflicts } from "../utils/cli/helpers/compare.js";
+import { updateBase, removeFromBaseBulk } from "../utils/updateFileBase.js";
+import { promptConflictResolution } from "../utils/cli/helpers/compare.js";
 import path from "path";
 import { compareLocalAndRemote } from "../utils/compare.js";
 import chalk from 'chalk';
-import { getFileTag, setFileTag } from "../utils/filetag.js";
-import { downloadAssetsZip, listAssets } from "../utils/magentrix/api/assets.js";
-import { downloadAssets, walkAssets } from "../utils/downloadAssets.js";
+import { setFileTag } from "../utils/filetag.js";
+import { downloadAssets } from "../utils/downloadAssets.js";
 import { listApps, downloadApp } from "../utils/magentrix/api/iris.js";
 import { extractIrisZip, hashIrisAppFolder } from "../utils/iris/zipper.js";
-import { v4 as uuidv4 } from 'uuid';
 import readlineSync from 'readline-sync';
 
 const config = new Config();

package/bin/magentrix.js

@@ -3,6 +3,8 @@
 // Imports
 import { Command } from 'commander';
 import chalk from 'chalk';
+import { existsSync } from 'node:fs';
+import { join } from 'node:path';
 import { VERSION } from '../vars/config.js';
 import { setup } from '../actions/setup.js';
 import { main } from '../actions/main.js';
@@ -17,6 +19,40 @@ import { update } from '../actions/update.js';
 import { configWizard } from '../actions/config.js';
 import { irisLink, irisDev, irisDelete, irisRecover, vueBuildStage } from '../actions/iris/index.js';
 
+// ── Vue Project Detection ────────────────────────────────
+/**
+ * Check if current directory is a Vue project (has config.ts)
+ */
+function isInVueProject() {
+    const configLocations = [
+        'src/config.ts',
+        'config.ts',
+        'src/iris-config.ts',
+        'iris-config.ts'
+    ];
+    return configLocations.some(loc => existsSync(join(process.cwd(), loc)));
+}
+
+/**
+ * Block non-iris commands when in a Vue project
+ */
+function requireMagentrixWorkspace(fn) {
+    return async (...args) => {
+        if (isInVueProject()) {
+            console.error(`\n${chalk.bgRed.white.bold(' ERROR ')} ${chalk.redBright('This command must be run in a Magentrix workspace')}\n`);
+            console.error(chalk.yellow('It looks like you\'re in a Vue project directory.'));
+            console.error(chalk.gray('This command requires a Magentrix workspace with global API key and instance URL.\n'));
+            console.error(chalk.cyan('Available commands in Vue projects:'));
+            console.error(chalk.gray('  • magentrix iris-link'));
+            console.error(chalk.gray('  • magentrix iris-dev'));
+            console.error(chalk.gray('  • magentrix vue-build-stage\n'));
+            process.exit(1);
+        }
+        // Execute the command
+        await fn(...args);
+    };
+}
+
 // ── Middleware ────────────────────────────────
 async function preMiddleware() {
     await recacheFileIdIndex(EXPORT_ROOT);
@@ -32,6 +68,11 @@ const withMiddleware = ({ pre, post }) => (fn) => async (...args) => {
     if (post) await post(...args);
 };
 
+const withDefault = withMiddleware({ pre: preMiddleware, post: postMiddleware });
+
+// Combined wrapper: check for Vue project + run middleware
+const withWorkspaceCheck = (fn) => requireMagentrixWorkspace(withDefault(fn));
+
 // ── CLI Setup ────────────────────────────────
 const program = new Command();
 program
@@ -93,8 +134,6 @@ program
         }
     });
 
-const withDefault = withMiddleware({ pre: preMiddleware, post: postMiddleware });
-
 // ── Error Handlers ───────────────────────────
 program.showHelpAfterError(false);
 program.configureOutput({
@@ -128,8 +167,8 @@ program
     .description('Configure your Magentrix API key')
     .option('--api-key <apiKey>', 'Magentrix API key')
     .option('--instance-url <instanceUrl>', 'Magentrix instance URL (e.g., https://example.magentrixcloud.com)')
-    .action(withDefault(setup));
-program.command('pull').description('Pull files from the remote server').action(withDefault(pull));
+    .action(withWorkspaceCheck(setup));
+program.command('pull').description('Pull files from the remote server').action(withWorkspaceCheck(pull));
 const createCommand = program
     .command('create')
     .description('Create files locally')
@@ -138,7 +177,7 @@ const createCommand = program
     .option('--name <name>', 'Name of the file to create')
     .option('--description <description>', 'Optional description')
     .option('--entity-id <entityId>', 'Entity ID (required for triggers)')
-    .action(withDefault(create));
+    .action(withWorkspaceCheck(create));
 
 // Override help for create command to show options
 createCommand.configureHelp({
@@ -185,17 +224,17 @@ createCommand.configureHelp({
         return help;
     }
 });
-program.command('status').description('Show file conflicts').action(withDefault(status));
-program.command('autopublish').description('Watch & sync changes in real time').action(withDefault(autoPublish));
+program.command('status').description('Show file conflicts').action(withWorkspaceCheck(status));
+program.command('autopublish').description('Watch & sync changes in real time').action(withWorkspaceCheck(autoPublish));
 // Publish does its own comprehensive file scanning, so skip the pre-cache middleware
-program.command('publish').description('Publish pending changes to the remote server').action(withDefault(publish));
-program.command('update').description('Update MagentrixCLI to the latest version').action(update);
+program.command('publish').description('Publish pending changes to the remote server').action(withWorkspaceCheck(publish));
+program.command('update').description('Update MagentrixCLI to the latest version').action(requireMagentrixWorkspace(update));
 
 // Config command - interactive wizard
 program
     .command('config')
     .description('Configure CLI settings')
-    .action(configWizard);
+    .action(requireMagentrixWorkspace(configWizard));
 
 // Iris commands for Vue.js app management
 program
@@ -236,6 +275,18 @@ program
 // ── Unknown Command Handler ──────────────────
 program.argument('[command]', 'command to run').action((cmd) => {
     const runMain = async () => {
+        // Check if in Vue project
+        if (isInVueProject()) {
+            console.error(`\n${chalk.bgRed.white.bold(' ERROR ')} ${chalk.redBright('This command must be run in a Magentrix workspace')}\n`);
+            console.error(chalk.yellow('It looks like you\'re in a Vue project directory.'));
+            console.error(chalk.gray('This command requires a Magentrix workspace with global API key and instance URL.\n'));
+            console.error(chalk.cyan('Available commands in Vue projects:'));
+            console.error(chalk.gray('  • magentrix iris-link'));
+            console.error(chalk.gray('  • magentrix iris-dev'));
+            console.error(chalk.gray('  • magentrix vue-build-stage\n'));
+            process.exit(1);
+        }
+
         await preMiddleware();
         await main();
         await postMiddleware();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magentrix-corp/magentrix-cli",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "CLI tool for synchronizing local files with Magentrix cloud platform",
   "main": "index.js",
   "type": "module",

package/utils/iris/config-reader.js

@@ -11,6 +11,108 @@ const CONFIG_LOCATIONS = [
     'iris-config.ts'
 ];
 
+/**
+ * The .env file to read configuration from.
+ * Currently only .env.development is supported.
+ */
+const ENV_FILE = '.env.development';
+
+/**
+ * Parse a .env file and return key-value pairs.
+ *
+ * @param {string} envPath - Path to the .env file
+ * @returns {Record<string, string>} - Parsed environment variables
+ */
+function parseEnvFile(envPath) {
+    const result = {};
+
+    if (!existsSync(envPath)) {
+        return result;
+    }
+
+    const content = readFileSync(envPath, 'utf-8');
+    const lines = content.split('\n');
+
+    for (const line of lines) {
+        // Skip comments and empty lines
+        const trimmed = line.trim();
+        if (!trimmed || trimmed.startsWith('#')) {
+            continue;
+        }
+
+        // Parse KEY=VALUE or KEY = VALUE
+        const match = trimmed.match(/^([A-Za-z_][A-Za-z0-9_]*)\s*=\s*(.*)$/);
+        if (match) {
+            const key = match[1];
+            let value = match[2].trim();
+
+            // Remove surrounding quotes if present
+            if ((value.startsWith('"') && value.endsWith('"')) ||
+                (value.startsWith("'") && value.endsWith("'"))) {
+                value = value.slice(1, -1);
+            }
+
+            result[key] = value;
+        }
+    }
+
+    return result;
+}
+
+/**
+ * Read configuration from .env.development file.
+ * Reads siteUrl, assets, and refreshToken.
+ *
+ * @param {string} projectPath - Path to the Vue project
+ * @returns {{
+ *   siteUrl: string | null,
+ *   assets: string[],
+ *   refreshToken: string | null,
+ *   envFileUsed: string | null
+ * }}
+ */
+export function readEnvConfig(projectPath) {
+    const result = {
+        siteUrl: null,
+        assets: [],
+        refreshToken: null,
+        envFileUsed: null
+    };
+
+    const envPath = join(projectPath, ENV_FILE);
+
+    if (!existsSync(envPath)) {
+        return result;
+    }
+
+    const envVars = parseEnvFile(envPath);
+    result.envFileUsed = ENV_FILE;
+
+    // Read VITE_SITE_URL
+    if (envVars.VITE_SITE_URL) {
+        result.siteUrl = envVars.VITE_SITE_URL;
+    }
+
+    // Read VITE_ASSETS
+    if (envVars.VITE_ASSETS) {
+        try {
+            const parsed = JSON.parse(envVars.VITE_ASSETS);
+            if (Array.isArray(parsed)) {
+                result.assets = parsed;
+            }
+        } catch {
+            // If not valid JSON, skip
+        }
+    }
+
+    // Read VITE_REFRESH_TOKEN
+    if (envVars.VITE_REFRESH_TOKEN) {
+        result.refreshToken = envVars.VITE_REFRESH_TOKEN;
+    }
+
+    return result;
+}
+
 /**
  * Find the config.ts file in a Vue project.
  *
@@ -35,6 +137,8 @@ export function findConfigFile(projectPath) {
  * @returns {{
  *   slug: string | null,
  *   appName: string | null,
+ *   appDescription: string | null,
+ *   appIconId: string | null,
  *   siteUrl: string | null,
  *   assets: string[],
  *   raw: string
@@ -44,6 +148,8 @@ export function parseConfigFile(configPath) {
     const result = {
         slug: null,
         appName: null,
+        appDescription: null,
+        appIconId: null,
         siteUrl: null,
         assets: [],
         raw: ''
@@ -82,6 +188,20 @@ export function parseConfigFile(configPath) {
         }
     }
 
+    // Extract appDescription (optional)
+    // appDescription: "Description text"
+    const appDescriptionMatch = content.match(/(?:appDescription|app_description)\s*:\s*["'`]([^"'`]*)["'`]/);
+    if (appDescriptionMatch) {
+        result.appDescription = appDescriptionMatch[1];
+    }
+
+    // Extract appIconId (optional)
+    // appIconId: "icon-id-here"
+    const appIconIdMatch = content.match(/(?:appIconId|app_icon_id)\s*:\s*["'`]([^"'`]*)["'`]/);
+    if (appIconIdMatch) {
+        result.appIconId = appIconIdMatch[1];
+    }
+
     // Extract siteUrl (various patterns)
     // siteUrl: "https://...", site_url: "https://...", baseUrl: "https://..."
     // Also handles: siteUrl: env.siteUrl || "https://..."
@@ -114,15 +234,24 @@ export function parseConfigFile(configPath) {
 /**
  * Read Vue project configuration.
  *
+ * Reads from multiple sources:
+ * - slug, appName, appDescription, appIconId: from config.ts only
+ * - siteUrl, assets, refreshToken: from .env.development only (no fallback)
+ *
  * @param {string} projectPath - Path to the Vue project
  * @returns {{
  *   found: boolean,
  *   configPath: string | null,
  *   slug: string | null,
  *   appName: string | null,
+ *   appDescription: string | null,
+ *   appIconId: string | null,
  *   siteUrl: string | null,
  *   assets: string[],
- *   errors: string[]
+ *   refreshToken: string | null,
+ *   envFileUsed: string | null,
+ *   errors: string[],
+ *   warnings: string[]
  * }}
  */
 export function readVueConfig(projectPath) {
@@ -131,9 +260,14 @@ export function readVueConfig(projectPath) {
         configPath: null,
         slug: null,
         appName: null,
+        appDescription: null,
+        appIconId: null,
         siteUrl: null,
         assets: [],
-        errors: []
+        refreshToken: null,
+        envFileUsed: null,
+        errors: [],
+        warnings: []
     };
 
     const configPath = findConfigFile(projectPath);
@@ -146,93 +280,130 @@ export function readVueConfig(projectPath) {
     result.found = true;
     result.configPath = configPath;
 
+    // Parse config.ts for slug, appName, appDescription, appIconId (always from config.ts)
     const parsed = parseConfigFile(configPath);
     result.slug = parsed.slug;
     result.appName = parsed.appName;
-    result.siteUrl = parsed.siteUrl;
-    result.assets = parsed.assets;
+    result.appDescription = parsed.appDescription;
+    result.appIconId = parsed.appIconId;
+
+    // Read .env.development for siteUrl, assets, and refreshToken (no fallback to config.ts)
+    const envConfig = readEnvConfig(projectPath);
+    result.envFileUsed = envConfig.envFileUsed;
+    result.siteUrl = envConfig.siteUrl;
+    result.assets = envConfig.assets;
+    result.refreshToken = envConfig.refreshToken;
 
-    // Validate required fields
+    // Validate required fields in config.ts
     if (!result.slug) {
-        result.errors.push('Missing required field: slug');
+        result.errors.push('Missing required field in config.ts: slug (appPath)');
     }
     if (!result.appName) {
-        result.errors.push('Missing required field: appName');
+        result.errors.push('Missing required field in config.ts: appName');
+    }
+
+    // Warnings for missing .env.development values
+    if (!envConfig.envFileUsed) {
+        result.warnings.push('No .env.development file found');
+    } else {
+        if (!result.siteUrl) {
+            result.warnings.push('VITE_SITE_URL not set in .env.development');
+        }
     }
 
     return result;
 }
 
 /**
- * Create a backup of the config file.
+ * Create a backup of a file.
  *
- * @param {string} configPath - Path to the config.ts file
+ * @param {string} filePath - Path to the file to backup
  * @returns {string} - Path to the backup file
  */
-export function backupConfigFile(configPath) {
-    const backupPath = `${configPath}.bak`;
-    copyFileSync(configPath, backupPath);
+export function backupFile(filePath) {
+    const backupPath = `${filePath}.bak`;
+    copyFileSync(filePath, backupPath);
     return backupPath;
 }
 
 /**
- * Restore config file from backup.
+ * Restore a file from backup.
  *
- * @param {string} configPath - Path to the config.ts file
+ * @param {string} filePath - Path to the file to restore
  * @returns {boolean} - True if restored, false if backup not found
  */
-export function restoreConfigFile(configPath) {
-    const backupPath = `${configPath}.bak`;
+export function restoreFile(filePath) {
+    const backupPath = `${filePath}.bak`;
     if (!existsSync(backupPath)) {
         return false;
     }
-    copyFileSync(backupPath, configPath);
+    copyFileSync(backupPath, filePath);
     return true;
 }
 
 /**
- * Inject assets into config.ts file.
+ * Determine which file will be used for asset injection.
+ * Only .env.development is supported for asset injection.
  *
- * @param {string} configPath - Path to the config.ts file
+ * @param {string} projectPath - Path to the Vue project
+ * @returns {{targetFile: string | null, targetName: string | null}}
+ */
+export function getInjectionTarget(projectPath) {
+    const envPath = join(projectPath, ENV_FILE);
+
+    if (existsSync(envPath)) {
+        return { targetFile: envPath, targetName: '.env.development' };
+    }
+
+    return { targetFile: null, targetName: null };
+}
+
+/**
+ * Inject assets into .env.development file.
+ * Returns failure if .env.development does not exist.
+ *
+ * @param {string} projectPath - Path to the Vue project
+ * @param {string[]} assets - Array of asset URLs to inject
+ * @returns {{success: boolean, targetFile: string | null, targetName: string | null}}
+ */
+export function injectAssets(projectPath, assets) {
+    const { targetFile, targetName } = getInjectionTarget(projectPath);
+
+    if (!targetFile) {
+        return { success: false, targetFile: null, targetName: null };
+    }
+
+    const success = injectAssetsIntoEnv(targetFile, assets);
+    return { success, targetFile, targetName };
+}
+
+/**
+ * Inject assets into a .env file.
+ *
+ * @param {string} envPath - Path to the .env file
  * @param {string[]} assets - Array of asset URLs to inject
  * @returns {boolean} - True if successful
  */
-export function injectAssetsIntoConfig(configPath, assets) {
-    if (!existsSync(configPath)) {
+export function injectAssetsIntoEnv(envPath, assets) {
+    if (!existsSync(envPath)) {
         return false;
     }
 
-    let content = readFileSync(configPath, 'utf-8');
-
-    // Format assets array
-    const assetsStr = assets.map(url => `    "${url}"`).join(',\n');
-    const newAssetsBlock = `assets: [\n    // Injected by magentrix iris-dev\n${assetsStr}\n  ]`;
+    let content = readFileSync(envPath, 'utf-8');
+    const assetsJson = JSON.stringify(assets);
+    const newLine = `VITE_ASSETS = '${assetsJson}'`;
 
-    // Check if assets array exists
-    const assetsPattern = /assets\s*:\s*\[[\s\S]*?\]/;
+    // Check if VITE_ASSETS already exists
+    const assetsPattern = /^VITE_ASSETS\s*=.*$/m;
     if (assetsPattern.test(content)) {
-        // Replace existing assets array
-        content = content.replace(assetsPattern, newAssetsBlock);
+        // Replace existing VITE_ASSETS line
+        content = content.replace(assetsPattern, newLine);
     } else {
-        // Need to add assets array - find a good place
-        // Look for the end of the config object
-        const configObjectPattern = /(export\s+(?:const|let|var)\s+\w+\s*=\s*\{[\s\S]*?)(}\s*;?\s*$)/;
-        const match = content.match(configObjectPattern);
-        if (match) {
-            // Insert before closing brace
-            const beforeClose = match[1].trimEnd();
-            const needsComma = !beforeClose.endsWith(',') && !beforeClose.endsWith('{');
-            content = content.replace(
-                configObjectPattern,
-                `${match[1]}${needsComma ? ',' : ''}\n  ${newAssetsBlock}\n${match[2]}`
-            );
-        } else {
-            // Can't find a good place to inject
-            return false;
-        }
+        // Add new line at the end
+        content = content.trimEnd() + '\n' + newLine + '\n';
     }
 
-    writeFileSync(configPath, content, 'utf-8');
+    writeFileSync(envPath, content, 'utf-8');
     return true;
 }
 
@@ -250,22 +421,29 @@ Could not find config.ts in the Vue project.
 
 Expected location: ${join(projectPath, 'src/config.ts')}
 
-Required fields:
-  - slug: App identifier (used as folder name)
+Required fields in config.ts:
+  - appPath (slug): App identifier (used as folder name)
   - appName: Display name for navigation menu
-  - siteUrl: Magentrix instance URL
+
+Required fields in .env.development:
+  - VITE_SITE_URL: Magentrix instance URL
+  - VITE_REFRESH_TOKEN: API refresh token
+  - VITE_ASSETS: Platform assets (managed by CLI)
 
 Example config.ts:
   export const config = {
-    slug: "my-app",
-    appName: "My Application",
-    siteUrl: "https://yourinstance.magentrix.com",
-    assets: []
-  }`;
+    appPath: "my-app",
+    appName: "My Application"
+  }
+
+Example .env.development:
+  VITE_SITE_URL = https://yourinstance.magentrix.com
+  VITE_REFRESH_TOKEN = your-api-key
+  VITE_ASSETS = '[]'`;
 }
 
 /**
- * Format config validation errors.
+ * Format config validation errors and warnings.
  *
  * @param {ReturnType<typeof readVueConfig>} config - Config read result
  * @returns {string} - Formatted error message
@@ -276,21 +454,36 @@ export function formatConfigErrors(config) {
         '────────────────────────────────────────────────────',
         '',
         `Config file: ${config.configPath || 'not found'}`,
-        ''
     ];
 
+    if (config.envFileUsed) {
+        lines.push(`Env file: ${config.envFileUsed}`);
+    } else {
+        lines.push('Env file: .env.development (not found)');
+    }
+
+    lines.push('');
+
     if (config.errors.length > 0) {
-        lines.push('Issues:');
+        lines.push('Errors:');
         for (const error of config.errors) {
             lines.push(`  ✗ ${error}`);
         }
+        lines.push('');
+    }
+
+    if (config.warnings?.length > 0) {
+        lines.push('Warnings:');
+        for (const warning of config.warnings) {
+            lines.push(`  ⚠ ${warning}`);
+        }
+        lines.push('');
     }
 
-    lines.push('');
     lines.push('Current values:');
     lines.push(`  slug: ${config.slug || '(missing)'}`);
     lines.push(`  appName: ${config.appName || '(missing)'}`);
-    lines.push(`  siteUrl: ${config.siteUrl || '(missing)'}`);
+    lines.push(`  siteUrl: ${config.siteUrl || '(not set)'}`);
 
     return lines.join('\n');
 }

package/utils/iris/linker.js

@@ -163,6 +163,8 @@ export function findLinkedProjectByPath(projectPath) {
  *     path: string,
  *     slug: string,
  *     appName: string,
+ *     appDescription: string | null,
+ *     appIconId: string | null,
  *     siteUrl: string | null,
  *     lastBuild: string | null
  *   } | null,
@@ -224,6 +226,8 @@ export function linkVueProject(projectPath) {
             ...projects[index],
             slug: vueConfig.slug,
             appName: vueConfig.appName,
+            appDescription: vueConfig.appDescription,
+            appIconId: vueConfig.appIconId,
             siteUrl: vueConfig.siteUrl
         };
         saveLinkedProjects(projects);
@@ -252,6 +256,8 @@ export function linkVueProject(projectPath) {
         path: normalizedPath,
         slug: vueConfig.slug,
         appName: vueConfig.appName,
+        appDescription: vueConfig.appDescription,
+        appIconId: vueConfig.appIconId,
         siteUrl: vueConfig.siteUrl,
         lastBuild: null
     };

package/utils/magentrix/api/iris.js

@@ -30,9 +30,12 @@ export const listApps = async (instanceUrl, token) => {
  * @param {Buffer} zipBuffer - The zip file as a Buffer
  * @param {string} filename - The filename for the zip (e.g., "my-app.zip")
  * @param {string} appName - The user-friendly display name (required for navigation)
+ * @param {Object} options - Optional parameters
+ * @param {string} [options.appDescription] - App description
+ * @param {string} [options.appIconId] - App icon ID
  * @returns {Promise<{success: boolean, message: string, folderName: string}>}
  */
-export const publishApp = async (instanceUrl, token, zipBuffer, filename, appName) => {
+export const publishApp = async (instanceUrl, token, zipBuffer, filename, appName, options = {}) => {
     if (!instanceUrl || !token) {
         throw new Error('Missing required Magentrix instanceUrl or token');
     }
@@ -55,11 +58,22 @@ export const publishApp = async (instanceUrl, token, zipBuffer, filename, appNam
     const formData = new FormData();
     formData.append('file', file);
 
-    // app-name is passed as URL parameter (required for navigation)
+    // Build query parameters
+    const params = new URLSearchParams();
+    params.append('app-name', appName);
+
+    if (options.appDescription) {
+        params.append('app-description', options.appDescription);
+    }
+
+    if (options.appIconId) {
+        params.append('app-icon-id', options.appIconId);
+    }
+
     const response = await fetchMagentrix({
         instanceUrl,
         token,
-        path: `/iris/publishapp?app-name=${encodeURIComponent(appName)}`,
+        path: `/iris/publishapp?${params.toString()}`,
         method: 'POST',
         body: formData,
         ignoreContentType: true,