1import { lazy, Suspense } from "react";
2import { BrowserRouter, Routes, Route } from "react-router";
3
4import ContextProvider from "./ContextProvider";
5
6import PageLayout from "./components/page-layout";
7import Loading from "./components/loading";
8
9// pages
10import NotFoundPage from "./pages/not-found";
11import HomePage from "./pages/home";
12
13const ActivitiesPage = lazy(() => import("./pages/activities"));
14const ActivityNewPage = lazy(() => import("./pages/activity-new"));
15const ActivityEditPage = lazy(() => import("./pages/activity-edit"));
16const ActivitySharePage = lazy(() => import("./pages/activity-share"));
17const UpiDetailsPage = lazy(() => import("./pages/upi-details"));
18const FriendsPage = lazy(() => import("./pages/friends"));
19const AboutPage = lazy(() => import("./pages/about"));
20
21const AppRouter = () => {
22 return (
23 <BrowserRouter>
24 <Suspense fallback={<Loading routeLoader />}>
25 <Routes>
26 <Route element={<PageLayout />}>
27 <Route index element={<HomePage />} />
28 <Route
29 path="activities"
30 element={
31 <Suspense fallback={<Loading routeLoader />}>
32 <ActivitiesPage />
33 </Suspense>
34 }
35 />
36 <Route
37 path="new"
38 element={
39 <Suspense fallback={<Loading routeLoader />}>
40 <ActivityNewPage />
41 </Suspense>
42 }
43 />
44 <Route
45 path="edit/:id"
46 element={
47 <Suspense fallback={<Loading routeLoader />}>
48 <ActivityEditPage />
49 </Suspense>
50 }
51 />
52 <Route
53 path="share/:id"
54 element={
55 <Suspense fallback={<Loading routeLoader />}>
56 <ActivitySharePage />
57 </Suspense>
58 }
59 />
60 <Route
61 path="upi"
62 element={
63 <Suspense fallback={<Loading routeLoader />}>
64 <UpiDetailsPage />
65 </Suspense>
66 }
67 />
68 <Route
69 path="friends"
70 element={
71 <Suspense fallback={<Loading routeLoader />}>
72 <FriendsPage />
73 </Suspense>
74 }
75 />
76 <Route
77 path="about"
78 element={
79 <Suspense fallback={<Loading routeLoader />}>
80 <AboutPage />
81 </Suspense>
82 }
83 />
84 </Route>
85 {/* 404 */}
86 <Route path="*" element={<NotFoundPage />} />
87 </Routes>
88 </Suspense>
89 </BrowserRouter>
90 );
91};
92
93function App() {
94 return (
95 <>
96 <ContextProvider>
97 <AppRouter />
98 </ContextProvider>
99 </>
100 );
101}
102
103export default App;