Overview
- Context
- An internal system for CALEBrated Virtual Services, whose remote VA team needed one place to work, report and get paid.
- Industry
- Remote staffing · Virtual assistant services
- Engagement
- End-to-end custom build, in use by the team
- Status
- Internal business system, in use
My role
- Built the app end to end: roles, time cards, presence, boards, chat and payroll
- Took it to production on Vercel with a Postgres database and private file storage
- Fixed the findings of a security review before the team moved in
- Keep improving it from team feedback: pay rules, lunch breaks, screenshot timing
Technical stack
- Next.js
- React
- TypeScript
- Postgres (Neon)
- Drizzle
- Vercel Blob
The client’s problem
A remote VA team needs one place to clock in, share their screen while working, take breaks, report at the end of each shift and get paid on the right hours. Managers need to see who is working right now, and payroll has to come straight from the time cards.
Requirements
- Clock in and out with screen sharing, breaks and lunch
- Show who is working, on break or offline, live
- Keep tasks, boards, team chat and announcements next to the time cards
- Turn each Monday to Sunday week into payroll by pay level
Solution architecture
Each lane is one workflow, in the order it runs.
A work day
- Clock in with screen sharing
- Shown as working, live
- Screenshot every 2 minutes
- Breaks and lunch
- Clock out with an EOD report
- Time card saved
The team
- Admin assigns tasks
- Boards by status
- Team room, channels and direct messages
- Announcements and calendar
Pay week
- Monday to Sunday time cards
- Hours up to the 8-hour shift
- Deductions by pay level
- Gross, deductions and net
- CSV or PDF export
Implementation details
Presence and time
Clock-in requires screen sharing; presence updates live; work screenshots are captured every 2 minutes and stored privately.
Payroll from time cards
Each Monday to Sunday week is computed from the time cards, capped at the shift length, with deductions by pay level, and exported as CSV or PDF.
Production hardening
Postgres on Neon, private blob storage for screenshots and media, and a security review whose findings were fixed before launch.
Screenshots and film
Dashboard (sample data) 
Timesheet with a live shift 
Work screenshots 
Task board 
Payroll by pay week 
Team chat
Select a screenshot to open it at full size.
Testing and quality assurance
- Automated test suite (14 of 14 passing at the time of the screenshots)
- Security review with fixes before the team moved in
The outcome
- Hours, presence, tasks, chat and pay in one app for the team
- Managers see who is working right now
- Payroll comes from the time cards, with exports
Evidence
Screenshots
Taken from a local run with made-up sample data; they show no real people.
Open items
Built but not switched on yet: voice and video calls across networks (needs a TURN server) and email login codes (needs an email service).
Lessons learned
- Build around how the team actually works, then let their feedback drive the next changes.
Related services
Need a system built around how your team works?
Tell me about your process
