Skip to content

profullstack/smshub

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

182 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

SMSHub

SMSHub logo

Next.js React TypeScript Supabase Expo Electron Vitest License: MIT PRs Welcome

A multi-platform, real-time SMS messaging platform with unified inbox, multi-provider support (Twilio + Telnyx), and an API-first architecture.

πŸš€ Coming Soon: phonenumbers.bot β€” Real SIM phone numbers with a developer-first API

Platforms

Platform Tech Status
🌐 Web Next.js 16 (App Router) βœ… v1
πŸ“² PWA Service Worker + Manifest βœ… v1
πŸ“± iOS React Native (Expo) βœ… v1
πŸ€– Android React Native (Expo) βœ… v1
πŸ–₯ Desktop Electron βœ… v1

Features

  • Unified Inbox β€” Threaded conversations across all devices
  • Real-time Messaging β€” Sub-second updates via Supabase Realtime
  • Multi-Provider β€” Twilio + Telnyx with unified API (sendSMS())
  • Compose Flow β€” New message modal with sender number picker
  • Unread Tracking β€” Badge counts, auto-mark read on open
  • Search β€” Filter conversations by name or phone number
  • Contact Management β€” Auto-create on inbound, inline name editing
  • Delivery Receipts β€” Live status updates (queued β†’ sent β†’ delivered β†’ failed)
  • Keyboard Shortcuts β€” Ctrl+N (compose), Ctrl+K (search), arrows, Escape
  • Push Notifications β€” Native on mobile (Expo), OS notifications on desktop (Electron)
  • PWA β€” Installable, offline support, background sync
  • Dark Mode β€” Default, developer-focused UI

Tech Stack

Layer Technology
Frontend Next.js 16, React 19, TailwindCSS
Mobile React Native, Expo, expo-router
Desktop Electron, electron-builder
Backend Next.js API routes
Database Supabase (Postgres + Realtime + Auth + RLS)
Providers Twilio, Telnyx
Testing Vitest (48 tests)
CI Husky pre-commit (tests + typecheck + lint)
Mobile Deploy Expo EAS (expo.dev)
Desktop Build electron-builder (AppImage, dmg, NSIS)

Getting Started

Prerequisites

  • Node.js 22+
  • pnpm
  • A Supabase project
  • Twilio and/or Telnyx account(s)

Setup

# Install dependencies
pnpm install

# Copy env file and fill in your values
cp .env.example .env

# Run database migrations against your Supabase project
# (paste supabase/migrations/*.sql into the Supabase SQL editor)

# Start dev server
pnpm dev

Mobile (Expo)

cd mobile
pnpm install
npx expo start

# Build for iOS/Android via Expo EAS
eas build --profile production --platform all

Desktop (Electron)

cd electron
pnpm install
pnpm dev

# Package distributable
pnpm package

Environment Variables

Variable Description
NEXT_PUBLIC_SUPABASE_URL Supabase project URL
NEXT_PUBLIC_SUPABASE_ANON_KEY Supabase anon/public key
SUPABASE_SERVICE_ROLE_KEY Supabase service role key (server-only)
TWILIO_ACCOUNT_SID Twilio Account SID
TWILIO_AUTH_TOKEN Twilio Auth Token
TELNYX_API_KEY Telnyx API Key
TELNYX_PUBLIC_KEY Telnyx Public Key (webhook verification)
NEXT_PUBLIC_APP_URL App URL (default: http://localhost:3000)

Project Structure

src/                          # Web app (Next.js)
β”œβ”€β”€ app/
β”‚   β”œβ”€β”€ api/
β”‚   β”‚   β”œβ”€β”€ contacts/         # GET, PATCH /api/contacts/[id]
β”‚   β”‚   β”œβ”€β”€ conversations/    # GET, POST /api/conversations/[id]/read
β”‚   β”‚   β”œβ”€β”€ messages/         # GET, POST /api/messages/send
β”‚   β”‚   β”œβ”€β”€ providers/        # DELETE /api/providers/[id]
β”‚   β”‚   β”œβ”€β”€ phone-numbers/    # DELETE /api/phone-numbers/[id]
β”‚   β”‚   └── webhooks/         # Twilio + Telnyx inbound & status callbacks
β”‚   β”œβ”€β”€ login/                # Login page
β”‚   β”œβ”€β”€ register/             # Register page
β”‚   β”œβ”€β”€ settings/             # Provider & phone number management
β”‚   β”œβ”€β”€ phonenumbers/         # phonenumbers.bot coming soon page
β”‚   └── offline/              # PWA offline fallback
β”œβ”€β”€ components/
β”‚   β”œβ”€β”€ inbox-client.tsx      # Main inbox (sidebar + chat + realtime)
β”‚   β”œβ”€β”€ new-message-modal.tsx # Compose new conversation
β”‚   β”œβ”€β”€ contact-name-editor.tsx
β”‚   β”œβ”€β”€ toast-container.tsx   # Toast notifications
β”‚   └── sw-register.tsx       # Service worker registration
β”œβ”€β”€ contexts/
β”‚   └── toast-context.tsx     # Global toast state
β”œβ”€β”€ lib/
β”‚   β”œβ”€β”€ providers/            # Twilio + Telnyx unified layer
β”‚   β”œβ”€β”€ supabase/             # Client/server/middleware helpers
β”‚   └── types/                # TypeScript definitions
β”œβ”€β”€ middleware.ts              # Auth guard
mobile/                        # React Native (Expo)
β”œβ”€β”€ app/                       # expo-router screens
β”‚   β”œβ”€β”€ (tabs)/                # Inbox + Settings tabs
β”‚   β”œβ”€β”€ chat/[id].tsx          # Chat screen
β”‚   └── auth.tsx               # Login/register
β”œβ”€β”€ lib/                       # Supabase, API client, notifications
└── eas.json                   # Expo EAS build profiles
electron/                      # Desktop app
β”œβ”€β”€ main.ts                    # Window + tray + IPC
β”œβ”€β”€ preload.ts                 # Renderer bridge
β”œβ”€β”€ notifications.ts           # Supabase Realtime β†’ OS notifications
β”œβ”€β”€ updater.ts                 # Auto-updater
└── electron-builder.yml       # Build config
supabase/
└── migrations/                # 001_initial_schema + 002_unread_tracking

API Endpoints

Method Endpoint Description
POST /api/messages/send Send an SMS
GET /api/messages?conversation_id= Get messages for a conversation
GET /api/conversations List conversations
POST /api/conversations/[id]/read Mark conversation as read
GET /api/contacts List contacts
PATCH /api/contacts/[id] Update contact name
DELETE /api/providers/[id] Delete a provider
DELETE /api/phone-numbers/[id] Delete a phone number
POST /api/webhooks/twilio Twilio inbound webhook
POST /api/webhooks/telnyx Telnyx inbound webhook
POST /api/webhooks/twilio/status Twilio delivery status callback
POST /api/webhooks/telnyx/status Telnyx delivery status callback

Scripts

pnpm dev              # Start development server
pnpm build            # Production build
pnpm start            # Start production server
pnpm test             # Run tests (48 passing)
pnpm test:watch       # Run tests in watch mode
pnpm test:coverage    # Run tests with coverage
pnpm lint             # Lint source files
pnpm typecheck        # TypeScript type checking

Pre-commit Hook

Every commit automatically runs:

  1. πŸ§ͺ Tests β€” vitest run
  2. πŸ” Type check β€” tsc --noEmit
  3. ✨ Lint β€” eslint --fix on staged .ts/.tsx files

Database Schema

Tables: providers, phone_numbers, contacts, conversations, messages

  • Row Level Security (RLS) on all tables
  • Realtime enabled on messages and conversations
  • Unread tracking via last_read_at + computed count

See supabase/migrations/ for the full schema.

Contributing

PRs welcome! Please ensure all checks pass before submitting:

pnpm test && pnpm tsc --noEmit && pnpm lint

License

MIT

About

A multi-platform, real-time SMS messaging platform with unified inbox, multi-provider support (Twilio + Telnyx), and an API-first architecture.

Topics

Resources

Stars

Watchers

Forks

Packages

 
 
 

Contributors