web 404 page

apps/web/src/App.tsx

@@ -4,6 +4,7 @@ import Home from "./pages/Home";
 import Login from "./pages/Login";
 import Signup from "./pages/Signup";
 import Chat from "./pages/Chat";
+import NotFoundPage from "./pages/NotFound";
 import { ProtectedRoute } from "./components/ProtectedRoute";
 
 export default function App() {
@@ -22,6 +23,7 @@ export default function App() {
               </ProtectedRoute>
             }
           />
+          <Route path="*" element={<NotFoundPage />} />
         </Routes>
       </BrowserRouter>
     </NextUIProvider>

apps/web/src/pages/NotFound.tsx

@@ -0,0 +1,17 @@
+import { useLocation } from "react-router-dom";
+
+const NotFoundPage = () => {
+    const location = useLocation();
+
+    return (
+        <div style={{ textAlign: "center", padding: "2rem" }}>
+            <h1>404 - Page Not Found</h1>
+            <p>The page <strong>{location.pathname}</strong> does not exist.</p>
+            <a href="/" style={{ color: "blue", textDecoration: "underline" }}>
+                Go back to the homepage
+            </a>
+        </div>
+    );
+};
+
+export default NotFoundPage;