Skip to content

Prototype Overview

What: Eligibility determination flow for case management Type: UI/UX Prototype (no backend) Design System: Shadcn UI

  • Component Reference: Shadcn UI Docs
  • Design Rules: See DESIGN_RULES.md in repo
RoleKey ScreensPrimary Tasks
AI(automated)Reviews documents and parties, flags issues, generates recommendations
ManagerDashboard, AI Review Queue, Case DetailReview AI assessments, make eligibility decisions, assign cases

Note: Specialist role has been removed. AI handles document/party review; managers make final decisions.

As a…I want to…So that…
Case manageropen a case and see its current stage at a glanceI don’t have to remember which dashboard a case lives on
Case managerreview eligibility-stage details without leaving the caseI don’t lose context by jumping to the Eligibility dashboard
Case managerreview arbitration-stage details without leaving the caseI don’t lose context by jumping to the Arbitration dashboard
Case managersee a closed case’s reconciliation summary on the case itselfI don’t have to open a separate Admin Closures dashboard
Case managerrecognize a case’s stage instantly across listing, search, and detail surfacesthe same color and label always means the same thing
Case managerjump directly to any case from the top search barI don’t have to navigate to the Cases listing first
Case managerfilter the Cases listing with one clickI can triage my workload without opening a filters dialog
Case managertell at a glance that a checklist item is locked vs editableI don’t waste time trying to interact with a non-actionable control
Case managerswitch between dark and light themes and have my choice rememberedI can use the portal under whatever lighting condition I’m in
  1. AI reviews all case documents, flags issues, and verifies data.
  2. AI reviews both parties and flags mismatches.
  3. AI generates recommendation (approve/RFI/ineligible) with confidence score.
  4. Case enters the manager’s AI Review Queue.
  1. Open AI Review Queue from dashboard.
  2. Triage cases: expand rows for AI findings, or quick approve.
  3. For complex cases: open full 2-step review flow.
  4. Step 1: Review AI summary (documents, parties, flags, notes).
  5. Step 2: Make decision (approve/RFI/ineligible).
  1. View unassigned cases queue.
  2. Select cases for assignment.
  3. Confirm assignment.
RoutePage
/Redirects to /manager
/managerManager dashboard
/manager/ai-reviewAI review queue
/manager/ai-review/:caseIdManager focused 2-step review
/manager/focusedManager focused 2-step review, queue mode
/manager/assignAssign cases
/manager/casesCases list
/manager/case/:caseIdCase detail
AreaPurpose
src/components/layout/Page layouts and navigation
src/components/manager/Manager-specific components
src/components/manager/ai-review/AI review queue and 2-step flow
src/components/manager/case-detail/Case detail tabs and stage panels
src/components/manager/focused/Focused view controller and stats context
src/components/specialist/Hidden specialist components preserved for revert
src/components/ui/Shadcn UI components
  • Framework: Vite + React
  • Styling: Tailwind CSS v4
  • Components: Shadcn UI + Radix primitives
  • Routing: React Router
  • State: React hooks (no Redux)
TermMeaning
CaseIndividual eligibility application to process
AI ReviewAutomated document/party review with confidence score and recommendation
ManagerStaff member who reviews AI assessments and makes final decisions
AI Review QueueList of AI-processed cases awaiting manager decision
Focused View2-step flow: AI Summary -> Decision
  • Authentication/authorization
  • Backend API calls
  • Database persistence
  • Real eligibility logic
  • Notifications

All data is mocked. Focus is on UX validation.