Customer Support Chat
Communication · React + Node (Express) · 19 @molecule/* packages
Intercom-like support widget with live chat, chatbot, canned responses, and agent dashboard — with built-in Stripe-backed subscription tiers
Try it
Opens instantly. Runs on sample data, so changes reset on reload.
What is inside
Screens (13)
- Landing
/ - Login
/login - Signup
/signup - ForgotPassword
/forgot-password - ResetPassword
/reset-password - Inbox
/inbox(signed in) - ConversationDetail
/conversation/:id(signed in) - Contacts
/contacts(signed in) - Reports
/reports(signed in) - Automations
/automations(signed in) - Settings
/settings(signed in) - ContactDetail
/contacts/:id(signed in) - Notifications
/notifications(signed in)
Data model (12 tables)
- activities — id, actorId, action, resourceType, resourceId, metadata, createdAt
- activity_seen_status — userId, lastSeenActivityId, updatedAt
- automation_rules — id, workspace_id, name, trigger, conditions, actions, enabled, created_by, …
- canned_responses — id, workspace_id, title, shortcut, content, category, created_by, user_id, …
- contacts — id, workspace_id, email, name, phone, company, tags, total_conversations, …
- devices — id, createdAt, updatedAt, userId, name, pushPlatform, pushSubscription, hasPushSubscription
- payments — id, createdAt, updatedAt, userId, transactionId, productId, platformKey, data, …
- resource_tags — id, tagId, resourceType, resourceId, createdAt
- support_agents — id, user_id, status, current_conversation_count, avg_response_time_ms, csat_score, created_at, updated_at, …
- support_conversations — id, workspace_id, visitor_id, visitor_name, visitor_email, subject, status, priority, …
- support_messages — id, conversation_id, sender_type, sender_id, sender_name, content, type, user_id, …
- tags — id, name, slug, color, description, createdAt, updatedAt
API (6 handlers)
- agents
api/src/handlers/agents.ts - automations
api/src/handlers/automations.ts - canned-responses
api/src/handlers/canned-responses.ts - contacts
api/src/handlers/contacts.ts - conversations
api/src/handlers/conversations.ts - messages
api/src/handlers/messages.ts
Subscription tiers
free / pro / team — gated by: maxAgents, maxCannedResponses, maxConversations, maxMessages, advancedFeatures, canExport, retentionDays
Built from 19 @molecule/* packages
@molecule/api-ai-anthropic@molecule/api-database-postgresql@molecule/api-email-templates@molecule/api-emails-mailgun@molecule/api-entitlements@molecule/api-payments-stripe@molecule/api-push-notifications-web-push@molecule/api-realtime-socketio@molecule/api-resource-activity-feed@molecule/api-resource-payment@molecule/api-resource-tag@molecule/api-resource-user@molecule/api-search-meilisearch@molecule/app-billing-react@molecule/app-command-palette@molecule/app-data-table@molecule/app-keyboard-shortcuts@molecule/app-realtime-socketio@molecule/app-virtual-scroll
Required secrets
DATABASE_URLPostgreSQL connection stringMAILGUN_API_KEYMailgun API key for ticket notificationsANTHROPIC_API_KEYAnthropic API key for AI chatbot
The @molecule/* packages are Apache-2.0. The app you build from this template is yours to export and self-host. Licensing