component lab
Components
Utility & chrome

CodeDiff

Side-by-side before/after diff with marked lines and a narrator note per hunk. Two columns at ≥ 900px, stacked below.

annotated hunk / the bug the agent found

Removed lines are marked against before, added lines against after. The note narrates the why.

src/middleware/auth.ts ts
Before
1 function auth(req) {
2 const token = req.headers.get('Authorization');
3 return verify(token);
4 }
After
1 function auth(req) {
2 + const token = req.headers.get('Authorization')?.slice(7);
3 + if (!token) throw new UnauthorizedError();
4 return verify(token);
5 }
We were passing 'Bearer <token>' straight into verify() — the scheme prefix was never stripped.
minimal / no filename, no note

Just the two columns. Good for tiny config tweaks that need no narration.

Before
1 retries: 0,
After
1 + retries: 2,