Refactor: Implement Code Splitting

This commit is contained in:
gpt-engineer-app[bot]
2025-10-21 18:31:08 +00:00
parent da0f01a785
commit 70a8534da7
9 changed files with 722 additions and 89 deletions

View File

@@ -1,4 +1,5 @@
import * as React from "react";
import { lazy, Suspense } from "react";
import { Toaster } from "@/components/ui/toaster";
import { Toaster as Sonner } from "@/components/ui/sonner";
import { TooltipProvider } from "@/components/ui/tooltip";
@@ -9,47 +10,57 @@ import { AuthProvider } from "@/hooks/useAuth";
import { AuthModalProvider } from "@/contexts/AuthModalContext";
import { LocationAutoDetectProvider } from "@/components/providers/LocationAutoDetectProvider";
import { Footer } from "@/components/layout/Footer";
import { PageLoader } from "@/components/loading/PageSkeletons";
// Core routes (eager-loaded for best UX)
import Index from "./pages/Index";
import Parks from "./pages/Parks";
import ParkDetail from "./pages/ParkDetail";
import RideDetail from "./pages/RideDetail";
import Rides from "./pages/Rides";
import Manufacturers from "./pages/Manufacturers";
import ManufacturerDetail from "./pages/ManufacturerDetail";
import ManufacturerRides from "./pages/ManufacturerRides";
import ManufacturerModels from "./pages/ManufacturerModels";
import RideModelDetail from "./pages/RideModelDetail";
import RideModelRides from "./pages/RideModelRides";
import Designers from "./pages/Designers";
import DesignerDetail from "./pages/DesignerDetail";
import DesignerRides from "./pages/DesignerRides";
import ParkOwners from "./pages/ParkOwners";
import PropertyOwnerDetail from "./pages/PropertyOwnerDetail";
import OwnerParks from "./pages/OwnerParks";
import Operators from "./pages/Operators";
import OperatorDetail from "./pages/OperatorDetail";
import OperatorParks from "./pages/OperatorParks";
import Auth from "./pages/Auth";
import Profile from "./pages/Profile";
import ParkRides from "./pages/ParkRides";
import UserSettings from "./pages/UserSettings";
import Search from "./pages/Search";
import NotFound from "./pages/NotFound";
import Terms from "./pages/Terms";
import Privacy from "./pages/Privacy";
import SubmissionGuidelines from "./pages/SubmissionGuidelines";
import Admin from "./pages/Admin";
import AdminDashboard from "./pages/AdminDashboard";
import AdminModeration from "./pages/AdminModeration";
import AdminReports from "./pages/AdminReports";
import AdminSystemLog from "./pages/AdminSystemLog";
import AdminUsers from "./pages/AdminUsers";
import AdminSettings from "./pages/AdminSettings";
import BlogIndex from "./pages/BlogIndex";
import BlogPost from "./pages/BlogPost";
import AdminBlog from "./pages/AdminBlog";
import ForceLogout from "./pages/ForceLogout";
import AuthCallback from "./pages/AuthCallback";
import Auth from "./pages/Auth";
// Detail routes (lazy-loaded)
const ParkDetail = lazy(() => import("./pages/ParkDetail"));
const RideDetail = lazy(() => import("./pages/RideDetail"));
const ParkRides = lazy(() => import("./pages/ParkRides"));
const Manufacturers = lazy(() => import("./pages/Manufacturers"));
const ManufacturerDetail = lazy(() => import("./pages/ManufacturerDetail"));
const ManufacturerRides = lazy(() => import("./pages/ManufacturerRides"));
const ManufacturerModels = lazy(() => import("./pages/ManufacturerModels"));
const RideModelDetail = lazy(() => import("./pages/RideModelDetail"));
const RideModelRides = lazy(() => import("./pages/RideModelRides"));
const Designers = lazy(() => import("./pages/Designers"));
const DesignerDetail = lazy(() => import("./pages/DesignerDetail"));
const DesignerRides = lazy(() => import("./pages/DesignerRides"));
const ParkOwners = lazy(() => import("./pages/ParkOwners"));
const PropertyOwnerDetail = lazy(() => import("./pages/PropertyOwnerDetail"));
const OwnerParks = lazy(() => import("./pages/OwnerParks"));
const Operators = lazy(() => import("./pages/Operators"));
const OperatorDetail = lazy(() => import("./pages/OperatorDetail"));
const OperatorParks = lazy(() => import("./pages/OperatorParks"));
const BlogIndex = lazy(() => import("./pages/BlogIndex"));
const BlogPost = lazy(() => import("./pages/BlogPost"));
const Terms = lazy(() => import("./pages/Terms"));
const Privacy = lazy(() => import("./pages/Privacy"));
const SubmissionGuidelines = lazy(() => import("./pages/SubmissionGuidelines"));
// Admin routes (lazy-loaded - heavy bundle)
const AdminDashboard = lazy(() => import("./pages/AdminDashboard"));
const AdminModeration = lazy(() => import("./pages/AdminModeration"));
const AdminReports = lazy(() => import("./pages/AdminReports"));
const AdminSystemLog = lazy(() => import("./pages/AdminSystemLog"));
const AdminUsers = lazy(() => import("./pages/AdminUsers"));
const AdminBlog = lazy(() => import("./pages/AdminBlog"));
const AdminSettings = lazy(() => import("./pages/AdminSettings"));
// User routes (lazy-loaded)
const Profile = lazy(() => import("./pages/Profile"));
const UserSettings = lazy(() => import("./pages/UserSettings"));
const AuthCallback = lazy(() => import("./pages/AuthCallback"));
// Utility routes (lazy-loaded)
const NotFound = lazy(() => import("./pages/NotFound"));
const ForceLogout = lazy(() => import("./pages/ForceLogout"));
const queryClient = new QueryClient({
defaultOptions: {
@@ -73,50 +84,61 @@ function AppContent() {
<Sonner />
<div className="min-h-screen flex flex-col">
<div className="flex-1">
<Routes>
<Route path="/" element={<Index />} />
<Route path="/parks" element={<Parks />} />
<Route path="/parks/:slug" element={<ParkDetail />} />
<Route path="/parks/:parkSlug/rides" element={<ParkRides />} />
<Route path="/parks/:parkSlug/rides/:rideSlug" element={<RideDetail />} />
<Route path="/rides" element={<Rides />} />
<Route path="/search" element={<Search />} />
<Route path="/blog" element={<BlogIndex />} />
<Route path="/blog/:slug" element={<BlogPost />} />
<Route path="/manufacturers" element={<Manufacturers />} />
<Route path="/manufacturers/:slug" element={<ManufacturerDetail />} />
<Route path="/manufacturers/:manufacturerSlug/rides" element={<ManufacturerRides />} />
<Route path="/manufacturers/:manufacturerSlug/models" element={<ManufacturerModels />} />
<Route path="/manufacturers/:manufacturerSlug/models/:modelSlug" element={<RideModelDetail />} />
<Route path="/manufacturers/:manufacturerSlug/models/:modelSlug/rides" element={<RideModelRides />} />
<Route path="/designers" element={<Designers />} />
<Route path="/designers/:slug" element={<DesignerDetail />} />
<Route path="/designers/:designerSlug/rides" element={<DesignerRides />} />
<Route path="/owners" element={<ParkOwners />} />
<Route path="/owners/:slug" element={<PropertyOwnerDetail />} />
<Route path="/owners/:ownerSlug/parks" element={<OwnerParks />} />
<Route path="/operators" element={<Operators />} />
<Route path="/operators/:slug" element={<OperatorDetail />} />
<Route path="/operators/:operatorSlug/parks" element={<OperatorParks />} />
<Route path="/auth" element={<Auth />} />
<Route path="/auth/callback" element={<AuthCallback />} />
<Route path="/profile" element={<Profile />} />
<Route path="/profile/:username" element={<Profile />} />
<Route path="/settings" element={<UserSettings />} />
<Route path="/admin" element={<AdminDashboard />} />
<Route path="/admin/moderation" element={<AdminModeration />} />
<Route path="/admin/reports" element={<AdminReports />} />
<Route path="/admin/system-log" element={<AdminSystemLog />} />
<Route path="/admin/users" element={<AdminUsers />} />
<Route path="/admin/blog" element={<AdminBlog />} />
<Route path="/admin/settings" element={<AdminSettings />} />
<Route path="/terms" element={<Terms />} />
<Route path="/privacy" element={<Privacy />} />
<Route path="/submission-guidelines" element={<SubmissionGuidelines />} />
<Route path="/force-logout" element={<ForceLogout />} />
{/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
<Route path="*" element={<NotFound />} />
</Routes>
<Suspense fallback={<PageLoader />}>
<Routes>
{/* Core routes - eager loaded */}
<Route path="/" element={<Index />} />
<Route path="/parks" element={<Parks />} />
<Route path="/rides" element={<Rides />} />
<Route path="/search" element={<Search />} />
<Route path="/auth" element={<Auth />} />
{/* Detail routes - lazy loaded */}
<Route path="/parks/:slug" element={<ParkDetail />} />
<Route path="/parks/:parkSlug/rides" element={<ParkRides />} />
<Route path="/parks/:parkSlug/rides/:rideSlug" element={<RideDetail />} />
<Route path="/manufacturers" element={<Manufacturers />} />
<Route path="/manufacturers/:slug" element={<ManufacturerDetail />} />
<Route path="/manufacturers/:manufacturerSlug/rides" element={<ManufacturerRides />} />
<Route path="/manufacturers/:manufacturerSlug/models" element={<ManufacturerModels />} />
<Route path="/manufacturers/:manufacturerSlug/models/:modelSlug" element={<RideModelDetail />} />
<Route path="/manufacturers/:manufacturerSlug/models/:modelSlug/rides" element={<RideModelRides />} />
<Route path="/designers" element={<Designers />} />
<Route path="/designers/:slug" element={<DesignerDetail />} />
<Route path="/designers/:designerSlug/rides" element={<DesignerRides />} />
<Route path="/owners" element={<ParkOwners />} />
<Route path="/owners/:slug" element={<PropertyOwnerDetail />} />
<Route path="/owners/:ownerSlug/parks" element={<OwnerParks />} />
<Route path="/operators" element={<Operators />} />
<Route path="/operators/:slug" element={<OperatorDetail />} />
<Route path="/operators/:operatorSlug/parks" element={<OperatorParks />} />
<Route path="/blog" element={<BlogIndex />} />
<Route path="/blog/:slug" element={<BlogPost />} />
<Route path="/terms" element={<Terms />} />
<Route path="/privacy" element={<Privacy />} />
<Route path="/submission-guidelines" element={<SubmissionGuidelines />} />
{/* User routes - lazy loaded */}
<Route path="/auth/callback" element={<AuthCallback />} />
<Route path="/profile" element={<Profile />} />
<Route path="/profile/:username" element={<Profile />} />
<Route path="/settings" element={<UserSettings />} />
{/* Admin routes - lazy loaded */}
<Route path="/admin" element={<AdminDashboard />} />
<Route path="/admin/moderation" element={<AdminModeration />} />
<Route path="/admin/reports" element={<AdminReports />} />
<Route path="/admin/system-log" element={<AdminSystemLog />} />
<Route path="/admin/users" element={<AdminUsers />} />
<Route path="/admin/blog" element={<AdminBlog />} />
<Route path="/admin/settings" element={<AdminSettings />} />
{/* Utility routes - lazy loaded */}
<Route path="/force-logout" element={<ForceLogout />} />
{/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
<Route path="*" element={<NotFound />} />
</Routes>
</Suspense>
</div>
<Footer />
</div>