Refactoring UI

[dacsang97]

• Upgrade to Tailwind 4 & Shadcn UI latest
• Migrate from React Router Dom v6 to Tanstack Router
• Use Tanstack Query for better API handle, modernized data loading architecture by implementing Suspense and prefetch patterns

[Copilot]

Pull Request Overview

Refactors the web app to adopt Tailwind CSS v4 and the latest shadcn UI stack, migrates routing from React Router DOM v6 to TanStack Router, and introduces TanStack Query with Suspense/prefetch patterns to modernize data loading. Key changes include replacing page components with file-based route modules, adding comprehensive query option layers per domain, and overhauling styling tokens and primitives in the design system.

• Migration to TanStack Router with generated route tree and auth-aware layouts
• Introduction of granular query option modules with Suspense-ready hooks and prefetch logic
• Replacement/removal of legacy UI primitives and addition of skeleton loading components for deferred UX

Reviewed Changes

Copilot reviewed 138 out of 147 changed files in this pull request and generated 23 comments.

Show a summary per file

File	Description
apps/web/src/services/domain.service.ts	Added pagination/search params and refactored installation status fetch using shared api client
apps/web/src/services/auth.service.ts	Added transitional comments for TanStack Query hook strategy
apps/web/src/routes/login.tsx	New login route with auth redirect logic
apps/web/src/routes/_auth/users.tsx	Authenticated users route with background prefetch
apps/web/src/routes/_auth/ssl.tsx	SSL management route with prefetch
apps/web/src/routes/_auth/performance.tsx	Performance route prefetching multiple datasets
apps/web/src/routes/_auth/nodes.tsx	Nodes route scaffold
apps/web/src/routes/_auth/modsecurity.tsx	ModSecurity route with Suspense wrapper
apps/web/src/routes/_auth/logs.tsx	Logs route prefetching list/statistics/domains
apps/web/src/routes/_auth/index.tsx	Redirect index under auth to dashboard
apps/web/src/routes/_auth/domains.tsx	Domains route with default query prefetch
apps/web/src/routes/_auth/dashboard.tsx	Dashboard route prefetching metrics and alerts
apps/web/src/routes/_auth/backup.tsx	Backup route scaffold
apps/web/src/routes/_auth/alerts.tsx	Alerts route with notification + rules prefetch
apps/web/src/routes/_auth/acl.tsx	ACL route with rule prefetch
apps/web/src/routes/_auth/account.tsx	Account settings route scaffold
apps/web/src/routes/_auth.tsx	Auth layout route with gating + Outlet
apps/web/src/routes/__root.tsx	Root route establishing providers (QueryClient, Theme, DevTools)
apps/web/src/routes/$catchall.tsx	404 catchall route
apps/web/src/router.tsx	Router instance with context placeholders
apps/web/src/routeTree.gen.ts	Generated route tree (do not edit)
apps/web/src/queries/user.query-options.ts	User query/mutation options with cache management
apps/web/src/queries/ssl.query-options.ts	SSL certificate query/mutation patterns
apps/web/src/queries/performance.query-options.ts	Performance metrics & cleanup mutations
apps/web/src/queries/modsec.query-options.ts	ModSecurity rule & settings query layer
apps/web/src/queries/logs.query-options.ts	Log querying with polling and download mutation
apps/web/src/queries/index.ts	Barrel export for query option modules
apps/web/src/queries/domain.query-options.ts	Domain list/status queries & mutations
apps/web/src/queries/dashboard.query-options.ts	Dashboard stats/system metrics query options
apps/web/src/queries/auth.query-options.ts	Auth lifecycle queries & mutations (login, 2FA)
apps/web/src/queries/alerts.query-options.ts	Alert channels & rules query/mutation options
apps/web/src/queries/acl.query-options.ts	ACL rules query/mutation options
apps/web/src/pages/Users.tsx	Removed legacy page (replaced by route + query layer)
apps/web/src/pages/SSL.tsx	Removed legacy SSL page
apps/web/src/pages/Performance.tsx	Removed legacy Performance page
apps/web/src/pages/Logs.tsx	Removed legacy Logs page
apps/web/src/pages/Index.tsx	Removed fallback landing page
apps/web/src/pages/Domains.tsx	Removed legacy Domains page
apps/web/src/pages/Dashboard.tsx	Removed legacy Dashboard page
apps/web/src/pages/Alerts.tsx	Removed legacy Alerts page
apps/web/src/main.tsx	App bootstrap updated to use RouterProvider & QueryClient
apps/web/src/lib/utils.ts	Minor style change (semicolons removed)
apps/web/src/lib/route-loaders.ts	Utility ensure/prefetch helpers for routes
apps/web/src/lib/query-client.ts	Query key helper + context query client extractor
apps/web/src/lib/deferred-loading-example.tsx	Educational deferred loading example
apps/web/src/index.css	Tailwind v4 design token overhaul
apps/web/src/hooks/use-mobile.ts	New mobile breakpoint hook
apps/web/src/components/ui/use-toast.ts	Removed legacy re-export (sonner now used)
apps/web/src/components/ui/tooltip.tsx	Rewritten tooltip primitive with provider changes
apps/web/src/components/ui/toggle.tsx	Removed old Toggle component
apps/web/src/components/ui/toggle-group.tsx	Removed old ToggleGroup component
apps/web/src/components/ui/toaster.tsx	Removed legacy toaster (sonner adopted)
apps/web/src/components/ui/toast.tsx	Removed legacy toast primitives
apps/web/src/components/ui/textarea.tsx	Refactored Textarea (simplified, removed forwardRef)
apps/web/src/components/ui/tabs.tsx	Refactored Tabs API & styling
apps/web/src/components/ui/table.tsx	Refactored Table primitives (removed forwardRef)
apps/web/src/components/ui/switch.tsx	Refactored Switch (removed forwardRef)
apps/web/src/components/ui/sonner.tsx	New Sonner Toaster integration
apps/web/src/components/ui/slider.tsx	Removed old Slider component
apps/web/src/components/ui/skeletons.tsx	New barrel export for skeleton components
apps/web/src/components/ui/skeleton*.tsx	Added various skeleton/loading primitives

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[sonarqubecloud]

Quality Gate failed

Failed conditions
C Reliability Rating on New Code (required ≥ A)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE

[vncloudsco]

Thank em!

LGTM