Collections Pages — Specific Improvement Spec
Exact changes for /collections dashboard and /collections/:id detail page
March 31, 2026
📊 10 Dashboard Improvements
📋 12 Detail Page Improvements
🎯 22 Total Spec Items
Part A — Dashboard
Current /collections Dashboard Layout
┌─────────────────────────────────────────────────────────────┐
│ Collections Overview [Export CSV] │
├──────────┬──────────┬──────────┬──────────────────────────────┤
│ Total │ Outstand.│ Overdue │ Collection │
│ Overdue │ Receiv. │ Buyers │ Rate │
│ $XXX │ $XXX │ XX │ XX% │
├──────────┴──────────┴──────────┴──────────────────────────────┤
│ Aging Analysis Chart │
│ ▓▓▓▓▓ ▓▓▓▓ ▓▓▓ ▓▓ ▓ │
│ 0-30 31-60 61-90 91+ 120+ │
├───────────────────────────────────────────────────────────────┤
│ Monthly Collections Chart (FAKE DATA — see Problem #8) │
│ ▁▂▃▄▅▆▇█▇▆▅▄ │
├───────────────────────────────────────────────────────────────┤
│ [Project ▼] [Aging ▼] [Search...] │
├───────────────────────────────────────────────────────────────┤
│ Focus Project: Ashley Hills │
│ Billed: $XX Expenses: $XX Collection Rate: XX% Risk: XX │
├───────────────────────────────────────────────────────────────┤
│ [Overdue] [Due Soon] [All Buyers] │
│ ┌─────────────────────────────────────────────────────────┐ │
│ │ Buyer │ Unit │ Project │ Amount │ Days │ Next Due │ Stat │ │
│ │ ... │ ... │ ... │ ... │ ... │ ... │ ... │ │
│ │ ... │ ... │ ... │ ... │ ... │ ... │ ... │ │
│ │ ... │ ... │ ... │ ... │ ... │ ... │ ... │ │
│ └─────────────────────────────────────────────────────────┘ │
│ < 1 2 3 > │
└───────────────────────────────────────────────────────────────┘
- 1 No collections health score — 4 stat cards show raw numbers but no single "are we healthy?" indicator. Property managers need a traffic-light-style health assessment at a glance.
- 2 Aging chart is disconnected — Shows aging buckets but doesn't connect to actions. No way to click a bucket and filter the table below. Chart is view-only.
- 3 Focus project section is weak — Shows billing/expenses/rate but missing: (a) trend arrows showing if things are getting better/worse month-over-month, (b) top delinquent tenants for that project, (c) days-to-collect average.
- 4 No collections funnel — Can't see how many accounts are at each stage (reminder → notice → payment plan → legal → eviction). This is the most important operational view for a collections manager.
- 5 No AI action queue — AI features exist in the detail page but there's no portfolio-level "here are the top 10 things to do right now" list on the dashboard.
- 6 Table columns are basic — Missing: payment history sparkline, risk score badge, last contact date, assigned agent. The table looks like a spreadsheet, not an intelligence tool.
- 7 No visual timeline/Gantt — Can't see where cases are in their lifecycle relative to each other. No way to spot clustering of escalation deadlines.
- 8 Collection chart uses fake data —
collection-chart.component.ts multiplies revenueCollected × [0.12, 0.15, ...] — completely fabricated monthly distribution, not real collection data.
- 9 No comparison to previous period — None of the 4 stat cards show trend vs last month. Property managers always want to know "is it getting better or worse?"
- 10 CSV export is the only export — No PDF report generation, no scheduled email digest, no shareable dashboard link for stakeholders.
Current vs Proposed
❌ Current — Flat cards, no context
┌──────────────────┐
│ Total Overdue │
│ $124,500 │
│ │
│ │
└──────────────────┘
✅ Proposed — Rich KPI cards
┌──────────────────────────┐
│ 📊 Total Overdue │
│ $124,500 ↗ +8.2% │
│ ▁▂▃▅▇█ (last 6 months) │
│ ● Above avg (indust: $95K)│
└──────────────────────────┘
Specification
- Each of the 4 stat cards gets three new sub-elements:
- (a) Trend arrow + % change — compare current value to same metric last month. Green ↗ for improvement, red ↘ for decline. Use
↗ +8.2% format.
- (b) Sparkline — inline SVG sparkline showing last 6 months of that metric's value. Height: 24px, width: fills card.
- (c) Benchmark indicator — colored dot (green/amber/red) comparing to industry standard or portfolio average. Shows reference value.
- Card height increases from ~80px to ~120px. Keep 4-column grid layout.
Implementation Notes
Backend: Add GET /api/collections/kpi-trends endpoint returning 6-month history per metric. Frontend: Extend stat-card.component to accept trend data. Use lightweight inline SVG for sparklines (no chart library needed).
New Widget — Wireframe
┌─────────────────────────────────────┐
│ COLLECTIONS HEALTH │
│ │
│ ╭──────╮ │
│ ╭─╯ 82 ╰─╮ │
│ │ / 100 │ │
│ ╰───────────╯ │
│ ● Good │
│ │
│ Collection Rate (40%) ████████░░ │
│ Aging Trend (30%) ██████░░░░ │
│ Delinquency Rate (20%) █████████░ │
│ Recovery Rate (10%) ███████░░░ │
└─────────────────────────────────────┘
Specification
- Large circular gauge (CSS-only, no library) showing 0-100 composite score
- Score formula: Collection Rate × 0.4 + Aging Trend × 0.3 + (100 - Delinquency Rate) × 0.2 + Recovery Rate × 0.1
- Color thresholds: Green 80+ ("Good"), Amber 60-79 ("Needs Attention"), Red <60 ("Critical")
- Below gauge: breakdown bars showing each component's contribution
- Placement: First item in KPI row (shifts 4 stat cards to right, making a 5-item row or stacking health score above)
New Widget — Wireframe
┌───────────────────────────────────────────────┐
│ Collections Funnel │
│ │
│ ██████████████████████████████████ All: 5,000 │
│ ██████████████████████████ Late: 234 │
│ ████████████████████ Notice: 89 │
│ ██████████████ Plan: 34 │
│ ██████████ Legal: 12 │
│ ██████ Eviction: 3 │
│ │
│ Conversion: 4.7% → 38.0% → 38.2% → 35.3% → │
│ 25.0% │
│ │
│ Click any stage to filter the table below ↓ │
└───────────────────────────────────────────────┘
Specification
- Visual funnel (CSS trapezoids or angled divs) showing account flow through 6 stages
- Each stage shows: count, total dollar amount, conversion rate from previous stage
- Interactive: Click any stage → filters the table below to show only accounts at that stage
- Color gradient: blue (early stages) → amber → red (eviction)
- Placement: Below aging chart, left column of a 2-column layout (right column = AI Action Queue)
Data Source
Backend: GET /api/collections/funnel — aggregates from collection_cases.escalation_level and collection_cases.status. Map escalation levels 1-5 to funnel stages.
New Widget — Wireframe
┌──────────────────────────────────────────────┐
│ 🤖 AI Action Queue Today: 10 items│
├──────────────────────────────────────────────┤
│ 1. 📱 Send SMS to Ahmad Khan │
│ 87% likely to pay if contacted today │
│ 🔴 Urgent │ A-305 │ $12,400 │
│ [Execute] [Dismiss] [Snooze ▼] │
├──────────────────────────────────────────────┤
│ 2. ⚠️ Escalate Maria Santos — 3rd miss │
│ Auto-escalation triggers in 2 days │
│ 🟡 High │ B-102 │ $6,800 │
│ [Execute] [Dismiss] [Snooze ▼] │
├──────────────────────────────────────────────┤
│ 3. 📧 Email James Williams — plan due tmrw │
│ Payment plan installment #2 due Mar 31 │
│ 🟡 High │ C-401 │ $3,200 │
│ [Execute] [Dismiss] [Snooze ▼] │
├──────────────────────────────────────────────┤
│ 4. 📞 Call Sarah Chen — promised Friday │
│ Follow up on verbal promise from Mar 27 │
│ 🔵 Normal │ A-102 │ $2,100 │
│ [Execute] [Dismiss] [Snooze ▼] │
├──────────────────────────────────────────────┤
│ ↓ Show 6 more actions │
└──────────────────────────────────────────────┘
Specification
- Scrollable card (max-height: 400px) showing top 10 AI-recommended actions across ALL active cases
- Each item: tenant name, recommended action, confidence %, urgency badge, unit, amount
- Quick-action buttons: Execute (calls existing AI action endpoint), Dismiss (hide for today), Snooze (remind in 1h/4h/tomorrow)
- Placement: Right column, next to Collections Funnel (2-column layout)
- Urgency levels: 🔴 Urgent (today), 🟡 High (this week), 🔵 Normal (this month)
Data Source
New endpoint: GET /api/collections/ai-queue — runs the AI recommendation engine across all active cases, ranks by urgency × confidence × amount, returns top 10.
Current vs Proposed
❌ Current — Static bars, no interaction
▓▓▓▓▓ ▓▓▓▓ ▓▓▓ ▓▓ ▓
0-30 31-60 61-90 91+ 120+
✅ Proposed — Clickable with labels & trends
▓▓▓▓▓ ▓▓▓▓ ▓▓▓ ▓▓ ▓█ ← growing!
0-30 31-60 61-90 91+ 120+
$45K $32K $24K $15K $8K
(120) (54) (32) (18) (10)
↘-3% ↗+2% →0% ↗+12% ↗+5%
─── click to filter ───
Specification
- Click any bar → filters the buyer table below to show only accounts in that aging bucket
- Each bar displays: dollar amount label, account count, trend vs last month (arrow + %)
- Fastest-growing bucket gets a red highlight border and pulse animation
- Selected bar stays highlighted with accent color until cleared
Current vs Proposed Table
❌ Current — Basic spreadsheet
│ Buyer │ Unit │ Project │ Amount │ Days │ Next Due │ Status │
│ Ahmad │ A305 │ Ashley │ $12.4K │ 94 │ Mar 15 │ Active │
│ James │ B201 │ Ashley │ $4.2K │ 32 │ Mar 28 │ Active │
✅ Proposed — Intelligence table
│☐│ Buyer │Unit │Risk│ Amount │Days│ History │Agent │Last Contact│
│☐│ Ahmad K. │A305 │ 🔴 │$12,400 │ 94 │ ●●○●○○ │Sarah │ 2 days ago │
│☐│ James W. │B201 │ 🟡 │ $4,200 │ 32 │ ●●●●○● │Mike │ 5 days ago │
│☐│ Maria S. │B102 │ 🔴 │ $6,800 │ 67 │ ●○○●○○ │Sarah │ 1 week ago │
↑ ↑ ↑ ↑ ↑
bulk colored sparkline assigned relative
select badge dots agent time
New Columns
- Checkbox column: Select individual rows or "select all" for bulk actions
- Risk Score: Colored badge — 🔴 High (score <30%), 🟡 Medium (30-60%), 🟢 Low (60%+). Sourced from AI payment probability.
- Payment History: 6-dot sparkline — ● green (paid on time), ◐ amber (paid late), ○ red (missed). Last 6 months.
- Assigned Agent: Agent name or "Unassigned" tag. Clickable to reassign.
- Last Contact: Relative time since last communication ("2 days ago", "1 week ago"). Red if >14 days.
New Features
- Column sorting: Click any header to sort asc/desc. Currently no sorting exists.
- Bulk actions bar: Appears when rows selected — [Send Bulk SMS] [Assign Agent] [Export Selected]
- Row color-coding: Light red background for 90+ days overdue, light amber for 60-89 days
New Widget — Wireframe
┌──────────────────────────────────────────┐
│ 📡 Communication Effectiveness │
│ Notice-to-Pay Conversion Rate by Channel │
│ │
│ 📞 Call ██████████████████████ 67% │
│ 📱 SMS ██████████████ 45% │
│ ✉️ Letter ██████████ 31% │
│ 📧 Email ███████ 22% │
│ │
│ 💡 Calls are 3x more effective than email │
└──────────────────────────────────────────┘
Specification
- Horizontal bar chart showing notice-to-pay conversion rate by communication channel
- Data: count of notices sent per channel vs payments received within 14 days of notice
- AI insight line at bottom: auto-generated recommendation based on data
- Placement: Below the funnel/AI queue section, full width or left column
The Problem — Fake Data in Code
// collection-chart.component.ts — CURRENT (FAKE)
const monthlyMultipliers = [0.12, 0.15, 0.08, 0.18, 0.10, 0.14, 0.09, 0.06, 0.03, 0.03, 0.01, 0.01];
this.monthlyData = monthlyMultipliers.map(m => this.revenueCollected * m);
// ↑ This generates fake distribution — NOT real monthly data
The Fix
// PROPOSED — Real data from backend
// Backend: GET /api/collections/monthly-summary?months=12
// Returns: [{ month: '2025-04', billed: 45000, collected: 42300 }, ...]
// Frontend: Grouped bar chart
// Blue bars = billed amount per month
// Green bars = collected amount per month
// Gap between them = shortfall (highlighted in red if growing)
Specification
- Create new backend endpoint aggregating actual payment records by month
- Show grouped bar chart: billed (blue) vs collected (green) per month
- Add trend line showing collection rate % over time
- Highlight months where collection rate dropped below 90% in red
New Widget — Wireframe
┌───────────────────────────────────────────┐
│ ⏰ Upcoming Deadlines [7d] [14d] [30d]│
├───────────────────────────────────────────┤
│ 🔴 TODAY Cure period expires — Unit A305│
│ Ahmad Khan │ $12,400 │
│ [View Case →] │
├───────────────────────────────────────────┤
│ 🔴 APR 1 Court hearing — Unit B102 │
│ Maria Santos │ $6,800 │
│ [View Case →] │
├───────────────────────────────────────────┤
│ 🟡 APR 3 Filing deadline — Unit C401 │
│ James Williams │ $3,200 │
│ [View Case →] │
├───────────────────────────────────────────┤
│ ⚪ APR 8 Payment plan due — Unit A102 │
│ Sarah Chen │ $2,100 │
│ [View Case →] │
└───────────────────────────────────────────┘
Specification
- List of actionable deadlines: cure period expirations, court dates, filing deadlines, payment plan due dates
- Color-coded: 🔴 today/tomorrow, 🟡 this week, ⚪ later
- Toggle view: 7-day / 14-day / 30-day window
- Click navigates to case detail page
- Placement: Right sidebar or below the main table
Current vs Proposed
❌ Current — Dropdown-only filtering
[Project ▼] [Aging ▼] [Search...]
✅ Proposed — One-click filter chips + dropdowns
[Critical 90+] [Payment Plans] [Legal] [First-Time Late]
[Chronic Payers] [My Cases] [Unassigned] + [Project ▼] [Search...]
Specification
- Horizontal strip of clickable filter chips above the table
- Pre-defined filters for common scenarios — one click to activate, click again to deactivate
- Multiple chips can be active simultaneously (AND logic)
- Active chip gets accent-colored border and filled background
- Existing dropdown filters remain alongside chips
Proposed /collections — Collections Intelligence Dashboard
┌─────────────────────────────────────────────────────────────────────────┐
│ Collections Intelligence Dashboard [Export ▼] │
│ PDF │ CSV │ Email │
├───────────┬────────────┬────────────┬────────────┬─────────────────────┤
│ Health │ Total │Outstanding │ Overdue │ Collection │
│ Score │ Overdue │ Receivables│ Buyers │ Rate │
│ ╭───╮ │ $124,500 │ $890,200 │ 47 │ 94.2% │
│ │82 │ │ ↗ +8.2% │ ↘ -2.1% │ ↗ +3 │ ↘ -0.8% │
│ ╰───╯ │ ▁▂▃▅▇█ │ █▇▅▃▂▁ │ ▁▁▂▃▃▅ │ █▇▇▆▅▅ │
│ ● Good │ ●Above avg │ ●Below avg │ ●On target │ ●Above avg │ ← D-1, D-2
├───────────┴────────────┴────────────┴────────────┴─────────────────────┤
│ [Critical 90+] [Payment Plans] [Legal] [First-Time] [My Cases] │ ← D-10
│ [Chronic Payers] [Unassigned] │
├──────────────────────────────────┬─────────────────────────────────────┤
│ Collections Funnel D-3 │ 🤖 AI Action Queue D-4 │
│ │ │
│ ████████████████████ All: 5,000│ 1. 📱 SMS Ahmad Khan (87%) │
│ ████████████████ Late: 234 │ $12,400 │ 🔴 Urgent │ [Execute] │
│ ████████████ Notice: 89 │ 2. ⚠️ Escalate Maria (3rd miss) │
│ ████████ Plan: 34 │ $6,800 │ 🟡 High │ [Execute] │
│ ██████ Legal: 12 │ 3. 📧 Email James (plan due) │
│ ████ Eviction: 3 │ $3,200 │ 🟡 High │ [Execute] │
│ │ 4. 📞 Call Sarah (promise Fri) │
│ Click stage to filter table ↓ │ $2,100 │ 🔵 Normal │ [Execute] │
├──────────────┬───────────────────┴─────────────────────────────────────┤
│ Aging Buckets│ Monthly Collections (Real Data) D-8 │
│ (interactive)│ │
│ ▓▓▓▓▓ │ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ ▓▓ │
│ ▓▓▓▓ │ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ░░ ▓=collected │
│ ▓▓▓ │ Apr May Jun Jul Aug Sep Oct Nov Dec Jan Feb Mar │
│ ▓▓ │ ░=billed │
│ ▓ D-5 │ Collection rate trend: ──────╲_╱──── 94.2% │
├──────────────┴────────────────────────────────────────────────────────┤
│ 📡 Comm. Effectiveness: 📞67% │ 📱45% │ ✉️31% │ 📧22% D-7 │
├───────────────────────────────────────────────────────────────────────┤
│ [Project ▼] [Aging ▼] [Search...] │
│ Focus: Ashley Hills — Rate: 91.3% ↗+1.2% │ Top Risk: A-305 ($12K) │
├───────────────────────────────────────────────────────────────────────┤
│ [Overdue] [Due Soon] [All Buyers] [Payment Plans] [Legal Cases] │
│ ┌─────────────────────────────────────────────────────────────────┐ │
│ │☐│ Buyer │ Unit │ Risk │ Amount │ Days │ History │ Agent │ │ ← D-6
│ │☐│ Ahmad K. │ A305 │ 🔴 │ $12,400 │ 94 │ ●●○●○○ │ Sarah │ │
│ │☐│ Maria S. │ B102 │ 🔴 │ $6,800 │ 67 │ ●○○●○○ │ Sarah │ │
│ │☐│ James W. │ C401 │ 🟡 │ $4,200 │ 32 │ ●●●●○● │ Mike │ │
│ │☐│ Sarah C. │ A102 │ 🟢 │ $2,100 │ 15 │ ●●●●●○ │ — │ │
│ └─────────────────────────────────────────────────────────────────┘ │
│ [Send Bulk SMS] [Assign Agent] [Export Selected] < 1 2 3 > │
├───────────────────────────────────────────────────────────────────────┤
│ ⏰ Deadlines This Week D-9 │
│ 🔴 Today: Cure expires A305 │ 🔴 Apr 1: Court B102 │ 🟡 Apr 3... │
└───────────────────────────────────────────────────────────────────────┘
Part B — Detail Page
Current /collections/:id Detail Page Layout
┌─────────────────────────────────────────────────────────────────────┐
│ ← Back to Collections │
├─────────────────────────────┬───────────────────────────────────────┤
│ 👤 Ahmad Khan │ Balance: $12,400 │ Escalation: 3/5 │
│ A-305, Ashley Hills │ Pay Prob: 34% │ Days: 94 │
│ +1 (555) 234-5678 │ Status: Active │
├─────────────────────────────────────────────────────────────────────┤
│ [SMS] [Email] [Call] [Plan] [Payment] [Notice] [Escalate] [More] │
├─────────────────────────────────────────────────────────────────────┤
│ 🤖 AI: Send a courtesy SMS with payment link — 67% response rate │
│ [Execute Action] │
├─────────────┬───────────────────────────────────────────────────────┤
│ Tenant Info │ [Communications] [Ledger] [Calls] │
│ │ │
│ Lease Info │ ┌──────────────────────────────┐ │
│ - Start/End │ │ ← SMS from tenant (Mar 28) │ │
│ - Rent $2K │ │ "I'll pay on Friday" │ │
│ - Deposit │ └──────────────────────────────┘ │
│ │ ┌──────────────────────────────┐ │
│ Escalation │ │ SMS to tenant (Mar 25) → │ │
│ ○ ○ ● ○ ○ │ │ "Payment reminder for $2K" │ │
│ Level 3 │ └──────────────────────────────┘ │
│ │ ┌──────────────────────────────┐ │
│ Legal Events│ │ Email to tenant (Mar 20) → │ │
│ - Event 1 │ │ "Outstanding balance notice" │ │
│ - Event 2 │ └──────────────────────────────┘ │
│ │ │
│ Documents │ │
│ - Notice 1 │ │
│ - Lease │ │
│ [Upload] │ │
└─────────────┴───────────────────────────────────────────────────────┘
- 1 No payment history visualization — Only a table of missed months in the Ledger tab. No visual showing the pattern over the entire lease (which months paid on time, which missed, what the trend is).
- 2 AI recommendation is a single text line — Just shows
next_best_action text with one "Execute" button. No explanation of WHY this action, no confidence score displayed, no alternative options to choose from.
- 3 No financial summary — The ledger tab shows missed months and installments but there's no total picture: total lease value, total paid to date, % complete, projected loss if evicted.
- 4 No comparable cases — Property manager has no context on "what happened with similar cases?" No data on whether payment plans work for tenants with this profile.
- 5 Communication timeline has no sentiment — Messages show direction, channel, and delivery status, but no sentiment indicator. Can't tell if tenant is becoming more hostile or more cooperative over time.
- 6 Payment Plan is hardcoded to 3 installments —
offerPaymentPlan() always creates 3 installments. No dialog to configure terms. No AI-generated options with projected recovery rates.
- 7 Generate Notice creates a stub document — Creates a database record but doesn't generate an actual PDF. Should produce jurisdiction-aware notice with proper legal language.
- 8 Upload Document is a stub — Always creates "Uploaded Document" with type "other". No actual file upload capability — no file picker, no drag-and-drop, no preview.
- 9 No escalation workflow visualization — Shows escalation level as 5 dots but no timeline showing WHEN each escalation happened, how long each stage lasted, or what triggers the next one.
- 10 No cost-of-inaction analysis — Property manager can't see "if I don't act, this will cost us $X in lost rent + $Y in legal fees + $Z in vacancy." No urgency quantification.
- 11 Legal workflow section is basic — Shows events in a simple list but no visual pipeline. Doesn't show the full legal process or where THIS case currently sits in it.
- 12 No "what the tenant sees" view — Property manager can't see the tenant's portal experience. Showing their view would help craft more empathetic, effective communications.
New Component — Wireframe
┌────────────────────────────────────────────────────────────────┐
│ Payment History (12 months) │
│ │
│ Jan Feb Mar Apr May Jun Jul Aug Sep Oct│
│ ● ● ● ● ◐ ○ ○ ○ ● │
│ on on on on late miss miss miss paid │
│ │
│ Nov Dec │
│ ○ · Legend: ● On Time ◐ Late ○ Missed · Future │
│ miss future │
│ │
│ Pattern: 4 consecutive on-time → 1 late → 3 missed → 1 paid → │
│ Declining trend. Action needed. │
└────────────────────────────────────────────────────────────────┘
Specification
- Visual timeline spanning the entire lease life (12-24 months depending on lease)
- Each month rendered as a colored circle: ● green = paid on time, ◐ amber = paid late, ○ red = missed, · gray = future
- Hover on any circle shows tooltip: payment date, amount, days late (if applicable)
- Below timeline: AI-generated pattern description ("4 consecutive on-time → declining")
- Placement: Full width, above the tabs, below the header/action buttons. First thing the manager sees.
Data Source
Already available: installment_schedules table has due dates and payment status. Map status: 'paid' with paid_date <= due_date → on-time. paid_date > due_date → late. status: 'overdue' → missed.
Current vs Proposed
❌ Current — Single line, no context
🤖 AI: Send a courtesy SMS with payment link — 67% response rate
[Execute Action]
✅ Proposed — Rich expandable card
┌──────────────────────────────────────────────────────┐
│ 🤖 AI Recommendation 92% conf. │
│ ──────────────────────────────────────────────────── │
│ ★ Send courtesy SMS with payment link │
│ │
│ WHY THIS ACTION: │
│ 3 similar cases (first-time late, <$15K) responded │
│ to SMS within 24hrs. Ahmad's preferred channel is │
│ SMS (3 of 4 past responses via SMS). │
│ │
│ EXPECTED OUTCOME: │
│ 67% chance of payment within 7 days │
│ Based on 23 similar resolved cases │
│ │
│ [Execute SMS ▶] │
│ │
│ ▾ ALTERNATIVES │
│ 📞 Schedule call with agent — 78% conf. [Execute] │
│ 📧 Send email with statement — 54% conf. [Execute] │
│ ⏳ Wait 3 more days then escalate — 41% conf. │
└──────────────────────────────────────────────────────┘
Specification
- Primary recommendation prominently displayed with confidence percentage as a colored badge
- "Why this action" section: cites similar cases, tenant's communication preference, historical response data
- "Expected outcome": probability of payment + timeframe, based on resolved case data
- Alternatives section: expandable, shows 2-3 other options with their own confidence scores and execute buttons
- Each option's Execute button triggers the corresponding action (SMS dialog, email composer, etc.)
Backend Changes
Extend AI recommendation response to include: confidence, reasoning, similar_cases_count, expected_outcome, alternatives[]. Currently only returns next_best_action string.
New Component — Wireframe
┌───────────────────────────────────────┐
│ 💰 Financial Summary │
│ │
│ Lease Value $24,000 │
│ ███████████████████████████████ 100% │
│ │
│ Paid to Date $14,400 │
│ ████████████████████░░░░░░░░░░ 60% │
│ ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ = paid │
│ ░░░░░░░░░░░░░░░░░░░░░ = outstanding │
│ │
│ Outstanding $9,600 │
│ Security Deposit -$2,400 │
│ Late Fees Accrued +$450 │
│ ───────────────────────────── │
│ Net Exposure $7,650 │
│ │
│ ⚠️ Cost if Evicted: ~$14,100 │
│ Remaining rent $9,600 │
│ Legal costs est. $2,500 │
│ Vacancy loss est. $2,000 │
│ │
│ [Apply Late Fee] [Waive Fee] │
│ [Record Payment] [Adjust Balance] │
└───────────────────────────────────────┘
Specification
- Placed in left column, replaces/augments the current "Tenant & Lease Info" section at the top
- Stacked progress bar: green (paid) + red (outstanding) = total lease value
- Key financial metrics with clear labels and amounts in
JetBrains Mono
- Net Exposure = Outstanding - Security Deposit + Late Fees
- Cost if Evicted = Remaining rent + estimated legal costs + estimated vacancy loss (configurable per jurisdiction)
- Quick action buttons for common financial operations (see C-11)
New Tab — Wireframe
┌──────────────────────────────────────────────────────────┐
│ [Communications] [Ledger] [Calls] [Similar Cases ←NEW] │
├──────────────────────────────────────────────────────────┤
│ 📊 Similar Cases (matched on: $10-15K range, 60-120 │
│ days overdue, residential, same city) │
│ │
│ Resolution Outcomes (6 similar cases found): │
│ │
│ ✅ Payment Plan 3 cases │ avg 45 days to resolve │
│ ████████████████████ 50% success rate │
│ │
│ ✅ Full Payment 2 cases │ avg 12 days to resolve │
│ ████████████████ 33% (usually after demand letter) │
│ │
│ ❌ Went to Legal 1 case │ 90 days to resolve │
│ ████████ 17% (tenant abandoned unit) │
│ │
│ 💡 Recommendation: Payment plan has highest success rate │
│ for cases in this profile. Average recovery: 78%. │
│ │
│ ▾ View individual cases │
│ Case #1042 — Resolved via 4-installment plan (42 days) │
│ Case #987 — Paid in full after demand letter (8 days) │
│ Case #1105 — Payment plan, 3 installments (51 days) │
└──────────────────────────────────────────────────────────┘
Specification
- New tab in the main content area: "Similar Cases"
- Matching criteria: amount range (±25%), days overdue range (±30 days), same property type, same city/jurisdiction
- Shows resolution outcomes grouped by method with success rates and average resolution times
- AI-generated recommendation based on what worked for similar cases
- Expandable list of individual comparable cases with links
New Component — Wireframe
┌──────────────────────────────────────────────────────┐
│ Tenant Sentiment Over Time │
│ │
│ 😊 5 │ ● │
│ 4 │ ● ● │
│ 😐 3 │ ● ● │
│ 2 │ ● │
│ 😠 1 │ ● │
│ └────────────────────────────────────── │
│ Mar 5 Mar 12 Mar 18 Mar 22 Mar 25 Mar 28│
│ │
│ Trend: ↘ Declining — tenant becoming less │
│ cooperative. Consider empathetic approach. │
├──────────────────────────────────────────────────────┤
│ ┌─green border──────────────────────────────────┐ │
│ │ ← SMS from tenant (Mar 28) │ │
│ │ "I'll try to pay Friday, sorry for the delay" │ │
│ │ Sentiment: 3/5 (neutral-cooperative) │ │
│ └───────────────────────────────────────────────┘ │
│ ┌─red border────────────────────────────────────┐ │
│ │ ← SMS from tenant (Mar 25) │ │
│ │ "Stop calling me, I know I owe" │ │
│ │ Sentiment: 1/5 (hostile) │ │
│ └───────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────┘
Specification
- Small line chart above the chat timeline showing sentiment score (1-5) over time
- Each inbound communication gets a sentiment dot on the chart (NLP analysis)
- Trend line with AI-generated summary: "Declining — consider empathetic approach"
- Chat bubbles get subtle border tinting: green = positive/cooperative, red = hostile/frustrated
- Sentiment score badge on each message bubble
Current vs Proposed
❌ Current — Hardcoded 3 installments
// offerPaymentPlan() in component
const installments = 3; // ← HARDCODED
const amount = outstanding / 3;
// Creates plan immediately, no dialog
✅ Proposed — Smart plan dialog
┌──────────────────────────────────────────────┐
│ 📋 Create Payment Plan │
│ Outstanding Balance: $9,600 │
│ ─────────────────────────────────────────── │
│ │
│ AI-Generated Options: │
│ │
│ ○ Aggressive — 2 installments │
│ $4,800/mo │ 89% projected recovery │
│ Due: Apr 15, May 15 │
│ │
│ ● Standard — 3 installments (recommended) │
│ $3,200/mo │ 76% projected recovery │
│ Due: Apr 15, May 15, Jun 15 │
│ │
│ ○ Lenient — 6 installments │
│ $1,600/mo │ 62% projected recovery │
│ Due: Apr-Sep, 15th of each month │
│ │
│ ○ Custom — Set your own terms │
│ Installments: [___] Start: [______] │
│ │
│ Include late fee in plan? [✓] $450 │
│ Auto-notify tenant? [✓] via SMS │
│ │
│ [Cancel] [Create Plan & Notify] │
└──────────────────────────────────────────────┘
Specification
- Modal dialog replaces the one-click plan creation
- AI generates 3 plan options based on: outstanding amount, tenant's payment history, comparable case data
- Each option shows: number of installments, monthly amount, projected recovery rate
- Custom option allows manager to set any terms
- Options to include late fees in plan and auto-notify tenant
- Preview shows full payment schedule before creation
Current vs Proposed
❌ Current — Static dots, no timeline
Escalation Level: ● ● ● ○ ○ (3/5)
✅ Proposed — Interactive pipeline with timeline
┌──────────────────────────────────────────────────────────────────┐
│ Escalation Pipeline │
│ │
│ [1 Reminder]──►[2 Notice]──►[3 Demand]──►[4 Legal]──►[5 Eviction]│
│ ✅ ✅ ● HERE ○ ○ │
│ Mar 1 Mar 8 Mar 15 │
│ (30 days) (7 days) (16 days ago) │
│ │
│ ⏰ Auto-escalates to Level 4 on Apr 5 if no payment received │
│ (21 days remaining in current stage) │
│ │
│ History: │
│ • Mar 1 — Friendly reminder SMS sent (auto) │
│ • Mar 8 — Formal notice generated & sent │
│ • Mar 15 — Demand letter sent via certified mail │
└──────────────────────────────────────────────────────────────────┘
Specification
- Horizontal pipeline with 5 steps, connected by arrows
- Completed steps: green checkmark + date completed + duration in that stage
- Current step: pulsing dot + "HERE" label + date entered + days elapsed
- Future steps: gray circles
- Auto-escalation notice: shows when next escalation triggers if no action taken
- History log: what actions were taken at each stage
- Placement: Full width, below payment history timeline, above action buttons
New Component — Wireframe
┌───────────────────────────────────────────┐
│ ⚠️ Cost of Inaction │
│ Every day of inaction costs ~$67 │
│ │
│ TODAY │
│ ██████████ Outstanding $9,600 │
│ ██ Late fees $450 │
│ ───────────────── │
│ Total: $10,050 │
│ │
│ +30 DAYS │
│ ██████████ + Lost rent $2,000 │
│ ████ + Late fees $150 │
│ Total: $12,200 (+$2,150) │
│ │
│ +60 DAYS │
│ ██████████ + Legal filing $500 │
│ ██████ + Attorney $1,500 │
│ Total: $14,200 (+$2,000) │
│ │
│ +90 DAYS │
│ ██████████ + Court costs $800 │
│ ████████ + Vacancy loss $4,000 │
│ Total: $19,000 (+$4,800) │
│ │
│ 📈 Cost doubles in ~90 days │
│ ⏰ Act now to minimize exposure │
└───────────────────────────────────────────┘
Specification
- Stacking bar visualization showing escalating costs over 30/60/90 day windows
- Cost components: outstanding balance, late fees, lost rent (monthly), legal fees (estimated by stage), vacancy loss
- Daily cost calculation: total projected 90-day cost ÷ 90
- Cost estimates configurable per jurisdiction / property type in system settings
- Placement: Left column, below the Financial Summary card
Current vs Proposed
❌ Current — Simple event list
Legal Events:
• Notice to Pay sent (Mar 8)
• Demand Letter sent (Mar 15)
• Cure period started (Mar 15)
✅ Proposed — Visual legal pipeline
Legal Process (Jordan — Landlord-Tenant Law)
[Notice to Pay]──[Cure Period]──[Filing]──[Hearing]──[Judgment]──[Writ]
✅ Done ● HERE (5d ○ ○ ○ ○
(Mar 8) remaining)
Cure Period: Mar 15 → Apr 5 (14 days per jurisdiction)
█████████████░░░░░ 9 of 14 days elapsed (64%)
If cure expires without payment:
→ File eviction: est. $500 filing fee
→ Court hearing: typically 14-21 days after filing
→ Total timeline to possession: ~60-75 days
Specification
- Jurisdiction-aware: shows the correct legal process steps for this property's location
- Visual pipeline with progress bar for time-bound stages (cure period, etc.)
- Forward-looking: shows estimated timeline and costs for remaining steps
- Links to generate required documents at each stage
New Dialog — Wireframe
┌───────────────────────────────────────────────────┐
│ 📱 Send SMS to Ahmad Khan │
│ │
│ Tone: [Friendly ▼] [Firm] [Formal] [Final Warning]│
│ │
│ ┌──────────────────────────────────────────────┐ │
│ │ Hi Ahmad, this is Sarah from Ashley Hills. │ │
│ │ We noticed your balance of $9,600 is 94 days │ │
│ │ overdue. We'd love to work out a plan that │ │
│ │ works for you. │ │
│ │ │ │
│ │ Pay now: https://pay.unitcycle.com/ak305 │ │
│ │ │ │
│ │ Or reply to discuss a payment plan. │ │
│ │ — Sarah, Property Manager │ │
│ └──────────────────────────────────────────────┘ │
│ │
│ 🤖 AI-drafted based on: escalation level 3, tenor │
│ preference SMS, previous cooperative response. │
│ ✏️ Edit before sending │
│ │
│ Preview (how tenant will see it): │
│ ┌─────────────────────┐ │
│ │ 📱 iPhone Preview │ │
│ │ From: Ashley Hills │ │
│ │ Hi Ahmad, this is... │ │
│ └─────────────────────┘ │
│ │
│ [Cancel] [Send SMS ▶] │
└───────────────────────────────────────────────────┘
Specification
- When clicking SMS/Email buttons, dialog opens with AI-pre-populated message
- AI considers: tenant name, amount, days overdue, escalation level, previous comms, tone history
- Tone selector: Friendly / Firm / Formal / Final Warning — changes the message tone
- Manager can edit the message before sending
- Phone/email preview showing how tenant will receive it
- Include payment link auto-generated for this tenant
New Component — Wireframe
┌───────────────────────────────────────┐
│ Quick Actions │
│ │
│ [📝 Apply Late Fee] │
│ Auto-calculated: $150 (5% of $3,000) │
│ Based on lease terms §4.2 │
│ │
│ [🔄 Waive Late Fee] │
│ Requires reason note │
│ │
│ [💵 Record Partial Payment] │
│ Amount: $[_______] │
│ Date: [_______] │
│ │
│ [⚖️ Adjust Balance] │
│ Reason: [Credit ▼] │
│ Amount: $[_______] │
└───────────────────────────────────────┘
Specification
- Button group below the Financial Summary card in left column
- Apply Late Fee: auto-calculates based on lease terms (% or flat fee), one-click to apply
- Waive Late Fee: requires a reason note (dropdown: courtesy, hardship, error, other)
- Record Partial Payment: quick entry for amount + date, creates payment record
- Adjust Balance: credit/debit with reason — for corrections, concessions, etc.
Current vs Proposed
❌ Current — Fake upload stub
// uploadDocument() in component
this.documents.push({
name: 'Uploaded Document',
type: 'other', // ← always 'other'
date: new Date()
});
// No actual file upload — just creates a record
✅ Proposed — Real file upload with categorization
┌──────────────────────────────────────────┐
│ 📁 Upload Document │
│ │
│ ┌───────────────────────────────────────┐ │
│ │ │ │
│ │ 📄 Drag & drop files here │ │
│ │ or click to browse │ │
│ │ │ │
│ │ PDF, DOC, JPG up to 10MB │ │
│ └───────────────────────────────────────┘ │
│ │
│ Type: [Auto-detected: Notice ▼] │
│ Lease │ Notice │ Payment Plan │ │
│ Court Form │ Correspondence │ Other │
│ │
│ Preview: │
│ ┌───────────────────┐ │
│ │ 📄 notice-to-pay │ │
│ │ .pdf (234 KB) │ │
│ │ Page 1 of 2 │ │
│ └───────────────────┘ │
│ │
│ [Cancel] [Upload & Attach] │
└──────────────────────────────────────────┘
Specification
- Real file upload with drag-and-drop zone and file browser
- Auto-categorization: AI/keyword-based detection of document type from filename and content
- Inline preview for PDFs and images
- File stored in cloud storage (S3/equivalent), link saved in database
- PDF generation for notices and payment plans using templates
Proposed /collections/:id — Collection Case Intelligence
┌─────────────────────────────────────────────────────────────────────────────┐
│ ← Collections Ahmad Khan — A-305, Ashley Hills Status: Active │
├─────────────────────────────────────────────────────────────────────────────┤
│ Balance: $9,600 │ Escalation: 3/5 │ Pay Prob: 34% │ Days Overdue: 94 │
│ ⚠️ Legal Hold │ Cost/Day: $67 │ Net Exp: $7.6K │ Risk: 🔴 High │
├─────────────────────────────────────────────────────────────────────────────┤
│ Payment History (12 months) C-1 │
│ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec │
│ ● ● ● ● ◐ ○ ○ ○ ● ○ ○ · │
│ Pattern: Declining — 4 on-time → slipping. Action needed. │
├─────────────────────────────────────────────────────────────────────────────┤
│ Escalation Pipeline C-7 │
│ [1 Reminder]──►[2 Notice]──►[3 Demand]──►[4 Legal]──►[5 Eviction] │
│ ✅ ✅ ● HERE ○ ○ │
│ Mar 1 Mar 8 Mar 15 Auto-esc │
│ (16 days) Apr 5 │
├─────────────────────────────────────────────────────────────────────────────┤
│ [📱SMS] [📧Email] [📞Call] [📋Plan] [💵Pay] [📄Notice] [⬆️Esc] [More ▼] │
├─────────────────────────────────────────────────────────────────────────────┤
│ 🤖 AI Recommendation — 92% confidence C-2 │
│ ★ Send courtesy SMS with payment link │
│ Why: 3 similar cases responded in 24hrs │ Expected: 67% pay in 7 days │
│ [Execute SMS ▶] Alt: 📧 54% │ 📞 78% │ ⏳ 41% │
├────────────────────┬────────────────────────────────────────────────────────┤
│ 💰 Financial C-3 │ [Communications] [Ledger] [Calls] [Similar Cases] │
│ Summary │ │
│ │ Sentiment: ────╲__/──╲ (trending ↘) C-5 │
│ Lease: $24,000 │ │
│ Paid: $14,400 │ ┌─green────────────────────────────────────────┐ │
│ ████████░░░░ 60% │ │ ← SMS from Ahmad (Mar 28) 😐 3/5 │ │
│ │ │ "I'll try to pay Friday" │ │
│ Outstanding $9,600 │ └──────────────────────────────────────────────┘ │
│ Deposit -$2,400 │ ┌─red──────────────────────────────────────────┐ │
│ Late Fees +$450 │ │ ← SMS from Ahmad (Mar 25) 😠 1/5 │ │
│ ────────────────── │ │ "Stop calling me, I know I owe" │ │
│ Net Exp: $7,650 │ └──────────────────────────────────────────────┘ │
│ If Evict: $14,100 │ ┌─────────────────────────────────────────────┐ │
│ │ │ SMS to Ahmad (Mar 25) → │ │
│ [Apply Fee] C-11 │ │ "Payment reminder for March rent..." │ │
│ [Waive Fee] │ └──────────────────────────────────────────────┘ │
│ [Record Payment] │ │
│ ──────────────── │ │
│ 👤 Tenant Info │ │
│ Lease: Jan-Dec '26 │ │
│ Rent: $2,000/mo │ │
│ Phone: 555-234-5678│ │
│ ──────────────── │ │
│ ⚖️ Legal C-9 │ │
│ [Notice]──[Cure]── │ │
│ [Filing]──[Hearing] │ │
│ Cure: 5d remaining │ │
│ ──────────────── │ │
│ 📁 Documents C-12 │ │
│ • Notice (Mar 8) │ │
│ • Demand (Mar 15) │ │
│ [Upload ⬆ Drag&Drop]│ │
│ ──────────────── │ │
│ ⚠️ Cost of C-8 │ │
│ Inaction │ │
│ Today: $10,050 │ │
│ +30 days: $12,200 │ │
│ +60 days: $14,200 │ │
│ +90 days: $19,000 │ │
│ ($67/day) │ │
└────────────────────┴────────────────────────────────────────────────────────┘
Part C — Priorities
🟢 P1 — Do First — Highest impact, drives demo value (7 items)
| # | Improvement | Page | Effort | Impact | Priority |
| D-1 |
Enhanced KPI Cards with Trends |
Dashboard |
Low |
★★★★★ |
P1 |
| D-2 |
Collections Health Score |
Dashboard |
Low |
★★★★★ |
P1 |
| C-1 |
Payment History Timeline |
Detail |
Low |
★★★★★ |
P1 |
| C-2 |
Upgraded AI Recommendation Panel |
Detail |
Med |
★★★★★ |
P1 |
| C-3 |
Financial Summary Card |
Detail |
Low |
★★★★☆ |
P1 |
| D-6 |
Enhanced Table Columns & Bulk Actions |
Dashboard |
Med |
★★★★☆ |
P1 |
| C-7 |
Escalation Workflow Visualization |
Detail |
Low |
★★★★☆ |
P1 |
🔵 P2 — Do Next — Strong value-add (7 items)
| # | Improvement | Page | Effort | Impact | Priority |
| D-3 |
Collections Funnel |
Dashboard |
Med |
★★★★☆ |
P2 |
| D-4 |
AI Action Queue |
Dashboard |
Med |
★★★★☆ |
P2 |
| C-6 |
Smart Payment Plan Dialog |
Detail |
Med |
★★★★☆ |
P2 |
| C-8 |
Cost of Inaction Calculator |
Detail |
Low |
★★★★☆ |
P2 |
| C-10 |
AI-Drafted Communication Templates |
Detail |
Med |
★★★★☆ |
P2 |
| D-5 |
Interactive Aging Chart |
Dashboard |
Low |
★★★☆☆ |
P2 |
| D-8 |
Real Chart Data (Replace Fake) |
Dashboard |
Med |
★★★☆☆ |
P2 |
⚪ P3 — Polish & Advanced (8 items)
| # | Improvement | Page | Effort | Impact | Priority |
| C-4 |
Comparable Cases Panel |
Detail |
High |
★★★☆☆ |
P3 |
| C-5 |
Sentiment Timeline |
Detail |
High |
★★★☆☆ |
P3 |
| D-7 |
Communication Effectiveness Widget |
Dashboard |
Med |
★★★☆☆ |
P3 |
| D-9 |
Upcoming Deadlines Widget |
Dashboard |
Med |
★★★☆☆ |
P3 |
| C-9 |
Enhanced Legal Workflow |
Detail |
Med |
★★★☆☆ |
P3 |
| C-11 |
Quick Financial Actions |
Detail |
Low |
★★☆☆☆ |
P3 |
| C-12 |
Document Upload Fix |
Detail |
Med |
★★☆☆☆ |
P3 |
| D-10 |
Quick Filter Chips |
Dashboard |
Low |
★★☆☆☆ |
P3 |
🟢 P1 Sprint — Week 1-2
7 items • 4 Low + 3 Med effort
- D-1 Enhanced KPI cards
- D-2 Health Score gauge
- C-1 Payment history dots
- C-2 AI panel upgrade
- C-3 Financial summary
- D-6 Table enhancements
- C-7 Escalation pipeline
These 7 items transform the demo impression from "basic CRUD" to "intelligent collections platform."
🔵 P2 Sprint — Week 3-4
7 items • 2 Low + 5 Med effort
- D-3 Collections funnel
- D-4 AI action queue
- C-6 Smart payment plans
- C-8 Cost of inaction
- C-10 AI-drafted comms
- D-5 Interactive aging chart
- D-8 Real chart data
These add the "wow factor" — AI-powered workflows, smart dialogs, and data integrity fixes.
⚪ P3 Sprint — Week 5-6
8 items • 2 Low + 4 Med + 2 High effort
- C-4 Comparable cases
- C-5 Sentiment timeline
- D-7 Comm effectiveness
- D-9 Deadlines widget
- C-9 Legal workflow
- C-11 Quick financial actions
- C-12 Document upload fix
- D-10 Quick filter chips
Polish, advanced analytics, and infrastructure fixes. Nice-to-have for demo, essential for production.