The Challenge
I wanted a piece that shows the parts of B2B SaaS front-end that are actually hard, not another landing page. A workflow-heavy, role-based product slice, with complex validated forms, real server state, and every awkward UI state handled properly: loading, error, empty, and blocked.
The Solution
Two roles, applicant and reviewer, with permission-gated routes. A six-step compliance intake built with React Hook Form and Zod, with conditional fields, cross-step validation, autosave and resume. Real document upload with preview and download, persisted client-side in IndexedDB. A reviewer queue with SLA tracking and optimistic approve, reject, and request-changes. There is no backend: a full mock API runs in the browser via MSW with realistic latency and injectable errors, so every state is genuinely built and demonstrable. Light and dark, responsive, accessible, and tested with Vitest and Playwright. Built in React 19, TypeScript, Vite, Tailwind, and shadcn/Radix, with TanStack Query and Zustand.
The Results
A self-contained demo running live on this site, switchable between both roles with no sign-in. A reference implementation of senior React product engineering, end to end from UX to tested code.