Client Portal CRM
A multi-tenant CRM SaaS for freelancers and small agencies — every account is an Organization with its own team (staff members with roles), its own Clients/Projects/Tasks/Invoices, its own billing subscription, and an optional Client Portal its clients can log into directly. Built with Next.js App Router, Prisma, and Supabase.
A complete, tested multi-tenant SaaS foundation: real multi-tenancy, real Paddle billing (buyer supplies their own account/credentials — see Billing), a Client Portal, attachments, comments, notifications, onboarding, analytics, search, and a Platform Admin console — all built on Server Components and Server Actions with no client-side data-fetching library.
Live demo
client-portal-crm.vercel.app
Staff demo credentials (Owner):
A second staff account ([email protected], same password) is a plain Member of the same organization — sign in as either to see the same shared workspace, with the Team page showing both.
Client Portal demo credentials (a real, separate portal-only identity, invited into one of the demo clients):
All three accounts are seeded via npm run db:seed (prisma/seed.ts, see Database setup) into one already-connected demo organization — clients, projects, tasks, invoices, a couple of threaded comments (including an @-mention), and a couple of notifications, so every staff account lands directly on a populated dashboard, no extra setup step required. Attachments are deliberately not seeded: an Attachment row is a pointer to a real Supabase Storage object, and the seed script performs no Storage upload, so a fake row would just 404 — upload a real file through the app itself to see that flow.
These demo credentials are intentionally public — the seeded organization uses only fictional data (see prisma/seed.ts), but the account has full read/write access, so treat data in it as disposable and re-seedable, not as a stable fixture between sessions.
Screenshots
| |
|---|
| Dashboard — live metrics, revenue trends, and status breakdowns | Clients — search, filter, sort, pagination |
| |
| Projects | Tasks |
| |
| Invoices | Client Portal — a client's own view of their invoices |
| |
| Client detail — Client Portal access management | Project collaboration — threaded comments with @-mentions |
| |
| Analytics — KPIs and trend charts derived entirely from the org's own data | Team — roles and membership |
| |
| Billing settings — plan, usage, and Paddle plans (buyer-configurable; intentionally unconfigured in this demo) | Onboarding — first-login "Getting started" checklist |
| |
Also: branded login · Client Portal — Projects
Features
- Multi-tenant Organizations — every account belongs to an
Organization; staff join it via a Membership with a role (OWNER / ADMIN / MEMBER), enforced server-side on every sensitive mutation (team management, billing, etc.), never just in the UI.
- Clients, Projects, Tasks, Invoices — full CRUD for each, scoped to the active organization at the database query level.
- Client Portal (
/portal) — a separate, thinner identity space (PortalUser, invited per-Client) where a client can log in to view their own projects and invoices — no access to staff data, no access to other clients.
- Team & invitations — invite staff by email (token-based, expiring, single-use), manage roles, invite clients to the portal the same way.
- Attachments — real file uploads (Supabase Storage) on clients/projects/tasks, with a server-validated type/size allowlist.
- Comments — threaded comments with @-mentions on projects.
- Notifications — in-app Notification Center + email digest/delivery (Resend), with graceful degradation when no email provider is configured.
- Onboarding — a dismissible "Getting started" checklist on first login, computed live from real data (no separate progress table beyond an explicit skip/dismiss).
- Analytics (
/analytics, OWNER/ADMIN) — KPIs and trend charts derived entirely from the org's own data; no external analytics provider, no tracking.
- Search — cross-entity search across clients/projects/tasks/invoices/comments.
- Billing & subscriptions — plan catalog, usage-based entitlement enforcement, and a real, buyer-configurable Paddle integration (see Billing).
- Platform Admin (
/platform-admin) — a read-only, env-var-gated internal console for whoever operates the deployment (see Platform Admin) — separate from any tenant's own Organization.
- Search, filter, sort, pagination — server-side, URL-param-driven (
?q=&status=&sort=field:dir&page=), so state survives a refresh and is shareable as a link.
- Dashboard — live metrics and recent-activity feeds, computed with concurrent Prisma queries.
This is the beginning of the README. Read the rest at the original. Read the full README ↗
