Case study · Enterprise SaaS
Compito
A professional-services and accounting platform that replaces spreadsheets and email threads with one system of record — client data, projects, documents and QuickBooks all in sync.
Role
Senior UI Engineer
Senior UI/UX Designer
Timeline
Ongoing platform
modernization
Stack
Angular · PrimeNG
SignalR
Industry
Accounting &
professional services
16 → 21
Angular versions upgraded without a rewrite, keeping the product shipping throughout.
1 system
Client records, projects, documents, time and QuickBooks data unified from five disconnected tools.
7-1
SCSS architecture and a reusable component library replacing one-off, duplicated styling.
The problem
Accounting firms were running client work across five disconnected tools: client details in one system, project deadlines in another, billable time in a spreadsheet, source documents in email, and QuickBooks off to the side as the real system of record.
That split cost staff time, created version-control chaos around client files, and left managers unable to see engagement health at a glance. Compito needed to become the single place firms actually worked from — not another tool bolted on top.
What it does
QuickBooks Online sync
Client accounting data connects via OAuth2 — no manual re-entry, no reconciliation by hand.
Projects & tasks
Structured engagement workspaces with assignment, status tracking, and printable task views.
Document management
A centralized file repository tied to the right client and project — not scattered across inboxes.
Time tracking & reports
Billable time capture feeds directly into reporting for real-time engagement visibility.
Role-based access
Navigation and permissions adapt automatically by role — staff, manager, or admin.
Global search
Cross-module search and quick task previews for fast access without breaking workflow.
My role
I led UI engineering and design on Compito — modernizing the Angular foundation, migrating the component library to PrimeNG, and building the shared component system the rest of the product runs on.
- • Upgraded the app from Angular 16 to Angular 21 without disrupting active feature work
- • Migrated the UI from Angular Material to PrimeNG with a custom theme preset
- • Restructured styling into a 7-1 SCSS architecture with light/dark mode support
- • Built the global search, task preview/print views, and reusable component library
- • Implemented role-based route guards and the authentication interceptor pipeline
- • Built the QuickBooks Online OAuth integration end to end
Key decisions
OAuth without breaking the SPA
QuickBooks' OAuth2 redirect could easily blow away router state. I built a dedicated callback route with popup-based authorization, so users land back on the exact client record they started from — fully synced.
Fixing overlays app-wide, once
PrimeNG overlays (date pickers, dropdowns) were rendering behind modals. Instead of patching z-index component by component, I raised the overlay layer once in the theme config — the fix now applies to every dialog automatically, including future ones.
Permissions as configuration, not code
With six-plus feature modules and growing, I standardized access control around a single declarative `featureName` key on each route, so permissions live in one place instead of being re-implemented per component.
Outcome
Compito replaced five disconnected tools with one role-aware platform. Firms sync QuickBooks data automatically, keep documents attached to the right client and project, and get real-time visibility into engagement status — while the modernized Angular foundation and reusable component system mean new features ship faster and stay consistent as the product keeps growing.
Let's talk about your project