{"id":51450695,"url":"https://github.com/pedroknigge/superpipewhat","last_synced_at":"2026-07-05T20:01:30.383Z","repository":{"id":353146544,"uuid":"1218119193","full_name":"pedroknigge/superpipewhat","owner":"pedroknigge","description":"Pipedrive ↔ Whaticket en una sola extensión de Chrome. Panel de Pipedrive dentro de Whaticket + envío de WhatsApp vía Whaticket desde Pipedrive.","archived":false,"fork":false,"pushed_at":"2026-04-22T16:09:30.000Z","size":783,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-04-22T18:12:56.823Z","etag":null,"topics":["chrome-extension","crm","manifest-v3","pipedrive","whaticket","whatsapp"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pedroknigge.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-04-22T14:52:04.000Z","updated_at":"2026-04-22T16:09:34.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/pedroknigge/superpipewhat","commit_stats":null,"previous_names":["pedroknigge/superpipewhat"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/pedroknigge/superpipewhat","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pedroknigge%2Fsuperpipewhat","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pedroknigge%2Fsuperpipewhat/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pedroknigge%2Fsuperpipewhat/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pedroknigge%2Fsuperpipewhat/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pedroknigge","download_url":"https://codeload.github.com/pedroknigge/superpipewhat/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pedroknigge%2Fsuperpipewhat/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35167259,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-05T02:00:06.290Z","response_time":100,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chrome-extension","crm","manifest-v3","pipedrive","whaticket","whatsapp"],"created_at":"2026-07-05T20:01:29.471Z","updated_at":"2026-07-05T20:01:30.356Z","avatar_url":"https://github.com/pedroknigge.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"icons/logo.png\" alt=\"SuperPipeWhat\" width=\"420\"\u003e\n\u003c/p\u003e\n\n# SuperPipeWhat\n\n**Un puente bidireccional entre [Pipedrive](https://www.pipedrive.com/) y [Whaticket](https://whaticket.com/) en una sola extensión de Chrome.** Dos integraciones complementarias que cubren el agujero que deja la falta de integración oficial entre ambas plataformas:\n\n- 📥 **En Whaticket** — panel lateral con los datos del contacto en Pipedrive (deals, timeline, próxima actividad). Creá notas, actividades, deals, editá etapa/valor, marcá won/lost, mandá email con BCC tracked — todo sin salir del chat.\n- 📤 **En Pipedrive** — botón flotante (o iconos inline) para enviar WhatsApp vía Whaticket desde cualquier deal, lead, persona u organización. Plantillas con variables, envío masivo desde vistas de lista, adjuntos.\n\nExtensión Chrome Manifest V3. Un único install atiende ambos dominios y decide qué lógica cargar según la página activa. Sin servidores propios, sin tracking, sin telemetría.\n\nHecha por [marketingfraccional.com](https://marketingfraccional.com) · Pedro Knigge.\n\n\u003e Esta extensión unifica y reemplaza a los proyectos predecesores [PipeWhat](https://github.com/pedroknigge/pipewhat) y [WhatPipe](https://github.com/pedroknigge/whatpipe).\n\n---\n\n## ¿Por qué?\n\nLos equipos comerciales y de atención usan Pipedrive para el pipeline y Whaticket para conversar por WhatsApp. Pero **no existe integración oficial entre ambos**: quien atiende copia números a mano, pega en Whaticket, vuelve a Pipedrive a actualizar el deal, pierde trazabilidad. Con SuperPipeWhat:\n\n- Desde Whaticket, mientras chateás, ves el pipeline del contacto y operás sobre Pipedrive en la misma pantalla.\n- Desde Pipedrive, mandás WhatsApp sin salir del deal, con plantillas personalizadas y envío masivo.\n\n---\n\n## ✨ Qué hace\n\n### 📥 Panel de Pipedrive dentro de Whaticket\n\nSe inyecta en `*.whaticket.com`. Pestaña **PD** pegada al borde derecho.\n\n**Lectura**\n\n- Detección automática del teléfono del chat (URL, `tel:` links, header) con búsqueda en Pipedrive probando múltiples variantes (con/sin código de país, con/sin el `9` móvil argentino, últimos 8–10 dígitos).\n- Persona con nombre, empresa, dueño, teléfonos y emails. Click en tel/email copia al portapapeles.\n- Deals asociados con `Pipeline · Etapa`, status pill (open/won/lost) y valor.\n- Banner con la **próxima actividad pendiente** y botón `✓ Hecha`.\n- **Timeline del deal** con íconos por tipo (📞 llamada, 🤝 reunión, ✅ tarea, ✉️ email, 📝 nota, 📎 archivo, 🔄 cambio). Notas con *Ver más/menos*, archivos clickeables, cambios de stage con nombre real.\n\n**Escritura** (con confirmación propia, sin `confirm()` bloqueante)\n\n- **+ Nota** al deal.\n- **+ Actividad** con presets rápidos o custom.\n- **✎ Editar deal**: cambiar etapa (filtrada por pipeline), valor + moneda, reasignar dueño, marcar 🏆 Won, marcar ❌ Lost con razón de pérdida.\n- **+ Nuevo deal** con selector pipeline+etapa dependientes.\n- **+ Tel** / **+ Email** que *mergea* con los contactos existentes.\n- **📧 Email** por deal: form inline que arma un `mailto:` con tu **Smart BCC** de Pipedrive — el mail queda loggeado automáticamente en el deal.\n- **+ Crear persona en Pipedrive** cuando el teléfono del chat no matchea.\n\n**Responsive**\n\n- Ancho default `clamp(320, 440, 30% viewport)`, auto-colapsado en pantallas \u003c1100px.\n- Modo compacto automático con container queries cuando el panel mide ≤380px.\n- Resize handle arrastrable (300–900px) con ancho persistido.\n- El chat de Whaticket se encoge en vez de quedar tapado.\n\n### 📤 Envío WhatsApp desde Pipedrive\n\nSe inyecta en `*.pipedrive.com`. Botón flotante 📱 abajo a la derecha (o iconos inline).\n\n- **Atajo `Alt+Shift+W`** para abrir el modal desde cualquier vista.\n- **Detección de contacto**: por DOM (fallback) o por API de Pipedrive (preciso, requiere token).\n- **Plantillas** con variables: `{{nombre}}`, `{{apellido}}`, `{{nombre_completo}}`, `{{empresa}}`, `{{mi_empresa}}`, `{{email}}`, `{{deal}}`, `{{owner}}`.\n- **Adjuntos por plantilla** (imagen, PDF, audio vía URL).\n- **Envío masivo**: marcá varias filas en una vista de lista (Negocios, Leads, Personas) y aparece un botón **\"Enviar a N\"** que resuelve cada destinatario contra la API de Pipedrive y personaliza la plantilla **por contacto**. Log en vivo con OK/fallos, intervalo configurable, podés frenar en cualquier momento.\n- **Modal arrastrable**; se vuelve transparente mientras lo movés.\n- **Modo del botón**: flotante (default) o inline (iconito verde al lado de cada número de teléfono).\n- **Guardar como plantilla** desde el propio modal con un click.\n\n---\n\n## ⌨️ Atajos\n\n| Dónde | Atajo | Acción |\n|---|---|---|\n| Whaticket | `Alt + Shift + P` | Colapsar / expandir el panel de Pipedrive |\n| Pipedrive | `Alt + Shift + W` | Abrir modal de envío Whaticket |\n\n---\n\n## 🛠 Instalación\n\n1. Cloná este repo (o descargalo como ZIP).\n2. En Chrome: `chrome://extensions` → activar **Modo desarrollador**.\n3. Click en **Cargar extensión sin empaquetar** → seleccionar la carpeta `SuperPipeWhat/`.\n4. Click al ícono de la extensión → **Opciones** y configurá las credenciales (ver abajo).\n\n### Configuración inicial\n\n**Pestaña Pipedrive (panel dentro de Whaticket)**\n\n- **Subdominio**: si tu URL es `miempresa.pipedrive.com`, poné `miempresa`.\n- **Token de API** de Pipedrive: *Configuración → Preferencias personales → API*.\n- **Código de país por defecto** (opcional pero recomendado): ej. `54` para AR. Se usa en las dos integraciones.\n- **Smart Email BCC** (opcional): tu BCC personal de Pipedrive (*Email sync*). Activa el tracking automático de mails enviados desde el panel.\n- **Whaticket self-hosted** (opcional): si tu Whaticket corre en un dominio propio, autorizalo acá. Chrome te va a pedir permiso explícito.\n\n**Pestaña Whaticket (FAB dentro de Pipedrive)**\n\n- **Token de Whaticket**: creá uno en [app.whaticket.com/tokens](https://app.whaticket.com/tokens) con permisos `create:messages` y `read:whatsapps`.\n- **Conexión por defecto**: \"Cargar conexiones\" y elegí una de la lista.\n- **Tu empresa**: nombre usado como `{{mi_empresa}}` en plantillas.\n- **Modo del botón**: flotante o inline.\n\n**Pestaña Plantillas**\n\nVienen 3 plantillas base en rioplatense. Editá o agregá las tuyas. Los cambios se sincronizan en vivo entre pestañas.\n\n---\n\n## 🏗 Arquitectura\n\nExtensión **Manifest V3** con dos `content_scripts` — uno por dominio — y un service worker único que hace de router.\n\n```\nSuperPipeWhat/\n├── manifest.json         MV3, dos content_scripts disjuntos\n├── background.js         Service worker — Pipedrive API + Whaticket API + commands + migración\n├── content/\n│   ├── whaticket.js      Panel Pipedrive en *.whaticket.com\n│   ├── whaticket.css\n│   ├── pipedrive.js      FAB / modal de envío en *.pipedrive.com\n│   └── pipedrive.css\n├── options.html / .js    4 tabs: Pipedrive · Whaticket · Plantillas · Ayuda\n├── popup.html / .js      Estado en vivo de ambas integraciones + banner contextual\n└── icons/\n```\n\n- **Permisos mínimos**: `storage`, `scripting` + `host_permissions` para `*.pipedrive.com`, `*.whaticket.com`, `api.whaticket.com`. Sin `tabs`, `activeTab`, ni nada más.\n- **Los tokens nunca llegan al content script**: todas las llamadas a APIs pasan por el service worker. Los content scripts sólo ven las respuestas parseadas.\n- **Cache en memoria** (TTL 5 min) para Pipedrive: `persons/search`, `persons/{id}`, `persons/{id}/deals`, `deals/{id}/flow`, `/stages`, `/pipelines`. Invalidación precisa al escribir.\n- **XSS-safe**: el content script de Whaticket renderea todo con `createElement` + `textContent` (nunca `innerHTML` con datos de terceros).\n- **SPA-friendly**: `MutationObserver` + polling de URL para detectar cambios de chat en Whaticket y cambios de página en Pipedrive sin recarga.\n\n### APIs usadas\n\n**Pipedrive** (`https://\u003ctu-dominio\u003e.pipedrive.com/api/v1`)\n\n| Método | Path | Uso |\n|---|---|---|\n| GET | `/persons/search?term=\u003cphone\u003e\u0026fields=phone` | Buscar persona por teléfono |\n| GET | `/persons/{id}` + `/persons/{id}/deals` | Bundle del contacto |\n| GET | `/deals/{id}/flow?limit=15` | Timeline del deal |\n| GET | `/stages`, `/pipelines`, `/users` | Catálogos |\n| GET | `/deals/{id}`, `/leads/{id}`, `/organizations/{id}` | Lookup desde el FAB de Pipedrive |\n| POST | `/notes`, `/activities`, `/deals`, `/persons` | Crear |\n| PUT | `/deals/{id}`, `/persons/{id}`, `/activities/{id}` | Editar |\n\n**Whaticket** (`https://api.whaticket.com/api/v1`)\n\n| Método | Path | Uso |\n|---|---|---|\n| GET | `/whatsapps` | Listar conexiones |\n| POST | `/messages` | Enviar mensaje (con o sin `mediaUrl`) |\n\n---\n\n## 🔒 Privacidad\n\n- Tokens (Pipedrive y Whaticket) se guardan **únicamente** en `chrome.storage.local` de tu navegador.\n- Los content scripts inyectados en Whaticket y Pipedrive **no tienen acceso a los tokens** — delegan todo al service worker.\n- SuperPipeWhat **no usa servidores propios ni de terceros**. No hay tracking, analytics ni telemetría.\n- Los mails enviados desde el panel salen desde **tu propio cliente de mail** (Gmail, Outlook, Apple Mail) — la extensión sólo arma el `mailto:` con el Smart BCC para el tracking de Pipedrive.\n- Los únicos endpoints externos a los que llega la extensión son la **API de Pipedrive** y la **API de Whaticket**.\n\n---\n\n## 🗺 Roadmap\n\n- [ ] Paginación de deals cuando la persona tiene \u003e 20.\n- [ ] Adjuntar archivos al deal desde el panel.\n- [ ] Campos custom del deal/persona.\n- [ ] Log de envíos masivos como notas en Pipedrive.\n- [ ] i18n (EN, PT).\n- [ ] Privacy policy + publicación en Chrome Web Store.\n\nPRs y sugerencias bienvenidas.\n\n---\n\n## Créditos\n\nBy **[marketingfraccional.com](https://marketingfraccional.com)** · Pedro Knigge.\n\n## Licencia\n\n[MIT](./LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpedroknigge%2Fsuperpipewhat","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpedroknigge%2Fsuperpipewhat","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpedroknigge%2Fsuperpipewhat/lists"}