Lesson 5 of 7 · 5 min
Customer Profile and Tabs
Navigate the five tabs on a customer detail page to access overview, orders, invoices, loyalty history, and account settings.
Customer Profile and Tabs
Video coming soon
Lesson Notes
Click any row in the directory table to open the customer's detail page at /customers/[id]. The page header shows the customer's avatar (initials fallback if no photo URL is set), full name, reliability badge (only shown for Moderate or At risk bands — reliable customers get no badge to keep the interface clean), email, phone, and brokerage name. A 'Linked AGENT account' badge appears when the customer has a connected Vremly user account.
The Overview tab is the default landing view. It contains four sections: a Reliability card (score out of 100 plus the count of total and late cancellations); a Contact Details card (name, email, phone, brokerage) with an Edit button for stub records; a Linked User Account card (shown only when the customer has a portal account, displaying their account type and sign-up date); and an Internal Notes card where you can add or edit team-visible notes that the customer never sees. The notes support multi-line free text with a Cancel / Save button pair.
The Orders tab lists every project associated with this customer, loaded lazily when you first open the tab. Each row shows the property address, job status badge (matching the same status vocabulary used everywhere in Vremly: Booked, Shooting, Editing, Delivered, Cancelled, etc.), scheduled date, and order date. Clicking any row navigates directly to that job's detail page at /jobs/[id]. If the customer has no orders yet, an empty state offers a shortcut to create an order for them via the booking flow.
The Invoices tab lists all invoices linked to this customer, again loaded on first open. Columns are invoice number (formatted as INV-0001), status (Draft, Sent, Overdue, Paid, Void), total, and creation date. Clicking any invoice row navigates to /invoices/[id]. The Outstanding stat card in the header is the sum of all SENT and OVERDUE invoices for this customer — if that number is greater than zero, the icon background turns red as a visual alert.
The Loyalty tab shows the customer's current cashback balance, lifetime earned amount, and loyalty tier (if your organization has loyalty enabled). Below a separator, the full transaction log lists every cashback event with its type badge, reason, signed amount (green for positive, red for negative), and date. The Settings tab is the account management surface: for customers with a linked account, you can send a branded password reset email; for stub records with no account yet, you can send a portal invite. Both actions require the customer to have an email address on file.
On iOS, the customer detail screen is a scrollable card layout rather than a tab interface. It shows the identity card (avatar + name + tier label), a four-icon quick-actions row (Call, Message, Email, New Job) that opens native iOS apps when tapped, a loyalty tier showcase card (visible only when the customer has a tier), two stat tiles (Total jobs, Last job), an Internal Notes card when notes exist, and a History card with 'Customer since' and 'Last updated' dates.
Key Takeaways
- The detail page has five tabs: Overview, Orders, Invoices, Loyalty, and Settings — Orders and Invoices load lazily on first open.
- Internal Notes on the Overview tab are team-only; the customer never sees them.
- The Outstanding stat card turns red when the customer has unpaid SENT or OVERDUE invoices.
- The Settings tab lets you send a portal invite (for stub records) or a password reset (for linked accounts).
- The iOS detail screen replaces tabs with a vertical card layout and adds one-tap Call, Message, and Email actions.