Customer Dashboard — Overview

The Customer dashboard is the primary Oktivo workspace a paying customer logs into: a left sidebar of feature groups (CRM, Marketing, Tickets, Commerce, Call & Chatbot, Automation, Monitor, Connecter, Account) that each open a section for working leads, running calls, and managing their account.

This overview maps the whole Customer dashboard. Each sidebar group has its own deep-dive doc (linked below). The sidebar here is the ground truth: it mirrors app/src/layouts/CustomerLayout.tsx exactly, and the 17 Platform_Sections screenshot folders are all screens of this one dashboard.

Screenshot

Architecture Overview

How Access Is Decided (Step-by-Step)

Oktivo gates every customer feature in three layers. All three must pass before data is returned.

1. Route role gate (frontend). app/src/routes.tsx wraps the customer route group in <ProtectedRoute allowedRoles={['customer']}>. A user whose role is not customer never reaches these pages.
2. Entitlement gate (frontend). Individual pages/sidebar items are wrapped in <FeatureRoute features={[FEATURES.*]}> (keys from app/src/lib/features.ts). Without the entitlement the sidebar row renders locked and the page shows a "contact us" state instead of the feature.
3. Sub-section + RBAC gate (frontend). Sidebar children carry their own features (sub-section keys like crm.contacts) and resource (RBAC resource like crm). A team member only sees children they are entitled to and permitted for.
4. Backend middleware chain. Every API request runs verifyJwt → requireFeatureAccess(...) → a scope resolver (resolveCrmLeadScope, resolveCommerceScope, resolveTicketScope, …) → requirePermission(resource, action) / per-action gates. The scope resolver pins the request to the caller's tenant (customerUID) and visibility, so a customer can never read another tenant's data.

Jargon: Entitlement / feature = a paid capability toggled per org and per customer (superadmin → org → customer). RBAC (Role-Based Access Control) = what a given team member may do inside a feature (view/create/edit/delete). Scope = the tenant + row-level visibility the backend forces onto every query. See Feature Entitlements & Bundles and Team RBAC.

Sidebar Groups → Section Docs

Sidebar group	What it does	Primary entitlement(s)	Deep-dive doc
Dashboard	Landing KPI cards + CRM activity	always visible	Dashboard
CRM	Leads, Contacts, Companies, Opportunities, Tasks, Segments, Agentic Automation	crm_leads, crm_segments, crm.*	CRM
Marketing	Lead-source attribution analytics	crm.marketing	Marketing
Tickets	Helpdesk: inbox, settings, routing, SLA, integrations	tickets, tickets.*	Tickets
Commerce	Stores, Inventory, Orders, Transactions	commerce, commerce.*	Commerce
Call and Chatbot	Agents, Bulk Calling, Calls, Analysis Schemas, AI Chatbot, Knowledge Base	voice_campaign, web_agent, call_analysis, chatbot, knowledge_base	Call & Chatbot
Automation	Overview, Auto Workflow, WhatsApp Automation, IVR Workflow	workflow, whatsapp.automation, call_flow_builder	Automation
Monitor	Analytics, Logs, History, Notifications, DND, Agent/Order/Payment performance	voice_campaign, webhooks, dynamic_tools, dnd_list, monitor.activity*	Monitor
Connecter	Integrations hub (CRM providers, WhatsApp, Facebook, Google Ads/Sheets, Gmail, Apollo, Webhooks, Client Tools, MCP)	crm_connecter, whatsapp, webhooks, dynamic_tools, mcp_integrations	Connecter
Account	My Numbers, Credits, BYOK, BYON, Oktivo Number, Team	voice_campaign, byok, byon, number_purchasing, team_management	Account
Settings / API Docs	Account settings + public API reference	crm_api (API Docs)	Settings

File Reference

File	Role	Key items
app/src/layouts/CustomerLayout.tsx	Builds the customer sidebar (mainNavItems, bottomNavItems) and applies B2C/commerce relabelling + agent-only filtering	mainNavItems, visibleNavItems, KYC/phone/industry gates
app/src/routes.tsx	Maps each sidebar path to a page and wraps groups in ProtectedRoute / FeatureRoute	route table
app/src/lib/features.ts	Single source of truth for entitlement keys + dependencies	FEATURES, FEATURE_DEPENDENCIES, MODULE_DEPENDENCIES
backend/client_backend/src/middleware/feature.middleware.ts	requireFeatureAccess / requireSubSection entitlement enforcement	—
backend/client_backend/src/middleware/rbac.middleware.ts	requirePermission, requireGrant, requireRole	—

Data Model

The dashboard itself stores nothing; it reads from the collections each section owns. See the per-section docs for schemas, and Data Collections for the full map.

API Endpoints

The overview has no endpoints of its own. Role/entitlement context comes from the auth session:

Current user + entitlements

• Method: GET
• Path: /auth/me
• Auth: verifyJwt
• Response: 200 with the user, role, organization, and resolved feature set used by ProtectedRoute/FeatureRoute.

External Integrations

None at the dashboard level. Section docs cover LiveKit (calling), Meta/WhatsApp, Google, Razorpay, and SIP integrations where relevant.

How to Test (End-to-End)

1. Prerequisites: a customer account with a plan, and the client backend + frontend running.
2. Log in as the customer and confirm you land on /dashboard.
3. Confirm the sidebar shows only the groups your plan entitles (toggle a feature in the admin/superadmin grid and reload — a removed feature should lock its sidebar row).
4. Open each group and confirm its landing page loads without a 403 in the network tab.
5. As a team member with limited RBAC, confirm restricted children are hidden and restricted actions return 403.

Troubleshooting

Symptom	Cause	Fix
A sidebar group is missing	The org/customer lacks its entitlement	Grant the feature in the admin (org) or superadmin grid
Sidebar row shows but is locked	Entitlement off for this customer	Enable the feature for the customer; see Feature Entitlements & Bundles
Page loads but API returns 403	RBAC permission missing for the team member	Grant the resource/action in Team settings; see Team RBAC
Blocking KYC/phone modal appears	Account owner hasn't completed KYC/phone verification	Complete KYC (or the grace window must be active) — see CustomerLayout.tsx gating