React Review Audit

[reactreview]

❌ 1 error, ⚠️ 22 warnings

Copy as prompt

Fix the following React Review diagnostics in my codebase.

## Errors (1)

1. [error] require-reduced-motion — apps/website/package.json:0
   Project uses a motion library but has no prefers-reduced-motion handling — required for accessibility (WCAG 2.3.3)

## Warnings (22)

2. [warning] exhaustive-deps — apps/demo/src/app.tsx:72
   React Hook `useEffect` is missing dependency `inputValue.trim` — list it in the dependency array, or call the hook unconditionally.

3. [warning] no-array-index-key — apps/demo/src/app.tsx:96
   Array index in `key` doesn't uniquely identify the element — re-renders may use stale state.

4. [warning] no-array-index-as-key — apps/demo/src/app.tsx:96
   Array index "index" used as key — causes bugs when list is reordered or filtered

5. [warning] control-has-associated-label — apps/demo/src/app.tsx:107
   A control must be associated with a text label — add visible text, `aria-label`, or `aria-labelledby`.

6. [warning] button-has-type — apps/demo/src/app.tsx:118
   `<button>` elements must have an explicit `type` attribute.

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

8. [warning] use-lazy-motion — apps/website/app/page.tsx:9
   Import "m" with LazyMotion instead of "motion" — saves ~30kb in bundle size

9. [warning] exhaustive-deps — apps/website/app/page.tsx:261
   React Hook `useEffect` is missing dependency `config` — list it in the dependency array, or call the hook unconditionally.

10. [warning] click-events-have-key-events — apps/website/app/page.tsx:579
   Visible non-interactive elements with click handlers must have a corresponding keyboard listener (`onKeyUp`, `onKeyDown`, or `onKeyPress`).

11. [warning] no-static-element-interactions — apps/website/app/page.tsx:579
   Static HTML elements with event handlers require a role — add `role="…"` or use a semantic HTML element instead.

12. [warning] button-has-type — apps/website/app/page.tsx:596
   `<button>` elements must have an explicit `type` attribute.

13. [warning] no-array-index-key — apps/website/app/page.tsx:758
   Array index in `key` doesn't uniquely identify the element — re-renders may use stale state.

14. [warning] no-array-index-as-key — apps/website/app/page.tsx:758
   Array index "index" used as key — causes bugs when list is reordered or filtered

15. [warning] click-events-have-key-events — apps/website/app/page.tsx:759
   Visible non-interactive elements with click handlers must have a corresponding keyboard listener (`onKeyUp`, `onKeyDown`, or `onKeyPress`).

16. [warning] no-static-element-interactions — apps/website/app/page.tsx:759
   Static HTML elements with event handlers require a role — add `role="…"` or use a semantic HTML element instead.

17. [warning] no-array-index-as-key — apps/website/app/claude-spinner.tsx:38
   Array index "index" used as key — causes bugs when list is reordered or filtered

18. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `class-variance-authority`

19. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `lucide-react`

20. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `pasito`

21. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `torph`

22. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `web-haptics`

23. [warning] unused-dependency — apps/website/package.json:0
   Unused dependency: `zustand`

---

❌ Errors (1)

Project uses a motion library but has no prefers-reduced-motion handling — required for accessibility (WCAG 2.3.3) _{· 1 in 1 file}

_{require-reduced-motion}

Add useReducedMotion() from your animation library, or a @media (prefers-reduced-motion: reduce) CSS query

File	Lines
apps/website/package.json	0

---

⚠️ Warnings (22)

Unused dependency: `class-variance-authority` _{· 6 in 1 file}

_{unused-dependency}

Remove the dependency from package.json if it is genuinely unused.

File	Lines
apps/website/package.json	0, 0, 0, 0, 0, 0

Array index "index" used as key — causes bugs when list is reordered or filtered _{· 3 in 3 files}

_{no-array-index-as-key}

Use a stable unique identifier: key={item.id} or key={item.slug} — index keys break on reorder/filter

File	Lines
apps/demo/src/app.tsx	96
apps/website/app/page.tsx	758
apps/website/app/claude-spinner.tsx	38

React Hook `useEffect` is missing dependency `inputValue.trim` — list it in the dependency array, or call the hook unconditionally. _{· 2 in 2 files}

_{exhaustive-deps}

List every value the hook callback captures in its dependency array.

File	Lines
apps/demo/src/app.tsx	72
apps/website/app/page.tsx	261

Array index in `key` doesn't uniquely identify the element — re-renders may use stale state. _{· 2 in 2 files}

_{no-array-index-key}

Use a stable, data-derived key instead of the array index.

File	Lines
apps/demo/src/app.tsx	96
apps/website/app/page.tsx	758

`<button>` elements must have an explicit `type` attribute. _{· 2 in 2 files}

_{button-has-type}

Set type="button" (or "submit" / "reset") explicitly on every <button>.

File	Lines
apps/demo/src/app.tsx	118
apps/website/app/page.tsx	596

Visible non-interactive elements with click handlers must have a corresponding keyboard listener (`onKeyUp`, `onKeyDown`, or `onKeyPress`). _{· 2 in 1 file}

_{click-events-have-key-events}

Pair onClick with onKeyUp / onKeyDown / onKeyPress for keyboard users.

File	Lines
apps/website/app/page.tsx	579, 759

Static HTML elements with event handlers require a role — add `role="…"` or use a semantic HTML element instead. _{· 2 in 1 file}

_{no-static-element-interactions}

Static HTML elements with event handlers require a role, or use a semantic HTML element instead.

File	Lines
apps/website/app/page.tsx	579, 759

A control must be associated with a text label — add visible text, `aria-label`, or `aria-labelledby`. _{· 1 in 1 file}

_{control-has-associated-label}

Every interactive control must have an accessible label.

File	Lines
apps/demo/src/app.tsx	107

Page without metadata or generateMetadata export — hurts SEO _{· 1 in 1 file}

_{nextjs-missing-metadata}

Add export const metadata = { title: '...', description: '...' } or export async function generateMetadata()

File	Lines
apps/website/app/page.tsx	6

Import "m" with LazyMotion instead of "motion" — saves ~30kb in bundle size _{· 1 in 1 file}

_{use-lazy-motion}

Use import { LazyMotion, m } from "framer-motion" with domAnimation features — saves ~30kb

File	Lines
apps/website/app/page.tsx	9

---

^{Reviewed by reactreview for commit b47aab7. Configure here.}