Who it is for
Support leads running live chat with an AI agent.
What it does
- AI usage is metered in plain view, with an alert before it reaches the limit.
- The AI agent hands the chat to a person when it should.
- Conversations reach your phone when nobody is at the desk.
How we built it
ArcLayer did the product design, the design system and the engineering. AI agents wrote code and tests against Gripz’s design system, and a person reviewed each change before it merged.
Build note: Keeping AI usage costs visible inside a product
How we work on Gripz
Tokens come from the design file
Theme tokens are generated from the Paper design file, and screens are compared pixel by pixel with the design exports.
One command checks everything
A single Turborepo run builds, lints, type-checks and tests every package in the monorepo.
The widget has a size budget
The chat widget build fails if its loader grows past 3 KB, so it stays light on customers’ sites.
Journeys and accessibility are tested
Playwright runs the main journeys against a production build, with axe-core checking accessibility.
Data separation is tested in the database
A SQL test checks that row-level security keeps each customer’s data apart.
Email changes get a dry run
Sign-in emails are built with React Email and pushed to Supabase Auth only after a dry run.