Add pre-commit hooks for linting and formatting

Set up pre-commit framework with ruff (backend) and ESLint/Prettier/tsc
(frontend) hooks to catch issues locally before CI. Auto-format all
frontend files with Prettier to comply with the new check.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/ShinyEncounterModal.tsx

@@ -24,7 +24,9 @@ interface ShinyEncounterModalProps {
 
 const SPECIAL_METHODS = ['starter', 'gift', 'fossil', 'trade']
 
-function groupByMethod(pokemon: RouteEncounterDetail[]): { method: string; pokemon: RouteEncounterDetail[] }[] {
+function groupByMethod(
+  pokemon: RouteEncounterDetail[]
+): { method: string; pokemon: RouteEncounterDetail[] }[] {
   const groups = new Map<string, RouteEncounterDetail[]>()
   for (const rp of pokemon) {
     const list = groups.get(rp.encounterMethod) ?? []
@@ -50,7 +52,7 @@ export function ShinyEncounterModal({
   const [selectedRouteId, setSelectedRouteId] = useState<number | null>(null)
   const { data: routePokemon, isLoading: loadingPokemon } = useRoutePokemon(
     selectedRouteId,
-    gameId,
+    gameId
   )
 
   const [selectedPokemon, setSelectedPokemon] =
@@ -60,12 +62,12 @@ export function ShinyEncounterModal({
   const [search, setSearch] = useState('')
 
   const filteredPokemon = routePokemon?.filter((rp) =>
-    rp.pokemon.name.toLowerCase().includes(search.toLowerCase()),
+    rp.pokemon.name.toLowerCase().includes(search.toLowerCase())
   )
 
   const groupedPokemon = useMemo(
     () => (filteredPokemon ? groupByMethod(filteredPokemon) : []),
-    [filteredPokemon],
+    [filteredPokemon]
   )
   const hasMultipleGroups = groupedPokemon.length > 1
 
@@ -90,8 +92,10 @@ export function ShinyEncounterModal({
   }
 
   // Only show leaf routes (no children, i.e. routes that aren't parents)
-  const parentIds = new Set(routes.filter(r => r.parentRouteId !== null).map(r => r.parentRouteId))
-  const leafRoutes = routes.filter(r => !parentIds.has(r.id))
+  const parentIds = new Set(
+    routes.filter((r) => r.parentRouteId !== null).map((r) => r.parentRouteId)
+  )
+  const leafRoutes = routes.filter((r) => !parentIds.has(r.id))
 
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center p-4">
@@ -206,11 +210,14 @@ export function ShinyEncounterModal({
                                 {rp.pokemon.name}
                               </span>
                               {SPECIAL_METHODS.includes(rp.encounterMethod) && (
-                                <EncounterMethodBadge method={rp.encounterMethod} />
+                                <EncounterMethodBadge
+                                  method={rp.encounterMethod}
+                                />
                               )}
                               <span className="text-[10px] text-gray-400">
                                 Lv. {rp.minLevel}
-                                {rp.maxLevel !== rp.minLevel && `–${rp.maxLevel}`}
+                                {rp.maxLevel !== rp.minLevel &&
+                                  `–${rp.maxLevel}`}
                               </span>
                             </button>
                           ))}