#1

React Review Audit

Openreact-doctor[bot]opened 6mo ago

Score: 85/100 · 1 error · 135 warnings

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

## Errors (1)

1. [error] jsx-key — src/app/order/component/resturantCard.tsx:32
   Missing "key" prop for element in iterator.

## Warnings (135)

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

3. [warning] react-compiler-destructure-method — src/app/order/[orederId]/component/header.tsx:14
   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

4. [warning] react-compiler-destructure-method — src/app/order/[orederId]/component/header.tsx:27
   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

5. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:93
   Unknown property found

6. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:95
   Unknown property found

7. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:123
   Unknown property found

8. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:125
   Unknown property found

9. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:140
   Unknown property found

10. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:142
   Unknown property found

11. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:157
   Unknown property found

12. [warning] no-unknown-property — src/components/layout/Footer/index.tsx:159
   Unknown property found

13. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:60
   Use of incorrect `href` for the 'a' element.

14. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:65
   Use of incorrect `href` for the 'a' element.

15. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:83
   Use of incorrect `href` for the 'a' element.

16. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:100
   Use of incorrect `href` for the 'a' element.

17. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:113
   Use of incorrect `href` for the 'a' element.

18. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:130
   Use of incorrect `href` for the 'a' element.

19. [warning] anchor-is-valid — src/components/layout/Footer/index.tsx:147
   Use of incorrect `href` for the 'a' element.

20. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:3
   bg-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

21. [warning] nextjs-no-a-element — src/components/layout/Footer/index.tsx:7
   Use next/link instead of <a> for internal links — enables client-side navigation and prefetching

22. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:15
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

23. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:18
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

24. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:18
   text-gray-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

25. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:34
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

26. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:37
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

27. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:37
   text-gray-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

28. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:55
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

29. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:58
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

30. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:58
   text-gray-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

31. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:73
   border-gray-200 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

32. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:73
   border-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

33. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:75
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

34. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:75
   text-gray-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

35. [warning] design-no-space-on-flex-children — src/components/layout/Footer/index.tsx:82
   space-x-5 on a flex/grid parent — use gap-x-5 instead. Per-sibling margins phantom-gap on conditional render and don't mirror in RTL

36. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:85
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

37. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:85
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

38. [warning] design-no-redundant-size-axes — src/components/layout/Footer/index.tsx:87
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

39. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:102
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

40. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:102
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

41. [warning] design-no-redundant-size-axes — src/components/layout/Footer/index.tsx:104
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

42. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:115
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

43. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:115
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

44. [warning] design-no-redundant-size-axes — src/components/layout/Footer/index.tsx:117
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

45. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:132
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

46. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:132
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

47. [warning] design-no-redundant-size-axes — src/components/layout/Footer/index.tsx:134
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

48. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:149
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

49. [warning] design-no-default-tailwind-palette — src/components/layout/Footer/index.tsx:149
   text-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

50. [warning] design-no-redundant-size-axes — src/components/layout/Footer/index.tsx:151
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

51. [warning] design-no-redundant-size-axes — src/app/order/[orederId]/component/ResturantDetailsCard.tsx:24
   w-[33px] h-[33px] → use the shorthand size-[33px] (Tailwind v3.4+)

52. [warning] nextjs-missing-metadata — src/app/order/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

53. [warning] no-gradient-text — src/app/order/page.tsx:43
   Gradient text (bg-clip-text + bg-gradient) is decorative rather than meaningful — a common AI tell. Use solid colors for text

54. [warning] design-no-default-tailwind-palette — src/app/order/page.tsx:43
   via-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

55. [warning] design-no-default-tailwind-palette — src/app/order/page.tsx:43
   to-slate-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

56. [warning] design-no-redundant-size-axes — src/components/theme-toggle.tsx:22
   w-[1.2rem] h-[1.2rem] → use the shorthand size-[1.2rem] (Tailwind v3.4+)

57. [warning] design-no-redundant-size-axes — src/components/theme-toggle.tsx:23
   w-[1.2rem] h-[1.2rem] → use the shorthand size-[1.2rem] (Tailwind v3.4+)

58. [warning] click-events-have-key-events — src/app/order/[orederId]/component/OptionsCards.tsx:24
   Enforce a clickable non-interactive element has at least one keyboard event listener.

59. [warning] click-events-have-key-events — src/app/order/[orederId]/component/OptionsCards.tsx:35
   Enforce a clickable non-interactive element has at least one keyboard event listener.

60. [warning] no-static-element-interactions — src/app/order/[orederId]/component/OptionsCards.tsx:24
   Static HTML elements with event handlers require a role.

61. [warning] no-static-element-interactions — src/app/order/[orederId]/component/OptionsCards.tsx:35
   Static HTML elements with event handlers require a role.

62. [warning] react-compiler-destructure-method — src/app/order/[orederId]/component/OptionsCards.tsx:18
   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

63. [warning] design-no-redundant-size-axes — src/app/order/[orederId]/component/OptionsCards.tsx:24
   w-[200px] h-[200px] → use the shorthand size-[200px] (Tailwind v3.4+)

64. [warning] design-no-default-tailwind-palette — src/app/order/[orederId]/component/OptionsCards.tsx:24
   bg-slate-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

65. [warning] design-no-redundant-size-axes — src/app/order/[orederId]/component/OptionsCards.tsx:31
   w-[45%] h-[45%] → use the shorthand size-[45%] (Tailwind v3.4+)

66. [warning] design-no-redundant-size-axes — src/app/order/[orederId]/component/OptionsCards.tsx:35
   w-[200px] h-[200px] → use the shorthand size-[200px] (Tailwind v3.4+)

67. [warning] design-no-redundant-size-axes — src/app/order/[orederId]/component/OptionsCards.tsx:42
   w-[45%] h-[45%] → use the shorthand size-[45%] (Tailwind v3.4+)

68. [warning] click-events-have-key-events — src/app/order/component/resturantCard.tsx:39
   Enforce a clickable non-interactive element has at least one keyboard event listener.

69. [warning] no-static-element-interactions — src/app/order/component/resturantCard.tsx:39
   Static HTML elements with event handlers require a role.

70. [warning] react-compiler-destructure-method — src/app/order/component/resturantCard.tsx:27
   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

71. [warning] design-no-redundant-size-axes — src/app/order/component/resturantCard.tsx:48
   w-[33px] h-[33px] → use the shorthand size-[33px] (Tailwind v3.4+)

72. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:96
   text-gray-600 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

73. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:135
   text-gray-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

74. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:144
   bg-gray-200 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

75. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:146
   text-gray-600 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

76. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:162
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

77. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:171
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

78. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:180
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

79. [warning] design-no-default-tailwind-palette — src/components/layout/Navbar/index.tsx:189
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

80. [warning] no-array-index-as-key — src/sections/WhyUs/index.tsx:59
   Array index "index" used as key — causes bugs when list is reordered or filtered

81. [warning] design-no-default-tailwind-palette — src/sections/WhyUs/index.tsx:73
   bg-slate-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

82. [warning] no-array-index-as-key — src/sections/WhyUs/index.tsx:85
   Array index "index" used as key — causes bugs when list is reordered or filtered

83. [warning] design-no-default-tailwind-palette — src/sections/WhyUs/index.tsx:99
   bg-slate-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

84. [warning] nextjs-missing-metadata — src/app/order/[orederId]/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

85. [warning] no-gradient-text — src/app/order/[orederId]/page.tsx:35
   Gradient text (bg-clip-text + bg-gradient) is decorative rather than meaningful — a common AI tell. Use solid colors for text

86. [warning] design-no-default-tailwind-palette — src/app/order/[orederId]/page.tsx:35
   via-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

87. [warning] design-no-default-tailwind-palette — src/app/order/[orederId]/page.tsx:35
   to-slate-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

88. [warning] nextjs-missing-metadata — src/app/(site)/page.tsx:1
   Page without metadata or generateMetadata export — hurts SEO

89. [warning] design-no-default-tailwind-palette — src/sections/Testimonials/index.tsx:52
   text-slate-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

90. [warning] no-array-index-as-key — src/sections/Testimonials/index.tsx:60
   Array index "index" used as key — causes bugs when list is reordered or filtered

91. [warning] design-no-default-tailwind-palette — src/sections/Testimonials/index.tsx:74
   text-slate-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

92. [warning] nextjs-no-img-element — src/sections/Testimonials/index.tsx:79
   Use next/image instead of <img> — provides automatic optimization, lazy loading, and responsive srcset

93. [warning] design-no-redundant-size-axes — src/sections/Testimonials/index.tsx:82
   w-[60px] h-[60px] → use the shorthand size-[60px] (Tailwind v3.4+)

94. [warning] design-no-default-tailwind-palette — src/sections/Testimonials/index.tsx:86
   text-slate-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

95. [warning] nextjs-missing-metadata — src/app/order/[orederId]/menu/page.tsx:2
   Page without metadata or generateMetadata export — hurts SEO

96. [warning] no-gradient-text — src/app/order/[orederId]/menu/page.tsx:38
   Gradient text (bg-clip-text + bg-gradient) is decorative rather than meaningful — a common AI tell. Use solid colors for text

97. [warning] design-no-default-tailwind-palette — src/app/order/[orederId]/menu/page.tsx:38
   via-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

98. [warning] design-no-default-tailwind-palette — src/app/order/[orederId]/menu/page.tsx:38
   to-slate-400 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

99. [warning] no-effect-event-handler — src/app/(auth)/sign-in/page.tsx:18
   useEffect simulating an event handler — move logic to an actual event handler instead

100. [warning] nextjs-no-client-side-redirect — src/app/(auth)/sign-in/page.tsx:20
   router.push() in useEffect — use redirect() from next/navigation or handle navigation in an event handler

101. [warning] react-compiler-destructure-method — src/app/(auth)/sign-in/page.tsx:20
   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

102. [warning] design-no-default-tailwind-palette — src/app/(auth)/sign-in/page.tsx:26
   bg-slate-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

103. [warning] design-no-bold-heading — src/app/(auth)/sign-in/page.tsx:29
   font-bold on <h1> crushes counter shapes at display sizes — use font-semibold (600) or font-medium (500)

104. [warning] design-no-default-tailwind-palette — src/app/(auth)/sign-in/page.tsx:30
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

105. [warning] no-array-index-as-key — src/sections/Pricing/index.tsx:61
   Array index "index" used as key — causes bugs when list is reordered or filtered

106. [warning] no-array-index-as-key — src/sections/Pricing/card/index.tsx:33
   Array index "index" used as key — causes bugs when list is reordered or filtered

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

108. [warning] no-cascading-set-state — src/hooks/useUser.tsx:45
   6 setState calls in a single useEffect — consider using useReducer or deriving state

109. [warning] design-no-default-tailwind-palette — src/sections/HowItWorks/index.tsx:24
   text-slate-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

110. [warning] no-array-index-as-key — src/sections/HowItWorks/index.tsx:34
   Array index "index" used as key — causes bugs when list is reordered or filtered

111. [warning] design-no-redundant-size-axes — src/sections/HowItWorks/index.tsx:36
   w-[60px] h-[60px] → use the shorthand size-[60px] (Tailwind v3.4+)

112. [warning] design-no-redundant-size-axes — src/sections/HowItWorks/index.tsx:39
   w-[200px] h-[200px] → use the shorthand size-[200px] (Tailwind v3.4+)

113. [warning] design-no-default-tailwind-palette — src/sections/HowItWorks/index.tsx:39
   bg-slate-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

114. [warning] design-no-default-tailwind-palette — src/sections/HowItWorks/index.tsx:40
   text-slate-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

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

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

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

118. [warning] design-no-bold-heading — src/sections/Header/index.tsx:8
   font-bold on <h1> crushes counter shapes at display sizes — use font-semibold (600) or font-medium (500)

119. [warning] design-no-default-tailwind-palette — src/sections/Header/index.tsx:23
   bg-slate-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

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

121. [warning] no-array-index-as-key — src/sections/Benefits/index.tsx:43
   Array index "index" used as key — causes bugs when list is reordered or filtered

122. [warning] design-no-default-tailwind-palette — src/sections/Benefits/index.tsx:44
   bg-slate-800 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

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

124. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:25
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

125. [warning] design-no-redundant-size-axes — src/components/ui/dropdown-menu.tsx:41
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

126. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:47
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

127. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:63
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

128. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:82
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

129. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:100
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

130. [warning] design-no-redundant-size-axes — src/components/ui/dropdown-menu.tsx:113
   w-3.5 h-3.5 → use the shorthand size-3.5 (Tailwind v3.4+)

131. [warning] design-no-redundant-size-axes — src/components/ui/dropdown-menu.tsx:115
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

132. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:124
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

133. [warning] design-no-redundant-size-axes — src/components/ui/dropdown-menu.tsx:136
   w-3.5 h-3.5 → use the shorthand size-3.5 (Tailwind v3.4+)

134. [warning] design-no-redundant-size-axes — src/components/ui/dropdown-menu.tsx:138
   w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

135. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:146
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

136. [warning] no-react19-deprecated-apis — src/components/ui/dropdown-menu.tsx:164
   forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

❌ Errors (1)

jsx-key

Missing "key" prop for element in iterator.

Add a "key" prop to the element in the iterator (https://react.dev/learn/rendering-lists#keeping-list-items-in-order-with-key).

src/app/order/component/resturantCard.tsx:32


⚠️ Warnings (135)

design-no-default-tailwind-palette

bg-gray-900 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

Replace indigo-* / gray-* / slate-* with project tokens, your brand color, or a less-default neutral (zinc, neutral, stone)

src/components/layout/Footer/index.tsx:3
src/components/layout/Footer/index.tsx:15
src/components/layout/Footer/index.tsx:18
src/components/layout/Footer/index.tsx:18
src/components/layout/Footer/index.tsx:34
src/components/layout/Footer/index.tsx:37
src/components/layout/Footer/index.tsx:37
src/components/layout/Footer/index.tsx:55
src/components/layout/Footer/index.tsx:58
src/components/layout/Footer/index.tsx:58
src/components/layout/Footer/index.tsx:73
src/components/layout/Footer/index.tsx:73
src/components/layout/Footer/index.tsx:75
src/components/layout/Footer/index.tsx:75
src/components/layout/Footer/index.tsx:85
src/components/layout/Footer/index.tsx:85
src/components/layout/Footer/index.tsx:102
src/components/layout/Footer/index.tsx:102
src/components/layout/Footer/index.tsx:115
src/components/layout/Footer/index.tsx:115
src/components/layout/Footer/index.tsx:132
src/components/layout/Footer/index.tsx:132
src/components/layout/Footer/index.tsx:149
src/components/layout/Footer/index.tsx:149
src/app/order/page.tsx:43
src/app/order/page.tsx:43
src/app/order/[orederId]/component/OptionsCards.tsx:24
src/components/layout/Navbar/index.tsx:96
src/components/layout/Navbar/index.tsx:135
src/components/layout/Navbar/index.tsx:144
src/components/layout/Navbar/index.tsx:146
src/components/layout/Navbar/index.tsx:162
src/components/layout/Navbar/index.tsx:171
src/components/layout/Navbar/index.tsx:180
src/components/layout/Navbar/index.tsx:189
src/sections/WhyUs/index.tsx:73
src/sections/WhyUs/index.tsx:99
src/app/order/[orederId]/page.tsx:35
src/app/order/[orederId]/page.tsx:35
src/sections/Testimonials/index.tsx:52
src/sections/Testimonials/index.tsx:74
src/sections/Testimonials/index.tsx:86
src/app/order/[orederId]/menu/page.tsx:38
src/app/order/[orederId]/menu/page.tsx:38
src/app/(auth)/sign-in/page.tsx:26
src/app/(auth)/sign-in/page.tsx:30
src/sections/HowItWorks/index.tsx:24
src/sections/HowItWorks/index.tsx:39
src/sections/HowItWorks/index.tsx:40
src/sections/Header/index.tsx:23
src/sections/Benefits/index.tsx:44

design-no-redundant-size-axes

w-4 h-4 → use the shorthand size-4 (Tailwind v3.4+)

Collapse w-N h-N to size-N (Tailwind v3.4+) when both axes match

src/components/layout/Footer/index.tsx:87
src/components/layout/Footer/index.tsx:104
src/components/layout/Footer/index.tsx:117
src/components/layout/Footer/index.tsx:134
src/components/layout/Footer/index.tsx:151
src/app/order/[orederId]/component/ResturantDetailsCard.tsx:24
src/components/theme-toggle.tsx:22
src/components/theme-toggle.tsx:23
src/app/order/[orederId]/component/OptionsCards.tsx:24
src/app/order/[orederId]/component/OptionsCards.tsx:31
src/app/order/[orederId]/component/OptionsCards.tsx:35
src/app/order/[orederId]/component/OptionsCards.tsx:42
src/app/order/component/resturantCard.tsx:48
src/sections/Testimonials/index.tsx:82
src/sections/HowItWorks/index.tsx:36
src/sections/HowItWorks/index.tsx:39
src/components/ui/dropdown-menu.tsx:41
src/components/ui/dropdown-menu.tsx:113
src/components/ui/dropdown-menu.tsx:115
src/components/ui/dropdown-menu.tsx:136
src/components/ui/dropdown-menu.tsx:138

no-react19-deprecated-apis

forwardRef is no longer needed on React 19+ — refs are regular props on function components; remove forwardRef and pass ref directly

Pass ref as a regular prop on function components — forwardRef is no longer needed in React 19+. Replace useContext(X) with use(X) for branch-aware context reads. Only enabled on projects detected as React 19+.

src/components/ui/button.tsx:43
src/hooks/useUser.tsx:1
src/components/ui/tabs.tsx:10
src/components/ui/tabs.tsx:25
src/components/ui/tabs.tsx:40
src/components/ui/switch.tsx:8
src/components/ui/separator.tsx:8
src/components/ui/dropdown-menu.tsx:25
src/components/ui/dropdown-menu.tsx:47
src/components/ui/dropdown-menu.tsx:63
src/components/ui/dropdown-menu.tsx:82
src/components/ui/dropdown-menu.tsx:100
src/components/ui/dropdown-menu.tsx:124
src/components/ui/dropdown-menu.tsx:146
src/components/ui/dropdown-menu.tsx:164

no-unknown-property

Unknown property found

Use 'fillRule' instead

src/components/layout/Footer/index.tsx:93
src/components/layout/Footer/index.tsx:95
src/components/layout/Footer/index.tsx:123
src/components/layout/Footer/index.tsx:125
src/components/layout/Footer/index.tsx:140
src/components/layout/Footer/index.tsx:142
src/components/layout/Footer/index.tsx:157
src/components/layout/Footer/index.tsx:159

anchor-is-valid

Use of incorrect href for the 'a' element.

Provide a correct href for the a element.

src/components/layout/Footer/index.tsx:60
src/components/layout/Footer/index.tsx:65
src/components/layout/Footer/index.tsx:83
src/components/layout/Footer/index.tsx:100
src/components/layout/Footer/index.tsx:113
src/components/layout/Footer/index.tsx:130
src/components/layout/Footer/index.tsx:147

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/sections/WhyUs/index.tsx:59
src/sections/WhyUs/index.tsx:85
src/sections/Testimonials/index.tsx:60
src/sections/Pricing/index.tsx:61
src/sections/Pricing/card/index.tsx:33
src/sections/HowItWorks/index.tsx:34
src/sections/Benefits/index.tsx:43

react-compiler-destructure-method

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

Destructure the method up front: const { push } = useRouter() then call push(...) directly — clearer dependency graph and easier for React Compiler to memoize

src/app/order/[orederId]/component/header.tsx:14
src/app/order/[orederId]/component/header.tsx:27
src/app/order/[orederId]/component/OptionsCards.tsx:18
src/app/order/component/resturantCard.tsx:27
src/app/(auth)/sign-in/page.tsx:20

nextjs-missing-metadata

Page without metadata or generateMetadata export — hurts SEO

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

src/app/order/page.tsx:1
src/app/order/[orederId]/page.tsx:1
src/app/(site)/page.tsx:1
src/app/order/[orederId]/menu/page.tsx:2

no-gradient-text

Gradient text (bg-clip-text + bg-gradient) is decorative rather than meaningful — a common AI tell. Use solid colors for text

Use solid text colors for readability. If you need emphasis, use font weight, size, or a distinct color instead of gradients

src/app/order/page.tsx:43
src/app/order/[orederId]/page.tsx:35
src/app/order/[orederId]/menu/page.tsx:38

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/app/order/[orederId]/component/OptionsCards.tsx:24
src/app/order/[orederId]/component/OptionsCards.tsx:35
src/app/order/component/resturantCard.tsx:39

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/app/order/[orederId]/component/OptionsCards.tsx:24
src/app/order/[orederId]/component/OptionsCards.tsx:35
src/app/order/component/resturantCard.tsx:39

design-no-bold-heading

font-bold on <h1> crushes counter shapes at display sizes — use font-semibold (600) or font-medium (500)

Use font-semibold (600) or font-medium (500) on headings — 700+ crushes letter counter shapes at display sizes

src/app/(auth)/sign-in/page.tsx:29
src/sections/Header/index.tsx:8

nextjs-no-a-element

Use next/link instead of <a> for internal links — enables client-side navigation and prefetching

import Link from 'next/link' — enables client-side navigation, prefetching, and preserves scroll position

src/components/layout/Footer/index.tsx:7

design-no-space-on-flex-children

space-x-5 on a flex/grid parent — use gap-x-5 instead. Per-sibling margins phantom-gap on conditional render and don't mirror in RTL

Use gap-* on the flex/grid parent. space-x-* / space-y-* produce phantom gaps when a sibling is conditionally rendered, lose vertical spacing on wrapped lines, and don't mirror in RTL

src/components/layout/Footer/index.tsx:82

nextjs-no-img-element

Use next/image instead of <img> — provides automatic optimization, lazy loading, and responsive srcset

import Image from 'next/image' — provides automatic WebP/AVIF, lazy loading, and responsive srcset

src/sections/Testimonials/index.tsx:79

no-effect-event-handler

useEffect simulating an event handler — move logic to an actual event handler instead

Move the conditional logic into onClick, onChange, or onSubmit handlers directly

src/app/(auth)/sign-in/page.tsx:18

nextjs-no-client-side-redirect

router.push() in useEffect — use redirect() from next/navigation or handle navigation in an event handler

Avoid redirects inside useEffect. Use an event handler, middleware, or server-side redirect (App Router: redirect() from next/navigation; Pages Router: getServerSideProps redirect)

src/app/(auth)/sign-in/page.tsx:20

no-cascading-set-state

6 setState calls in a single useEffect — consider using useReducer or deriving state

Combine into useReducer: const [state, dispatch] = useReducer(reducer, initialState)

src/hooks/useUser.tsx:45


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

Activity

0

No activity yet.