Self-hostable CRM template for WhatsApp — shared inbox, contacts, sales pipelines, broadcasts, and no-code automations. Fork it, brand it, host it.
Go to file
Arnas Donauskas 1645034e1a
feat(flows): canvas / mind-map view (PR 2a of 3 — editable foundation)
Builds on PR 1's read-only canvas. This PR brings the canvas to ~75%
of list-view parity: drag-to-reposition (persisted) and click-to-edit
via a side panel that mounts the same per-node forms the list view
uses. Drag-to-connect + add/delete from canvas land in PR 2b.

Architecture (the bulk of the diff):

  - Extracted the per-node forms (SendButtonsForm, SendListForm,
    SendMediaForm, ConditionForm, SetTagForm + inline forms for the
    smaller types) plus the shared field components (TextRow,
    NextNodeRow, NodeKeySelect) from flow-builder.tsx into
    src/components/flows/forms/. Both views now mount the SAME
    NodeConfigForm dispatcher so behaviour can't drift between
    "what the list editor shows" and "what the canvas side panel
    shows".
  - Lifted all editor state into a context/hook
    (src/components/flows/flow-editor-state.tsx) with a
    FlowEditorProvider that wraps both views in flow-editor-shell.
    Single source of truth: toggling Canvas ⇄ List never resets
    unsaved edits, and a drag on the canvas updates the same nodes
    array the list view reads.
  - flow-builder.tsx shrinks from ~2400 lines to ~900 (extracted
    forms) and stops owning state (now consumes via useFlowEditor()).
    List-only UI state — expanded cards, scroll refs, jump-to-node
    flash — stays internal.

Canvas additions:

  - onNodeDragStop writes the new position to context via
    updateNodePosition (flips dirty; serialized in the existing PUT
    /api/flows/[id] body — the route already accepts position_x /
    position_y per migration 010).
  - onNodeClick opens a controlled shadcn Sheet (right-side panel)
    with the per-node form, plus "Set as entry" and "Delete node"
    buttons. Esc / overlay / close button all close.

What's intentionally still NOT in this PR (PR 2b):

  - Per-slot Handle components on the custom node renderer.
  - Drag-to-connect handler that maps target → updated
    next_node_key for the right slot.
  - Floating "+" button to add nodes from canvas.
  - Keyboard / context-menu delete.

Tests: 9 new pure-helper tests (uniqueNodeKey + defaultConfigFor
self-consistency). Hook integration tests are deferred — would
require @testing-library/react + jsdom infra. Existing 271 tests
still pass.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-29 20:17:15 +02:00
.github test: foundational Vitest suite for security + critical pure logic 2026-05-18 16:06:02 +03:00
public feat(inbox): WhatsApp-style doodle background in the chat area 2026-05-22 10:06:34 +03:00
src feat(flows): canvas / mind-map view (PR 2a of 3 — editable foundation) 2026-05-29 20:17:15 +02:00
supabase/migrations feat(flows): add send_media node for image / video / document sends 2026-05-29 19:11:29 +02:00
.editorconfig chore: contributor experience — CoC, templates, Dependabot, editor configs 2026-04-20 21:16:21 +03:00
.env.local.example feat(templates): submit-to-Meta endpoint + component-based form builder 2026-05-29 15:34:58 +02:00
.gitignore fix(webhook): require META_APP_SECRET, fail closed 2026-04-20 18:54:52 +03:00
.prettierignore chore: contributor experience — CoC, templates, Dependabot, editor configs 2026-04-20 21:16:21 +03:00
.prettierrc chore: contributor experience — CoC, templates, Dependabot, editor configs 2026-04-20 21:16:21 +03:00
AGENTS.md Initial commit from Create Next App 2026-04-16 17:52:39 +03:00
CHANGELOG.md docs(changelog): 0.2.2 — send_media flow node + migration 016 2026-05-29 19:22:22 +02:00
CLAUDE.md Initial commit from Create Next App 2026-04-16 17:52:39 +03:00
components.json feat: initial commit 2026-04-16 17:53:27 +03:00
CONTRIBUTING.md chore: rename product to "CRM Template for WhatsApp" 2026-05-06 11:52:11 +03:00
eslint.config.mjs Initial commit from Create Next App 2026-04-16 17:52:39 +03:00
LICENSE chore: OSS metadata + LICENSE + SECURITY + complete env example 2026-04-20 20:41:14 +03:00
next.config.ts security: baseline response headers (CSP report-only + OWASP set) 2026-04-20 19:24:41 +03:00
package-lock.json feat(flows): canvas / mind-map view (PR 1 of 3 — read-only) 2026-05-29 19:41:37 +02:00
package.json feat(flows): canvas / mind-map view (PR 1 of 3 — read-only) 2026-05-29 19:41:37 +02:00
postcss.config.mjs Initial commit from Create Next App 2026-04-16 17:52:39 +03:00
README.md docs: add Deploy on Hostinger button to README 2026-05-19 17:04:25 +03:00
tsconfig.json Initial commit from Create Next App 2026-04-16 17:52:39 +03:00
vitest.config.ts test: foundational Vitest suite for security + critical pure logic 2026-05-18 16:06:02 +03:00

wacrm — CRM Template for WhatsApp

Self-hostable CRM template for WhatsApp® — shared inbox, contacts, sales pipelines, broadcasts, and no-code automations. Fork it, brand it, host it.

Deploy on Hostinger

License: MIT CI Next.js 16 Supabase Stars

The marketing site and self-host docs live in a separate repo: ArnasDon/wacrm-site (wacrm.tech). This repo is the product — clone or fork it to run your own CRM.

What you get out of the box

  • Shared inbox on the official WhatsApp Business API — multiple agents working one number, per-conversation assignment, status, and notes.
  • Contacts + tags + custom fields, CSV import, deduplication.
  • Sales pipelines (Kanban) with deals linked to conversations.
  • Broadcasts with Meta-approved templates, delivery + read tracking, per-recipient variable substitution.
  • No-code automations — triggers on inbound messages, new contacts, keywords, or schedule; conditional branches, waits, tags, webhooks. Visual builder.
  • Real-time dashboard — response times, daily volume, pipeline value, cross-module activity feed.
  • Account management — email, password, avatar, global sign-out.

Why fork this?

This is a template, not a product. Forking means you get:

  • Full ownership — your code, your Supabase project, your domain, your data. No SaaS lock-in, no seat pricing, no trust dance.
  • Full customisation — add the fields your team needs, remove the modules you don't, redesign anything. The stack is boring on purpose (Next.js + Supabase + Tailwind) so the learning curve is short.
  • Zero ops to start — Hostinger Managed Node.js deploys a fork in a few clicks. No Docker, no Kubernetes, no infra team needed.
  • Real security primitives — token encryption (AES-256-GCM), RLS on every table, HMAC-verified webhooks, CSP, rate limiting, CI typecheck/build on every PR.

Not a framework. Not an SDK. A concrete, working CRM you can stand up in an afternoon and make yours.

Quick start

# Fork on GitHub first: https://github.com/ArnasDon/wacrm → Fork
git clone https://github.com/<your-username>/wacrm.git
cd wacrm
npm install
cp .env.local.example .env.local   # fill in Supabase + Meta creds
npm run dev

Open http://localhost:3000. You'll be redirected to /login (or /dashboard if already signed in).

Documentation

Full self-host documentation — Supabase migrations, WhatsApp Business API config, and production deploy — lives at wacrm.tech/docs (source: ArnasDon/wacrm-site).

Key pages:

Stack

  • App — Next.js 16 (App Router), React 19, TypeScript, Tailwind v4.
  • Data — Supabase (Postgres + Auth + Storage + RLS).
  • WhatsApp — Meta Cloud API (official WhatsApp Business API).

Contributing

This is a template, not a collaborative product — the expected flow is fork → customise → deploy, not upstream contribution. Bug reports and security issues are welcome; feature PRs often belong in your fork rather than here. Details in CONTRIBUTING.md and .github/SECURITY.md.

License

MIT. Fork it, brand it, host it.