feat: some profile page upgrades

src/app.tsx

@@ -1,8 +1,8 @@
 import { FunctionComponent } from "preact";
-import { ErrorBoundary, LocationProvider, Route, Router, useLocation } from "preact-iso";
+import { ErrorBoundary, lazy, LocationProvider, Route, Router, useLocation } from "preact-iso";
 import "preact/debug";
 import LoginPage from "./pages/login";
-import ProfilePage from "./pages/profile";
+import { AppProvider } from "./providers/AuthProvider";
 
 const HomePage: FunctionComponent = () => {
   const location = useLocation();
@@ -12,14 +12,17 @@ const HomePage: FunctionComponent = () => {
 
 export function App() {
   return (
-    <LocationProvider>
-      <ErrorBoundary>
-        <Router>
-          <Route path="/" component={HomePage} />
-          <Route path="/login" component={LoginPage} />
-          <Route path="/profile" component={ProfilePage} />
-        </Router>
-      </ErrorBoundary>
-    </LocationProvider>
+    <AppProvider>
+      <LocationProvider>
+        <ErrorBoundary>
+          <Router>
+            <Route path="/" component={HomePage} />
+            <Route path="/login" component={LoginPage} />
+            <Route path="/profile/*" component={lazy(() => import("./pages/profile"))} />
+            <Route default component={() => <h1>404</h1>} />
+          </Router>
+        </ErrorBoundary>
+      </LocationProvider>
+    </AppProvider>
   );
 }