From eceb170df03721dca4183b658c863b94fa04bc84 Mon Sep 17 00:00:00 2001
From: cheveguerra <cheveguerra@gmail.com>
Date: Wed, 11 Jan 2023 10:36:18 -0600
Subject: [PATCH 01/11] feat: mod de starters para habiltar portal

Modificacion de starters para habiltar el portal para el QR
---
 starters/apps/base-baileys-json/app.js        |  64 +++++++---
 starters/apps/base-baileys-memory/app.js      |  64 +++++++---
 starters/apps/base-baileys-mongo/app.js       | 108 +++++++++--------
 starters/apps/base-baileys-mysql/app.js       | 108 +++++++++--------
 .../apps/base-baileys-mysql/public/index.html |  80 -------------
 .../apps/base-baileys-mysql/server.http.js    |  34 ------
 starters/apps/base-meta-json/app.js           | 104 +++++++++--------
 starters/apps/base-meta-memory/app.js         | 104 +++++++++--------
 starters/apps/base-meta-mongo/app.js          | 104 +++++++++--------
 starters/apps/base-meta-mysql/app.js          | 104 +++++++++--------
 starters/apps/base-twilio-json/app.js         | 104 +++++++++--------
 starters/apps/base-twilio-memory/app.js       | 104 +++++++++--------
 starters/apps/base-twilio-mongo/app.js        | 104 +++++++++--------
 starters/apps/base-twilio-mysql/app.js        | 104 +++++++++--------
 starters/apps/base-venom-json/app.js          | 108 +++++++++--------
 .../apps/base-venom-json/public/index.html    |  80 -------------
 starters/apps/base-venom-json/server.http.js  |  34 ------
 starters/apps/base-venom-memory/app.js        | 108 +++++++++--------
 .../apps/base-venom-memory/public/index.html  |  80 -------------
 .../apps/base-venom-memory/server.http.js     |  34 ------
 starters/apps/base-venom-mongo/app.js         | 108 +++++++++--------
 .../apps/base-venom-mongo/public/index.html   |  80 -------------
 starters/apps/base-venom-mongo/server.http.js |  34 ------
 starters/apps/base-venom-mysql/app.js         | 108 +++++++++--------
 .../apps/base-venom-mysql/public/index.html   |  80 -------------
 starters/apps/base-venom-mysql/server.http.js |  34 ------
 starters/apps/base-wweb-json/app.js           | 108 +++++++++--------
 .../apps/base-wweb-json/public/index.html     |  80 -------------
 starters/apps/base-wweb-json/server.http.js   |  34 ------
 starters/apps/base-wweb-memory/app.js         | 108 +++++++++--------
 .../apps/base-wweb-memory/public/index.html   |  80 -------------
 starters/apps/base-wweb-memory/server.http.js |  34 ------
 starters/apps/base-wweb-mongo/app.js          | 109 ++++++++++--------
 .../apps/base-wweb-mongo/public/index.html    |  80 -------------
 starters/apps/base-wweb-mongo/server.http.js  |  34 ------
 starters/apps/base-wweb-mysql/app.js          | 108 +++++++++--------
 .../apps/base-wweb-mysql/public/index.html    |  80 -------------
 starters/apps/base-wweb-mysql/server.http.js  |  34 ------
 38 files changed, 1174 insertions(+), 1893 deletions(-)
 delete mode 100644 starters/apps/base-baileys-mysql/public/index.html
 delete mode 100644 starters/apps/base-baileys-mysql/server.http.js
 delete mode 100644 starters/apps/base-venom-json/public/index.html
 delete mode 100644 starters/apps/base-venom-json/server.http.js
 delete mode 100644 starters/apps/base-venom-memory/public/index.html
 delete mode 100644 starters/apps/base-venom-memory/server.http.js
 delete mode 100644 starters/apps/base-venom-mongo/public/index.html
 delete mode 100644 starters/apps/base-venom-mongo/server.http.js
 delete mode 100644 starters/apps/base-venom-mysql/public/index.html
 delete mode 100644 starters/apps/base-venom-mysql/server.http.js
 delete mode 100644 starters/apps/base-wweb-json/public/index.html
 delete mode 100644 starters/apps/base-wweb-json/server.http.js
 delete mode 100644 starters/apps/base-wweb-memory/public/index.html
 delete mode 100644 starters/apps/base-wweb-memory/server.http.js
 delete mode 100644 starters/apps/base-wweb-mongo/public/index.html
 delete mode 100644 starters/apps/base-wweb-mongo/server.http.js
 delete mode 100644 starters/apps/base-wweb-mysql/public/index.html
 delete mode 100644 starters/apps/base-wweb-mysql/server.http.js

diff --git a/starters/apps/base-baileys-json/app.js b/starters/apps/base-baileys-json/app.js
index 67d4be6..b06887c 100644
--- a/starters/apps/base-baileys-json/app.js
+++ b/starters/apps/base-baileys-json/app.js
@@ -9,31 +9,59 @@ const QRPortalWeb = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const JsonFileAdapter = require('@bot-whatsapp/database/json')
 
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
+
 const flowDocs = addKeyword([
     'doc',
     'documentacion',
     'documentación',
-]).addAnswer([
-    '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
-    'https://bot-whatsapp.netlify.app/',
-])
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer([
-    '🙌 Aquí encontras un ejemplo rapido',
-    'https://bot-whatsapp.netlify.app/docs/example/',
-])
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowGracias = addKeyword(['gracias', 'grac']).addAnswer([
-    '🚀 Puedes aportar tu granito de arena a este proyecto',
-    '[*opencollective*] https://opencollective.com/bot-whatsapp',
-    '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
-    '[*patreon*] https://www.patreon.com/leifermendez',
-])
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowDiscord = addKeyword(['discord']).addAnswer([
-    '🤪 Únete al discord',
-    'https://link.codigoencasa.com/DISCORD',
-])
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
     .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
diff --git a/starters/apps/base-baileys-memory/app.js b/starters/apps/base-baileys-memory/app.js
index a8fbd00..3d05e79 100644
--- a/starters/apps/base-baileys-memory/app.js
+++ b/starters/apps/base-baileys-memory/app.js
@@ -9,31 +9,59 @@ const QRPortalWeb = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const MockAdapter = require('@bot-whatsapp/database/mock')
 
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
+
 const flowDocs = addKeyword([
     'doc',
     'documentacion',
     'documentación',
-]).addAnswer([
-    '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
-    'https://bot-whatsapp.netlify.app/',
-])
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer([
-    '🙌 Aquí encontras un ejemplo rapido',
-    'https://bot-whatsapp.netlify.app/docs/example/',
-])
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowGracias = addKeyword(['gracias', 'grac']).addAnswer([
-    '🚀 Puedes aportar tu granito de arena a este proyecto',
-    '[*opencollective*] https://opencollective.com/bot-whatsapp',
-    '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
-    '[*patreon*] https://www.patreon.com/leifermendez',
-])
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowDiscord = addKeyword(['discord']).addAnswer([
-    '🤪 Únete al discord',
-    'https://link.codigoencasa.com/DISCORD',
-])
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
     .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
diff --git a/starters/apps/base-baileys-mongo/app.js b/starters/apps/base-baileys-mongo/app.js
index 277115d..253d1fa 100644
--- a/starters/apps/base-baileys-mongo/app.js
+++ b/starters/apps/base-baileys-mongo/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
@@ -29,58 +28,72 @@ const MONGO_DB_NAME = 'db_bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -95,6 +108,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-baileys-mysql/app.js b/starters/apps/base-baileys-mysql/app.js
index 02a13c0..3dc800b 100644
--- a/starters/apps/base-baileys-mysql/app.js
+++ b/starters/apps/base-baileys-mysql/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 
@@ -30,58 +29,72 @@ const MYSQL_DB_NAME = 'bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -98,6 +111,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-baileys-mysql/public/index.html b/starters/apps/base-baileys-mysql/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-baileys-mysql/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-baileys-mysql/server.http.js b/starters/apps/base-baileys-mysql/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-baileys-mysql/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-meta-json/app.js b/starters/apps/base-meta-json/app.js
index 49dd430..cc4c7ac 100644
--- a/starters/apps/base-meta-json/app.js
+++ b/starters/apps/base-meta-json/app.js
@@ -20,58 +20,72 @@ const JsonFileAdapter = require('@bot-whatsapp/database/json')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-meta-memory/app.js b/starters/apps/base-meta-memory/app.js
index 288929c..c8201e8 100644
--- a/starters/apps/base-meta-memory/app.js
+++ b/starters/apps/base-meta-memory/app.js
@@ -20,58 +20,72 @@ const MockAdapter = require('@bot-whatsapp/database/mock')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-meta-mongo/app.js b/starters/apps/base-meta-mongo/app.js
index f40a6a2..18cd9ac 100644
--- a/starters/apps/base-meta-mongo/app.js
+++ b/starters/apps/base-meta-mongo/app.js
@@ -27,58 +27,72 @@ const MONGO_DB_NAME = 'db_bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-meta-mysql/app.js b/starters/apps/base-meta-mysql/app.js
index 25b171c..102f977 100644
--- a/starters/apps/base-meta-mysql/app.js
+++ b/starters/apps/base-meta-mysql/app.js
@@ -28,58 +28,72 @@ const MYSQL_DB_NAME = 'bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-twilio-json/app.js b/starters/apps/base-twilio-json/app.js
index 190e842..047a126 100644
--- a/starters/apps/base-twilio-json/app.js
+++ b/starters/apps/base-twilio-json/app.js
@@ -20,58 +20,72 @@ const JsonFileAdapter = require('@bot-whatsapp/database/json')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-twilio-memory/app.js b/starters/apps/base-twilio-memory/app.js
index 9730709..cc1d16b 100644
--- a/starters/apps/base-twilio-memory/app.js
+++ b/starters/apps/base-twilio-memory/app.js
@@ -20,58 +20,72 @@ const MockAdapter = require('@bot-whatsapp/database/mock')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-twilio-mongo/app.js b/starters/apps/base-twilio-mongo/app.js
index 9e5e3f7..dcabb99 100644
--- a/starters/apps/base-twilio-mongo/app.js
+++ b/starters/apps/base-twilio-mongo/app.js
@@ -27,58 +27,72 @@ const MONGO_DB_NAME = 'db_bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-twilio-mysql/app.js b/starters/apps/base-twilio-mysql/app.js
index 7100f9c..4725cd3 100644
--- a/starters/apps/base-twilio-mysql/app.js
+++ b/starters/apps/base-twilio-mysql/app.js
@@ -29,58 +29,72 @@ const MYSQL_DB_NAME = 'bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
diff --git a/starters/apps/base-venom-json/app.js b/starters/apps/base-venom-json/app.js
index c742f78..c399b5e 100644
--- a/starters/apps/base-venom-json/app.js
+++ b/starters/apps/base-venom-json/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const JsonFileAdapter = require('@bot-whatsapp/database/json')
 
@@ -22,58 +21,72 @@ const JsonFileAdapter = require('@bot-whatsapp/database/json')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -85,6 +98,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-venom-json/public/index.html b/starters/apps/base-venom-json/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-venom-json/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-venom-json/server.http.js b/starters/apps/base-venom-json/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-venom-json/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-venom-memory/app.js b/starters/apps/base-venom-memory/app.js
index 6f89ef2..c539f36 100644
--- a/starters/apps/base-venom-memory/app.js
+++ b/starters/apps/base-venom-memory/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MockAdapter = require('@bot-whatsapp/database/mock')
 
@@ -22,58 +21,72 @@ const MockAdapter = require('@bot-whatsapp/database/mock')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -85,6 +98,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-venom-memory/public/index.html b/starters/apps/base-venom-memory/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-venom-memory/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-venom-memory/server.http.js b/starters/apps/base-venom-memory/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-venom-memory/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-venom-mongo/app.js b/starters/apps/base-venom-mongo/app.js
index d8de982..bae23f8 100644
--- a/starters/apps/base-venom-mongo/app.js
+++ b/starters/apps/base-venom-mongo/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
@@ -29,58 +28,72 @@ const MONGO_DB_NAME = 'db_bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -95,6 +108,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-venom-mongo/public/index.html b/starters/apps/base-venom-mongo/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-venom-mongo/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-venom-mongo/server.http.js b/starters/apps/base-venom-mongo/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-venom-mongo/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-venom-mysql/app.js b/starters/apps/base-venom-mysql/app.js
index 24da8ee..737dc99 100644
--- a/starters/apps/base-venom-mysql/app.js
+++ b/starters/apps/base-venom-mysql/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 
@@ -31,58 +30,72 @@ const MYSQL_DB_NAME = 'bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -99,6 +112,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-venom-mysql/public/index.html b/starters/apps/base-venom-mysql/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-venom-mysql/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-venom-mysql/server.http.js b/starters/apps/base-venom-mysql/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-venom-mysql/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-wweb-json/app.js b/starters/apps/base-wweb-json/app.js
index 31f03dd..3144bd0 100644
--- a/starters/apps/base-wweb-json/app.js
+++ b/starters/apps/base-wweb-json/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const JsonFileAdapter = require('@bot-whatsapp/database/json')
 
@@ -22,58 +21,72 @@ const JsonFileAdapter = require('@bot-whatsapp/database/json')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -85,6 +98,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-wweb-json/public/index.html b/starters/apps/base-wweb-json/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-wweb-json/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-wweb-json/server.http.js b/starters/apps/base-wweb-json/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-wweb-json/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-wweb-memory/app.js b/starters/apps/base-wweb-memory/app.js
index 5318283..29eb0bc 100644
--- a/starters/apps/base-wweb-memory/app.js
+++ b/starters/apps/base-wweb-memory/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MockAdapter = require('@bot-whatsapp/database/mock')
 
@@ -22,58 +21,72 @@ const MockAdapter = require('@bot-whatsapp/database/mock')
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -85,6 +98,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-wweb-memory/public/index.html b/starters/apps/base-wweb-memory/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-wweb-memory/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-wweb-memory/server.http.js b/starters/apps/base-wweb-memory/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-wweb-memory/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-wweb-mongo/app.js b/starters/apps/base-wweb-mongo/app.js
index 34f3887..43eed81 100644
--- a/starters/apps/base-wweb-mongo/app.js
+++ b/starters/apps/base-wweb-mongo/app.js
@@ -4,12 +4,10 @@ const {
     createFlow,
     addKeyword,
 } = require('@bot-whatsapp/bot')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
-require('./server.http')
-
 /**
  * Declaramos las conexiones de Mongo
  */
@@ -29,58 +27,72 @@ const MONGO_DB_NAME = 'db_bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -95,6 +107,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-wweb-mongo/public/index.html b/starters/apps/base-wweb-mongo/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-wweb-mongo/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-wweb-mongo/server.http.js b/starters/apps/base-wweb-mongo/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-wweb-mongo/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))
diff --git a/starters/apps/base-wweb-mysql/app.js b/starters/apps/base-wweb-mysql/app.js
index 2095842..2b31f4a 100644
--- a/starters/apps/base-wweb-mysql/app.js
+++ b/starters/apps/base-wweb-mysql/app.js
@@ -5,8 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-require('./server.http')
-
+const QRPortal = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 
@@ -31,58 +30,72 @@ const MYSQL_DB_NAME = 'bot'
  * Primero declaras los submenus 1.1 y 2.1, luego el 1 y 2 y al final el principal.
  */
 
-const flowBolsos2 = addKeyword(['bolsos2', '2'])
-    .addAnswer('🤯 *MUCHOS* bolsos ...')
-    .addAnswer('y mas bolsos... bla bla')
+const flowSecundario = addKeyword(['2', 'siguiente']).addAnswer([
+    '📄 Aquí tenemos el flujo secundario',
+])
 
-const flowZapatos2 = addKeyword(['zapatos2', '2'])
-    .addAnswer('🤯 repito que tengo *MUCHOS* zapatos.')
-    .addAnswer('y algunas otras cosas.')
+const flowDocs = addKeyword([
+    'doc',
+    'documentacion',
+    'documentación',
+]).addAnswer(
+    [
+        '📄 Aquí encontras las documentación recuerda que puedes mejorarla',
+        'https://bot-whatsapp.netlify.app/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowZapatos = addKeyword(['1', 'zapatos', 'ZAPATOS'])
-    .addAnswer('🤯 Veo que elegiste zapatos')
-    .addAnswer('Tengo muchos zapatos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Zapatos2*', 'para mas información'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowZapatos2]
-    )
+const flowTuto = addKeyword(['tutorial', 'tuto']).addAnswer(
+    [
+        '🙌 Aquí encontras un ejemplo rapido',
+        'https://bot-whatsapp.netlify.app/docs/example/',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-const flowBolsos = addKeyword(['2', 'bolsos', 'BOLSOS'])
-    .addAnswer('🙌 Veo que elegiste bolsos')
-    .addAnswer('Tengo muchos bolsos...bla bla')
-    .addAnswer(
-        ['Manda:', '*(2) Bolsos2*', 'para mas información.'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos2]
-    )
+const flowGracias = addKeyword(['gracias', 'grac']).addAnswer(
+    [
+        '🚀 Puedes aportar tu granito de arena a este proyecto',
+        '[*opencollective*] https://opencollective.com/bot-whatsapp',
+        '[*buymeacoffee*] https://www.buymeacoffee.com/leifermendez',
+        '[*patreon*] https://www.patreon.com/leifermendez',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
-/**
- * Declarando flujo principal
- */
+const flowDiscord = addKeyword(['discord']).addAnswer(
+    [
+        '🤪 Únete al discord',
+        'https://link.codigoencasa.com/DISCORD',
+        '\n*2* Para siguiente paso.',
+    ],
+    null,
+    null,
+    [flowSecundario]
+)
 
 const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
-    .addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
-    .addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
+    .addAnswer('🙌 Hola bienvenido a este *Chatbot*')
     .addAnswer(
-        ['Para continuar escribe:', '*(1) Zapatos*', '*(2) Bolsos*'],
-        { capture: true },
-        (ctx) => {
-            console.log('Aqui puedes ver más info del usuario...')
-            console.log('Puedes enviar un mail, hook, etc..')
-            console.log(ctx)
-        },
-        [flowBolsos, flowZapatos]
+        [
+            'te comparto los siguientes links de interes sobre el proyecto',
+            '👉 *doc* para ver la documentación',
+            '👉 *gracias*  para ver la lista de videos',
+            '👉 *discord* unirte al discord',
+        ],
+        null,
+        null,
+        [flowDocs, flowGracias, flowTuto, flowDiscord]
     )
 
 const main = async () => {
@@ -99,6 +112,7 @@ const main = async () => {
         provider: adapterProvider,
         database: adapterDB,
     })
+    QRPortalWeb()
 }
 
 main()
diff --git a/starters/apps/base-wweb-mysql/public/index.html b/starters/apps/base-wweb-mysql/public/index.html
deleted file mode 100644
index 202b50c..0000000
--- a/starters/apps/base-wweb-mysql/public/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
-<!DOCTYPE html>
-<html lang="es">
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-        <title>🤖 Crear chatbot WhatsApp en minutos</title>
-        <style>
-            html,
-            body {
-                display: flex;
-                margin: 0;
-                padding: 0;
-                width: 100%;
-                height: 100%;
-                justify-content: center;
-                align-self: center;
-                align-items: center;
-                font-family: 'Inter', sans-serif;
-            }
-        </style>
-    </head>
-    <body>
-        <div
-            style="
-                display: flex;
-                gap: 2rem;
-                justify-content: center;
-                align-items: center;
-            "
-        >
-            <img
-                style="
-                    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
-                        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
-                    border-radius: 15px;
-                    object-fit: contain;
-                "
-                width="400"
-                height="400"
-                src="qr.png"
-                alt="Escanear QR"
-            />
-            <div style="width: 400px; display: grid; gap: 1rem">
-                <h1 style="margin: 0">Whatsapp QR</h1>
-                <p>
-                    <strong
-                        >F5 para actualizar, el codigo se actualiza cada minuto. </strong
-                    ><br />
-                    Con esta libreria, puedes configurar respuestas
-                    automatizadas para preguntas frecuentes , recibir y
-                    responder mensajes de manera automatizada, y hacer un
-                    seguimiento de las interacciones con los clientes. Además,
-                    nuestro Chatbot se integra fácilmente con otros sistemas y
-                    herramientas que ya esté utilizando en su negocio.
-                </p>
-                <div>
-                    <a
-                        target="_blank"
-                        style="
-                            background: white;
-                            box-shadow: rgb(0 0 0 / 16%) 0px 10px 36px 0px,
-                                rgb(0 0 0 / 6%) 0px 0px 0px 1px;
-                            padding: 10px;
-                            border-radius: 5px;
-                            font-weight: 600;
-                            text-decoration: none;
-                            color: #1a1a1a;
-                            border: solid 1px #afafaf;
-                        "
-                        href="https://bot-whatsapp.netlify.app/"
-                        >Ver documentación</a
-                    >
-                </div>
-            </div>
-        </div>
-    </body>
-</html>
diff --git a/starters/apps/base-wweb-mysql/server.http.js b/starters/apps/base-wweb-mysql/server.http.js
deleted file mode 100644
index 217bd71..0000000
--- a/starters/apps/base-wweb-mysql/server.http.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const http = require('http')
-const fs = require('fs')
-const path = require('path')
-
-const PORT = process.env.PORT || 3000
-
-/**
- * Levantar un HTTP Server
- */
-http.createServer(function (req, res) {
-    var cssPath = undefined
-    var fileStream = undefined
-    var imagePath = undefined
-
-    if (req.url === '/') {
-        fs.readFile('./public/index.html', 'UTF-8', function (err, html) {
-            res.writeHead(200, { 'Content-Type': 'text/html' })
-            res.end(html)
-        })
-    } else if (req.url.match('.css$')) {
-        cssPath = path.join(__dirname, 'public', req.url)
-        fileStream = fs.createReadStream(cssPath, 'UTF-8')
-        res.writeHead(200, { 'Content-Type': 'text/css' })
-        fileStream.pipe(res)
-    } else if (req.url.match('.png$')) {
-        imagePath = path.join(__dirname, req.url)
-        fileStream = fs.createReadStream(imagePath)
-        res.writeHead(200, { 'Content-Type': 'image/png' })
-        fileStream.pipe(res)
-    } else {
-        res.writeHead(404, { 'Content-Type': 'text/html' })
-        res.end('No Page Found')
-    }
-}).listen(PORT, () => console.log(`Escanear QR Code http://localhost:${PORT}`))

From f430380b4f23d41702395c96c628bf13bf443278 Mon Sep 17 00:00:00 2001
From: cheveguerra <cheveguerra@gmail.com>
Date: Wed, 11 Jan 2023 10:49:48 -0600
Subject: [PATCH 02/11] fix: correccion en starters app.js para portal QR

correccion en starters app.js para portal QR
---
 starters/apps/base-baileys-mongo/app.js | 2 +-
 starters/apps/base-baileys-mysql/app.js | 2 +-
 starters/apps/base-venom-json/app.js    | 2 +-
 starters/apps/base-venom-memory/app.js  | 2 +-
 starters/apps/base-venom-mongo/app.js   | 2 +-
 starters/apps/base-venom-mysql/app.js   | 2 +-
 starters/apps/base-wweb-json/app.js     | 2 +-
 starters/apps/base-wweb-memory/app.js   | 2 +-
 starters/apps/base-wweb-mongo/app.js    | 3 ++-
 starters/apps/base-wweb-mysql/app.js    | 2 +-
 10 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/starters/apps/base-baileys-mongo/app.js b/starters/apps/base-baileys-mongo/app.js
index 253d1fa..2de3ad6 100644
--- a/starters/apps/base-baileys-mongo/app.js
+++ b/starters/apps/base-baileys-mongo/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
diff --git a/starters/apps/base-baileys-mysql/app.js b/starters/apps/base-baileys-mysql/app.js
index 3dc800b..d3dbbe5 100644
--- a/starters/apps/base-baileys-mysql/app.js
+++ b/starters/apps/base-baileys-mysql/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const BaileysProvider = require('@bot-whatsapp/provider/baileys')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 
diff --git a/starters/apps/base-venom-json/app.js b/starters/apps/base-venom-json/app.js
index c399b5e..120deee 100644
--- a/starters/apps/base-venom-json/app.js
+++ b/starters/apps/base-venom-json/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const JsonFileAdapter = require('@bot-whatsapp/database/json')
 
diff --git a/starters/apps/base-venom-memory/app.js b/starters/apps/base-venom-memory/app.js
index c539f36..8402cf9 100644
--- a/starters/apps/base-venom-memory/app.js
+++ b/starters/apps/base-venom-memory/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MockAdapter = require('@bot-whatsapp/database/mock')
 
diff --git a/starters/apps/base-venom-mongo/app.js b/starters/apps/base-venom-mongo/app.js
index bae23f8..2f4f16a 100644
--- a/starters/apps/base-venom-mongo/app.js
+++ b/starters/apps/base-venom-mongo/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
diff --git a/starters/apps/base-venom-mysql/app.js b/starters/apps/base-venom-mysql/app.js
index 737dc99..8c5c2db 100644
--- a/starters/apps/base-venom-mysql/app.js
+++ b/starters/apps/base-venom-mysql/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const VenomProvider = require('@bot-whatsapp/provider/venom')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 
diff --git a/starters/apps/base-wweb-json/app.js b/starters/apps/base-wweb-json/app.js
index 3144bd0..729ac2a 100644
--- a/starters/apps/base-wweb-json/app.js
+++ b/starters/apps/base-wweb-json/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const JsonFileAdapter = require('@bot-whatsapp/database/json')
 
diff --git a/starters/apps/base-wweb-memory/app.js b/starters/apps/base-wweb-memory/app.js
index 29eb0bc..d6a567a 100644
--- a/starters/apps/base-wweb-memory/app.js
+++ b/starters/apps/base-wweb-memory/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MockAdapter = require('@bot-whatsapp/database/mock')
 
diff --git a/starters/apps/base-wweb-mongo/app.js b/starters/apps/base-wweb-mongo/app.js
index 43eed81..a8e8aad 100644
--- a/starters/apps/base-wweb-mongo/app.js
+++ b/starters/apps/base-wweb-mongo/app.js
@@ -4,7 +4,8 @@ const {
     createFlow,
     addKeyword,
 } = require('@bot-whatsapp/bot')
-const QRPortal = require('@bot-whatsapp/portal')
+
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MongoAdapter = require('@bot-whatsapp/database/mongo')
 
diff --git a/starters/apps/base-wweb-mysql/app.js b/starters/apps/base-wweb-mysql/app.js
index 2b31f4a..68f7f37 100644
--- a/starters/apps/base-wweb-mysql/app.js
+++ b/starters/apps/base-wweb-mysql/app.js
@@ -5,7 +5,7 @@ const {
     addKeyword,
 } = require('@bot-whatsapp/bot')
 
-const QRPortal = require('@bot-whatsapp/portal')
+const QRPortalWeb = require('@bot-whatsapp/portal')
 const WebWhatsappProvider = require('@bot-whatsapp/provider/web-whatsapp')
 const MySQLAdapter = require('@bot-whatsapp/database/mysql')
 

From 0f9e57df378bcbf1dfe9de6390c925f87521bda0 Mon Sep 17 00:00:00 2001
From: leifermendez <leifermendez@users.noreply.github.com>
Date: Wed, 11 Jan 2023 19:44:10 +0000
Subject: [PATCH 03/11] ci(version): :zap: automatic - "${date}" updated
 versions every packages

---
 packages/bot/package.json                 | 2 +-
 packages/cli/package.json                 | 2 +-
 packages/contexts/package.json            | 2 +-
 packages/create-bot-whatsapp/package.json | 2 +-
 packages/database/package.json            | 2 +-
 packages/portal/package.json              | 2 +-
 packages/provider/package.json            | 2 +-
 7 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/bot/package.json b/packages/bot/package.json
index 44ebca0..b205714 100644
--- a/packages/bot/package.json
+++ b/packages/bot/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/bot",
-    "version": "0.0.55-alpha.0",
+    "version": "0.0.61-alpha.0",
     "description": "",
     "main": "./lib/bundle.bot.cjs",
     "scripts": {
diff --git a/packages/cli/package.json b/packages/cli/package.json
index 6f04765..18b8619 100644
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/cli",
-    "version": "0.0.61-alpha.0",
+    "version": "0.0.67-alpha.0",
     "description": "",
     "main": "index.js",
     "devDependencies": {
diff --git a/packages/contexts/package.json b/packages/contexts/package.json
index 7f0f0a8..7381d6a 100644
--- a/packages/contexts/package.json
+++ b/packages/contexts/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/contexts",
-    "version": "0.0.5-alpha.0",
+    "version": "0.0.11-alpha.0",
     "description": "",
     "main": "./lib/bundle.contexts.cjs",
     "files": [
diff --git a/packages/create-bot-whatsapp/package.json b/packages/create-bot-whatsapp/package.json
index b6cf5b4..49503df 100644
--- a/packages/create-bot-whatsapp/package.json
+++ b/packages/create-bot-whatsapp/package.json
@@ -1,6 +1,6 @@
 {
     "name": "create-bot-whatsapp",
-    "version": "0.0.72-alpha.0",
+    "version": "0.0.78-alpha.0",
     "description": "",
     "main": "./lib/bundle.create-bot-whatsapp.cjs",
     "files": [
diff --git a/packages/database/package.json b/packages/database/package.json
index 3d745a8..80bbcd1 100644
--- a/packages/database/package.json
+++ b/packages/database/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/database",
-    "version": "0.0.53-alpha.0",
+    "version": "0.0.59-alpha.0",
     "description": "Esto es el conector a  mysql, pg, mongo",
     "main": "./lib/mock/index.cjs",
     "keywords": [],
diff --git a/packages/portal/package.json b/packages/portal/package.json
index 03c9bae..9fd3307 100644
--- a/packages/portal/package.json
+++ b/packages/portal/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/portal",
-    "version": "0.0.11-alpha.0",
+    "version": "0.0.17-alpha.0",
     "description": "Portal WEB para escanear QR",
     "main": "./lib/portal.http.cjs",
     "scripts": {
diff --git a/packages/provider/package.json b/packages/provider/package.json
index c32af01..683ca66 100644
--- a/packages/provider/package.json
+++ b/packages/provider/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/provider",
-    "version": "0.0.59-alpha.0",
+    "version": "0.0.65-alpha.0",
     "description": "Esto es el conector a Twilio, Meta, etc...",
     "main": "./lib/mock/index.cjs",
     "keywords": [],

From 42b98801db6dc13a9c7e247325788e72d48cbb64 Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Wed, 11 Jan 2023 21:16:19 +0100
Subject: [PATCH 04/11] chore(release): 0.1.16

---
 CHANGELOG.md | 2 ++
 package.json | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c16e624..48381f1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.16](https://github.com/leifermendez/bot-whatsapp/compare/v0.1.15...v0.1.16) (2023-01-11)
+
 ### [0.1.15](https://github.com/leifermendez/bot-whatsapp/compare/v0.1.14...v0.1.15) (2023-01-11)
 
 ### [0.1.14](https://github.com/leifermendez/bot-whatsapp/compare/v0.1.13...v0.1.14) (2023-01-11)
diff --git a/package.json b/package.json
index c7f64fc..a6e64e7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bot-whatsapp/root",
-    "version": "0.1.15",
+    "version": "0.1.16",
     "description": "Bot de wahtsapp open source para MVP o pequeños negocios",
     "main": "app.js",
     "private": true,

From aaec0751408ab49483d428810d94aaf7d46acb94 Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Wed, 11 Jan 2023 21:17:32 +0100
Subject: [PATCH 05/11] fix(ci): pre-release

---
 .github/workflows/releases.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/releases.yml b/.github/workflows/releases.yml
index 32d04cf..d1c2e8f 100644
--- a/.github/workflows/releases.yml
+++ b/.github/workflows/releases.yml
@@ -68,7 +68,6 @@ jobs:
               run: yarn node ./scripts/github.js --version="${{ steps.package-version.outputs.current-version}}" --token="${{ secrets.OCTO_TOKEN }}"
 
             - name: 'Run if changes have been detected'
-              if: steps.auto-commit-action.outputs.changes_detected == 'true'
               run: |
                   git add .
                   git commit -m "chore(version): pre release"

From 230981e2676361149cb2a99def7f705e75009260 Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 09:35:06 +0100
Subject: [PATCH 06/11] fix(starters): :zap: added dockerfile

---
 starters/apps/base-baileys-mongo/Dockerfile | 4 +++-
 starters/apps/base-baileys-mysql/Dockerfile | 4 +++-
 starters/apps/base-meta-json/Dockerfile     | 9 +++++++++
 starters/apps/base-meta-memory/Dockerfile   | 9 +++++++++
 starters/apps/base-meta-mongo/Dockerfile    | 9 +++++++++
 starters/apps/base-meta-mysql/Dockerfile    | 9 +++++++++
 starters/apps/base-twilio-json/Dockerfile   | 9 +++++++++
 starters/apps/base-twilio-memory/Dockerfile | 9 +++++++++
 starters/apps/base-twilio-mongo/Dockerfile  | 9 +++++++++
 starters/apps/base-twilio-mysql/Dockerfile  | 9 +++++++++
 10 files changed, 78 insertions(+), 2 deletions(-)
 create mode 100644 starters/apps/base-meta-json/Dockerfile
 create mode 100644 starters/apps/base-meta-memory/Dockerfile
 create mode 100644 starters/apps/base-meta-mongo/Dockerfile
 create mode 100644 starters/apps/base-meta-mysql/Dockerfile
 create mode 100644 starters/apps/base-twilio-json/Dockerfile
 create mode 100644 starters/apps/base-twilio-memory/Dockerfile
 create mode 100644 starters/apps/base-twilio-mongo/Dockerfile
 create mode 100644 starters/apps/base-twilio-mysql/Dockerfile

diff --git a/starters/apps/base-baileys-mongo/Dockerfile b/starters/apps/base-baileys-mongo/Dockerfile
index 14b07b2..7fb6d5d 100644
--- a/starters/apps/base-baileys-mongo/Dockerfile
+++ b/starters/apps/base-baileys-mongo/Dockerfile
@@ -1,7 +1,9 @@
-FROM node:lts-bullseye as bot
+FROM node:18-bullseye as bot
 WORKDIR /app
 COPY package*.json ./
 RUN npm i
 COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
 ARG PORT
 CMD ["npm", "start"]
diff --git a/starters/apps/base-baileys-mysql/Dockerfile b/starters/apps/base-baileys-mysql/Dockerfile
index 14b07b2..7fb6d5d 100644
--- a/starters/apps/base-baileys-mysql/Dockerfile
+++ b/starters/apps/base-baileys-mysql/Dockerfile
@@ -1,7 +1,9 @@
-FROM node:lts-bullseye as bot
+FROM node:18-bullseye as bot
 WORKDIR /app
 COPY package*.json ./
 RUN npm i
 COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
 ARG PORT
 CMD ["npm", "start"]
diff --git a/starters/apps/base-meta-json/Dockerfile b/starters/apps/base-meta-json/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-meta-json/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-meta-memory/Dockerfile b/starters/apps/base-meta-memory/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-meta-memory/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-meta-mongo/Dockerfile b/starters/apps/base-meta-mongo/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-meta-mongo/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-meta-mysql/Dockerfile b/starters/apps/base-meta-mysql/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-meta-mysql/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-twilio-json/Dockerfile b/starters/apps/base-twilio-json/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-twilio-json/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-twilio-memory/Dockerfile b/starters/apps/base-twilio-memory/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-twilio-memory/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-twilio-mongo/Dockerfile b/starters/apps/base-twilio-mongo/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-twilio-mongo/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]
diff --git a/starters/apps/base-twilio-mysql/Dockerfile b/starters/apps/base-twilio-mysql/Dockerfile
new file mode 100644
index 0000000..7fb6d5d
--- /dev/null
+++ b/starters/apps/base-twilio-mysql/Dockerfile
@@ -0,0 +1,9 @@
+FROM node:18-bullseye as bot
+WORKDIR /app
+COPY package*.json ./
+RUN npm i
+COPY . .
+ARG RAILWAY_STATIC_URL
+ARG PUBLIC_URL
+ARG PORT
+CMD ["npm", "start"]

From a1ce98bdc884e59d104456c5883250024492fa63 Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 10:31:41 +0100
Subject: [PATCH 07/11] docs: :art: more doc

---
 packages/docs/src/routes/docs/flows/index.mdx | 138 +++++++++++++++++-
 1 file changed, 137 insertions(+), 1 deletion(-)

diff --git a/packages/docs/src/routes/docs/flows/index.mdx b/packages/docs/src/routes/docs/flows/index.mdx
index 027c793..7a2171c 100644
--- a/packages/docs/src/routes/docs/flows/index.mdx
+++ b/packages/docs/src/routes/docs/flows/index.mdx
@@ -1,6 +1,6 @@
 import Navigation from '../../../components/widgets/Navigation'
 
-# Flow (Flujos)
+# Flow
 
 Los flujos hace referencia al hecho de construir un flujo de conversion. Esto es un flow podemos observar que estan presente dos metodos importantes **addKeyword** y el **addAnswer**.
 
@@ -23,6 +23,142 @@ const flowPrincipal = addKeyword(['hola', 'alo'])
 
 ---
 
+## addKeyword()
+
+Esta funcion se utliza para iniciar un flujo de conversion. <br /> Recibe un `string` o un `array`
+de string `['hola','buenas']`.
+
+**Opciones**
+
+-   sensitive: Sensible a mayusculas y minusculas por defecto `false`
+
+```js
+const { addKeyword } = require('@bot-whatsapp/bot')
+
+const flowString = addKeyword('hola')
+
+const flowArray = addKeyword(['hola', 'alo'])
+
+const flowSensitive = addKeyword(['hola', 'alo'], {
+    sensitive: true,
+})
+```
+
+---
+
+## addAnswer()
+
+Esta funcion se utliza para responder un mensaje despues del `addKeyword()`
+
+**Opciones**
+
+-   delay: 0 (milisegundos)
+-   media: url de imagen
+-   buttons: array `[{body:'Boton1'}, {body:'Boton2'}, {body:'Boton3'}]`
+-   capture: false (para esperar respuesta)
+-   child: Objecto tipo flujo o arra de flujos hijos
+
+```js
+const { addKeyword } = require('@bot-whatsapp/bot')
+
+const flowString = addKeyword('hola').addAnswer(
+    'Este mensaje se enviara 1 segundo despues',
+    {
+        delay: 1000,
+    }
+)
+
+const flowString = addKeyword('hola').addAnswer(
+    'Este mensaje envia una imagen',
+    {
+        media: 'https://i.imgur.com/0HpzsEm.png',
+    }
+)
+
+const flowString = addKeyword('hola').addAnswer(
+    'Este mensaje envia tres botones',
+    {
+        buttons: [
+            { body: 'Boton 1' },
+            { body: 'Boton 2' },
+            { body: 'Boton 3' },
+        ],
+    }
+)
+
+const flowString = addKeyword('hola').addAnswer(
+    'Este mensaje espera una respueta del usuario',
+    {
+        capture: true,
+    }
+)
+```
+
+---
+
+## ctx
+
+Este argumento se utiliza para obtener el contexto de la conversación
+
+```js
+const { addKeyword } = require('@bot-whatsapp/bot')
+
+const flowString = addKeyword('hola').addAnswer(
+    'Indica cual es tu email',
+    null,
+    (ctx) => {
+        console.log('👉 Informacion del contexto: ', ctx)
+    }
+)
+```
+
+---
+
+## fallBack()
+
+Esta funcion se utliza para volver a enviar el ultimo mensaje abajo un ejemplo.
+En el ejemplo de abajo esperamos que el usuario ingrese un mensaje que contenga `@` sino contiene
+se repetira el mensaje `Indica cual es tu email`
+
+```js
+const { addKeyword } = require('@bot-whatsapp/bot')
+
+const flowString = addKeyword('hola').addAnswer(
+    'Indica cual es tu email',
+    null,
+    (ctx, { fallBack }) => {
+        if (!ctx.body.includes('@')) return fallBack()
+    }
+)
+```
+
+---
+
+## flowDynamic()
+
+Esta funcion se utliza para devolver mensajes dinamicos que pueden venir de una API o Base de datos.
+La funcion recibe un array que debe contener la siguiente estrucutura:
+
+`[{body:'Mensaje}, {body:'Mensaje2}]`
+
+```js
+const { addKeyword } = require('@bot-whatsapp/bot')
+
+const flowString = addKeyword('hola')
+    .addAnswer('Indica cual es tu email', null, async (ctx, {flowDynamic}) => {
+        const mensajesDB = () => {
+            const categories = db.find(...)
+            const mapDatos = categories.map((c) => ({body:c.name}))
+            return mapDatos
+        }
+        await flowDynamic(mensajesDB())
+    })
+
+
+```
+
+---
+
 <Navigation
     pages={[
         { name: 'Conceptos', link: '/docs/essential' },

From f742caa9a47f66cac80d747789076859d95e732e Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 11:43:58 +0100
Subject: [PATCH 08/11] refactor(bot): :sparkles: async callbacks

---
 packages/bot/core/core.class.js | 72 +++++++++++++++++++--------------
 packages/bot/utils/queue.js     |  8 ++--
 2 files changed, 46 insertions(+), 34 deletions(-)

diff --git a/packages/bot/core/core.class.js b/packages/bot/core/core.class.js
index 4243713..e084b20 100644
--- a/packages/bot/core/core.class.js
+++ b/packages/bot/core/core.class.js
@@ -8,6 +8,10 @@ const { createWriteStream } = require('fs')
 const logger = new Console({
     stdout: createWriteStream(`${process.cwd()}/core.class.log`),
 })
+
+const QueuePrincipal = new Queue()
+const QueueDynamic = new Queue()
+
 /**
  * [ ] Escuchar eventos del provider asegurarte que los provider emitan eventos
  * [ ] Guardar historial en db
@@ -84,17 +88,33 @@ class CoreClass {
             this.databaseClass.save(ctxByNumber)
         }
 
+        // 📄 Esta funcion se encarga de enviar un array de mensajes dentro de este ctx
+        const sendFlow = async (messageToSend, numberOrId) => {
+            const queue = []
+            for (const ctxMessage of messageToSend) {
+                const delayMs = ctxMessage?.options?.delay || 0
+                if (delayMs) await delay(delayMs)
+                QueuePrincipal.enqueue(() =>
+                    Promise.all([
+                        this.sendProviderAndSave(numberOrId, ctxMessage),
+                        cbEveryCtx(ctxMessage?.ref),
+                    ])
+                )
+            }
+            return Promise.all(queue)
+        }
+
         // 📄 [options: fallBack]: esta funcion se encarga de repetir el ultimo mensaje
         const fallBack = () => {
             fallBackFlag = true
             msgToSend = this.flowClass.find(refToContinue?.keyword, true) || []
-            this.sendFlow(msgToSend, from)
+            sendFlow(msgToSend, from)
             return refToContinue
         }
 
         // 📄 [options: flowDynamic]: esta funcion se encarga de responder un array de respuesta esta limitado a 5 mensajes
         // para evitar bloque de whatsapp
-        const flowDynamic = (listMsg = [], optListMsg = { limit: 3 }) => {
+        const flowDynamic = async (listMsg = [], optListMsg = { limit: 3 }) => {
             if (!Array.isArray(listMsg))
                 throw new Error('Esto debe ser un ARRAY')
 
@@ -108,26 +128,29 @@ class CoreClass {
                     })
                 )
                 .slice(0, optListMsg.limit)
-            msgToSend = parseListMsg
-            this.sendFlow(msgToSend, from)
+            for (const msg of parseListMsg) {
+                await this.sendProviderAndSave(from, msg)
+            }
             return
         }
 
         // 📄 Se encarga de revisar si el contexto del mensaje tiene callback y ejecutarlo
-        const cbEveryCtx = (inRef) => {
-            this.flowClass.allCallbacks[inRef](messageCtxInComming, {
+        const cbEveryCtx = async (inRef) => {
+            if (!this.flowClass.allCallbacks[inRef]) return Promise.resolve()
+            return this.flowClass.allCallbacks[inRef](messageCtxInComming, {
                 fallBack,
                 flowDynamic,
             })
         }
 
         // 📄 [options: callback]: Si se tiene un callback se ejecuta
-        if (!fallBackFlag) {
-            if (prevMsg?.options?.capture) cbEveryCtx(prevMsg?.ref)
-            for (const ite of this.flowClass.find(body)) {
-                if (!ite?.options?.capture) cbEveryCtx(ite?.ref)
-            }
-        }
+        //TODO AQUI
+        // if (!fallBackFlag) {
+        //     if (prevMsg?.options?.capture) cbEveryCtx(prevMsg?.ref)
+        //     for (const ite of this.flowClass.find(body)) {
+        //         if (!ite?.options?.capture) cbEveryCtx(ite?.ref)
+        //     }
+        // }
 
         // 📄🤘(tiene return) [options: nested(array)]: Si se tiene flujos hijos los implementa
         if (!fallBackFlag && prevMsg?.options?.nested?.length) {
@@ -138,11 +161,12 @@ class CoreClass {
 
             msgToSend = this.flowClass.find(body, false, flowStandalone) || []
 
-            for (const ite of msgToSend) {
-                cbEveryCtx(ite?.ref)
-            }
+            // //TODO AQUI
+            // for (const ite of msgToSend) {
+            //     cbEveryCtx(ite?.ref)
+            // }
 
-            this.sendFlow(msgToSend, from)
+            sendFlow(msgToSend, from)
             return
         }
 
@@ -153,13 +177,13 @@ class CoreClass {
 
             if (['string', 'boolean'].includes(typeCapture) && valueCapture) {
                 msgToSend = this.flowClass.find(refToContinue?.ref, true) || []
-                this.sendFlow(msgToSend, from)
+                sendFlow(msgToSend, from)
                 return
             }
         }
 
         msgToSend = this.flowClass.find(body) || []
-        this.sendFlow(msgToSend, from)
+        sendFlow(msgToSend, from)
     }
 
     /**
@@ -176,18 +200,6 @@ class CoreClass {
         ])
     }
 
-    sendFlow = async (messageToSend, numberOrId) => {
-        const queue = []
-        for (const ctxMessage of messageToSend) {
-            const delayMs = ctxMessage?.options?.delay || 0
-            if (delayMs) await delay(delayMs)
-            Queue.enqueue(() =>
-                this.sendProviderAndSave(numberOrId, ctxMessage)
-            )
-        }
-        return Promise.all(queue)
-    }
-
     /**
      * @private
      * @param {*} message
diff --git a/packages/bot/utils/queue.js b/packages/bot/utils/queue.js
index 1f610e9..873024a 100644
--- a/packages/bot/utils/queue.js
+++ b/packages/bot/utils/queue.js
@@ -1,8 +1,8 @@
 class Queue {
-    static queue = []
-    static pendingPromise = false
+    queue = []
+    pendingPromise = false
 
-    static enqueue(promise) {
+    enqueue(promise) {
         return new Promise((resolve, reject) => {
             this.queue.push({
                 promise,
@@ -13,7 +13,7 @@ class Queue {
         })
     }
 
-    static dequeue() {
+    dequeue() {
         if (this.workingOnPromise) {
             return false
         }

From 8a1bdc58785950493cc2683b0ecb0fa881dc683f Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 16:35:43 +0100
Subject: [PATCH 09/11] refactor(bot): :fire: fallback

---
 packages/bot/core/core.class.js   | 25 +++++++++++++++++++------
 packages/bot/rollup-bot.config.js |  1 +
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/packages/bot/core/core.class.js b/packages/bot/core/core.class.js
index e084b20..c0186d8 100644
--- a/packages/bot/core/core.class.js
+++ b/packages/bot/core/core.class.js
@@ -10,7 +10,6 @@ const logger = new Console({
 })
 
 const QueuePrincipal = new Queue()
-const QueueDynamic = new Queue()
 
 /**
  * [ ] Escuchar eventos del provider asegurarte que los provider emitan eventos
@@ -92,12 +91,13 @@ class CoreClass {
         const sendFlow = async (messageToSend, numberOrId) => {
             const queue = []
             for (const ctxMessage of messageToSend) {
+                console.log('🙌 ', ctxMessage.answer)
                 const delayMs = ctxMessage?.options?.delay || 0
                 if (delayMs) await delay(delayMs)
                 QueuePrincipal.enqueue(() =>
                     Promise.all([
                         this.sendProviderAndSave(numberOrId, ctxMessage),
-                        cbEveryCtx(ctxMessage?.ref),
+                        resolveCbEveryCtx(ctxMessage),
                     ])
                 )
             }
@@ -105,19 +105,23 @@ class CoreClass {
         }
 
         // 📄 [options: fallBack]: esta funcion se encarga de repetir el ultimo mensaje
-        const fallBack = () => {
+        const fallBack = async () => {
             fallBackFlag = true
-            msgToSend = this.flowClass.find(refToContinue?.keyword, true) || []
-            sendFlow(msgToSend, from)
+            await this.sendProviderAndSave(from, refToContinue)
+            QueuePrincipal.queue = []
             return refToContinue
         }
 
         // 📄 [options: flowDynamic]: esta funcion se encarga de responder un array de respuesta esta limitado a 5 mensajes
         // para evitar bloque de whatsapp
-        const flowDynamic = async (listMsg = [], optListMsg = { limit: 3 }) => {
+        const flowDynamic = async (
+            listMsg = [],
+            optListMsg = { limit: 5, fallback: false }
+        ) => {
             if (!Array.isArray(listMsg))
                 throw new Error('Esto debe ser un ARRAY')
 
+            fallBackFlag = optListMsg.fallback
             const parseListMsg = listMsg
                 .map(({ body }, index) =>
                     toCtx({
@@ -134,6 +138,13 @@ class CoreClass {
             return
         }
 
+        // 📄 Se encarga de revisar si el contexto del mensaje tiene callback o fallback
+        const resolveCbEveryCtx = async (ctxMessage) => {
+            if (prevMsg?.options?.capture) return cbEveryCtx(prevMsg?.ref)
+            if (!ctxMessage?.options?.capture)
+                return await cbEveryCtx(ctxMessage?.ref)
+        }
+
         // 📄 Se encarga de revisar si el contexto del mensaje tiene callback y ejecutarlo
         const cbEveryCtx = async (inRef) => {
             if (!this.flowClass.allCallbacks[inRef]) return Promise.resolve()
@@ -143,6 +154,8 @@ class CoreClass {
             })
         }
 
+        if (prevMsg?.ref) resolveCbEveryCtx(prevMsg)
+
         // 📄 [options: callback]: Si se tiene un callback se ejecuta
         //TODO AQUI
         // if (!fallBackFlag) {
diff --git a/packages/bot/rollup-bot.config.js b/packages/bot/rollup-bot.config.js
index f8ffa2a..36bbb87 100644
--- a/packages/bot/rollup-bot.config.js
+++ b/packages/bot/rollup-bot.config.js
@@ -10,6 +10,7 @@ module.exports = [
             banner: banner['banner.output'].join(''),
             file: join(__dirname, 'lib', 'bundle.bot.cjs'),
             format: 'cjs',
+            sourcemap: true,
         },
         plugins: [commonjs(), nodeResolve()],
     },

From ee30df73b879f4bf712b7e51f09e44ac943bea7f Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 21:04:04 +0100
Subject: [PATCH 10/11] ci(cli): :zap: fix

---
 packages/bot/core/core.class.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/bot/core/core.class.js b/packages/bot/core/core.class.js
index c0186d8..79d996b 100644
--- a/packages/bot/core/core.class.js
+++ b/packages/bot/core/core.class.js
@@ -91,7 +91,6 @@ class CoreClass {
         const sendFlow = async (messageToSend, numberOrId) => {
             const queue = []
             for (const ctxMessage of messageToSend) {
-                console.log('🙌 ', ctxMessage.answer)
                 const delayMs = ctxMessage?.options?.delay || 0
                 if (delayMs) await delay(delayMs)
                 QueuePrincipal.enqueue(() =>

From 8f27d34081a899dc1aa7de6afeb5a1184d7a8fd3 Mon Sep 17 00:00:00 2001
From: Leifer Mendez <leifer33@gmail.com>
Date: Thu, 12 Jan 2023 21:04:44 +0100
Subject: [PATCH 11/11] ci(cli): :zap: fix

---
 .github/workflows/releases.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/releases.yml b/.github/workflows/releases.yml
index d1c2e8f..d587c64 100644
--- a/.github/workflows/releases.yml
+++ b/.github/workflows/releases.yml
@@ -77,4 +77,3 @@ jobs:
               uses: stefanzweifel/git-auto-commit-action@v4
               with:
                   commit_message: 'chore(version): launch release 🚀 "${{ steps.package-version.outputs.current-version}}"'
-                  branch: dev