fabrica-e-commerce 0.2.2 → 0.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fabrica-e-commerce",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "CLI launcher for deploying Fabrica e-commerce stores — Supabase + Vercel, works on Windows, macOS, Linux & Termux.",
   "type": "module",
   "bin": {

package/src/cli.js

@@ -3,14 +3,21 @@ import { readFile } from 'node:fs/promises';
 import { fileURLToPath } from 'node:url';
 import path from 'node:path';
 import { connectSupabase } from './bridge.js';
-import { collectEnv, cloneRepo, deployToVercel, updateProjectEnv, ensureVercelLogin, runLocally } from './deploy.js';
+import {
+  collectEnv, collectAdminPassword, cloneRepo,
+  deployToVercel, updateProjectEnv, ensureVercelLogin, runLocally,
+} from './deploy.js';
 import { createGithubRepoFromClone } from './github.js';
 import { ensureDependencies, vinsCommand } from './deps.js';
 import { cleanCommand } from './clean.js';
 import { BRIDGE_ORIGIN, STORE_REPO } from './config.js';
 import { dataDir, readProjects } from './store.js';
 import { choose, ask } from './prompt.js';
-import { banner, help, kv, kvSuccess, kvFail, section, endSections, subBox, log, logInfo, logWarn, divider, stepHeader, orange, dimOrange, bold, dim, green, cyan } from './ui.js';
+import {
+  banner, help, kv, kvSuccess, kvFail, section, endSections, subBox,
+  log, logInfo, logWarn, logSuccess, divider, stepHeader,
+  orange, dimOrange, bold, dim, green, cyan, yellow, red, white,
+} from './ui.js';
 import { openUrl } from './system.js';
 
 async function packageVersion() {
@@ -23,31 +30,42 @@ async function packageVersion() {
 async function build() {
   banner();
 
-  stepHeader(1, 5, 'Dependency check');
+  // Step 1 — Dependency check
+  stepHeader(1, 6, 'Dependency check');
   section('Dependency check');
   await ensureDependencies({ names: ['git'] });
   endSections();
 
-  stepHeader(2, 5, 'Supabase connect');
+  // Step 2 — Supabase connect
+  stepHeader(2, 6, 'Supabase connect');
   section('Supabase connect');
   kv('Bridge', 'ONLINE');
   kv('SQL',    'Prepared securely (hidden from UI)');
   const supabase = await connectSupabase();
   endSections();
 
-  stepHeader(3, 5, 'Environment variables');
+  // Step 3 — Environment variables
+  stepHeader(3, 6, 'Environment variables');
   const env = await collectEnv(supabase);
 
-  stepHeader(4, 5, 'Clone storefront');
+  // Step 4 — Admin password
+  stepHeader(4, 6, 'Admin password');
+  const adminPassword = await collectAdminPassword();
+  env['PASS'] = adminPassword;
+
+  // Step 5 — Clone storefront
+  stepHeader(5, 6, 'Clone storefront');
   const project = await cloneRepo();
 
-  stepHeader(5, 5, 'Deploy target');
+  // Step 6 — Deploy target
+  stepHeader(6, 6, 'Deploy target');
   section('Where should Fabrica deploy?');
+  logInfo('Choose how you want to run your store:');
   endSections();
 
   const target = await choose('Select deployment target:', [
-    { name: '☁  Deploy on Vercel (cloud, shareable URL)', value: 'vercel' },
-    { name: '💻  Run locally on this computer',           value: 'local' },
+    { name: '☁   Deploy on Vercel  —  cloud, shareable URL', value: 'vercel' },
+    { name: '💻  Run locally         —  development on this machine', value: 'local' },
   ]);
 
   if (target === 'local') {
@@ -63,14 +81,14 @@ async function build() {
   const githubRepo = await createGithubRepoFromClone(project);
   const record = await deployToVercel(project, env, githubRepo);
 
-  section('✓ Deployment complete');
+  section('✓  Deployment complete');
   divider();
-  kv('Project',    record.projectName);
+  kvSuccess('Project',    record.projectName);
   kv('GitHub',     record.githubRepo || dim('n/a'));
-  kv('URL',        record.productionUrl || dim('n/a'));
-  kv('Local path', record.target);
+  kv('Live URL',   record.productionUrl || dim('n/a'));
+  kv('Local path', dim(record.target));
   divider();
-  log(green('Your Fabrica store is live!'));
+  logSuccess('Your Fabrica store is live! 🎉');
   endSections();
 }
 
@@ -81,18 +99,22 @@ async function list() {
 
   section('Your Fabrica projects');
   if (!projects.length) {
-    logInfo('No projects found');
-    log('Run: npx fabrica-e-commerce build');
+    logInfo('No projects found yet');
+    log(`Run ${cyan('npx fabrica-e-commerce build')} to create your first store`);
     endSections();
     return;
   }
 
-  kv('Total projects', String(projects.length));
+  kv('Total', String(projects.length) + ' project' + (projects.length !== 1 ? 's' : ''));
   divider();
   for (const p of projects) {
-    const type = p.type === 'local' ? cyan('local') : green('cloud');
-    log(`${bold(p.projectName)}  ${type}  ${dim(p.createdAt?.slice(0,10) || '')}`);
+    const badge = p.type === 'local'
+      ? `${yellow('◉')} ${yellow('local')}`
+      : `${green('◉')} ${green('cloud')}`;
+    log(`${bold(white(p.projectName))}  ${badge}  ${dim(p.createdAt?.slice(0, 10) || '')}`);
   }
+  divider();
+  logInfo('Select a project to view its details');
   endSections();
 
   const choices = projects.map((p) => ({
@@ -103,14 +125,19 @@ async function list() {
   const selected = await choose('Select a project to view details:', choices);
   const project = projects.find((p) => p.id === selected);
 
-  section(`Project: ${bold(project.projectName)}`);
-  kv('Type',      project.type === 'local' ? cyan('local') : green('cloud'));
-  kv('Created',   project.createdAt || dim('unknown'));
-  kv('Path',      project.target || dim('n/a'));
+  section(`Project — ${bold(orange(project.projectName))}`);
+  divider();
+  const typeBadge = project.type === 'local' ? yellow('local') : green('cloud');
+  kv('Type',      typeBadge);
+  kv('Created',   project.createdAt ? project.createdAt.slice(0, 19).replace('T', ' ') : dim('unknown'));
+  kv('Path',      dim(project.target || 'n/a'));
   kv('GitHub',    project.githubRepo || dim('n/a'));
   kv('Supabase',  project.supabaseUrl || dim('n/a'));
   kv('URL',       project.productionUrl || dim('n/a'));
-  kv('Env keys',  (project.envKeys || []).join(', ') || dim('none'));
+  kv('Env keys',  (project.envKeys || []).length
+    ? (project.envKeys || []).join(dim('  ·  '))
+    : dim('none'));
+  divider();
   endSections();
 }
 
@@ -120,24 +147,26 @@ async function env() {
   const projects = await readProjects();
 
   section('Environment manager');
+  logInfo('Update API keys and secrets for any project.');
   if (!projects.length) {
-    logInfo('No projects found');
-    log('Run: npx fabrica-e-commerce build');
+    divider();
+    log(`No projects found — run ${cyan('npx fabrica-e-commerce build')} first`);
     endSections();
     return;
   }
+  kv('Total projects', String(projects.length));
   endSections();
 
   const typeFilter = await choose('Which projects to show?', [
-    { name: 'All projects',                 value: 'all' },
-    { name: 'Local projects only',          value: 'local' },
-    { name: 'Cloud (Vercel) projects only', value: 'cloud' },
+    { name: '📋  All projects',                  value: 'all' },
+    { name: '💻  Local projects only',           value: 'local' },
+    { name: '☁   Cloud (Vercel) projects only',  value: 'cloud' },
   ]);
 
   const filtered = typeFilter === 'all' ? projects : projects.filter((p) => p.type === typeFilter);
   if (!filtered.length) {
     section('Environment manager');
-    log(`No ${typeFilter} projects found`);
+    logWarn(`No ${typeFilter} projects found`);
     endSections();
     return;
   }
@@ -156,13 +185,22 @@ async function env() {
     return;
   }
 
+  section(`Env keys — ${bold(orange(project.projectName))}`);
+  divider();
+  for (const k of envKeys) log(`${orange('·')} ${white(k)}`);
+  divider();
+  endSections();
+
   const key = await choose('Select env variable to update:', envKeys.map((k) => ({ name: k, value: k })));
   const currentVal = (project.env || {})[key];
-  const value = await ask(`New value for ${key}`, currentVal || '');
+
+  console.log();
+  const value = await ask(`New value for ${orange(key)}`, currentVal || '');
+  console.log();
 
   section('Applying update');
   await updateProjectEnv(project, key, value);
-  kvSuccess('Updated', `${key} → ${project.type === 'local' ? '.env.local' : 'Vercel + redeployed'}`);
+  kvSuccess('Updated', `${key}  →  ${project.type === 'local' ? '.env.local' : 'Vercel + redeployed'}`);
   endSections();
 }
 
@@ -173,17 +211,18 @@ async function rerun() {
 
   section('Re-run / re-open project');
   if (!projects.length) {
-    logInfo('No projects found');
-    log('Run: npx fabrica-e-commerce build');
+    logInfo('No projects found yet');
+    log(`Run ${cyan('npx fabrica-e-commerce build')} to create your first store`);
     endSections();
     return;
   }
+  kv('Total', String(projects.length) + ' project' + (projects.length !== 1 ? 's' : ''));
   endSections();
 
   const typeFilter = await choose('Which type of project?', [
-    { name: 'All projects',              value: 'all' },
-    { name: 'Local projects',            value: 'local' },
-    { name: 'Cloud (Vercel) projects',   value: 'cloud' },
+    { name: '📋  All projects',               value: 'all' },
+    { name: '💻  Local projects',             value: 'local' },
+    { name: '☁   Cloud (Vercel) projects',    value: 'cloud' },
   ]);
 
   const filtered = typeFilter === 'all' ? projects : projects.filter((p) => p.type === typeFilter);
@@ -200,12 +239,14 @@ async function rerun() {
   })));
   const project = filtered.find((p) => p.id === projectId);
 
-  section(`Re-running: ${bold(project.projectName)}`);
+  section(`Re-running — ${bold(orange(project.projectName))}`);
 
   if (project.type === 'local') {
-    kv('Path', project.target);
+    divider();
+    kv('Path', dim(project.target));
     kv('URL',  'http://localhost:3000');
-    log('Starting dev server — browser opens in 3s…');
+    log(dim('Starting dev server — browser opens in 3s…'));
+    divider();
     endSections();
 
     const { runCommand, runCommandCapture } = await import('./system.js');
@@ -217,11 +258,13 @@ async function rerun() {
     await runCommand(devCommand[0], devCommand[1], { cwd: project.target });
   } else {
     const url = project.productionUrl || null;
+    divider();
     kv('GitHub',  project.githubRepo || dim('n/a'));
     kv('URL',     url || dim('n/a'));
     kv('Inspect', project.inspectUrl || dim('n/a'));
-    kv('Created', project.createdAt || dim('unknown'));
-    if (url) log(`Opening ${url} …`);
+    kv('Created', project.createdAt ? project.createdAt.slice(0, 19).replace('T', ' ') : dim('unknown'));
+    divider();
+    if (url) log(dim(`Opening ${url}…`));
     endSections();
     if (url) await openUrl(url);
   }
@@ -230,14 +273,21 @@ async function rerun() {
 // ── info ──────────────────────────────────────────────────────────────────────
 async function info() {
   banner();
+  const version = await packageVersion();
+
   section('Package info');
-  kv('Package',    `fabrica-e-commerce v${await packageVersion()}`);
+  divider();
+  kvSuccess('Package',   `fabrica-e-commerce  v${version}`);
   kv('Bridge',     BRIDGE_ORIGIN);
   kv('Store repo', STORE_REPO);
-  kv('Local data', dataDir);
+  kv('Local data', dim(dataDir));
+  divider();
   kv('Node.js',    process.version);
   kv('Platform',   process.platform);
+  kv('Arch',       process.arch);
+  divider();
   kv('Creator',    'SPARROW AI SOLUTION');
+  kv('License',    'MIT');
   endSections();
 }
 
@@ -254,7 +304,9 @@ export async function run(args) {
   if (command === 'vins'  || command === '/vins')                        return vinsCommand();
   if (command === 'help'  || command === '--help' || command === '-h')   return help();
 
-  console.error(`Unknown command: ${command}`);
-  help();
+  section('Unknown command');
+  logWarn(`"${command}" is not a valid command`);
+  log(`Run ${cyan('npx fabrica-e-commerce help')} to see all commands`);
+  endSections();
   process.exitCode = 1;
 }

package/src/deploy.js

@@ -4,31 +4,96 @@ import crypto from 'node:crypto';
 import { HARDCODED_ENV, REQUIRED_ENV_KEYS, STORE_REPO } from './config.js';
 import { buildsDir, saveProject } from './store.js';
 import { runCommand, runCommandCapture, openUrl } from './system.js';
-import { kv, section, endSections, spinner, subBox, log, red, dimOrange } from './ui.js';
-import { ask, choose } from './prompt.js';
+import {
+  kv, kvSuccess, kvFail, kvPending, section, endSections, spinner,
+  subBox, log, logInfo, logWarn, logSuccess, divider,
+  orange, dimOrange, bold, dim, green, cyan, red, white, yellow,
+} from './ui.js';
+import { ask, askPassword, choose } from './prompt.js';
 
 const VERCEL_ENVIRONMENTS = ['production', 'preview', 'development'];
 
+// ── Env key descriptions ───────────────────────────────────────────────────────
+const ENV_DESCRIPTIONS = {
+  RAZORPAY_KEY_ID:     'Razorpay payment key ID',
+  RAZORPAY_KEY_SECRET: 'Razorpay payment secret',
+  OPENROUTER_API_KEY:  'OpenRouter AI API key',
+  UMAMI_WEBSITE_ID:    'Umami analytics website ID',
+  UMAMI_API_KEY:       'Umami analytics API key',
+  SHIPPO_API_KEY:      'Shippo shipping API key',
+};
+
 export async function collectEnv(supabase) {
+  // ── Show what will be collected ──────────────────────────────────────────────
   section('Environment variables');
+  logInfo('The following API keys are required for your store:');
+  divider();
+  for (const key of REQUIRED_ENV_KEYS) {
+    kvPending(key, ENV_DESCRIPTIONS[key] || '');
+  }
+  divider();
+  log(dim('Enter each value below — press Enter to confirm'));
+  endSections();
+
+  // ── Collect each key interactively ───────────────────────────────────────────
+  console.log();
   const env = { ...HARDCODED_ENV, SUPABASE_URL: supabase.url, SUPABASE_ANON_KEY: supabase.anonKey };
   for (const key of REQUIRED_ENV_KEYS) {
-    endSections();           // flush so the ask() prompt appears cleanly
-    env[key] = await ask(`${key}`);
-    section('Environment variables');
+    env[key] = await ask(key);
+  }
+  console.log();
+
+  // ── Summary ───────────────────────────────────────────────────────────────────
+  section('Environment variables — collected');
+  for (const key of REQUIRED_ENV_KEYS) {
+    kvSuccess(key, '••••••••');
   }
+  logSuccess('All API keys saved');
+  endSections();
+
   return env;
 }
 
+export async function collectAdminPassword() {
+  // ── Show intent box ──────────────────────────────────────────────────────────
+  section('Admin & edit panel password');
+  logInfo('Set a password to protect your store\'s admin and edit panel.');
+  log(dim('This will be stored as the PASS environment variable.'));
+  divider();
+  log(`${orange('PASS')}  ${dimOrange('→')}  ${dim('Admin panel access password')}`);
+  endSections();
+
+  // ── Prompt ────────────────────────────────────────────────────────────────────
+  console.log();
+  const password = await askPassword('Admin panel password (PASS)');
+  console.log();
+
+  // ── Confirm ───────────────────────────────────────────────────────────────────
+  section('Admin password — set');
+  kvSuccess('PASS', '••••••••  (stored securely)');
+  endSections();
+
+  return password;
+}
+
 export async function cloneRepo() {
   endSections();
   section('Clone storefront');
-  const projectName = await ask('Vercel project name', `fabrica-store-${Date.now()}`);
+  logInfo('Enter a name for your project (used as the Vercel project name).');
+  endSections();
+
+  console.log();
+  const projectName = await ask('Project name', `fabrica-store-${Date.now()}`);
+  console.log();
+
   section('Clone storefront');
   const id = crypto.randomUUID();
   const target = path.join(buildsDir, `${projectName}-${id.slice(0, 8)}`);
-  // git clone output goes directly to inherited stdio — show it outside the box
+  kv('Project', projectName);
+  kv('Destination', dim(target));
+  log(dim('Cloning repository — this may take a moment...'));
   endSections();
+
   await runCommand('git', ['clone', STORE_REPO, target]);
   return { id, projectName, target };
 }
@@ -40,23 +105,24 @@ export async function isLoggedInToVercel() {
 
 export async function ensureVercelLogin() {
   section('Vercel login');
-  const spin = spinner('Checking Vercel login');
+  const spin = spinner('Checking Vercel login…');
   if (await isLoggedInToVercel()) {
-    spin.succeed('Already logged in to Vercel');
+    spin.succeed(green('Already logged in to Vercel'));
+    endSections();
     return;
   }
   spin.fail('Not logged in to Vercel');
-  log('Opening "vercel login" — finish the login in your browser...');
+  log(dim('Opening "vercel login" — finish the login in your browser…'));
   endSections();
   await runCommand('npx', ['vercel@latest', 'login']);
   section('Vercel login');
   if (!(await isLoggedInToVercel())) {
     throw new Error('Vercel login was not completed. Run "fabrica build" again after logging in.');
   }
-  kv('Vercel', 'Logged in');
+  kvSuccess('Vercel', 'Logged in successfully');
+  endSections();
 }
 
-// Capture vercel CLI output and add it into the current section buffer as a subBox
 async function runVercelBoxed(args, options = {}) {
   const result = await runCommandCapture('npx', ['vercel@latest', ...args], options);
   const raw = ((result.stdout || '') + (result.stderr || '')).trim();
@@ -68,23 +134,35 @@ async function runVercelBoxed(args, options = {}) {
 }
 
 async function setEnvEverywhere(project, env) {
+  section('Setting environment variables');
+  logInfo(`Pushing ${Object.keys(env).length} variables to Vercel…`);
+  divider();
   for (const [key, value] of Object.entries(env)) {
     const spin = spinner(`Setting ${key}`);
     for (const environment of VERCEL_ENVIRONMENTS) {
       await runVercelBoxed(['env', 'rm', key, environment, '--yes'], { cwd: project.target, allowFailure: true });
       await runVercelBoxed(['env', 'add', key, environment], { cwd: project.target, input: `${value}\n` });
     }
-    spin.succeed(`Set ${key} (production, preview, development)`);
+    spin.succeed(`${green(key)}  ${dimOrange('→')}  ${dim('production · preview · development')}`);
   }
+  divider();
+  logSuccess('All environment variables pushed to Vercel');
 }
 
 async function connectGithubRepo(project, repoUrl) {
-  const spin = spinner(`Connecting Vercel project to ${repoUrl}`);
+  const spin = spinner(`Connecting Vercel project to GitHub…`);
   const attempts = 6;
   let lastError = '';
   for (let attempt = 1; attempt <= attempts; attempt++) {
-    const connect = await runCommandCapture('npx', ['--yes', 'vercel@latest', 'git', 'connect', repoUrl, '--yes'], { cwd: project.target });
-    if (connect.code === 0) { spin.succeed('Vercel project connected to GitHub repo'); return true; }
+    const connect = await runCommandCapture(
+      'npx',
+      ['--yes', 'vercel@latest', 'git', 'connect', repoUrl, '--yes'],
+      { cwd: project.target }
+    );
+    if (connect.code === 0) {
+      spin.succeed(`${green('GitHub repo connected')}  ${dim(repoUrl)}`);
+      return true;
+    }
     lastError = (connect.stderr || connect.stdout || '').trim();
     if (attempt < attempts) await new Promise((r) => setTimeout(r, attempt * 3000));
   }
@@ -111,9 +189,11 @@ export async function deployToVercel(project, env, githubRepo) {
     await connectGithubRepo(project, githubRepo.repoUrl);
   }
 
+  endSections();
   await setEnvEverywhere(project, env);
 
-  const deploySpin = spinner('Creating production deployment');
+  section('Vercel deployment');
+  const deploySpin = spinner('Creating production deployment…');
   const deployResult = await runCommandCapture('npx', ['vercel@latest', '--prod', '--yes'], { cwd: project.target });
   const deployOutput = ((deployResult.stdout || '') + (deployResult.stderr || '')).trim();
 
@@ -127,12 +207,11 @@ export async function deployToVercel(project, env, githubRepo) {
   }
 
   subBox(deployOutput.split('\n').filter(Boolean));
-  deploySpin.succeed('Production deployment created');
+  deploySpin.succeed('Production deployment created successfully');
 
   const openTarget = aliasedUrl || productionUrl;
   if (openTarget) {
-    kv('Opening', openTarget);
-    // open after flush
+    kv('Live URL', openTarget);
     process.nextTick(() => openUrl(openTarget));
   }
 
@@ -162,7 +241,7 @@ export async function updateProjectEnv(project, key, value) {
     if (idx >= 0) lines[idx] = `${key}=${value}`;
     else lines.push(`${key}=${value}`);
     await fs.writeFile(envPath, lines.join('\n'), 'utf8');
-    kv('Updated', `${key} in .env.local`);
+    kvSuccess('Updated', `${key} → .env.local`);
   } else {
     await ensureVercelLogin();
     section('Applying update');
@@ -170,9 +249,9 @@ export async function updateProjectEnv(project, key, value) {
       await runVercelBoxed(['env', 'rm', key, environment, '--yes'], { cwd: project.target, allowFailure: true });
       await runVercelBoxed(['env', 'add', key, environment], { cwd: project.target, input: `${value}\n` });
     }
-    const spin = spinner('Redeploying...');
+    const spin = spinner('Redeploying…');
     await runVercelBoxed(['--prod', '--yes'], { cwd: project.target });
-    spin.succeed(`Redeployed ${project.projectName}`);
+    spin.succeed(`Redeployed ${green(project.projectName)}`);
   }
   const updated = { ...project, env: { ...(project.env || {}), [key]: value } };
   await saveProject(updated);
@@ -180,10 +259,12 @@ export async function updateProjectEnv(project, key, value) {
 
 export async function runLocally(project, env) {
   section('Local setup');
+  logInfo('Writing environment file and starting dev server…');
+  divider();
   const envPath = path.join(project.target, '.env.local');
   const contents = Object.entries(env).map(([k, v]) => `${k}=${String(v).replace(/\n/g, '\\n')}`).join('\n') + '\n';
   await fs.writeFile(envPath, contents, 'utf8');
-  kv('Env file', envPath);
+  kvSuccess('Env file', envPath);
 
   const hasPnpmLock = await fs.access(path.join(project.target, 'pnpm-lock.yaml')).then(() => true, () => false);
   const pnpmAvailable = (await runCommandCapture('pnpm', ['--version'])).code === 0;
@@ -198,15 +279,18 @@ export async function runLocally(project, env) {
   await saveProject(record);
 
   kv('URL', 'http://localhost:3000');
-  log('Installing dependencies...');
+  log(dim('Installing dependencies — this may take a while…'));
   endSections();
+
   await runCommand(installCmd[0], installCmd[1], { cwd: project.target });
 
   section('Local app');
-  kv('Path', project.target);
+  kvSuccess('Project', project.projectName);
+  kv('Path', dim(project.target));
   kv('URL',  'http://localhost:3000');
-  log('Starting dev server — browser opens in 3s...');
+  log(dim('Starting dev server — browser opens in 3s…'));
   endSections();
+
   setTimeout(() => openUrl('http://localhost:3000'), 3000);
   await runCommand(devCmd[0], devCmd[1], { cwd: project.target });
 }