@igoruehara/canvas-flow 0.1.11 → 0.1.13

package/bin/canvas-flow.js

@@ -20,6 +20,56 @@ const INFRA_PROJECT_NAME = 'canvas-flow';
 const INFRA_BASE_SERVICES = ['mongo'];
 const INFRA_FULL_SERVICES = ['mongo', 'etcd', 'minio', 'milvus'];
 
+const STARTUP_BANNER = [
+  '   ______                            ________               ',
+  '  / ____/___ _____ _   ______ ______/ ____/ /___ _      __ ',
+  " / /   / __ '/ __ \\ | / / __ '/ ___/ /_  / / __ \\ | /| / / ",
+  '/ /___/ /_/ / / / / |/ / /_/ (__  ) __/ / / /_/ / |/ |/ /  ',
+  '\\____/\\__,_/_/ /_/|___/\\__,_/____/_/   /_/\\____/|__/|__/   ',
+].join('\n');
+
+function envFlagEnabled(name) {
+  return ['1', 'true', 'yes', 'sim', 'on'].includes(String(process.env[name] || '').trim().toLowerCase());
+}
+
+function shouldUseAnsiColor() {
+  if (process.env.NO_COLOR) return false;
+  return Boolean(process.stdout.isTTY || process.env.FORCE_COLOR);
+}
+
+function colorAnsi(text, code) {
+  return shouldUseAnsiColor() ? `\x1b[${code}m${text}\x1b[0m` : text;
+}
+
+function shouldPrintStartupBanner(flags = {}) {
+  if (flags.banner === false || envFlagEnabled('CANVAS_FLOW_NO_BANNER')) return false;
+  if (process.env.CI && !envFlagEnabled('CANVAS_FLOW_BANNER')) return false;
+  return Boolean(process.stdout.isTTY || envFlagEnabled('CANVAS_FLOW_BANNER'));
+}
+
+function boxLine(text, width = 74) {
+  const safeText = String(text || '').slice(0, width - 4);
+  return `| ${safeText.padEnd(width - 4, ' ')} |`;
+}
+
+function printStartupBanner(flags = {}) {
+  if (!shouldPrintStartupBanner(flags)) return;
+
+  const border = '+'.padEnd(75, '-') + '+';
+  const box = [
+    border,
+    boxLine('Canvas Flow standalone runtime'),
+    boxLine('Tip: use --with-docker for local Mongo, or --full for Mongo + Milvus.'),
+    boxLine('Docs: https://igoruehara.github.io/canvas-flow/'),
+    border,
+  ].join('\n');
+
+  console.log('');
+  console.log(colorAnsi(STARTUP_BANNER.trimEnd(), '95'));
+  console.log(colorAnsi(box, '36'));
+  console.log('');
+}
+
 function printHelp() {
   console.log(`
 Canvas Flow standalone
@@ -44,6 +94,7 @@ Options:
   --public-url <url>          Override server.publicUrl
   --open                      Open the browser after starting
   --no-open                   Do not open the browser
+  --no-banner                 Do not print the startup banner
   --with-docker               Start local Docker infrastructure before Canvas Flow
   --full                      Include Milvus, MinIO and etcd with Docker infrastructure
   --show                      Show config content with "init" or "config"
@@ -835,6 +886,70 @@ function sleep(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
 
+function createStartupProgress() {
+  const frames = ['-', '\\', '|', '/'];
+  const useTty = Boolean(process.stdout.isTTY && !process.env.CI);
+  let frameIndex = 0;
+  let lastLength = 0;
+  let interval;
+  let percent = 0;
+  let message = 'starting';
+
+  const line = () => `${frames[frameIndex]} Canvas Flow startup ${String(percent).padStart(3, ' ')}% - ${message}`;
+  const clearLine = () => {
+    if (!useTty || !lastLength) return;
+    process.stdout.write(`\r${' '.repeat(lastLength)}\r`);
+    lastLength = 0;
+  };
+  const render = () => {
+    if (!useTty) return;
+    const text = line();
+    const padded = text.padEnd(lastLength, ' ');
+    lastLength = Math.max(lastLength, text.length);
+    process.stdout.write(`\r${padded}`);
+  };
+  const ensureInterval = () => {
+    if (!useTty || interval) return;
+    interval = setInterval(() => {
+      frameIndex = (frameIndex + 1) % frames.length;
+      render();
+    }, 140);
+    if (typeof interval.unref === 'function') interval.unref();
+  };
+  const stopInterval = () => {
+    if (!interval) return;
+    clearInterval(interval);
+    interval = undefined;
+  };
+
+  return {
+    update(nextPercent, nextMessage) {
+      percent = Math.max(percent, Math.min(99, Number(nextPercent) || percent));
+      message = nextMessage || message;
+      ensureInterval();
+      if (useTty) render();
+      else console.log(`Canvas Flow startup ${percent}% - ${message}`);
+    },
+    log(text) {
+      clearLine();
+      console.log(text);
+      render();
+    },
+    done(text) {
+      percent = 100;
+      message = 'ready';
+      stopInterval();
+      clearLine();
+      console.log(text || 'Canvas Flow ready (100%)');
+    },
+    fail(text) {
+      stopInterval();
+      clearLine();
+      if (text) console.log(text);
+    },
+  };
+}
+
 async function checkHttpOk(url, timeoutMs = 1200) {
   const controller = new AbortController();
   const timer = setTimeout(() => controller.abort(), timeoutMs);
@@ -851,37 +966,37 @@ async function checkHttpOk(url, timeoutMs = 1200) {
 function startStartupStatus(publicUrl, options = {}) {
   const healthUrl = `${String(publicUrl || '').replace(/\/$/, '')}/health`;
   const startedAt = Date.now();
+  const progress = options.progress || createStartupProgress();
   let stopped = false;
-
-  console.log('Canvas Flow startup: loading application bundle...');
-  console.log(`Canvas Flow startup: waiting for backend health at ${healthUrl}`);
-
-  const interval = setInterval(() => {
-    const elapsedSeconds = Math.max(1, Math.round((Date.now() - startedAt) / 1000));
-    console.log(`Canvas Flow startup: still starting (${elapsedSeconds}s elapsed)...`);
-  }, 2500);
+  let nextHealthLogAt = 0;
 
   const stop = () => {
     if (stopped) return;
     stopped = true;
-    clearInterval(interval);
   };
 
   void (async () => {
     const deadline = Date.now() + 90000;
+    progress.update(90, `waiting for backend health at ${healthUrl}`);
     while (!stopped && Date.now() < deadline) {
       if (await checkHttpOk(healthUrl)) {
         stop();
-        console.log(`Canvas Flow ready: ${publicUrl}`);
+        progress.done(`Canvas Flow ready (100%): ${publicUrl}`);
         if (options.openBrowser) openBrowser(publicUrl);
         return;
       }
+      const elapsedSeconds = Math.max(1, Math.round((Date.now() - startedAt) / 1000));
+      if (elapsedSeconds >= nextHealthLogAt) {
+        const nextPercent = Math.min(98, 90 + Math.floor(elapsedSeconds / 15));
+        progress.update(nextPercent, `waiting for backend health (${elapsedSeconds}s elapsed)`);
+        nextHealthLogAt = elapsedSeconds + 3;
+      }
       await sleep(500);
     }
 
     if (!stopped) {
       stop();
-      console.log('Canvas Flow startup: health check is still pending. Keep this terminal open and watch the backend logs above.');
+      progress.fail('Canvas Flow startup: health check is still pending. Keep this terminal open and watch the backend logs above.');
     }
   })();
 
@@ -1161,8 +1276,11 @@ async function doctor(flags) {
   reporter.finish();
 }
 
-async function waitForMongo(config, flags, paths) {
-  if (flags['skip-mongo-check'] === true) return;
+async function waitForMongo(config, flags, paths, progress) {
+  if (flags['skip-mongo-check'] === true) {
+    if (progress) progress.update(45, 'MongoDB preflight skipped');
+    return;
+  }
   if (!config.database.mongoUrl) {
     throw new Error(`database.mongoUrl is required. Edit the config with: canvas-flow config --edit`);
   }
@@ -1174,15 +1292,18 @@ async function waitForMongo(config, flags, paths) {
   let lastMessage = '';
 
   for (let attempt = 1; attempt <= attempts; attempt += 1) {
+    if (progress) progress.update(30, `checking MongoDB (${attempt}/${attempts})`);
     const result = await checkMongoConnection(config.database.mongoUrl, options);
     if (result.ok) {
-      console.log('MongoDB preflight: connected');
+      if (progress) progress.update(55, 'MongoDB connected');
+      else console.log('MongoDB preflight: connected');
       return;
     }
 
     lastMessage = result.message;
     if (attempt < attempts) {
-      console.log(`MongoDB preflight waiting (${attempt}/${attempts}): ${result.message}`);
+      if (progress) progress.update(35, `waiting for MongoDB (${attempt}/${attempts})`);
+      else console.log(`MongoDB preflight waiting (${attempt}/${attempts}): ${result.message}`);
       await sleep(1500);
     }
   }
@@ -1196,35 +1317,45 @@ async function waitForMongo(config, flags, paths) {
 }
 
 async function start(flags) {
-  assertBundleExists();
-  addSourceDependencyFallback();
-  if (flags['with-docker'] === true || flags.infra === true) {
-    infra('up', flags);
-  }
-  const paths = resolvePaths(flags);
-  ensureDir(paths.homeDir);
-  const configExisted = fs.existsSync(paths.configPath);
-  const config = loadConfig(paths.configPath);
-  const runtime = applyEnvironment(config, paths, flags);
-  await waitForMongo(config, flags, paths);
-
-  process.chdir(paths.homeDir);
-
-  console.log(`Canvas Flow config: ${paths.configPath}`);
-  console.log(`Canvas Flow home:   ${paths.homeDir}`);
-  console.log(`Canvas Flow URL:    ${runtime.publicUrl}`);
-  if (!configExisted) {
-    console.log('Created the default config.json.');
-    console.log('Edit it with: canvas-flow config --edit');
-    console.log('Show it with: canvas-flow config --show');
-  }
-
-  const shouldOpen = flags.open === true || (flags.open !== false && config.server.openBrowser === true);
-  const startupStatus = startStartupStatus(runtime.publicUrl, { openBrowser: shouldOpen });
+  printStartupBanner(flags);
+  const progress = createStartupProgress();
+  let startupStatus;
   try {
+    progress.update(5, 'checking package bundle');
+    assertBundleExists();
+    progress.update(10, 'loading runtime dependencies');
+    addSourceDependencyFallback();
+    if (flags['with-docker'] === true || flags.infra === true) {
+      progress.log('Canvas Flow startup: starting Docker infrastructure...');
+      infra('up', flags);
+    }
+    progress.update(15, 'loading config');
+    const paths = resolvePaths(flags);
+    ensureDir(paths.homeDir);
+    const configExisted = fs.existsSync(paths.configPath);
+    const config = loadConfig(paths.configPath);
+    progress.update(25, 'applying environment');
+    const runtime = applyEnvironment(config, paths, flags);
+    await waitForMongo(config, flags, paths, progress);
+
+    process.chdir(paths.homeDir);
+
+    progress.log(`Canvas Flow config: ${paths.configPath}`);
+    progress.log(`Canvas Flow home:   ${paths.homeDir}`);
+    progress.log(`Canvas Flow URL:    ${runtime.publicUrl}`);
+    if (!configExisted) {
+      progress.log('Created the default config.json.');
+      progress.log('Edit it with: canvas-flow config --edit');
+      progress.log('Show it with: canvas-flow config --show');
+    }
+
+    const shouldOpen = flags.open === true || (flags.open !== false && config.server.openBrowser === true);
+    progress.update(75, 'starting Canvas Flow API');
+    startupStatus = startStartupStatus(runtime.publicUrl, { openBrowser: shouldOpen, progress });
     require(SERVER_ENTRY);
   } catch (error) {
-    startupStatus.stop();
+    if (startupStatus) startupStatus.stop();
+    progress.fail('Canvas Flow startup failed.');
     throw error;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@igoruehara/canvas-flow",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "Standalone npm launcher for Canvas Flow multi-agent GenAI workflows.",
   "homepage": "https://github.com/igoruehara/canvas-flow#readme",
   "repository": {