Operations panels · 2026
Panel Adara
An insurance agency's commissions — imported from carrier spreadsheets, settled per agent, governed by roles.
Adara is an insurance agency that settles agent commissions every month. Their panel imports carrier files, applies per-agent rates and turns the result into settlements — behind a login, roles and an invitation flow, with a .NET backend built for the long run.
Client
Adara Ubezpieczenia
Status
In build — frontend on a mocked API, .NET backend in progress
Role
System design · Full frontend build · BFF & API contract · Design system
The numbers.
Every figure here lives in a repository.
- 111 + 149
- commits — frontend and .NET backend repositories
- 45
- mocked API endpoints — the whole panel clicks before the backend ships
- 20
- granular permissions across commissions, settlements, imports and users
- 4
- backend test suites — unit, integration, BFF and architecture tests
- 3 steps
- import wizard — Excel, CSV or PDF up to 10 MB, with preview and mapping
The brief.
Commission month at an insurance agency: carrier spreadsheets arrive, rates differ per agent, and someone has to turn it all into settlements people trust. Adara wanted that pipeline in one panel — imported, calculated, approved.
The frontend runs mock-first: dozens of endpoints are served in the browser, so every workflow — login, imports, rate changes, invitations — clicked long before the backend existed. The .NET 10 backend now grows behind the same contract.
What we built.
Shown as it really renders — no mockups.
Commission configuration
A default rate with per-agent overrides — searchable, sortable, saved in place — so the office manages rates without a developer.
Spreadsheet imports
Excel, CSV or PDF up to 10 MB through a three-step wizard — upload, preview and mapping, result — scoped to carrier, year and month.
Users, roles, invitations
Administrator, manager, agent and view-only access built from 20 granular permissions, with e-mail invitations and account states.
A backend built to last
.NET 10 with a BFF in front and clean architecture inside — four test suites, including architecture tests that keep the layers honest.
More of the work.
Users — roles, statuses, e-mail invitations and last-login times
Login — the navy-and-gold brand panel beside the sign-in card
Role
- System design
- Full frontend build
- BFF & API contract
- Design system
Stack
- React 19
- TypeScript strict
- Vite (Rolldown)
- TanStack Router · Query · Table
- Zustand
- MSW — mock-first dev
- .NET 10 · Aspire
- BFF pattern
- Biome
Worth knowing
- The frontend talks to a BFF only — one origin, one session, no token juggling in the browser.
- Mock mode is a first-class citizen: MSW serves the whole API in the browser, so the client clicks real workflows during weekly reviews.
- Proprietary engagement; shown with the client's brand.