@igoruehara/canvas-flow 0.1.9 → 0.1.11

package/README.md

@@ -1,10 +1,11 @@
 # Canvas Flow
 
-Canvas Flow e uma aplicacao web local para criar, testar e executar fluxos de IA multiagente em formato visual. O pacote npm sobe frontend e backend juntos em um unico comando.
+Canvas Flow é uma aplicação web local para criar, testar e executar agentes de IA multiagente em formato visual, com canais prontos para WhatsApp e Web Widget. O pacote npm sobe frontend e backend juntos em um único comando.
 
 Use quando quiser:
 
-- criar automacoes com agentes de IA;
+- criar agentes de IA para atendimento e automação;
+- publicar agentes nos canais WhatsApp e Web Widget;
 - conectar prompts, ferramentas, webhooks e documentos;
 - testar fluxos localmente antes de publicar;
 - usar RAG com documentos;
@@ -42,7 +43,7 @@ http://localhost:3333
 - execucao local de frontend e API no mesmo processo Node;
 - configuracao de provedores de IA pela UI ou pelo `config.json`;
 - RAG com Milvus/Zilliz ou Azure AI Search;
-- entrada por API, webhook, web widget e canais configurados no app;
+- canais de entrada para WhatsApp, Web Widget, API e webhook;
 - chaves de API para consumir fluxos publicados;
 - validacao do ambiente com `doctor`.
 

package/bin/canvas-flow.js

@@ -465,6 +465,19 @@ function joinCorsOrigins(config, publicUrl, port) {
   ].join(',');
 }
 
+function isLoopbackUrl(value) {
+  try {
+    const hostname = new URL(value).hostname.toLowerCase();
+    return hostname === 'localhost'
+      || hostname === '::1'
+      || hostname === '[::1]'
+      || hostname === '0.0.0.0'
+      || hostname.startsWith('127.');
+  } catch {
+    return false;
+  }
+}
+
 function applyEnvironment(config, paths, flags) {
   const port = Number(flags.port || config.server.port || 3333);
   const publicUrl = String(flags['public-url'] || config.server.publicUrl || `http://localhost:${port}`).replace(/\/$/, '');
@@ -515,11 +528,18 @@ function applyEnvironment(config, paths, flags) {
   setEnv('MONGO_SERVER_SELECTION_TIMEOUT_MS', config.database.mongoServerSelectionTimeoutMs);
   setEnv('MONGO_CONNECT_TIMEOUT_MS', config.database.mongoConnectTimeoutMs);
 
-  setBoolEnv('CANVAS_FLOW_LOGIN', asBool(config.auth.login));
+  const loginRequired = asBool(config.auth.login);
+  const exposeApiTokenToFrontend = config.auth.exposeApiTokenToFrontend === true
+    || (!loginRequired && isLoopbackUrl(publicUrl));
+  setBoolEnv('CANVAS_FLOW_LOGIN', loginRequired);
   setEnv('CANVAS_FLOW_LOGIN_TTL_HOURS', config.auth.loginTtlHours);
   setEnv('CANVAS_FLOW_LOGIN_THROTTLE_WINDOW_MS', config.auth.loginThrottleWindowMs || 600000);
   setEnv('CANVAS_FLOW_LOGIN_MAX_ATTEMPTS', config.auth.loginMaxAttempts || 8);
   setEnv('CANVAS_FLOW_API_TOKEN', config.auth.apiToken);
+  delete process.env.CANVAS_FLOW_FRONTEND_API_TOKEN;
+  if (!loginRequired && exposeApiTokenToFrontend) {
+    setEnv('CANVAS_FLOW_FRONTEND_API_TOKEN', config.auth.apiToken);
+  }
   setEnv('CANVAS_FLOW_JWT_SECRET', config.auth.jwtSecret);
   setEnv('CANVAS_FLOW_MEDIA_PROXY_SECRET', config.auth.mediaProxySecret);
   setEnv('CANVAS_FLOW_MEDIA_PROXY_TTL_SECONDS', config.auth.mediaProxyTtlSeconds);
@@ -815,6 +835,59 @@ function sleep(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
 
+async function checkHttpOk(url, timeoutMs = 1200) {
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), timeoutMs);
+  try {
+    const response = await fetch(url, { signal: controller.signal });
+    return response.ok;
+  } catch {
+    return false;
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
+function startStartupStatus(publicUrl, options = {}) {
+  const healthUrl = `${String(publicUrl || '').replace(/\/$/, '')}/health`;
+  const startedAt = Date.now();
+  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);
+
+  const stop = () => {
+    if (stopped) return;
+    stopped = true;
+    clearInterval(interval);
+  };
+
+  void (async () => {
+    const deadline = Date.now() + 90000;
+    while (!stopped && Date.now() < deadline) {
+      if (await checkHttpOk(healthUrl)) {
+        stop();
+        console.log(`Canvas Flow ready: ${publicUrl}`);
+        if (options.openBrowser) openBrowser(publicUrl);
+        return;
+      }
+      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.');
+    }
+  })();
+
+  return { stop };
+}
+
 function mongoConnectionOptions(config) {
   return {
     serverSelectionTimeoutMS: Number(config.database?.mongoServerSelectionTimeoutMs || 8000),
@@ -1147,12 +1220,13 @@ async function start(flags) {
   }
 
   const shouldOpen = flags.open === true || (flags.open !== false && config.server.openBrowser === true);
-  if (shouldOpen) {
-    const timer = setTimeout(() => openBrowser(runtime.publicUrl), 1200);
-    if (typeof timer.unref === 'function') timer.unref();
+  const startupStatus = startStartupStatus(runtime.publicUrl, { openBrowser: shouldOpen });
+  try {
+    require(SERVER_ENTRY);
+  } catch (error) {
+    startupStatus.stop();
+    throw error;
   }
-
-  require(SERVER_ENTRY);
 }
 
 async function main() {

package/package.json

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