fix: migrate react-router to v8 and patch postcss advisory

client/web/package.json

@@ -50,12 +50,12 @@
     "lucide-react": "^0.562.0",
     "next-themes": "^0.4.6",
     "qrcode.react": "^4.2.0",
-    "react": "^19.2.0",
+    "react": "^19.2.7",
     "react-day-picker": "^9.13.0",
-    "react-dom": "^19.2.0",
+    "react-dom": "^19.2.7",
     "react-hook-form": "^7.71.1",
     "react-resizable-panels": "^4.4.1",
-    "react-router-dom": "^7.12.0",
+    "react-router": "^8.3.0",
     "recharts": "^2.15.4",
     "sonner": "^2.0.7",
     "supertokens-auth-react": "^0.51.1",
@@ -87,7 +87,7 @@
     "vite-plugin-pwa": "^1.2.0"
   },
   "overrides": {
-    "postcss": "^8.4.38",
+    "postcss": "^8.5.18",
     "semver": "^7.5.2",
     "minimatch": "^10.2.1"
   }

client/web/src/components/AdminPortalButton.tsx

@@ -1,5 +1,5 @@
 import { ShieldCheck } from "lucide-react";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 
 import { useIsMobile } from "@/shared/hooks";
 import { useUserStore } from "@/shared/stores";

client/web/src/components/ErrorPage.tsx

@@ -1,9 +1,5 @@
 import { ArrowLeft, Home } from "lucide-react";
-import {
-  isRouteErrorResponse,
-  useNavigate,
-  useRouteError,
-} from "react-router-dom";
+import { isRouteErrorResponse, useNavigate, useRouteError } from "react-router";
 
 import { Button } from "@/components/ui/button";
 

client/web/src/layouts/AdminLayout.tsx

@@ -1,5 +1,5 @@
 import { ChevronLeft } from "lucide-react";
-import { Outlet, useNavigate } from "react-router-dom";
+import { Outlet, useNavigate } from "react-router";
 
 import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar";
 import { AppSidebar } from "@/pages/admin/_shared";

client/web/src/layouts/HackerLayout.tsx

@@ -1,6 +1,6 @@
 import type { LucideIcon } from "lucide-react";
 import { Bell, CalendarDays, House, ScanLine, User } from "lucide-react";
-import { NavLink, Outlet, useLocation } from "react-router-dom";
+import { NavLink, Outlet, useLocation } from "react-router";
 
 import {
   Sidebar,

client/web/src/main.tsx

@@ -1,7 +1,7 @@
 import "./index.css";
 
 import ReactDOM from "react-dom/client";
-import { RouterProvider } from "react-router-dom";
+import { RouterProvider } from "react-router/dom";
 
 import { initSuperTokens } from "@/shared/auth";
 

client/web/src/pages/admin/_shared/AppSidebar.tsx

@@ -14,7 +14,7 @@ import {
   Users,
 } from "lucide-react";
 import * as React from "react";
-import { useLocation } from "react-router-dom";
+import { useLocation } from "react-router";
 
 import { Separator } from "@/components/ui/separator";
 import {

client/web/src/pages/admin/_shared/NavSection.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import type { LucideIcon } from "lucide-react";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 
 import {
   SidebarGroup,

client/web/src/pages/admin/_shared/NavUser.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { ChevronsUpDown, Eye, LogOut, ShieldCheck } from "lucide-react";
-import { useLocation, useNavigate } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router";
 import Session from "supertokens-auth-react/recipe/session";
 
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";

client/web/src/pages/admin/_shared/grading/GradingPageLayout.tsx

@@ -1,6 +1,6 @@
 import { ArrowLeft, ChevronLeft, ChevronRight } from "lucide-react";
 import type { ReactNode } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";

client/web/src/pages/admin/_shared/grading/useGradingKeyboardShortcuts.ts

@@ -1,5 +1,5 @@
 import { useEffect } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 interface UseGradingKeyboardShortcutsOptions {
   disabled: boolean;

client/web/src/pages/admin/reviews/ReviewsPage.tsx

@@ -1,6 +1,6 @@
 import { ClipboardPen, X } from "lucide-react";
 import { useCallback, useEffect, useRef, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import {

client/web/src/pages/admin/reviews/grading/GradingPage.tsx

@@ -1,6 +1,6 @@
 import { ArrowLeft } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
-import { useNavigate, useSearchParams } from "react-router-dom";
+import { useNavigate, useSearchParams } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import {

client/web/src/pages/hacker/ApplyPage.tsx

@@ -1,4 +1,4 @@
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import { ApplicationWizard } from "@/pages/hacker/apply/components/ApplicationWizard";

client/web/src/pages/hacker/DashboardPage.tsx

@@ -1,4 +1,4 @@
-import { Link, useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router";
 import { signOut } from "supertokens-auth-react/recipe/session";
 
 import { Button } from "@/components/ui/button";

client/web/src/pages/hacker/StatusPage.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";

client/web/src/pages/hacker/apply/components/ApplicationWizard.tsx

@@ -2,7 +2,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { AlertCircle } from "lucide-react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { FormProvider, useForm } from "react-hook-form";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
 import { Input } from "@/components/ui/input";

client/web/src/pages/hacker/dashboard/DashboardPage.tsx

@@ -1,7 +1,7 @@
 import type { LucideIcon } from "lucide-react";
 import { BookOpen, ChevronRight, Mail, MessageSquare } from "lucide-react";
 import { useEffect, useState } from "react";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 
 import { getRequest } from "@/shared/lib/api";
 import type {

client/web/src/pages/hacker/faq/FAQPage.tsx

@@ -1,6 +1,6 @@
 import { ChevronLeft } from "lucide-react";
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import {
   Accordion,

client/web/src/pages/hacker/hacker-pack/HackerPackPage.tsx

@@ -1,6 +1,6 @@
 import { ChevronLeft, ExternalLink } from "lucide-react";
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Skeleton } from "@/components/ui/skeleton";
 

client/web/src/pages/hacker/profile/ProfilePage.tsx

@@ -8,7 +8,7 @@ import {
   Upload,
 } from "lucide-react";
 import { type ChangeEvent, useEffect, useRef, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 import { toast } from "sonner";
 import { signOut } from "supertokens-auth-react/recipe/session";
 

client/web/src/pages/hacker/status/StatusPage.tsx

@@ -1,7 +1,7 @@
 import { format, parseISO } from "date-fns";
 import { ChevronLeft, ChevronRight, Eye } from "lucide-react";
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";

client/web/src/pages/public/AuthCallbackPage.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 import Session, { signOut } from "supertokens-auth-react/recipe/session";
 import { redirectToThirdPartyLogin } from "supertokens-auth-react/recipe/thirdparty";
 

client/web/src/pages/public/AuthOAuthCallbackPage.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 import { signInAndUp } from "supertokens-auth-react/recipe/thirdparty";
 
 import { Alert, AlertDescription } from "@/components/ui/alert";

client/web/src/pages/public/AuthVerifyPage.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router";
 import { consumeCode } from "supertokens-auth-react/recipe/passwordless";
 
 import { Button } from "@/components/ui/button";

client/web/src/pages/public/LoginPage.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { Navigate } from "react-router-dom";
+import { Navigate } from "react-router";
 import { createCode } from "supertokens-auth-react/recipe/passwordless";
 import { useSessionContext } from "supertokens-auth-react/recipe/session";
 import { redirectToThirdPartyLogin } from "supertokens-auth-react/recipe/thirdparty";