refactor(react-hooks): enable stricter effect rules

Turn on react-hooks/set-state-in-effect and react-hooks/incompatible-library, then remove effect-driven local state sync patterns across affected pages. Keep behavior stable by deriving values from source state, remounting tab state by role key, and replacing useForm watch with useWatch.

app/(main)/search/page.tsx

@@ -377,19 +377,15 @@ function SearchPageContent() {
     const game = searchParams.get("game")
     return game ? [game] : []
   })
-  const [priceRange, setPriceRange] = useState<{ min: string; max: string }>({ min: "", max: "" })
+  const [priceRange, setPriceRange] = useState<{ min: string; max: string }>({
+    min: "",
+    max: "",
+  })
   const [onlyOnline, setOnlyOnline] = useState(false)
   const [minRating, setMinRating] = useState("0")
   const [sortBy, setSortBy] = useState("composite")
   const [visibleCount, setVisibleCount] = useState(12)
 
-  useEffect(() => {
-    const q = searchParams.get("q")
-    if (q !== null && q !== searchQuery) {
-      setSearchQuery(q)
-    }
-  }, [searchParams, searchQuery])
-
   useEffect(() => {
     const timer = setTimeout(() => {
       const params = new URLSearchParams(searchParams.toString())