mirror of
https://github.com/cheveguerra/bot-whatsapp.git
synced 2026-04-17 19:26:23 +00:00
docs(bot): ⚡ updated doc
This commit is contained in:
@@ -24,6 +24,10 @@
|
||||
"@builder.io/qwik-city": "0.0.128",
|
||||
"@fontsource/inter": "^4.5.14",
|
||||
"@iconify-json/tabler": "^1.1.49",
|
||||
"@tailwindcss/aspect-ratio": "^0.4.0",
|
||||
"@tailwindcss/forms": "^0.5.3",
|
||||
"@tailwindcss/line-clamp": "^0.3.1",
|
||||
"@tailwindcss/typography": "^0.5.0",
|
||||
"@types/eslint": "8.4.10",
|
||||
"@types/node": "latest",
|
||||
"@typescript-eslint/eslint-plugin": "5.45.0",
|
||||
|
||||
BIN
packages/docs/src/assets/fonts/FiraCode-VF.woff
Normal file
BIN
packages/docs/src/assets/fonts/FiraCode-VF.woff
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/FiraCode-VF.woff2
Normal file
BIN
packages/docs/src/assets/fonts/FiraCode-VF.woff2
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/IBMPlexMono-Regular.ttf
Normal file
BIN
packages/docs/src/assets/fonts/IBMPlexMono-Regular.ttf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/IBMPlexMono-SemiBold.ttf
Normal file
BIN
packages/docs/src/assets/fonts/IBMPlexMono-SemiBold.ttf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/Inter-italic-latin.var.woff2
Normal file
BIN
packages/docs/src/assets/fonts/Inter-italic-latin.var.woff2
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/Inter-roman-latin.var.woff2
Normal file
BIN
packages/docs/src/assets/fonts/Inter-roman-latin.var.woff2
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/Pally-Variable.ttf
Normal file
BIN
packages/docs/src/assets/fonts/Pally-Variable.ttf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/SourceSansPro-Regular.otf
Normal file
BIN
packages/docs/src/assets/fonts/SourceSansPro-Regular.otf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/SourceSerifPro-Regular.ttf
Normal file
BIN
packages/docs/src/assets/fonts/SourceSerifPro-Regular.ttf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/Synonym-Variable.ttf
Normal file
BIN
packages/docs/src/assets/fonts/Synonym-Variable.ttf
Normal file
Binary file not shown.
BIN
packages/docs/src/assets/fonts/Ubuntu-Mono-bold.woff2
Normal file
BIN
packages/docs/src/assets/fonts/Ubuntu-Mono-bold.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,13 @@
|
||||
.font {
|
||||
font-family: IBMPlexMono-Regular;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: IBMPlexMono-Regular;
|
||||
src: url(IBMPlexMono-Regular-subset.woff2) format('woff2'),
|
||||
url(IBMPlexMono-Regular-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+2C, U+2E, U+41-43, U+46, U+49, U+4B-4F, U+53-55, U+58,
|
||||
U+61-65, U+67-69, U+6C-76;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,13 @@
|
||||
.font {
|
||||
font-family: IBMPlexMono-SemiBold;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: IBMPlexMono-SemiBold;
|
||||
src: url(IBMPlexMono-SemiBold-subset.woff2) format('woff2'),
|
||||
url(IBMPlexMono-SemiBold-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+24, U+2E, U+30, U+38, U+39, U+41, U+42, U+44, U+47,
|
||||
U+4E, U+4F, U+52-55, U+57, U+59, U+65, U+68, U+6F, U+72, U+74;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,14 @@
|
||||
.font {
|
||||
font-family: Pally-Variable;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: Pally-Variable;
|
||||
src: url(Pally-Variable-subset.woff2) format('woff2'),
|
||||
url(Pally-Variable-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+24, U+2C, U+2E, U+30, U+33, U+39, U+41-43, U+46,
|
||||
U+49-4D, U+53, U+55, U+58, U+61-65, U+67-69, U+6B-77, U+79;
|
||||
font-weight: 400 700;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,13 @@
|
||||
.font {
|
||||
font-family: SourceSerifPro-Regular;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: SourceSerifPro-Regular;
|
||||
src: url(SourceSerifPro-Regular-subset.woff2) format('woff2'),
|
||||
url(SourceSerifPro-Regular-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+2C, U+2E, U+41-44, U+49, U+4A, U+4C, U+53, U+55,
|
||||
U+61-65, U+67-69, U+6B-76, U+79;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,14 @@
|
||||
.font {
|
||||
font-family: Synonym-Variable;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: Synonym-Variable;
|
||||
src: url(Synonym-Variable-subset.woff2) format('woff2'),
|
||||
url(Synonym-Variable-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+24, U+2C, U+2E, U+30, U+33, U+35, U+41-44, U+46, U+47,
|
||||
U+49, U+4B-4F, U+53-55, U+57-59, U+61, U+63-65, U+67-69, U+6C-76;
|
||||
font-weight: 400 700;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,13 @@
|
||||
.font {
|
||||
font-family: TenorSans-Regular;
|
||||
}
|
||||
|
||||
/* This file was automatically generated by GlyphHanger 4.0.1 */
|
||||
|
||||
@font-face {
|
||||
font-family: TenorSans-Regular;
|
||||
src: url(TenorSans-Regular-subset.woff2) format('woff2'),
|
||||
url(TenorSans-Regular-subset.zopfli.woff) format('woff');
|
||||
unicode-range: U+20, U+24, U+2E, U+30, U+36, U+46, U+49, U+4A, U+53, U+54,
|
||||
U+61, U+63, U+65, U+69, U+6B, U+6E, U+6F, U+72-75, U+79;
|
||||
}
|
||||
44
packages/docs/src/assets/styles/fonts.css
Normal file
44
packages/docs/src/assets/styles/fonts.css
Normal file
@@ -0,0 +1,44 @@
|
||||
@font-face {
|
||||
font-family: 'Inter var';
|
||||
font-weight: 100 900;
|
||||
font-display: block;
|
||||
font-style: normal;
|
||||
font-named-instance: 'Regular';
|
||||
src: url('../fonts/Inter-roman-latin.var.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter var';
|
||||
font-weight: 100 900;
|
||||
font-display: block;
|
||||
font-style: italic;
|
||||
font-named-instance: 'Italic';
|
||||
src: url('../fonts/Inter-italic-latin.var.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code VF';
|
||||
font-weight: 300 700;
|
||||
font-style: normal;
|
||||
src: url('../fonts/FiraCode-VF.woff2') format('woff2-variations'),
|
||||
url('../fonts/FiraCode-VF.woff') format('woff-variations');
|
||||
}
|
||||
|
||||
.font-mono {
|
||||
font-variant-ligatures: none;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('../fonts/SourceSansPro-Regular.otf') format('opentype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Ubuntu Mono';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
src: url('../fonts/Ubuntu-Mono-bold.woff2') format('woff2');
|
||||
}
|
||||
@@ -9,6 +9,7 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@import url('./fonts.css');
|
||||
|
||||
@layer components {
|
||||
.btn {
|
||||
@@ -24,19 +25,19 @@
|
||||
}
|
||||
|
||||
.slot h1 {
|
||||
@apply mb-2 font-semibold text-2xl;
|
||||
@apply my-2 font-semibold text-2xl;
|
||||
}
|
||||
|
||||
.slot h2 {
|
||||
@apply mb-2 font-semibold text-lg;
|
||||
@apply my-2 font-semibold text-lg;
|
||||
}
|
||||
|
||||
.slot h3 {
|
||||
@apply mb-2 font-semibold text-base;
|
||||
@apply my-2 font-semibold text-base;
|
||||
}
|
||||
|
||||
.slot code {
|
||||
@apply bg-slate-100 dark:bg-slate-800 p-1 px-2 rounded w-full;
|
||||
@apply bg-slate-100 dark:bg-slate-800 p-1 px-2 rounded w-full text-sm;
|
||||
}
|
||||
|
||||
.slot pre {
|
||||
@@ -51,6 +52,10 @@
|
||||
@apply my-5;
|
||||
}
|
||||
|
||||
.slot img {
|
||||
@apply rounded drop-shadow-2xl;
|
||||
}
|
||||
|
||||
[data-aw-toggle-menu] path {
|
||||
@apply transition;
|
||||
}
|
||||
|
||||
46
packages/docs/src/components/widgets/Collaborators.tsx
Normal file
46
packages/docs/src/components/widgets/Collaborators.tsx
Normal file
@@ -0,0 +1,46 @@
|
||||
import { component$ } from '@builder.io/qwik'
|
||||
|
||||
export default component$(() => {
|
||||
return (
|
||||
<div class={'pt-4'}>
|
||||
<div class="flex items-center space-x-2 text-base">
|
||||
<h4 class="font-semibold text-slate-900">Contributors</h4>
|
||||
<span class="rounded-full bg-slate-100 px-2 py-1 text-xs font-semibold text-slate-700">
|
||||
204
|
||||
</span>
|
||||
</div>
|
||||
<div class="mt-3 flex -space-x-2 overflow-hidden">
|
||||
<img
|
||||
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
|
||||
src="https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
|
||||
src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
|
||||
src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.25&w=256&h=256&q=80"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
|
||||
src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
|
||||
src="https://images.unsplash.com/photo-1517365830460-955ce3ccd263?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div class="mt-3 text-sm font-medium">
|
||||
<a href="#" class="text-blue-500">
|
||||
+ 198 others
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
@@ -5,28 +5,68 @@ import { useLocation } from '@builder.io/qwik-city'
|
||||
* options = [] array con la lista de opciones de la documentacion
|
||||
*/
|
||||
export default component$(
|
||||
({ options = [] }: { options: { link: string; name: string }[] }) => {
|
||||
const location = useLocation()
|
||||
const currentPage = location.pathname
|
||||
({
|
||||
options = [],
|
||||
}: {
|
||||
options: {
|
||||
title: string
|
||||
link: string
|
||||
list: { link: string; name: string }[]
|
||||
}[]
|
||||
}) => {
|
||||
return (
|
||||
<div>
|
||||
<ul>
|
||||
{options.map((opt) => (
|
||||
<li>
|
||||
<a
|
||||
class={
|
||||
currentPage === `${opt.link}/`
|
||||
? 'font-semibold'
|
||||
: ''
|
||||
}
|
||||
href={opt.link}
|
||||
>
|
||||
{opt.name}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{options.map((item) => (
|
||||
<UlCompoent title={item.title} list={item.list} />
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
export const UlCompoent = component$(
|
||||
(porps: {
|
||||
title: string
|
||||
link: string
|
||||
list: { link: string; name: string }[]
|
||||
}) => {
|
||||
return (
|
||||
<ul>
|
||||
<li class="mt-2 lg:mt-2">
|
||||
<a href={porps.link}>
|
||||
<h5 class="mb-8 lg:mb-3 font-semibold text-slate-900 dark:text-slate-200">
|
||||
{porps.title}
|
||||
</h5>
|
||||
</a>
|
||||
<LiComponent list={porps.list} />
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
export const LiComponent = component$(
|
||||
(porps: { list: { link: string; name: string }[] }) => {
|
||||
const location = useLocation()
|
||||
const currentPage = location.pathname
|
||||
return (
|
||||
<ul class="space-y-6 lg:space-y-2 border-l border-slate-100 dark:border-slate-800">
|
||||
{porps.list.map((opt) => (
|
||||
<li>
|
||||
<a
|
||||
class={[
|
||||
currentPage === `${opt.link}/`
|
||||
? 'font-semibold'
|
||||
: '',
|
||||
'block border-l pl-4 -ml-px border-transparent hover:border-slate-400 dark:hover:border-slate-500 text-slate-700 hover:text-slate-900 dark:text-slate-400 dark:hover:text-slate-300 ',
|
||||
]}
|
||||
href={opt.link}
|
||||
>
|
||||
{opt.name}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
@@ -8,6 +8,7 @@ import {
|
||||
import { RouterHead } from '~/components/core/RouterHead'
|
||||
import { DarkThemeLauncher } from '~/components/core/DarkThemeLauncher'
|
||||
|
||||
import fontStyles from '~/assets/styles/fonts.css?inline'
|
||||
import globalStyles from '~/assets/styles/global.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
@@ -18,6 +19,7 @@ export default component$(() => {
|
||||
* Dont remove the `<head>` and `<body>` elements.
|
||||
*/
|
||||
|
||||
useStyles$(fontStyles)
|
||||
useStyles$(globalStyles)
|
||||
|
||||
return (
|
||||
@@ -29,10 +31,7 @@ export default component$(() => {
|
||||
content="width=device-width, initial-scale=1"
|
||||
/>
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<RouterHead />
|
||||
<DarkThemeLauncher />
|
||||
</head>
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
import Collaborators from '../../components/widgets/Collaborators'
|
||||
|
||||
# Primeros Pasos
|
||||
|
||||
Los chatbots son una herramienta poderosa para que las empresas y
|
||||
@@ -6,8 +8,6 @@ organizaciones comuniquen de forma personalizada y automatizada con sus clientes
|
||||
Está documentación te ayudará a instalar tu bot de whatsapp en simples pasos con el proposito de
|
||||
que tengas un chatbot funcional en solo minutos.
|
||||
|
||||
---
|
||||
|
||||
### Ejecutar
|
||||
|
||||
Es muy sencillo solo deberas ejecutar el siguiente comando 🚀
|
||||
@@ -16,4 +16,12 @@ Es muy sencillo solo deberas ejecutar el siguiente comando 🚀
|
||||
npm create bot-whatsapp@latest
|
||||
```
|
||||
|
||||

|
||||
<div class="my-4 w-full">
|
||||
<img
|
||||
class="w-full"
|
||||
src="https://camo.githubusercontent.com/97cd563fb448c72cc50dd60d71e85d269e5b1c738473d56fee6e023e1e0723bb/68747470733a2f2f692e67697068792e636f6d2f6d656469612f6e744d74365476616c70737454497837416b2f67697068792e77656270"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Collaborators />
|
||||
|
||||
@@ -8,3 +8,113 @@ contributors:
|
||||
---
|
||||
|
||||
# Instalación
|
||||
|
||||
### 📄 Bienvenido/a
|
||||
|
||||
Si deseas colaborar con el proyecto existen varias maneras, la primera de ellas es aportando conocimiento y mejorando el repositorio (actualizando documentación, mejorando código, revisando **[issues](https://github.com/codigoencasa/bot-whatsapp/issues)**, etc).
|
||||
|
||||
También es bien recibido los aportes económicos que se utilizaran para diferentes fines **[ver más](https://opencollective.com/bot-whatsapp)**
|
||||
|
||||
El lenguaje principal que se utilizó para desarrollar este proyecto fue **JavaScript** con el fin de qué personas que están iniciando en el mundo de la programación puedan entender fácilmente.
|
||||
|
||||
### 🤔 Preguntas frecuentes
|
||||
|
||||
- ¿Como puedo hacer aportaciones de código en el proyecto?: [Ver Video](https://youtu.be/Lxt8Acob6aU)
|
||||
- ¿Como ejecutar el entorno de pruebas?: [Ver Video](https://youtu.be/Mf9V-dloBfk)
|
||||
- ¿Como crear un nuevo proveedor?: [Ver Video](https://youtu.be/cahK9zH3SI8)
|
||||
- ¿Que son los GithubActions?: [Ver Video](https://youtu.be/nYBEBFKLiqw)
|
||||
- ¿Canales de comunicación?: [Discord](https://link.codigoencasa.com/DISCORD)
|
||||
|
||||
---
|
||||
|
||||

|
||||
|
||||
**Requerimientos:**
|
||||
|
||||
- Node v16 o superior **[descargar node](https://nodejs.org/es/download/)**
|
||||
- **[Yarn](https://classic.yarnpkg.com/lang/en/docs/install/#windows-stable)** como gestor de paquetes. En el link conseguirás las intrucciones para instalar yarn.
|
||||
- **[VSCode](https://code.visualstudio.com/download)** (recomendado): Editor de código con plugins.
|
||||
- **[Conventional Commits](https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits&ssr=false#overview)** (plugin-vscode) este plugin te ayudará a crear commit semántico.
|
||||
- Se usará la rama **dev** _(https://github.com/leifermendez/bot-whatsapp/tree/dev)_ como rama principal hasta que se haga oficialmente el lanzamiento de la V2.
|
||||
|
||||
### 🚀 Iniciando
|
||||
|
||||
**Clonar repo rama dev**
|
||||
|
||||
```
|
||||
git clone --branch dev https://github.com/codigoencasa/bot-whatsapp
|
||||
```
|
||||
|
||||
**Instalar dependencias**
|
||||
|
||||
```
|
||||
cd bot-whatsapp
|
||||
yarn install
|
||||
```
|
||||
|
||||
**Compilar (build)**
|
||||
Para compilar la aplicación es necesario ejecutar este comando, el cual genera un directorio `lib` dentro de los paquetes del monorepo.
|
||||
|
||||
```
|
||||
yarn build
|
||||
```
|
||||
|
||||
**Example-app**
|
||||
Se ejecuta el CLI (Command Line Interface) para ayudarte a crear un app-bot de ejemplo.
|
||||
|
||||
```
|
||||
yarn run cli
|
||||
```
|
||||
|
||||
Selecionas (mediante las flechas arriba y abajo) el proveedor que quieras usar y cuando estes sobre el presiona la barra de espacio, igualmente selecciona la base de datos que quieras usar.
|
||||
|
||||
Se creó un subdirecorio con el nombre del proveedor y base de datos que seleccionaste, ejemplo: `base-bailey-mysql`
|
||||
|
||||
Dentro de ese directorio necesitas editar el archivo package.json y borrar las siguientes lineas:
|
||||
|
||||
```
|
||||
"@bot-whatsapp/bot": "latest",
|
||||
"@bot-whatsapp/cli": "latest",
|
||||
"@bot-whatsapp/database": "latest",
|
||||
"@bot-whatsapp/provider": "latest",
|
||||
```
|
||||
|
||||
Cambiate al directorio creado ejemplo: `base-bailey-mysql`
|
||||
|
||||
```
|
||||
cd base-baileys-mysql
|
||||
```
|
||||
|
||||
Ejecuta los comandos:
|
||||
|
||||
```
|
||||
npm install
|
||||
npm run pre-copy
|
||||
npm start
|
||||
```
|
||||
|
||||
En el caso de MySql y Mongo es necesario especificar en app.js los datos de la conexión, ejemplo de MySql:
|
||||
|
||||
```
|
||||
const BaileysProvider = require('@bot-whatsapp/provider/baileys')
|
||||
const MySQLAdapter = require('@bot-whatsapp/database/mysql')
|
||||
|
||||
/**
|
||||
* Declaramos las conexiones de MySQL
|
||||
*/
|
||||
const MYSQL_DB_HOST = 'localhost'
|
||||
const MYSQL_DB_USER = 'usr'
|
||||
const MYSQL_DB_PASSWORD = 'pass'
|
||||
const MYSQL_DB_NAME = 'bot'
|
||||
```
|
||||
|
||||

|
||||
|
||||
> **NOTA:** [Eres libre de aportar informacion a este documento o arreglar ortografia 🤣](https://github.com/codigoencasa/bot-whatsapp/edit/dev/CONTRIBUTING.md)
|
||||
|
||||
---
|
||||
|
||||
- [Discord](https://link.codigoencasa.com/DISCORD)
|
||||
- [Twitter](https://twitter.com/leifermendez)
|
||||
- [Youtube](https://www.youtube.com/watch?v=5lEMCeWEJ8o&list=PL_WGMLcL4jzWPhdhcUyhbFU6bC0oJd2BR)
|
||||
- [Telegram](https://t.me/leifermendez)
|
||||
|
||||
@@ -8,16 +8,15 @@ import ExtraBar from '~/components/widgets/ExtraBar'
|
||||
export default component$(() => {
|
||||
const store = useStore({
|
||||
options: [
|
||||
{ name: 'Primeros pasos', link: '/docs' },
|
||||
{ name: 'Instalación', link: '/docs/install' },
|
||||
{ name: 'Configuración', link: '/docs/settings' },
|
||||
{ name: 'Migración', link: '/docs/migration' },
|
||||
],
|
||||
extraOptions: [
|
||||
{ name: 'Primeros pasos', link: '/docs', class: 'font-semibold' },
|
||||
{ name: 'Instalación', link: '/docs' },
|
||||
{ name: 'Configuración', link: '/docs' },
|
||||
{ name: 'Forma de pensar', link: '/docs' },
|
||||
{
|
||||
title: 'Primeros pasos',
|
||||
list: [
|
||||
{ name: 'Vista rápida', link: '/docs' },
|
||||
{ name: 'Instalación', link: '/docs/install' },
|
||||
{ name: 'Configuración', link: '/docs/settings' },
|
||||
{ name: 'Migración', link: '/docs/migration' },
|
||||
],
|
||||
},
|
||||
],
|
||||
})
|
||||
|
||||
@@ -33,7 +32,7 @@ export default component$(() => {
|
||||
<Slot />
|
||||
</div>
|
||||
<div class={'px-3 col-span-1 '}>
|
||||
<ExtraBar options={store.extraOptions} />
|
||||
{/* <ExtraBar options={store.extraOptions} /> */}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -1,10 +1,130 @@
|
||||
---
|
||||
title: Overview
|
||||
contributors:
|
||||
- adamdbradley
|
||||
- steve8708
|
||||
- manucorporat
|
||||
- gabrielgrant
|
||||
---
|
||||
# Migración
|
||||
|
||||
# Migracion
|
||||
#### Versión (legacy)
|
||||
|
||||
En la **_versión (legacy)_** se implementas los flujos de esta manera, en dos archivos independientes.
|
||||
|
||||
> **`initial.json`** para establecer las palabras claves y el flujo a responder, por otro lado tambien se necesitaba implementar.
|
||||
> **`response.json`** donde se escriben los mensajes a responder.
|
||||
|
||||
```json
|
||||
//initial.json
|
||||
[
|
||||
{
|
||||
"keywords": ["hola", "ola", "alo"],
|
||||
"key": "hola"
|
||||
},
|
||||
{
|
||||
"keywords": ["productos", "info"],
|
||||
"key": "productos"
|
||||
},
|
||||
{
|
||||
"keywords": ["adios", "bye"],
|
||||
"key": "adios"
|
||||
},
|
||||
{
|
||||
"keywords": ["imagen", "foto"],
|
||||
"key": "catalogo"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
```json
|
||||
//response.json
|
||||
{
|
||||
"hola": {
|
||||
"replyMessage": ["Gracias a ti! \n"],
|
||||
"media": null,
|
||||
"trigger": null
|
||||
},
|
||||
"adios": {
|
||||
"replyMessage": ["Que te vaya bien!!"]
|
||||
},
|
||||
"productos": {
|
||||
"replyMessage": ["Más productos aquí"],
|
||||
"trigger": null,
|
||||
"actions": {
|
||||
"title": "¿Que te interesa ver?",
|
||||
"message": "Abajo unos botons",
|
||||
"footer": "",
|
||||
"buttons": [
|
||||
{ "body": "Telefonos" },
|
||||
{ "body": "Computadoras" },
|
||||
{ "body": "Otros" }
|
||||
]
|
||||
}
|
||||
},
|
||||
"catalogo": {
|
||||
"replyMessage": ["Te envio una imagen"],
|
||||
"media": "https://media2.giphy.com/media/VQJu0IeULuAmCwf5SL/giphy.gif",
|
||||
"trigger": null
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### Versión 2 (0.2.X)
|
||||
|
||||
En esta versión es mucho más sencillo abajo encontraras un ejemplo del mismo flujo anteriormente mostrado.
|
||||
|
||||
```js
|
||||
//app.js
|
||||
const {
|
||||
createBot,
|
||||
createProvider,
|
||||
createFlow,
|
||||
addKeyword,
|
||||
addChild,
|
||||
} = require('@bot-whatsapp/bot')
|
||||
|
||||
const BaileysProvider = require('@bot-whatsapp/provider/baileys')
|
||||
const MockAdapter = require('@bot-whatsapp/database/mock')
|
||||
/**
|
||||
* Declarando flujos principales.
|
||||
*/
|
||||
const flowHola = addKeyword(['hola', 'ola', 'alo']).addAnswer(
|
||||
'Bienvenido a tu tienda online!'
|
||||
)
|
||||
|
||||
const flowAdios = addKeyword(['adios', 'bye'])
|
||||
.addAnswer('Que te vaya bien!!')
|
||||
.addAnswer('Hasta luego!')
|
||||
|
||||
const flowProductos = addKeyword(['productos', 'info']).addAnswer(
|
||||
'Te envio una imagen',
|
||||
{
|
||||
buttons: [
|
||||
{ body: 'Telefonos' },
|
||||
{ body: 'Computadoras' },
|
||||
{ body: 'Otros' },
|
||||
],
|
||||
}
|
||||
)
|
||||
|
||||
const flowCatalogo = addKeyword(['imagen', 'foto']).addAnswer(
|
||||
'Te envio una imagen',
|
||||
{ media: 'https://media2.giphy.com/media/VQJu0IeULuAmCwf5SL/giphy.gif' }
|
||||
)
|
||||
|
||||
const main = async () => {
|
||||
const adapterDB = new MockAdapter()
|
||||
const adapterFlow = createFlow([
|
||||
flowHola,
|
||||
flowAdios,
|
||||
flowProductos,
|
||||
flowCatalogo,
|
||||
])
|
||||
const adapterProvider = createProvider(BaileysProvider)
|
||||
createBot({
|
||||
flow: adapterFlow,
|
||||
provider: adapterProvider,
|
||||
database: adapterDB,
|
||||
})
|
||||
}
|
||||
```
|
||||
|
||||
> Forma parte de este proyecto.
|
||||
|
||||
- [Discord](https://link.codigoencasa.com/DISCORD)
|
||||
- [Twitter](https://twitter.com/leifermendez)
|
||||
- [Youtube](https://www.youtube.com/watch?v=5lEMCeWEJ8o&list=PL_WGMLcL4jzWPhdhcUyhbFU6bC0oJd2BR)
|
||||
- [Telegram](https://t.me/leifermendez)
|
||||
|
||||
@@ -11,11 +11,212 @@ module.exports = {
|
||||
primary: colors.purple,
|
||||
secondary: colors.sky,
|
||||
},
|
||||
typography: (theme) => ({
|
||||
DEFAULT: {
|
||||
css: {
|
||||
maxWidth: 'none',
|
||||
color: theme('colors.slate.700'),
|
||||
hr: {
|
||||
borderColor: theme('colors.slate.100'),
|
||||
marginTop: '3em',
|
||||
marginBottom: '3em',
|
||||
},
|
||||
'h1, h2, h3': {
|
||||
letterSpacing: '-0.025em',
|
||||
},
|
||||
h2: {
|
||||
marginBottom: `${16 / 24}em`,
|
||||
},
|
||||
h3: {
|
||||
marginTop: '2.4em',
|
||||
lineHeight: '1.4',
|
||||
},
|
||||
h4: {
|
||||
marginTop: '2em',
|
||||
fontSize: '1.125em',
|
||||
},
|
||||
'h2 small, h3 small, h4 small': {
|
||||
fontFamily: theme('fontFamily.mono').join(', '),
|
||||
color: theme('colors.slate.500'),
|
||||
fontWeight: 500,
|
||||
},
|
||||
'h2 small': {
|
||||
fontSize: theme('fontSize.lg')[0],
|
||||
...theme('fontSize.lg')[1],
|
||||
},
|
||||
'h3 small': {
|
||||
fontSize: theme('fontSize.base')[0],
|
||||
...theme('fontSize.base')[1],
|
||||
},
|
||||
'h4 small': {
|
||||
fontSize: theme('fontSize.sm')[0],
|
||||
...theme('fontSize.sm')[1],
|
||||
},
|
||||
'h2, h3, h4': {
|
||||
'scroll-margin-top': 'var(--scroll-mt)',
|
||||
},
|
||||
ul: {
|
||||
listStyleType: 'none',
|
||||
paddingLeft: 0,
|
||||
},
|
||||
'ul > li': {
|
||||
position: 'relative',
|
||||
paddingLeft: '1.75em',
|
||||
},
|
||||
'ul > li::before': {
|
||||
content: '""',
|
||||
width: '0.75em',
|
||||
height: '0.125em',
|
||||
position: 'absolute',
|
||||
top: 'calc(0.875em - 0.0625em)',
|
||||
left: 0,
|
||||
borderRadius: '999px',
|
||||
backgroundColor: theme('colors.slate.300'),
|
||||
},
|
||||
a: {
|
||||
fontWeight: theme('fontWeight.semibold'),
|
||||
textDecoration: 'none',
|
||||
borderBottom: `1px solid ${theme(
|
||||
'colors.sky.300'
|
||||
)}`,
|
||||
},
|
||||
'a:hover': {
|
||||
borderBottomWidth: '2px',
|
||||
},
|
||||
'a code': {
|
||||
color: 'inherit',
|
||||
fontWeight: 'inherit',
|
||||
},
|
||||
strong: {
|
||||
color: theme('colors.slate.900'),
|
||||
fontWeight: theme('fontWeight.semibold'),
|
||||
},
|
||||
'a strong': {
|
||||
color: 'inherit',
|
||||
fontWeight: 'inherit',
|
||||
},
|
||||
kbd: {
|
||||
background: theme('colors.slate.100'),
|
||||
borderWidth: '1px',
|
||||
borderColor: theme('colors.slate.200'),
|
||||
padding: '0.125em 0.25em',
|
||||
color: theme('colors.slate.700'),
|
||||
fontWeight: 500,
|
||||
fontSize: '0.875em',
|
||||
fontVariantLigatures: 'none',
|
||||
borderRadius: '4px',
|
||||
margin: '0 1px',
|
||||
},
|
||||
code: {
|
||||
fontWeight: theme('fontWeight.medium'),
|
||||
fontVariantLigatures: 'none',
|
||||
},
|
||||
pre: {
|
||||
color: theme('colors.slate.50'),
|
||||
borderRadius: theme('borderRadius.xl'),
|
||||
padding: theme('padding.5'),
|
||||
boxShadow: theme('boxShadow.md'),
|
||||
display: 'flex',
|
||||
marginTop: `${20 / 14}em`,
|
||||
marginBottom: `${32 / 14}em`,
|
||||
},
|
||||
'p + pre': {
|
||||
marginTop: `${-4 / 14}em`,
|
||||
},
|
||||
'pre + pre': {
|
||||
marginTop: `${-16 / 14}em`,
|
||||
},
|
||||
'pre code': {
|
||||
flex: 'none',
|
||||
minWidth: '100%',
|
||||
},
|
||||
table: {
|
||||
fontSize: theme('fontSize.sm')[0],
|
||||
lineHeight: theme('fontSize.sm')[1].lineHeight,
|
||||
},
|
||||
thead: {
|
||||
color: theme('colors.slate.700'),
|
||||
borderBottomColor: theme('colors.slate.200'),
|
||||
},
|
||||
'thead th': {
|
||||
paddingTop: 0,
|
||||
fontWeight: theme('fontWeight.semibold'),
|
||||
},
|
||||
'tbody tr': {
|
||||
borderBottomColor: theme('colors.slate.100'),
|
||||
},
|
||||
'tbody tr:last-child': {
|
||||
borderBottomWidth: '1px',
|
||||
},
|
||||
'tbody code': {
|
||||
fontSize: theme('fontSize.xs')[0],
|
||||
},
|
||||
'figure figcaption': {
|
||||
textAlign: 'center',
|
||||
fontStyle: 'italic',
|
||||
},
|
||||
'figure > figcaption': {
|
||||
marginTop: `${12 / 14}em`,
|
||||
},
|
||||
},
|
||||
},
|
||||
dark: {
|
||||
css: {
|
||||
color: theme('colors.slate.400'),
|
||||
'h2, h3, h4, thead th': {
|
||||
color: theme('colors.slate.200'),
|
||||
},
|
||||
'h2 small, h3 small, h4 small': {
|
||||
color: theme('colors.slate.400'),
|
||||
},
|
||||
kbd: {
|
||||
background: theme('colors.slate.700'),
|
||||
borderColor: theme('colors.slate.600'),
|
||||
color: theme('colors.slate.200'),
|
||||
},
|
||||
code: {
|
||||
color: theme('colors.slate.200'),
|
||||
},
|
||||
hr: {
|
||||
borderColor: theme('colors.slate.200'),
|
||||
opacity: '0.05',
|
||||
},
|
||||
pre: {
|
||||
boxShadow: 'inset 0 0 0 1px rgb(255 255 255 / 0.1)',
|
||||
},
|
||||
a: {
|
||||
color: theme('colors.white'),
|
||||
borderBottomColor: theme('colors.sky.400'),
|
||||
},
|
||||
strong: {
|
||||
color: theme('colors.slate.200'),
|
||||
},
|
||||
thead: {
|
||||
color: theme('colors.slate.300'),
|
||||
borderBottomColor: 'rgb(148 163 184 / 0.2)',
|
||||
},
|
||||
'tbody tr': {
|
||||
borderBottomColor: 'rgb(148 163 184 / 0.1)',
|
||||
},
|
||||
blockQuote: {
|
||||
color: theme('colors.white'),
|
||||
},
|
||||
},
|
||||
},
|
||||
}),
|
||||
fontFamily: {
|
||||
sans: ["'Inter'", ...defaultTheme.fontFamily.sans],
|
||||
sans: ['Inter var', ...defaultTheme.fontFamily.sans],
|
||||
mono: ['Fira Code VF', ...defaultTheme.fontFamily.mono],
|
||||
source: ['Source Sans Pro', ...defaultTheme.fontFamily.sans],
|
||||
'ubuntu-mono': ['Ubuntu Mono', ...defaultTheme.fontFamily.mono],
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
darkMode: 'class',
|
||||
plugins: [
|
||||
require('@tailwindcss/line-clamp'),
|
||||
require('@tailwindcss/typography'),
|
||||
require('@tailwindcss/aspect-ratio'),
|
||||
require('@tailwindcss/forms')({ strategy: 'class' }),
|
||||
],
|
||||
}
|
||||
|
||||
79
yarn.lock
79
yarn.lock
@@ -916,11 +916,11 @@ __metadata:
|
||||
linkType: hard
|
||||
|
||||
"@babel/runtime@npm:^7.3.4":
|
||||
version: 7.20.6
|
||||
resolution: "@babel/runtime@npm:7.20.6"
|
||||
version: 7.20.7
|
||||
resolution: "@babel/runtime@npm:7.20.7"
|
||||
dependencies:
|
||||
regenerator-runtime: ^0.13.11
|
||||
checksum: 42a8504db21031b1859fbc0f52d698a3d2f5ada9519eb76c6f96a7e657d8d555732a18fe71ef428a67cc9fc81ca0d3562fb7afdc70549c5fec343190cbaa9b03
|
||||
checksum: 4629ce5c46f06cca9cfb9b7fc00d48003335a809888e2b91ec2069a2dcfbfef738480cff32ba81e0b7c290f8918e5c22ddcf2b710001464ee84ba62c7e32a3a3
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@@ -1882,6 +1882,49 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@tailwindcss/aspect-ratio@npm:^0.4.0":
|
||||
version: 0.4.2
|
||||
resolution: "@tailwindcss/aspect-ratio@npm:0.4.2"
|
||||
peerDependencies:
|
||||
tailwindcss: ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
|
||||
checksum: e998fcb0c1a55cae4e83c4510fed0d4d1cba845b7ed79a18451f55377d4a177050c2401af59222662a216aa9c407ef49c475c93db8e13246e0bb3f1ed42f78f8
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@tailwindcss/forms@npm:^0.5.3":
|
||||
version: 0.5.3
|
||||
resolution: "@tailwindcss/forms@npm:0.5.3"
|
||||
dependencies:
|
||||
mini-svg-data-uri: ^1.2.3
|
||||
peerDependencies:
|
||||
tailwindcss: ">=3.0.0 || >= 3.0.0-alpha.1"
|
||||
checksum: 9eddb4dbd06d01b1068138ff52a54ed0e35a28e7bfd3c72e226fc28658ecd92a9c078c4abe9c83db090984672040644d7ae2e035933fb619dd703df1d87aa275
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@tailwindcss/line-clamp@npm:^0.3.1":
|
||||
version: 0.3.1
|
||||
resolution: "@tailwindcss/line-clamp@npm:0.3.1"
|
||||
peerDependencies:
|
||||
tailwindcss: ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
|
||||
checksum: 805322a6333f029d6d961e02f23099d16f55d31f4736511bc741efff4097a1ad1574a7dff0530b17dbc974e08138b3beb13766f809e0116ebc192b0edf38b737
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@tailwindcss/typography@npm:^0.5.0":
|
||||
version: 0.5.8
|
||||
resolution: "@tailwindcss/typography@npm:0.5.8"
|
||||
dependencies:
|
||||
lodash.castarray: ^4.4.0
|
||||
lodash.isplainobject: ^4.0.6
|
||||
lodash.merge: ^4.6.2
|
||||
postcss-selector-parser: 6.0.10
|
||||
peerDependencies:
|
||||
tailwindcss: "*"
|
||||
checksum: afe172c75ddf086f840b10f95e562bb210dde5612fccfcfd3c4cee688c57ca5b79569b3c2cb75687b34b1b7f9ad194b14e9fbb09a741cd69198bb92b5ac3838f
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@tootallnate/once@npm:1":
|
||||
version: 1.1.2
|
||||
resolution: "@tootallnate/once@npm:1.1.2"
|
||||
@@ -7434,6 +7477,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"lodash.castarray@npm:^4.4.0":
|
||||
version: 4.4.0
|
||||
resolution: "lodash.castarray@npm:4.4.0"
|
||||
checksum: fca8c7047e0ae2738b0b2503fb00157ae0ff6d8a1b716f87ed715b22560e09de438c75b65e01a7e44ceb41c5b31dce2eb576e46db04beb9c699c498e03cbd00f
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"lodash.clone@npm:^4.5.0":
|
||||
version: 4.5.0
|
||||
resolution: "lodash.clone@npm:4.5.0"
|
||||
@@ -8301,6 +8351,15 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"mini-svg-data-uri@npm:^1.2.3":
|
||||
version: 1.4.4
|
||||
resolution: "mini-svg-data-uri@npm:1.4.4"
|
||||
bin:
|
||||
mini-svg-data-uri: cli.js
|
||||
checksum: 997f1fbd8d59a70f03761e18626d335197a3479cb9d1ff75678e4b64b864d32a0b8fc18115eabde035e5299b8b4a354a78e57dd6ac10f9d604162a6170898d09
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"miniflare@npm:2.10.0":
|
||||
version: 2.10.0
|
||||
resolution: "miniflare@npm:2.10.0"
|
||||
@@ -9718,6 +9777,16 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"postcss-selector-parser@npm:6.0.10":
|
||||
version: 6.0.10
|
||||
resolution: "postcss-selector-parser@npm:6.0.10"
|
||||
dependencies:
|
||||
cssesc: ^3.0.0
|
||||
util-deprecate: ^1.0.2
|
||||
checksum: 46afaa60e3d1998bd7adf6caa374baf857cc58d3ff944e29459c9a9e4680a7fe41597bd5b755fc81d7c388357e9bf67c0251d047c640a09f148e13606b8a8608
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"postcss-selector-parser@npm:^6.0.10, postcss-selector-parser@npm:^6.0.4, postcss-selector-parser@npm:^6.0.5, postcss-selector-parser@npm:^6.0.9":
|
||||
version: 6.0.11
|
||||
resolution: "postcss-selector-parser@npm:6.0.11"
|
||||
@@ -10034,6 +10103,10 @@ __metadata:
|
||||
"@builder.io/qwik-city": 0.0.128
|
||||
"@fontsource/inter": ^4.5.14
|
||||
"@iconify-json/tabler": ^1.1.49
|
||||
"@tailwindcss/aspect-ratio": ^0.4.0
|
||||
"@tailwindcss/forms": ^0.5.3
|
||||
"@tailwindcss/line-clamp": ^0.3.1
|
||||
"@tailwindcss/typography": ^0.5.0
|
||||
"@types/eslint": 8.4.10
|
||||
"@types/node": latest
|
||||
"@typescript-eslint/eslint-plugin": 5.45.0
|
||||
|
||||
Reference in New Issue
Block a user