React Review Audit

Fix the following React Review diagnostics in my codebase.

## Errors (4)

1. [error] rules-of-hooks — apps/web/app/threads/[id]/_components/RightSidebar.tsx:182
   React Hook "useRef" is called conditionally. React Hooks must be called in the exact same order in every component render.

2. [error] rules-of-hooks — apps/web/app/threads/[id]/_components/RightSidebar.tsx:183
   React Hook "useState" is called conditionally. React Hooks must be called in the exact same order in every component render.

3. [error] rules-of-hooks — apps/web/app/threads/[id]/_components/RightSidebar.tsx:184
   React Hook "useState" is called conditionally. React Hooks must be called in the exact same order in every component render.

4. [error] rules-of-hooks — apps/web/app/threads/[id]/_components/RightSidebar.tsx:186
   React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render.

## Warnings (74)

5. [warning] no-react19-deprecated-apis — apps/web/src/components/ui/animated-beam-logos.tsx:3
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

6. [warning] nextjs-missing-metadata — apps/web/app/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

7. [warning] prefer-useReducer — apps/web/app/threads/[id]/thread-detail-client.tsx:39
   Component "ThreadDetailClient" has 7 useState calls — consider useReducer for related state

8. [warning] no-giant-component — apps/web/app/threads/[id]/thread-detail-client.tsx:39
   Component "ThreadDetailClient" is 345 lines — consider breaking it into smaller focused components

9. [warning] react-compiler-destructure-method — apps/web/app/threads/[id]/thread-detail-client.tsx:233
   Destructure for clarity: `const { back } = useRouter()` then call `back(...)` directly — easier for React Compiler to memoize and clearer about which methods this component depends on

10. [warning] react-compiler-destructure-method — apps/web/app/threads/[id]/thread-detail-client.tsx:284
   Destructure for clarity: `const { push } = useRouter()` then call `push(...)` directly — easier for React Compiler to memoize and clearer about which methods this component depends on

11. [warning] nextjs-missing-metadata — apps/web/app/devices/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

12. [warning] nextjs-missing-metadata — apps/web/app/threads/[id]/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

13. [warning] no-autofocus — apps/web/app/devices/devices-client.tsx:142
   The `autoFocus` attribute is found here, which can cause usability issues for sighted and non-sighted users.

14. [warning] rendering-hydration-mismatch-time — apps/web/app/devices/devices-client.tsx:47
   Date.now() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

15. [warning] rendering-hydration-mismatch-time — apps/web/app/devices/devices-client.tsx:47
   Date.now() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

16. [warning] no-danger — apps/web/src/components/ai-elements/code-view.tsx:183
   Do not use `dangerouslySetInnerHTML` prop

17. [warning] js-set-map-lookups — apps/web/src/components/ai-elements/code-view.tsx:295
   array.includes() in a loop is O(n) per call — convert to a Set for O(1) lookups

18. [warning] js-combine-iterations — apps/web/src/components/ai-elements/code-view.tsx:307
   .map().filter() iterates the array twice — combine into a single loop with .reduce() or for...of

19. [warning] no-long-transition-duration — apps/web/app/threads/[id]/_components/TodoPanel.tsx:151
   1500ms transition is too slow for UI feedback — keep transitions under 1000ms. Use longer durations only for page-load hero animations

20. [warning] no-react19-deprecated-apis — apps/web/src/components/right-sidebar-context.tsx:3
   useContext is superseded by `use()` on React 19+ — `use()` reads context conditionally inside hooks, branches, and loops; switch to `import { use } from 'react'`

21. [warning] prefer-use-effect-event — apps/web/app/threads/[id]/_components/RightSidebar.tsx:101
   "onClose" is read only inside `addEventListener` — wrap it with useEffectEvent and remove it from the dep array so the effect doesn't re-synchronize on every parent render

22. [warning] no-derived-useState — apps/web/app/threads/[id]/_components/RightSidebar.tsx:89
   useState initialized from prop "defaultTab" — if this value should stay in sync with the prop, derive it during render instead

23. [warning] no-effect-event-handler — apps/web/app/threads/[id]/_components/RightSidebar.tsx:91
   useEffect simulating an event handler — move logic to an actual event handler instead

24. [warning] no-cascading-set-state — apps/web/app/threads/[id]/_components/RightSidebar.tsx:264
   4 setState calls in a single useEffect — consider using useReducer or deriving state

25. [warning] design-no-three-period-ellipsis — apps/web/app/threads/[id]/_components/RightSidebar.tsx:403
   Three-period ellipsis ("...") in JSX text — use the actual ellipsis character "…" (or `…`)

26. [warning] rendering-hydration-mismatch-time — apps/web/src/components/landing-page.tsx:94
   new Date() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

27. [warning] prefer-useReducer — apps/web/app/workspaces/workspaces-client.tsx:137
   Component "NewWorkspaceModal" has 5 useState calls — consider useReducer for related state

28. [warning] no-derived-useState — apps/web/app/workspaces/workspaces-client.tsx:235
   useState initialized from prop "workspace" — if this value should stay in sync with the prop, derive it during render instead

29. [warning] no-derived-useState — apps/web/app/workspaces/workspaces-client.tsx:236
   useState initialized from prop "workspace" — if this value should stay in sync with the prop, derive it during render instead

30. [warning] no-react19-deprecated-apis — apps/web/src/components/icons.tsx:90
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

31. [warning] async-await-in-loop — apps/web/app/api/daemon/pair/poll/route.ts:15
   await inside a while-loop runs the calls sequentially — for independent operations, collect them and use `await Promise.all(items.map(...))` to run them concurrently

32. [warning] nextjs-missing-metadata — apps/web/app/workspaces/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

33. [warning] no-array-index-as-key — apps/web/app/threads/[id]/_components/MessageBubble.tsx:110
   Array index "i" used as key — causes bugs when list is reordered or filtered

34. [warning] no-array-index-as-key — apps/web/app/threads/[id]/_components/MessageBubble.tsx:117
   Array index "i" used as key — causes bugs when list is reordered or filtered

35. [warning] js-flatmap-filter — apps/web/app/threads/[id]/_components/MessageBubble.tsx:172
   .map().filter(Boolean) iterates twice — use .flatMap() to transform and filter in a single pass

36. [warning] rendering-hydration-mismatch-time — apps/web/app/threads/threads-client.tsx:50
   new Date() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

37. [warning] rendering-hydration-mismatch-time — apps/web/app/threads/threads-client.tsx:50
   new Date() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

38. [warning] rendering-hydration-mismatch-time — apps/web/app/threads/threads-client.tsx:50
   new Date() reachable from JSX renders differently on server vs client — wrap in useEffect+useState (client-only) or add suppressHydrationWarning to the parent if intentional

39. [warning] js-batch-dom-css — apps/web/app/threads/[id]/_components/Composer.tsx:65
   Multiple sequential element.style assignments — batch with cssText or classList for fewer reflows

40. [warning] no-prevent-default — apps/web/app/threads/[id]/_components/Composer.tsx:158
   preventDefault() on <form> onSubmit — form won't work without JavaScript. Consider using a server action for progressive enhancement

41. [warning] react-compiler-destructure-method — apps/web/src/components/auth-layout.tsx:56
   Destructure for clarity: `const { push } = useRouter()` then call `push(...)` directly — easier for React Compiler to memoize and clearer about which methods this component depends on

42. [warning] no-generic-handler-names — apps/web/src/components/auth-layout.tsx:65
   Non-descriptive handler name "handleClick" — name should describe what it does, not when it runs

43. [warning] nextjs-missing-metadata — apps/web/app/threads/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

44. [warning] nextjs-missing-metadata — apps/web/app/sign-up/[[...sign-up]]/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

45. [warning] label-has-associated-control — apps/web/src/components/app-shell/sidebar.tsx:400
   A form label must be associated with a control.

46. [warning] label-has-associated-control — apps/web/src/components/app-shell/sidebar.tsx:494
   A form label must be associated with a control.

47. [warning] label-has-associated-control — apps/web/src/components/app-shell/sidebar.tsx:510
   A form label must be associated with a control.

48. [warning] label-has-associated-control — apps/web/src/components/app-shell/sidebar.tsx:521
   A form label must be associated with a control.

49. [warning] prefer-useReducer — apps/web/src/components/app-shell/sidebar.tsx:43
   Component "AppSidebar" has 5 useState calls — consider useReducer for related state

50. [warning] rerender-state-only-in-handlers — apps/web/src/components/app-shell/sidebar.tsx:51
   useState "searchOpen" is updated but never read in the component's return — use useRef so updates don't trigger re-renders

51. [warning] js-combine-iterations — apps/web/src/components/app-shell/sidebar.tsx:77
   .filter().map() iterates the array twice — combine into a single loop with .reduce() or for...of

52. [warning] no-effect-chain — apps/web/src/components/app-shell/sidebar.tsx:366
   useEffect reacts to "wsId" which is set by another useEffect — chains of effects add an extra render per link and become rigid as code evolves. Compute what you can during render and write all related state inside the event handler that originally fires the chain

53. [warning] react-compiler-destructure-method — apps/web/src/components/app-shell/sidebar.tsx:385
   Destructure for clarity: `const { push } = useRouter()` then call `push(...)` directly — easier for React Compiler to memoize and clearer about which methods this component depends on

54. [warning] no-cascading-set-state — apps/web/src/components/app-shell/sidebar.tsx:463
   3 setState calls in a single useEffect — consider using useReducer or deriving state

55. [warning] no-effect-event-handler — apps/web/src/components/app-shell/sidebar.tsx:463
   useEffect simulating an event handler — move logic to an actual event handler instead

56. [warning] design-no-em-dash-in-jsx-text — apps/web/src/components/ai-elements/tool-call.tsx:129
   Em dash (—) in JSX text reads as model output — replace with comma, colon, semicolon, or parentheses

57. [warning] nextjs-missing-metadata — apps/web/app/sign-in/[[...sign-in]]/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

58. [warning] no-redundant-roles — apps/web/src/components/ai-elements/timeline.tsx:387
   The `ol` element has an implicit role of `list`. Defining this explicitly is redundant and should be avoided.

59. [warning] use-lazy-motion — apps/web/src/components/ai-elements/timeline.tsx:3
   Import "m" with LazyMotion instead of "motion" — saves ~30kb in bundle size

60. [warning] js-set-map-lookups — apps/web/src/components/ai-elements/timeline.tsx:461
   array.includes() in a loop is O(n) per call — convert to a Set for O(1) lookups

61. [warning] design-no-em-dash-in-jsx-text — apps/web/src/components/ai-elements/timeline.tsx:763
   Em dash (—) in JSX text reads as model output — replace with comma, colon, semicolon, or parentheses

62. [warning] prefer-use-effect-event — apps/web/src/components/ai-elements/response.tsx:48
   "onClose" is read only inside `addEventListener` — wrap it with useEffectEvent and remove it from the dep array so the effect doesn't re-synchronize on every parent render

63. [warning] no-effect-event-handler — apps/web/src/components/ai-elements/response.tsx:50
   useEffect simulating an event handler — move logic to an actual event handler instead

64. [warning] no-danger — apps/web/src/components/ai-elements/grep-code-view.tsx:75
   Do not use `dangerouslySetInnerHTML` prop

65. [warning] no-react19-deprecated-apis — apps/web/src/components/ui/matrix.tsx:422
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

66. [warning] async-await-in-loop — apps/web/app/api/daemon/runs/pending/route.ts:19
   await inside a while-loop runs the calls sequentially — for independent operations, collect them and use `await Promise.all(items.map(...))` to run them concurrently

67. [warning] no-react19-deprecated-apis — apps/web/src/components/ui/terminal.tsx:6
   useContext is superseded by `use()` on React 19+ — `use()` reads context conditionally inside hooks, branches, and loops; switch to `import { use } from 'react'`

68. [warning] use-lazy-motion — apps/web/src/components/ui/terminal.tsx:14
   Import "m" with LazyMotion instead of "motion" — saves ~30kb in bundle size

69. [warning] rerender-state-only-in-handlers — apps/web/src/components/ui/terminal.tsx:140
   useState "started" is updated but never read in the component's return — use useRef so updates don't trigger re-renders

70. [warning] no-cascading-set-state — apps/web/src/components/ui/terminal.tsx:162
   3 setState calls in a single useEffect — consider using useReducer or deriving state

71. [warning] no-array-index-as-key — apps/web/src/components/ui/terminal.tsx:266
   Array index "index" used as key — causes bugs when list is reordered or filtered

72. [warning] design-no-redundant-size-axes — apps/web/src/components/ui/terminal.tsx:282
   w-2 h-2 → use the shorthand size-2 (Tailwind v3.4+)

73. [warning] design-no-redundant-size-axes — apps/web/src/components/ui/terminal.tsx:283
   w-2 h-2 → use the shorthand size-2 (Tailwind v3.4+)

74. [warning] design-no-redundant-size-axes — apps/web/src/components/ui/terminal.tsx:284
   w-2 h-2 → use the shorthand size-2 (Tailwind v3.4+)

75. [warning] no-react19-deprecated-apis — apps/web/src/components/ui/sidebar.tsx:48
   useContext is superseded by `use()` on React 19+ — `use()` reads context conditionally inside hooks, branches, and loops; switch to `import { use } from 'react'`

76. [warning] no-derived-useState — apps/web/src/components/ui/sidebar.tsx:74
   useState initialized from prop "defaultOpen" — if this value should stay in sync with the prop, derive it during render instead

77. [warning] no-inline-exhaustive-style — apps/web/src/lib/dotmatrix-core.tsx:784
   8 inline style properties — extract to a CSS class, CSS module, or styled component for maintainability and reuse

78. [warning] use-lazy-motion — apps/web/src/components/ui/animated-beam.tsx:3
   Import "m" with LazyMotion instead of "motion" — saves ~30kb in bundle size