diff --git a/.jules/palette.md b/.jules/palette.md new file mode 100644 index 0000000..45a7dad --- /dev/null +++ b/.jules/palette.md @@ -0,0 +1,3 @@ +## 2024-05-18 - Fix Session Drawer Linting & Accessibility +**Learning:** When migrating a setState from `useEffect` to the render phase for optimistic updates, it's easy to forget to add the `aria-label` to form fields if they just have placeholders. Placeholders are not a substitute for `aria-label` or `id`/`htmlFor` for screen readers. +**Action:** Always check form elements for `aria-label` or `id`/`htmlFor` when reviewing Next.js/React code. diff --git a/web/components/session-drawer.tsx b/web/components/session-drawer.tsx index c0f5a25..db61564 100644 --- a/web/components/session-drawer.tsx +++ b/web/components/session-drawer.tsx @@ -109,6 +109,7 @@ export function SessionDrawer({ value={message} onChange={(e) => setMessage(e.target.value)} placeholder="Send a follow-up to steer the agent…" + aria-label="Follow-up message" className="min-h-20 border-zinc-800 bg-zinc-900" />