#3

React Review Audit

Openreact-doctor[bot]opened 6mo ago

Score: 95/100 · 2 errors · 14 warnings

Copy as prompt
Fix the following React Review diagnostics in my codebase.

## Errors (2)

1. [error] alt-text — src/modules/shared/components/Sidebar/Sidebar.tsx:17
   Missing `alt` attribute.

2. [error] alt-text — src/modules/shared/components/Sidebar/Sidebar.tsx:17
   Missing `alt` attribute.

## Warnings (14)

3. [warning] no-array-index-as-key — src/modules/shared/routes/index.tsx:27
   Array index "index" used as key — causes bugs when list is reordered or filtered

4. [warning] no-render-in-render — src/app/App.tsx:23
   Inline render function "renderRoutes()" — extract to a separate component for proper reconciliation

5. [warning] click-events-have-key-events — src/modules/dashboard/features/Test.tsx:18
   Enforce a clickable non-interactive element has at least one keyboard event listener.

6. [warning] no-static-element-interactions — src/modules/dashboard/features/Test.tsx:18
   Static HTML elements with event handlers require a role.

7. [warning] click-events-have-key-events — src/modules/shared/components/DropDown/DropDown.tsx:48
   Enforce a clickable non-interactive element has at least one keyboard event listener.

8. [warning] no-static-element-interactions — src/modules/shared/components/DropDown/DropDown.tsx:48
   Static HTML elements with event handlers require a role.

9. [warning] no-default-props — src/modules/shared/components/Button/Button.tsx:67
   Button.defaultProps — React 19 removes `defaultProps` for function components and discourages it for class components. Move defaults into the destructured props parameter (e.g. `function Button({ size = "md", ...rest })`) so the rule applies cleanly to both shapes

10. [warning] click-events-have-key-events — src/modules/shared/components/Navbar/Navbar.tsx:108
   Enforce a clickable non-interactive element has at least one keyboard event listener.

11. [warning] click-events-have-key-events — src/modules/shared/components/Navbar/Navbar.tsx:116
   Enforce a clickable non-interactive element has at least one keyboard event listener.

12. [warning] click-events-have-key-events — src/modules/shared/components/Navbar/Navbar.tsx:125
   Enforce a clickable non-interactive element has at least one keyboard event listener.

13. [warning] no-array-index-as-key — src/modules/shared/components/SidebarItems/SidebarItems.tsx:19
   Array index "index" used as key — causes bugs when list is reordered or filtered

14. [warning] no-default-props — src/modules/shared/components/LazyLoad/LazyLoad.tsx:24
   LazyLoad.defaultProps — React 19 removes `defaultProps` for function components and discourages it for class components. Move defaults into the destructured props parameter (e.g. `function LazyLoad({ size = "md", ...rest })`) so the rule applies cleanly to both shapes

15. [warning] click-events-have-key-events — src/modules/shared/components/Input/Input.tsx:69
   Enforce a clickable non-interactive element has at least one keyboard event listener.

16. [warning] no-default-props — src/modules/shared/components/Input/Input.tsx:90
   Input.defaultProps — React 19 removes `defaultProps` for function components and discourages it for class components. Move defaults into the destructured props parameter (e.g. `function Input({ size = "md", ...rest })`) so the rule applies cleanly to both shapes

❌ Errors (2)

alt-text

Missing alt attribute.

Must have alt prop, either with meaningful text, or an empty string for decorative images.

src/modules/shared/components/Sidebar/Sidebar.tsx:17
src/modules/shared/components/Sidebar/Sidebar.tsx:17


⚠️ Warnings (14)

click-events-have-key-events

Enforce a clickable non-interactive element has at least one keyboard event listener.

Visible, non-interactive elements with click handlers must have one of keyup, keydown, or keypress listener.

src/modules/dashboard/features/Test.tsx:18
src/modules/shared/components/DropDown/DropDown.tsx:48
src/modules/shared/components/Navbar/Navbar.tsx:108
src/modules/shared/components/Navbar/Navbar.tsx:116
src/modules/shared/components/Navbar/Navbar.tsx:125
src/modules/shared/components/Input/Input.tsx:69

no-default-props

Button.defaultProps — React 19 removes defaultProps for function components and discourages it for class components. Move defaults into the destructured props parameter (e.g. function Button({ size = "md", ...rest })) so the rule applies cleanly to both shapes

React 19 removes Component.defaultProps for function components. Move the defaults into the destructured props parameter: function Foo({ size = "md", variant = "primary" }) instead of Foo.defaultProps = { size: "md", variant: "primary" }.

src/modules/shared/components/Button/Button.tsx:67
src/modules/shared/components/LazyLoad/LazyLoad.tsx:24
src/modules/shared/components/Input/Input.tsx:90

no-array-index-as-key

Array index "index" used as key — causes bugs when list is reordered or filtered

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

src/modules/shared/routes/index.tsx:27
src/modules/shared/components/SidebarItems/SidebarItems.tsx:19

no-static-element-interactions

Static HTML elements with event handlers require a role.

Add a role attribute to this element, or use a semantic HTML element instead.

src/modules/dashboard/features/Test.tsx:18
src/modules/shared/components/DropDown/DropDown.tsx:48

no-render-in-render

Inline render function "renderRoutes()" — extract to a separate component for proper reconciliation

Extract to a named component: const ListItem = ({ item }) => <div>{item.name}</div>

src/app/App.tsx:23


Last scored May 14, 2026 at 7:35 AM UTC. Maintained by React Review.

Activity

0

No activity yet.