CaseFlow

Caseworker Decision Support Tool — Built for DSIT AI Engineering Lab Hackathon, Challenge 3: Supporting Casework Decisions.

What it does

CaseFlow helps government caseworkers make faster, better-informed decisions by surfacing the right information at the right moment. It supports three user types named in the challenge brief:

Demo guide

Start here: Visit the landing page and select a role to explore the system.

1. Role selector (/) — Choose “Caseworker”, “Team leader”, or “Applicant” to switch views instantly
2. Caseworker view (/cases) — Browse cases, create new cases, review evidence, take workflow actions
3. Case detail — Click any case to see SLA countdown (deadline urgency at a glance), related cases, timeline filtering, evidence tracker, AI summary, and workflow actions
4. Team leader view (/dashboard) — Monitor team performance, analytics charts, escalated cases, reassign workload
5. Applicant view (/status-check) — Enter a reference number (e.g. REF-77291) to check case status
6. Use “Switch role” in the header to jump between views at any time

For caseworkers

• Case list dashboard — 60 cases at a glance with colour-coded status indicators, deadline alerts, filtering by status/type/team, free-text search, and sortable columns
• Create new case — GOV.UK form with full validation to create cases (case type, applicant details, team assignment)
• Case detail view — Structured timeline, applicant details, case notes, current workflow state, applicable policies, SLA countdown, and related cases
• Interactive workflow actions — Transition cases between states, mark evidence received, add notes, and request evidence directly from the case view
• Policy matching — Automatically surfaces relevant policies based on case type with key thresholds highlighted
• Workflow state visualisation — Shows where a case sits in the state machine, required actions, and allowed transitions
• Evidence tracker — Checklist-style panel showing which evidence items are received, outstanding, or overdue for each case, cross-referencing policy requirements against the case timeline
• Deadline alerts — Calculates and flags overdue evidence based on policy thresholds (28-day reminder, 56-day escalation)
• SLA countdown — Visual progress bar showing case age against 28-day reminder and 56-day escalation thresholds (green → amber → red), with GOV.UK warning text for overdue cases
• Related cases — Automatically surfaces up to 5 related cases by applicant, case type + team, or cross-references in case notes, helping caseworkers spot patterns
• Timeline filtering — Filter timeline events by category: All events, Key decisions, Evidence, or Notes, with event counts
• AI case summarisation — Returns realistic summaries with key facts, recommended actions, and risk level (mocked endpoint, designed for easy replacement with a real LLM)
• Batch actions — Select multiple cases for bulk reassignment or CSV export
• Keyboard shortcuts — Power-user navigation with keyboard shortcuts (press ? to view)

For team leaders

• Team leader dashboard — Caseload overview across teams, escalated cases, risk/overdue summary, capacity indicators, status and type breakdowns
• Analytics charts — CSS bar charts showing cases by status, type, age distribution, and weekly trends
• Case reassignment — Reassign escalated cases to a different team directly from the dashboard using a GOV.UK select dropdown
• CSV export — Download all cases as a CSV file with case ID, applicant, type, status, team, dates, priority, days open, and alert counts
• Recent activity feed — Live timeline of the 20 most recent events across all cases, linking directly to the relevant case

For applicants

• Status check page — Applicants enter their reference number to see: current case status, what it means in plain English, last update date, next expected action, and estimated timeline

Tech stack

Quick start

npm install
npm run dev

This starts both the backend (port 3001) and frontend dev server (port 3000) concurrently.

To use a custom backend port, set CASEFLOW_PORT (takes precedence over PORT):

CASEFLOW_PORT=4000 npm run dev

Run individually

npm run backend   # Express API on :3001
npm run frontend  # React dev server on :3000

Production build

npm run build     # Builds React frontend into packages/frontend/build
npm start         # Serves both API and static frontend from Express on :3001

Project structure

caseflow/
├── package.json              # Root workspace config
├── packages/
│   ├── backend/
│   │   ├── package.json
│   │   └── src/
│   │       ├── server.js         # Express entry point
│   │       ├── data/
│   │       │   ├── cases.json          # 60 synthetic cases
│   │       │   ├── policy-extracts.json # 10 government policies
│   │       │   └── workflow-states.json  # State machines for 3 case types
│   │       └── routes/
│   │           ├── cases.js        # Case CRUD with deadline alerts
│   │           ├── policies.js     # Policy lookup
│   │           ├── workflow.js     # Workflow state definitions
│   │           ├── ai.js           # Mocked AI summarisation
│   │           ├── dashboard.js    # Team leader statistics
│   │           ├── status-check.js # Applicant status lookup
│   │           ├── actions.js      # Interactive workflow actions
│   │           ├── evidence.js     # Evidence tracker endpoint
│   │           ├── export.js       # CSV export endpoint
│   │           ├── activity.js     # Activity feed endpoint
│   │           ├── reassign.js     # Case reassignment endpoint
│   │           ├── search.js       # Full-text case search
│   │           ├── notes.js        # Case notes editor
│   │           ├── analytics.js    # Analytics endpoint
│   │           └── batch.js        # Batch operations
│   └── frontend/
│       ├── package.json
│       ├── public/
│       │   └── govuk/             # GOV.UK Design System assets
│       └── src/
│           ├── App.js             # Router + role-aware GOV.UK layout
│           ├── pages/
│           │   ├── RoleSelector.js     # Landing page with role cards
│           │   ├── CaseList.js         # Main case dashboard
│           │   ├── CreateCase.js       # New case form
│           │   ├── CaseDetail.js       # Individual case view
│           │   ├── CaseCompare.js      # Side-by-side case comparison
│           │   ├── Dashboard.js        # Team leader overview + analytics
│           │   ├── StatusCheck.js      # Applicant status check
│           │   ├── Accessibility.js   # Accessibility statement
│           │   ├── Cookies.js         # Cookie policy
│           │   ├── Feedback.js        # User feedback form
│           │   └── NotFound.js        # GOV.UK 404 page
│           └── components/
│               ├── StatusTag.js
│               ├── AlertBadge.js
│               ├── CaseTypeLabel.js
│               ├── Timeline.js
│               ├── WorkflowVisualisation.js
│               ├── PolicyPanel.js
│               ├── AISummary.js
│               ├── WorkflowActions.js
│               ├── EvidenceTracker.js
│               ├── SlaCountdown.js
│               ├── RelatedCases.js
│               ├── ErrorBoundary.js
│               └── KeyboardShortcuts.js

API endpoints

User journeys

1. Select a role (start here)

Landing page → choose Caseworker, Team leader, or Applicant → redirected to the appropriate view

2. Caseworker reviews their caseload

Cases → filter by team/status → click case → view timeline, policies, alerts → use action buttons to transition state or add notes

3. Caseworker creates a new case

Cases → “Create case” → fill in GOV.UK form → submit → redirected to new case detail

4. Team leader monitors risk

Dashboard → see overdue/at-risk counts → review analytics charts → review escalated cases → reassign workload

5. Applicant checks their case

Check your status → enter reference number (e.g. REF-77291) → see status, what it means, next steps, and estimated timeline

What is mocked vs. what would be real

Design decisions

• GOV.UK Design System throughout — follows established government design patterns for familiarity, consistency, and accessibility
• Role selector — One-click demo experience for judges to switch between all three user types
• Mocked AI — The summarisation endpoint returns realistic pre-written summaries, architected so a real LLM can replace it by changing one function. Summaries include key facts, recommended actions, and risk level
• Deadline calculation — Uses policy thresholds from the workflow state machine, not hardcoded values. Handles partial evidence receipt, reminder, and escalation thresholds
• Interactive actions — In-memory workflow transitions demonstrate the tool’s interactivity without needing a database
• Three user types — Caseworker dashboard, team leader overview, and applicant status check cover all three users named in the brief
• Responsive design — CSS media queries for tablet (768px) and mobile (320px) layouts
• Loading states — GOV.UK-styled spinners for perceived performance during data fetches
• Security headers — Helmet middleware adds Content-Security-Policy, X-Frame-Options, X-Content-Type-Options, and other production security headers out of the box
• Error handling — GOV.UK-styled 404 page with catch-all route and ErrorBoundary for graceful failure recovery
• Accessibility — WCAG 2.2 patterns: skip links, ARIA labels, keyboard navigation, semantic HTML, colour not used as sole indicator

What we’d do next

1. Real AI integration — Replace mocked summaries with Claude API calls, using case timeline + notes + policies as context for truly intelligent case analysis
2. Persistent state — PostgreSQL database for cases, actions, audit trail, and user sessions
3. Authentication & authorisation — GOV.UK One Login for applicants, internal SSO for caseworkers, role-based access control
4. Notification system — Email/SMS alerts for approaching deadlines, case status changes, and applicant updates
5. Document upload — Allow applicants to upload evidence directly through the status check portal
6. Enhanced analytics — Processing time trends, bottleneck identification, and deeper evidence tracking metrics
7. Bulk operations — Expand batch actions with bulk-approve decisions and team capacity planning
8. API versioning — RESTful API with versioning for integration with other government systems
9. Automated policy updates — When policies change, automatically flag affected open cases for re-review

How we built this — fully autonomous AI development

CaseFlow was built entirely by an autonomous AI agent team, with no human writing any code. This is our strongest differentiator for the “how you used AI tools” question.

The team

Both agents are powered by Claude (Anthropic) and coordinated through Paperclip, an AI agent orchestration platform. The human’s role was limited to reviewing pull requests — no code was written manually.

Iteration timeline

Total: 11 iterations, 42 commits, 56 tests, fully autonomous.

How the AI workflow works

1. CEO agent reads the competition brief, identifies the highest-impact features to build next, and writes a structured implementation ticket with clear requirements and constraints
2. CTO agent picks up the ticket, explores the codebase, implements each feature in order, commits after each improvement, and runs all tests
3. CEO agent reviews the output, identifies gaps, and creates the next iteration ticket
4. Repeat until the product is competition-ready

What this demonstrates

• AI agents can plan, implement, test, and iterate on a real product autonomously
• The CEO/CTO split shows AI can handle both strategic thinking (what to build, in what order) and technical execution (writing code, testing, debugging)
• 11 iteration cycles show the agents can build incrementally — each version extends the last without breaking existing functionality
• The autonomous workflow is reproducible — the same agent team could build another product from a different brief

License

MIT