Merge pull request #505 from codigoencasa/dev

Dev
2026-04-17 19:26:23 +00:00 · 2023-01-16 17:38:30 +01:00
parent 13e0530c01 c5af1f8107
commit a14c67ad45
37 changed files with 544 additions and 52 deletions
--- a/.github/workflows/check-provider-major.yml
+++ b/.github/workflows/check-provider-major.yml
@@ -39,8 +39,14 @@ jobs:
            - name: Check Twilio
              run: yarn node ./scripts/checker.js --name=twilio --stable=true

+            - name: Add and commit changes to gh-pages branch
+              run: |
+                  git config --local user.email 'action@github.com'
+                  git config --local user.name 'GitHub Action'
+                  git add .
+
            - uses: stefanzweifel/git-auto-commit-action@v4
              with:
-                  commit_message: 'ci(providers): 🚩 Check BREAKING CHANGE'
+                  commit_message: 'ci(providers): check provider versions'
                  create_branch: true
-                  branch: feature/breaking-change
+                  branch: feature/providers-major
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -56,3 +56,55 @@ jobs:

            - name: Unit Tests
              run: yarn test
+
+    ############ UNIT TEST ############
+    check-providers:
+        name: Check Providers Versions
+        runs-on: ubuntu-latest
+        outputs:
+            commit: ${{ steps.vars.outputs.commit }}
+        steps:
+            - name: Checkout
+              uses: actions/checkout@v3
+              with:
+                  fetch-depth: 0
+                  ref: ${{github.event.after}}
+                  persist-credentials: false
+
+            - name: Setup Node
+              uses: actions/setup-node@v3
+              with:
+                  node-version: 16.x
+                  cache: 'yarn'
+                  registry-url: https://registry.npmjs.org/
+
+            - run: corepack enable
+
+            - name: Install NPM Dependencies
+              run: yarn install --immutable --network-timeout 300000
+
+            - name: Check Baileys
+              run: yarn node ./scripts/checker.js --name=baileys --stable=true
+
+            - name: Check Venom
+              run: yarn node ./scripts/checker.js --name=venom --stable=true
+
+            - name: Check web-whatsapp
+              run: yarn node ./scripts/checker.js --name=web-whatsapp --stable=true
+
+            - name: Check Meta
+              run: yarn node ./scripts/checker.js --name=meta --stable=true
+
+            - name: Check Twilio
+              run: yarn node ./scripts/checker.js --name=twilio --stable=true
+
+            - name: Set output
+              id: vars
+              run: echo "commit=$(git log --format=%B -n 1 ${{github.event.after}})" >> $GITHUB_OUTPUT
+
+            - name: Commit & Push changes
+              uses: actions-js/push@master
+              with:
+                  branch: feature/providers-major
+                  github_token: ${{ secrets.GITHUB_TOKEN }}
+                  force: true
--- a/packages/bot/core/core.class.js
+++ b/packages/bot/core/core.class.js
@@ -70,7 +70,7 @@ class CoreClass {
        const { body, from } = messageCtxInComming
        let msgToSend = []
        let fallBackFlag = false
-
+        if (!body) return
        if (!body.length) return

        const prevMsg = await this.databaseClass.getPrevByNumber(from)
--- a/packages/bot/package.json
+++ b/packages/bot/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/bot",
-    "version": "0.0.65-alpha.0",
+    "version": "0.0.66-alpha.0",
    "description": "",
    "main": "./lib/bundle.bot.cjs",
    "scripts": {
--- a/packages/cli/check/index.js
+++ b/packages/cli/check/index.js
@@ -24,7 +24,7 @@ const checkNodeVersion = () => {
 }

 const checkOs = () => {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
        console.log(bgCyan('🙂 Revisando tu sistema operativo'))
        const os = process.platform
        if (!os.includes('win32')) {
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/cli",
-    "version": "0.0.71-alpha.0",
+    "version": "0.0.72-alpha.0",
    "description": "",
    "main": "index.js",
    "devDependencies": {
--- a/packages/contexts/package.json
+++ b/packages/contexts/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/contexts",
-    "version": "0.0.15-alpha.0",
+    "version": "0.0.16-alpha.0",
    "description": "",
    "main": "./lib/bundle.contexts.cjs",
    "files": [
--- 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.92-alpha.0",
+    "version": "0.0.93-alpha.0",
    "description": "",
    "main": "./lib/bundle.create-bot-whatsapp.cjs",
    "files": [
--- a/packages/database/package.json
+++ b/packages/database/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/database",
-    "version": "0.0.63-alpha.0",
+    "version": "0.0.64-alpha.0",
    "description": "Esto es el conector a  mysql, pg, mongo",
    "main": "./lib/mock/index.cjs",
    "keywords": [],
--- a/packages/docs/src/components/widgets/Collaborator.tsx
+++ b/packages/docs/src/components/widgets/Collaborator.tsx
@@ -14,7 +14,7 @@ export default component$(
                <a href={props.user.html_url} target="_blank">
                    <img
                        class="w-16 h-16 rounded-full mx-auto object-cover"
-                        src={props.user.avatar_url + '&s=80'}
+                        src={props.user.avatar_url}
                        alt={props.user.login}
                        width="80"
                        height="80"
@@ -23,7 +23,9 @@ export default component$(

                <div class="pt-2 space-y-4 justify-center flex">
                    <figcaption class="text-sm">
-                        <div class={'font-semibold'}>{props.user.login}</div>
+                        <div class={'font-semibold truncate'}>
+                            {props.user.login}
+                        </div>
                    </figcaption>
                </div>
            </figure>
--- a/packages/docs/src/components/widgets/Hero.tsx
+++ b/packages/docs/src/components/widgets/Hero.tsx
@@ -56,7 +56,7 @@ export default component$(() => {
                                        </a>
                                        <a
                                            target={'_blank'}
-                                            href="https://youtu.be/DEIyGyJNGa8"
+                                            href="https://youtu.be/UgoS8PXxe-A"
                                            class="btn  bg-gray-50 dark:bg-transparent"
                                        >
                                            Ver video
--- a/packages/docs/src/components/widgets/Members.tsx
+++ b/packages/docs/src/components/widgets/Members.tsx
@@ -0,0 +1,54 @@
+import { component$ } from '@builder.io/qwik'
+import { RequestHandlerCloudflarePages } from '@builder.io/qwik-city/middleware/cloudflare-pages'
+import { User } from '~/contexts'
+import Collaborator from './Collaborator'
+
+export const onRequest: RequestHandlerCloudflarePages = async () => {
+    console.log('??heree')
+}
+
+export const TaleUsers = component$((props: { users: User[] }) => {
+    return (
+        <>
+            {props.users.map((user) => (
+                <div class="col-span-2 ">
+                    {' '}
+                    <Collaborator user={user} />
+                </div>
+            ))}
+        </>
+    )
+})
+
+export default component$((props: { users: User[] }) => {
+    return (
+        <section class="relative ">
+            <div class={'px-4 py-16 mx-auto max-w-6xl lg:py-20'}>
+                <div class="mb-10 md:mx-auto sm:text-center md:mb-12 max-w-3xl">
+                    <p class="text-base text-primary-600 dark:text-purple-200 font-semibold tracking-wide uppercase">
+                        Premium
+                    </p>
+                    <h2 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4 font-heading">
+                        Miembros
+                    </h2>
+                    <p class="max-w-3xl mx-auto sm:text-center text-xl text-gray-600 dark:text-slate-400">
+                        Conviértete en un miembro destacado y forma parte del
+                        proyecto y disfruta de manera adelantada de las
+                        actualizaciones{' '}
+                        <a
+                            class={'font-semibold'}
+                            target={'_blank'}
+                            href="https://opencollective.com/bot-whatsapp"
+                        >
+                            Únete
+                        </a>
+                    </p>
+                </div>
+
+                <div class="grid lg:grid-cols-12 grid-cols-1 gap-4 ">
+                    <TaleUsers users={props.users} />
+                </div>
+            </div>
+        </section>
+    )
+})
--- a/packages/docs/src/root.tsx
+++ b/packages/docs/src/root.tsx
@@ -52,16 +52,22 @@ export default component$(() => {
            title: 'Avanzado',
            list: [
                { name: 'Migración', link: '/docs/migration' },
-                { name: 'Extender funcionalidades', link: '/docs/custom' },
+                { name: 'MasterClass', link: '/docs/masterclass' },
+            ],
+        },
+        {
+            title: 'Despliegue',
+            list: [
+                { name: 'Local', link: '/docs/deploy/local' },
+                { name: 'Docker', link: '/docs/deploy/docker' },
+                { name: 'Cloud', link: '/docs/deploy/cloud' },
            ],
        },
        {
            title: 'Comunidad',
            list: [
-                { name: 'MasterClass', link: '/docs/masterclass' },
                { name: 'Colabores', link: '/docs/contributing' },
                { name: 'Unirme al proyecto', link: '/docs/join' },
-                { name: 'Sponsors', link: '/docs/sponsors' },
            ],
        },
    ])
--- a/packages/docs/src/routes/docs/deploy/cloud/index.mdx
+++ b/packages/docs/src/routes/docs/deploy/cloud/index.mdx
@@ -0,0 +1,108 @@
+import Alert from '../../../../components/widgets/Alert'
+import Navigation from '../../../../components/widgets/Navigation'
+
+# Entorno Cloud
+
+Si deseas tener tu chatbot en ejecución en un servidor en la nueba esta, guía te ayudará.
+El servidor deberá cumplir con los requisitos mínimos, puedes ver en [este enlace.](/docs/requirements)
+
+---
+
+Dependiendo de tu proveedor de **servicio Cloud** debes crear una instancia (máquina virtual), este ejemplo iremos orientando en un entorno de AWS.
+En nuestro ejemplo creamos una maquina virtual con **Ubuntu 20.04**
+
+![](https://i.imgur.com/5zRCz9q.png)
+
+---
+
+Posterior al proceso de crear la máquina esperamos unos minutos hasta que ya está operativo y tomamos nota del usuario y la IP pública para proceder a conectarnos vía SSH
+
+## ![](https://i.imgur.com/ljyJPBm.png)
+
+## Conectarse via SSH
+
+Luego de obtener los datos necesarios para conectarnos a nuestra máquina, procedemos a hacerlo
+
+```shell
+ssh -i llaveBot.pem ubutnu@34.228.208.104
+```
+
+---
+
+Luego puede aparecer un mensaje como el siguiente donde solo debes de responder **yes**
+
+![](https://i.imgur.com/rUBASqR.png)
+
+---
+
+Una vez conectado ya estás dentro de la máquina virtual, te aconsejamos la primera vez hacer una actualización de dependencias de Ubuntu con los siguientes comandos
+
+```shell
+sudo apt-get update
+```
+
+```shell
+sudo apt-get upgrade
+```
+
+---
+
+## Recuerda instalar Node 16 o superior
+
+Puedes ver más a detalle los pasos de la instalacion en este [blog](https://www.digitalocean.com/community/tutorials/how-to-install-node-js-on-ubuntu-20-04-es)
+
+```shell
+curl -sL https://deb.nodesource.com/setup_18.x -o nodesource_setup.sh
+```
+
+```shell
+sudo bash nodesource_setup.sh
+```
+
+```shell
+sudo apt-get install -y nodejs
+```
+
+---
+
+## Implementar el bot
+
+Si tienes el código de tu chatbot en un repositorio, solo falta que clones el repo en el servidor y ejecutes `npm start`
+
+Para escanear el **QR** puedes hacerlo vía WEB accediendo a la URL `http://[TU_IP_PUBLICA]:3000` en este ejemplo seria `http://34.228.208.10:3000`
+
+![](https://i.imgur.com/xcovczm.png)
+
+---
+
+## Firewall
+
+Si no te abre la pagina web asegurate de tener el puerto abierto en tu firewall.
+Ejemplo permitir el puerto **3000**
+
+![](https://i.imgur.com/0dAz0B1.png)
+
+---
+
+## Escanear QR
+
+![](https://i.imgur.com/2m3NbXC.png)
+
+---
+
+## Ejecutar en Producción
+
+Debes ubicarte en el directorio donde tienes el codigo fuente de tu chatbot.
+
+Independientemente de tu sistema operativo deberás ejecutar el chatbot con el comando atrevés de un sistema que mantenga el proceso en ejecución.
+Recomendamos [Pm2](https://pm2.keymetrics.io/)
+
+```shell
+pm2 start app.js --name=bot1
+```
+
+![](https://i.imgur.com/ilPS75H.png)
+
+La consola de devolver un mensaje con una lista de procesos, en el ejemplo puedes observar, que tenemos un proceso llamado `bot1`
+
+De esta manera ya puedes cerrar la terminal y tu bot seguirá en ejecución sin problema
--- a/packages/docs/src/routes/docs/deploy/docker/index.mdx
+++ b/packages/docs/src/routes/docs/deploy/docker/index.mdx
@@ -0,0 +1,32 @@
+import Alert from '../../../../components/widgets/Alert'
+import Navigation from '../../../../components/widgets/Navigation'
+
+# Entorno Docker
+
+Previamente, necesitas tener instalado Docker en tu servidor dependiendo del sistema operativo, los procesos cambian,
+puedes encontrar toda la información oficial de docker en [este enlace.](https://docs.docker.com/get-docker/)
+
+---
+
+Dependiendo del proveedor que has elegido necesitaras una implementación de Docker específica, pero no te preocupes, ya que viene implementada automáticamente en un archivo llamado **Dockerfile**, también puedes ver los otros Dockerfile en el apartado de [plantillas.](https://github.com/codigoencasa/bot-whatsapp/tree/main/starters/apps)
+
+![](https://i.imgur.com/cDspa0R.png)
+
+---
+
+## Contruir imagen
+
+Solo es necesario construir la imagen del docker lo puedes hacer con el siguiente comando
+
+```shell
+docker build . -t botwhatsapp:latest
+```
+
+## Iniciar contenedor
+
+Para iniciar el contenedor con la imagen previamente construida puedes realizarlo ejecutando el siguiente comando.
+Se utiliza el puerto **3001** solo com un ejemplo puedes usar el puerto que tu quieras
+
+```shell
+docker run -e PORT=3001 -p 3001:3001 botwhatsapp:latest
+```
--- a/packages/docs/src/routes/docs/deploy/local/index.mdx
+++ b/packages/docs/src/routes/docs/deploy/local/index.mdx
@@ -0,0 +1,26 @@
+import Alert from '../../../../components/widgets/Alert'
+import Navigation from '../../../../components/widgets/Navigation'
+
+# Entorno Local
+
+Si deseas tener tu chatbot en ejecución en un servidor local (computadora personal, etc.) esta, guía te ayudará.
+El servidor local deberá cumplir con los requisitos mínimos, puedes ver en [este enlace.](/docs/requirements)
+
+---
+
+<Alert>Si deseas instalar pm2 puedes ejecutar `npm install pm2 --global`</Alert>
+
+Debes ubicarte en el directorio donde tienes el codigo fuente de tu chatbot.
+
+Independientemente de tu sistema operativo deberás ejecutar el chatbot con el comando atrevés de un sistema que mantenga el proceso en ejecución.
+Recomendamos [Pm2](https://pm2.keymetrics.io/)
+
+```shell
+pm2 start app.js --name=bot1
+```
+
+![](https://i.imgur.com/ilPS75H.png)
+
+La consola de devolver un mensaje con una lista de procesos, en el ejemplo puedes observar, que tenemos un proceso llamado `bot1`
+
+De esta manera ya puedes cerrar la terminal y tu bot seguirá en ejecución sin problema
--- a/packages/docs/src/routes/docs/masterclass/index.md
+++ b/packages/docs/src/routes/docs/masterclass/index.md
@@ -1,24 +0,0 @@
-[![hackmd-github-sync-badge](https://hackmd.io/79xQyVSgRD6RsTpqtMPPdw/badge)](https://hackmd.io/79xQyVSgRD6RsTpqtMPPdw)
-### Preguntas Frecuentes para Master Class BOT v2
-> Anota aqui las preguntas o dudas que tengas
-> Pronto estare publicando fecha y hora para la masterclass
-
-1.- Si necesito correr dos bots al mismo tiempo ¿donde puedo cambiar el puerto?
-
-2.- Si necesito agregar o modificar funciones del bot, ¿como puedo hacerlo?
-
-3.- Si quiero mi bot con otra base de datos diferente a MySQL ¿como lo puedo hacer?
-
-4.- Quiero conectarme a tal o cual API con JSON/XML/etc, ¿se puede hacer?
-
-5.- ¿Como integrar listas?
-
-6.- Preguntas y respuestas con el Bot
-
-7.- Guardar conversaciones en Excel.
-
-8.- ¿Puedo usar 2 o mas sesiones (códigos QR) al mismo tiempo?
-
-9.- ¿Puede ser que al usar el provider bailey, al leer el qr.png, que sea desde una url en el navegador, y no desde visual studio? Gracias
-
-10.- ¿Cómo tomo los datos que me envían en un mensaje para utilizarlo internamente en la búsqueda de datos propios y devolver la respuesta?
--- a/packages/docs/src/routes/docs/masterclass/index.mdx
+++ b/packages/docs/src/routes/docs/masterclass/index.mdx
@@ -0,0 +1,26 @@
+# MasterClass
+
+<iframe
+    width="560"
+    height="315"
+    src="https://www.youtube.com/embed/22jiE2Z3XGM"
+    title="YouTube video player"
+    frameborder="0"
+    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+    allowfullscreen
+></iframe>
+
+---
+
+### Preguntas de la masterclass
+
+-   Si necesito correr dos bots al mismo tiempo ¿donde puedo cambiar el puerto?
+-   Si necesito agregar o modificar funciones del bot, ¿como puedo hacerlo?
+-   Si quiero mi bot con otra base de datos diferente a MySQL ¿como lo puedo hacer?
+-   Quiero conectarme a tal o cual API con JSON/XML/etc, ¿se puede hacer?
+-   ¿Como integrar listas?
+-   Preguntas y respuestas con el Bot
+-   Guardar conversaciones en Excel.
+-   ¿Puedo usar 2 o mas sesiones (códigos QR) al mismo tiempo?
+-   ¿Puede ser que al usar el provider bailey, al leer el qr.png, que sea desde una url en el navegador, y no desde visual studio? Gracias
+-   ¿Cómo tomo los datos que me envían en un mensaje para utilizarlo internamente en la búsqueda de datos propios y devolver la respuesta?
--- a/packages/docs/src/routes/index.tsx
+++ b/packages/docs/src/routes/index.tsx
@@ -5,7 +5,9 @@ import Features from '~/components/widgets/Features'
 import FAQs from '~/components/widgets/FAQs'
 import CallToAction from '~/components/widgets/CallToAction'
 import Collaborators from '~/components/widgets/Collaborators'
+import Members from '~/components/widgets/Members'
 import { fetchGithub } from '~/services/github'
+import { fetchOpenCollective } from '~/services/opencollective'
 import { RequestHandlerNetlify } from '@builder.io/qwik-city/middleware/netlify-edge'
 import { GITHUB_TOKEN } from './docs/constant'

@@ -13,8 +15,12 @@ export const onGet: RequestHandlerNetlify = async ({ platform }) => {
    const CHECK_GITHUB_TOKEN =
        (platform as any)?.['GITHUB_TOKEN'] ?? GITHUB_TOKEN
    console.log(`[🚩 platform]: `, GITHUB_TOKEN)
-    const data = await fetchGithub(CHECK_GITHUB_TOKEN)
-    return data
+    const dataGithub = await fetchGithub(CHECK_GITHUB_TOKEN)
+    const dataOpenCollective = await fetchOpenCollective()
+    return {
+        dataGithub,
+        dataOpenCollective,
+    }
 }

 export default component$(() => {
@@ -27,9 +33,16 @@ export default component$(() => {
            <CallToAction />
            <Resource
                value={resource}
-                onResolved={(data: any) => <Collaborators users={data} />}
+                onResolved={(data: any) => {
+                    return (
+                        <>
+                            <Collaborators users={data.dataGithub} />
+                            <FAQs />
+                            <Members users={data.dataOpenCollective} />
+                        </>
+                    )
+                }}
            ></Resource>
-            <FAQs />
        </>
    )
 })
--- a/packages/docs/src/services/github.ts
+++ b/packages/docs/src/services/github.ts
@@ -14,6 +14,9 @@ export const fetchGithub = async (token: string) => {
            },
        }
    )
-    const listUsers = data.json()
-    return listUsers
+    const listUsers = await data.json()
+    return listUsers.map((u: any) => ({
+        ...u,
+        avatar_url: `${u.avatar_url}&s=80`,
+    }))
 }
--- a/packages/docs/src/services/opencollective.ts
+++ b/packages/docs/src/services/opencollective.ts
@@ -0,0 +1,19 @@
+/**
+ * GET API from OpenCollective
+ * @returns
+ */
+export const fetchOpenCollective = async () => {
+    const data = await fetch(
+        `https://opencollective.com/bot-whatsapp/members/users.json?limit=10&offset=0`,
+        {
+            method: 'GET',
+        }
+    )
+    const listUsers = await data.json()
+    return listUsers.map((u: any) => ({
+        html_url: u.profile,
+        avatar_url: u.image ?? 'https://i.imgur.com/HhiYKwN.png',
+        login: u.name,
+        id: u.MemberId,
+    }))
+}
--- a/packages/portal/.vscode/extensions.json
+++ b/packages/portal/.vscode/extensions.json
@@ -0,0 +1,4 @@
+{
+    "recommendations": ["dbaeumer.vscode-eslint", "unifiedjs.vscode-mdx"],
+    "unwantedRecommendations": []
+}
--- a/packages/portal/.vscode/qwik-city.code-snippets
+++ b/packages/portal/.vscode/qwik-city.code-snippets
@@ -0,0 +1,32 @@
+{
+    "onGet": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:onGet",
+        "description": "onGet function for a route index",
+        "body": [
+            "export const onGet: RequestHandler = (request) => {",
+            "  $0",
+            "};"
+        ]
+    },
+    "onGet (typed)": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:onGet typed",
+        "description": "onGet function for a route index",
+        "body": [
+            "export interface ${1:PageData} {",
+            "  $2",
+            "};",
+            "",
+            "export const onGet: RequestHandler<$1> = (request) => {",
+            "  $4",
+            "};"
+        ]
+    },
+    "useEndpoint": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useEndpoint",
+        "description": "useEndpoint declaration",
+        "body": "const $1 = useEndpoint<typeof onGet>();"
+    }
+}
--- a/packages/portal/.vscode/qwik.code-snippets
+++ b/packages/portal/.vscode/qwik.code-snippets
@@ -0,0 +1,84 @@
+{
+    "Qwik component (simple)": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:component",
+        "description": "Simple Qwik component",
+        "body": [
+            "export const ${1:${TM_FILENAME_BASE/(.*)/${1:/pascalcase}/}} = component$(() => {",
+            "  return <${2:div}>$4</$2>",
+            "});"
+        ]
+    },
+    "Qwik component (props)": {
+        "scope": "typescriptreact",
+        "prefix": "q:component w/props",
+        "description": "Qwik component w/ props",
+        "body": [
+            "export interface ${1:${TM_FILENAME_BASE/(.*)/${1:/pascalcase}/}}Props {",
+            "  $2",
+            "}",
+            "",
+            "export const $1 = component$<$1Props>((props) => {",
+            "  const ${2:count} = useSignal(0);",
+            "  return (",
+            "    <${3:div} on${4:Click}$={(ev) => {$5}}>",
+            "      $6",
+            "    </${3}>",
+            "  );",
+            "});"
+        ]
+    },
+    "Qwik signal": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useSignal",
+        "description": "useSignal() declaration",
+        "body": ["const ${1:foo} = useSignal($2);", "$0"]
+    },
+    "Qwik store": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useStore",
+        "description": "useStore() declaration",
+        "body": ["const ${1:state} = useStore({", "  $2", "});", "$0"]
+    },
+    "$ hook": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:$",
+        "description": "$() function hook",
+        "body": ["$(() => {", "  $0", "});", ""]
+    },
+    "useClientEffect": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useClientEffect",
+        "description": "useClientEffect$() function hook",
+        "body": ["useClientEffect$(({ track }) => {", "  $0", "});", ""]
+    },
+    "useTask": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useTask",
+        "description": "useTask$() function hook",
+        "body": [
+            "useTask$(({ track }) => {",
+            "  track(() => $1);",
+            "  $0",
+            "});",
+            ""
+        ]
+    },
+    "useResource": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useResource",
+        "description": "useResource$() declaration",
+        "body": [
+            "const $1 = useResource$(({ track, cleanup }) => {",
+            "  $0",
+            "});",
+            ""
+        ]
+    },
+    "useServerMount": {
+        "scope": "javascriptreact,typescriptreact",
+        "prefix": "q:useServerMount",
+        "description": "useServerMount$() function hook",
+        "body": ["useServerMount$(() => {", "  $0", "});", ""]
+    }
+}
--- a/packages/portal/package.json
+++ b/packages/portal/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/portal",
-    "version": "0.0.21-alpha.0",
+    "version": "0.0.22-alpha.0",
    "description": "Portal WEB para escanear QR",
    "main": "./lib/portal.http.cjs",
    "scripts": {
--- a/packages/portal/server/@qwik-city-not-found-paths.js
+++ b/packages/portal/server/@qwik-city-not-found-paths.js
@@ -0,0 +1,15 @@
+const notFounds = [
+    [
+        '/',
+        '<!DOCTYPE html>\n<html>\n<head>\n  <meta charset="utf-8">\n  <meta http-equiv="Status" content="404"/>\n  <title>404 Resource Not Found</title>\n  <meta name="viewport" content="width=device-width,initial-scale=1">\n  <style>\n    body { color: #006ce9; background-color: #fafafa; padding: 30px; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Roboto, sans-serif; }\n    p { max-width: 600px; margin: 60px auto 30px auto; background: white; border-radius: 4px; box-shadow: 0px 0px 50px -20px #006ce9; overflow: hidden; }\n    strong { display: inline-block; padding: 15px; background: #006ce9; color: white; }\n    span { display: inline-block; padding: 15px; }\n    pre { max-width: 580px; margin: 0 auto; }\n  </style>\n</head>\n<body>\n  <p><strong>404</strong> <span>Resource Not Found</span></p>\n</body>\n</html>',
+    ],
+]
+function getNotFound(p) {
+    for (const r of notFounds) {
+        if (p.startsWith(r[0])) {
+            return r[1]
+        }
+    }
+    return 'Resource Not Found'
+}
+export { getNotFound }
--- a/packages/portal/server/@qwik-city-plan.mjs
+++ b/packages/portal/server/@qwik-city-plan.mjs
--- a/packages/portal/server/@qwik-city-static-paths.js
+++ b/packages/portal/server/@qwik-city-static-paths.js
@@ -0,0 +1,23 @@
+const staticPaths = new Set([
+    '/',
+    '/favicon.svg',
+    '/manifest.json',
+    '/q-manifest.json',
+    '/robots.txt',
+    '/service-worker.js',
+    '/sitemap.xml',
+    '/water-mark.png',
+])
+function isStaticPath(p) {
+    if (p.startsWith('/build/')) {
+        return true
+    }
+    if (p.startsWith('/assets/')) {
+        return true
+    }
+    if (staticPaths.has(p)) {
+        return true
+    }
+    return false
+}
+export { isStaticPath }
--- a/packages/portal/server/entry.ssr.js
+++ b/packages/portal/server/entry.ssr.js
@@ -0,0 +1 @@
+export * from './entry.ssr.mjs'
--- a/packages/portal/server/entry.ssr.mjs
+++ b/packages/portal/server/entry.ssr.mjs
--- a/packages/portal/server/package.json
+++ b/packages/portal/server/package.json
@@ -0,0 +1,3 @@
+{
+    "type": "module"
+}
--- a/packages/provider/package.json
+++ b/packages/provider/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@bot-whatsapp/provider",
-    "version": "0.0.69-alpha.0",
+    "version": "0.0.70-alpha.0",
    "description": "Esto es el conector a Twilio, Meta, etc...",
    "main": "./lib/mock/index.cjs",
    "keywords": [],
--- a/packages/provider/src/web-whatsapp/package.json
+++ b/packages/provider/src/web-whatsapp/package.json
@@ -1,5 +1,5 @@
 {
    "dependencies": {
-        "whatsapp-web.js": "1.18.4"
+        "whatsapp-web.js": "1.19.2"
    }
 }
--- a/starters/apps/base-wweb-json/package.json
+++ b/starters/apps/base-wweb-json/package.json
@@ -14,7 +14,7 @@
        "@bot-whatsapp/database": "latest",
        "@bot-whatsapp/provider": "latest",
        "@bot-whatsapp/portal": "latest",
-        "whatsapp-web.js": "1.18.4"
+        "whatsapp-web.js": "1.19.2"
    },
    "author": "",
    "license": "ISC"
--- a/starters/apps/base-wweb-memory/package.json
+++ b/starters/apps/base-wweb-memory/package.json
@@ -14,7 +14,7 @@
        "@bot-whatsapp/database": "latest",
        "@bot-whatsapp/provider": "latest",
        "@bot-whatsapp/portal": "latest",
-        "whatsapp-web.js": "1.18.4"
+        "whatsapp-web.js": "1.19.2"
    },
    "author": "",
    "license": "ISC"
--- a/starters/apps/base-wweb-mongo/package.json
+++ b/starters/apps/base-wweb-mongo/package.json
@@ -9,7 +9,7 @@
    },
    "keywords": [],
    "dependencies": {
-        "whatsapp-web.js": "1.18.4",
+        "whatsapp-web.js": "1.19.2",
        "@bot-whatsapp/bot": "latest",
        "@bot-whatsapp/cli": "latest",
        "@bot-whatsapp/database": "latest",
--- a/starters/apps/base-wweb-mysql/package.json
+++ b/starters/apps/base-wweb-mysql/package.json
@@ -9,7 +9,7 @@
    },
    "keywords": [],
    "dependencies": {
-        "whatsapp-web.js": "1.18.4",
+        "whatsapp-web.js": "1.19.2",
        "@bot-whatsapp/bot": "latest",
        "@bot-whatsapp/cli": "latest",
        "@bot-whatsapp/database": "latest",