feat(sales-ux): triage signals, reminders, realtime toasts, mobile FAB
Sales-CRM workflow batch — closes audit recommendations #2, #3, #4, #6,
#7, #8, #9, #10, #13, #15. Skips #11 (My-pipeline filter — needs a real
assignee column on interests, defer until ownership model lands) and #12
(keyboard shortcuts — explicit user call).
Interest list (the rep's main triage surface):
- Last activity column replaces Created (sortable by
dateLastContact). Postgres NULLs-last on DESC means
never-contacted leads sort to the bottom — exactly the right
triage default.
- Comment-icon next to client name when notesCount > 0, with a
tooltip showing the count. Cheap, glanceable signal that the
lead has correspondence to peek at.
- Urgency badges under stage when criteria fire: "Silent Nd"
for mid-funnel interests with no contact in 7+ days,
"EOI Nd" for EOIs awaiting signature 14+ days, "Deposit Nd"
for eoi_signed interests with no deposit after 21 days.
Pure derived — no extra fetch, computed from the dates the
row already returns.
- Bulk select checkbox column with bulk-archive (existing
DataTable.bulkActions API; just wired with a confirm-dialog
and a Promise.all fan-out).
- Mobile FAB (+) for new interest, anchored above the bottom-tab
bar with safe-area inset awareness.
All four signals mirrored on the mobile InterestCard (comment
icon, urgency badges, last-activity footer).
Interest detail:
- Reminder bell badge in the header showing pending/snoozed
reminder count linked to the interest. Surfaced via
getInterestById's new `activeReminderCount`.
- "Latest note" teaser on the Overview tab — truncated 3-line
preview of the most recent threaded note + relative time +
"View all" link to the Notes tab. Saves a click for the
common "what was discussed last?" peek.
- Color-block swatches in InlineStagePicker dropdown (rounded-sm
mini-bars in the stage's progressive saturation color, replacing
the previous tiny dots). Reads as a visual scan instead of a
list.
Dashboard:
- MyRemindersRail on the right sidebar above the existing
AlertRail. Shows pending+snoozed reminders for the current
user (overdue first), each with priority pill, relative due
time, and click-through to the linked interest/client/berth.
Berth detail:
- BerthInterestPulse card at the top of the Overview tab,
replacing the old "buried in tab" pattern. Shows up to 5
active interests with avatar, stage pill, urgency badges, and
last-activity. Mirrors the old Nuxt CRM's beloved "Interested
Parties" panel but with the new triage signals.
Realtime toasts:
- New <RealtimeToasts /> mounted inside SocketProvider in the
dashboard layout. Subscribes to interest:stageChanged,
document:completed, document:signer:signed, and
interest:outcomeSet — fires sonner toasts so reps watching any
page learn about pipeline events without refreshing.
Service layer:
- listInterests: notesCount per row (left join + count + groupBy).
- getInterestById: clientPrimaryPhone + clientPrimaryPhoneE164
(for the Email/Call/WhatsApp buttons added last commit; phone
pieces were missing), notesCount, recentNote, activeReminderCount.
- sortColumn switch handles 'dateLastContact' explicitly; default
stays 'updatedAt'.
tsc clean. vitest 835/835 pass. ESLint clean on every file touched.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-02 04:09:51 +02:00
|
|
|
/**
|
|
|
|
|
* Sales-triage urgency badges for interest list rows + cards.
|
|
|
|
|
*
|
|
|
|
|
* Derived purely from the dates we already return on the row, so this is a
|
2026-05-04 22:57:01 +02:00
|
|
|
* pure function - no DB hits, no extra fetch. Mirrors the logic the
|
feat(sales-ux): triage signals, reminders, realtime toasts, mobile FAB
Sales-CRM workflow batch — closes audit recommendations #2, #3, #4, #6,
#7, #8, #9, #10, #13, #15. Skips #11 (My-pipeline filter — needs a real
assignee column on interests, defer until ownership model lands) and #12
(keyboard shortcuts — explicit user call).
Interest list (the rep's main triage surface):
- Last activity column replaces Created (sortable by
dateLastContact). Postgres NULLs-last on DESC means
never-contacted leads sort to the bottom — exactly the right
triage default.
- Comment-icon next to client name when notesCount > 0, with a
tooltip showing the count. Cheap, glanceable signal that the
lead has correspondence to peek at.
- Urgency badges under stage when criteria fire: "Silent Nd"
for mid-funnel interests with no contact in 7+ days,
"EOI Nd" for EOIs awaiting signature 14+ days, "Deposit Nd"
for eoi_signed interests with no deposit after 21 days.
Pure derived — no extra fetch, computed from the dates the
row already returns.
- Bulk select checkbox column with bulk-archive (existing
DataTable.bulkActions API; just wired with a confirm-dialog
and a Promise.all fan-out).
- Mobile FAB (+) for new interest, anchored above the bottom-tab
bar with safe-area inset awareness.
All four signals mirrored on the mobile InterestCard (comment
icon, urgency badges, last-activity footer).
Interest detail:
- Reminder bell badge in the header showing pending/snoozed
reminder count linked to the interest. Surfaced via
getInterestById's new `activeReminderCount`.
- "Latest note" teaser on the Overview tab — truncated 3-line
preview of the most recent threaded note + relative time +
"View all" link to the Notes tab. Saves a click for the
common "what was discussed last?" peek.
- Color-block swatches in InlineStagePicker dropdown (rounded-sm
mini-bars in the stage's progressive saturation color, replacing
the previous tiny dots). Reads as a visual scan instead of a
list.
Dashboard:
- MyRemindersRail on the right sidebar above the existing
AlertRail. Shows pending+snoozed reminders for the current
user (overdue first), each with priority pill, relative due
time, and click-through to the linked interest/client/berth.
Berth detail:
- BerthInterestPulse card at the top of the Overview tab,
replacing the old "buried in tab" pattern. Shows up to 5
active interests with avatar, stage pill, urgency badges, and
last-activity. Mirrors the old Nuxt CRM's beloved "Interested
Parties" panel but with the new triage signals.
Realtime toasts:
- New <RealtimeToasts /> mounted inside SocketProvider in the
dashboard layout. Subscribes to interest:stageChanged,
document:completed, document:signer:signed, and
interest:outcomeSet — fires sonner toasts so reps watching any
page learn about pipeline events without refreshing.
Service layer:
- listInterests: notesCount per row (left join + count + groupBy).
- getInterestById: clientPrimaryPhone + clientPrimaryPhoneE164
(for the Email/Call/WhatsApp buttons added last commit; phone
pieces were missing), notesCount, recentNote, activeReminderCount.
- sortColumn switch handles 'dateLastContact' explicitly; default
stays 'updatedAt'.
tsc clean. vitest 835/835 pass. ESLint clean on every file touched.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-02 04:09:51 +02:00
|
|
|
* server-side alert-rules engine uses, but for at-a-glance rendering on
|
|
|
|
|
* the list itself.
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
const SILENT_DAYS_THRESHOLD = 7;
|
|
|
|
|
const EOI_AWAITING_DAYS_THRESHOLD = 14;
|
|
|
|
|
const DEPOSIT_PENDING_DAYS_THRESHOLD = 21;
|
|
|
|
|
|
|
|
|
|
const ACTIVE_MID_FUNNEL_STAGES = new Set(['details_sent', 'in_communication']);
|
|
|
|
|
|
|
|
|
|
export interface InterestUrgencyInput {
|
|
|
|
|
pipelineStage: string;
|
|
|
|
|
outcome?: string | null;
|
|
|
|
|
archivedAt?: string | null;
|
|
|
|
|
dateLastContact?: string | null;
|
|
|
|
|
updatedAt?: string;
|
|
|
|
|
dateEoiSent?: string | null;
|
|
|
|
|
eoiStatus?: string | null;
|
|
|
|
|
dateDepositReceived?: string | null;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export interface UrgencyBadge {
|
|
|
|
|
/** Stable id for keying. */
|
|
|
|
|
id: 'silent' | 'eoi_awaiting' | 'deposit_pending';
|
|
|
|
|
label: string;
|
|
|
|
|
/** Long form for tooltip / aria-label. */
|
|
|
|
|
detail: string;
|
|
|
|
|
/** Tailwind classes for the pill. */
|
|
|
|
|
className: string;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function daysSince(iso: string | null | undefined): number | null {
|
|
|
|
|
if (!iso) return null;
|
|
|
|
|
const t = new Date(iso).getTime();
|
|
|
|
|
if (Number.isNaN(t)) return null;
|
|
|
|
|
return Math.floor((Date.now() - t) / 86_400_000);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export function computeUrgencyBadges(row: InterestUrgencyInput): UrgencyBadge[] {
|
|
|
|
|
// Closed / archived interests don't need triage signals.
|
|
|
|
|
if (row.archivedAt || row.outcome) return [];
|
|
|
|
|
|
|
|
|
|
const badges: UrgencyBadge[] = [];
|
|
|
|
|
|
2026-05-04 22:57:01 +02:00
|
|
|
// Silent in mid-funnel stages - most actionable.
|
feat(sales-ux): triage signals, reminders, realtime toasts, mobile FAB
Sales-CRM workflow batch — closes audit recommendations #2, #3, #4, #6,
#7, #8, #9, #10, #13, #15. Skips #11 (My-pipeline filter — needs a real
assignee column on interests, defer until ownership model lands) and #12
(keyboard shortcuts — explicit user call).
Interest list (the rep's main triage surface):
- Last activity column replaces Created (sortable by
dateLastContact). Postgres NULLs-last on DESC means
never-contacted leads sort to the bottom — exactly the right
triage default.
- Comment-icon next to client name when notesCount > 0, with a
tooltip showing the count. Cheap, glanceable signal that the
lead has correspondence to peek at.
- Urgency badges under stage when criteria fire: "Silent Nd"
for mid-funnel interests with no contact in 7+ days,
"EOI Nd" for EOIs awaiting signature 14+ days, "Deposit Nd"
for eoi_signed interests with no deposit after 21 days.
Pure derived — no extra fetch, computed from the dates the
row already returns.
- Bulk select checkbox column with bulk-archive (existing
DataTable.bulkActions API; just wired with a confirm-dialog
and a Promise.all fan-out).
- Mobile FAB (+) for new interest, anchored above the bottom-tab
bar with safe-area inset awareness.
All four signals mirrored on the mobile InterestCard (comment
icon, urgency badges, last-activity footer).
Interest detail:
- Reminder bell badge in the header showing pending/snoozed
reminder count linked to the interest. Surfaced via
getInterestById's new `activeReminderCount`.
- "Latest note" teaser on the Overview tab — truncated 3-line
preview of the most recent threaded note + relative time +
"View all" link to the Notes tab. Saves a click for the
common "what was discussed last?" peek.
- Color-block swatches in InlineStagePicker dropdown (rounded-sm
mini-bars in the stage's progressive saturation color, replacing
the previous tiny dots). Reads as a visual scan instead of a
list.
Dashboard:
- MyRemindersRail on the right sidebar above the existing
AlertRail. Shows pending+snoozed reminders for the current
user (overdue first), each with priority pill, relative due
time, and click-through to the linked interest/client/berth.
Berth detail:
- BerthInterestPulse card at the top of the Overview tab,
replacing the old "buried in tab" pattern. Shows up to 5
active interests with avatar, stage pill, urgency badges, and
last-activity. Mirrors the old Nuxt CRM's beloved "Interested
Parties" panel but with the new triage signals.
Realtime toasts:
- New <RealtimeToasts /> mounted inside SocketProvider in the
dashboard layout. Subscribes to interest:stageChanged,
document:completed, document:signer:signed, and
interest:outcomeSet — fires sonner toasts so reps watching any
page learn about pipeline events without refreshing.
Service layer:
- listInterests: notesCount per row (left join + count + groupBy).
- getInterestById: clientPrimaryPhone + clientPrimaryPhoneE164
(for the Email/Call/WhatsApp buttons added last commit; phone
pieces were missing), notesCount, recentNote, activeReminderCount.
- sortColumn switch handles 'dateLastContact' explicitly; default
stays 'updatedAt'.
tsc clean. vitest 835/835 pass. ESLint clean on every file touched.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-02 04:09:51 +02:00
|
|
|
if (ACTIVE_MID_FUNNEL_STAGES.has(row.pipelineStage)) {
|
|
|
|
|
const lastTouchIso = row.dateLastContact ?? row.updatedAt ?? null;
|
|
|
|
|
const days = daysSince(lastTouchIso);
|
|
|
|
|
if (days !== null && days >= SILENT_DAYS_THRESHOLD) {
|
|
|
|
|
badges.push({
|
|
|
|
|
id: 'silent',
|
|
|
|
|
label: `Silent ${days}d`,
|
|
|
|
|
detail: `No contact in ${days} days`,
|
|
|
|
|
className: 'bg-amber-100 text-amber-800 border border-amber-200',
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// EOI sent but not signed for too long.
|
|
|
|
|
if (row.eoiStatus === 'waiting_for_signatures') {
|
|
|
|
|
const days = daysSince(row.dateEoiSent);
|
|
|
|
|
if (days !== null && days >= EOI_AWAITING_DAYS_THRESHOLD) {
|
|
|
|
|
badges.push({
|
|
|
|
|
id: 'eoi_awaiting',
|
|
|
|
|
label: `EOI ${days}d`,
|
|
|
|
|
detail: `EOI awaiting signature for ${days} days`,
|
|
|
|
|
className: 'bg-orange-100 text-orange-800 border border-orange-200',
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// EOI signed but deposit not received.
|
|
|
|
|
if (row.pipelineStage === 'eoi_signed' && !row.dateDepositReceived && row.dateEoiSent) {
|
|
|
|
|
const days = daysSince(row.dateEoiSent);
|
|
|
|
|
if (days !== null && days >= DEPOSIT_PENDING_DAYS_THRESHOLD) {
|
|
|
|
|
badges.push({
|
|
|
|
|
id: 'deposit_pending',
|
|
|
|
|
label: `Deposit ${days}d`,
|
|
|
|
|
detail: `Awaiting deposit for ${days} days since EOI sent`,
|
|
|
|
|
className: 'bg-rose-100 text-rose-800 border border-rose-200',
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return badges;
|
|
|
|
|
}
|