From 080f6cbb2412bdbcab69cc6152fdb85af68a64ce Mon Sep 17 00:00:00 2001
From: FlorianSpeicher <flo200538@gmail.com>
Date: Wed, 21 May 2025 23:36:36 +0200
Subject: [PATCH] Added category page without content

---
 01-frontend/src/App.tsx            |  3 ++-
 01-frontend/src/pages/Category.tsx | 34 ++++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 01-frontend/src/pages/Category.tsx

diff --git a/01-frontend/src/App.tsx b/01-frontend/src/App.tsx
index 84f1c29..8bbaa7c 100644
--- a/01-frontend/src/App.tsx
+++ b/01-frontend/src/App.tsx
@@ -7,6 +7,7 @@ import NoPage from './pages/NoPage';
 import Product from './pages/Product';
 import Payment from './pages/Payment';
 import Contact from './pages/Contact';
+import Category from './pages/Category';
 import { BasketProvider } from './helper/BasketProvider';
 
 export default function App() {
@@ -21,7 +22,7 @@ export default function App() {
           <Route path="*" element={<NoPage />} />
           <Route path="/product/:id" element={<Product />} />
           <Route path="/checkout" element={<Payment />} />
-          <Route path="/categories" element={<Home />} />
+          <Route path="/categories" element={<Category />} />
           <Route path="/contact" element={<Contact />} />
         </Routes>
       </BrowserRouter>
diff --git a/01-frontend/src/pages/Category.tsx b/01-frontend/src/pages/Category.tsx
new file mode 100644
index 0000000..926e3a6
--- /dev/null
+++ b/01-frontend/src/pages/Category.tsx
@@ -0,0 +1,34 @@
+import { Box, Typography, Button } from "@mui/material";
+import { useNavigate } from "react-router-dom";
+import "./pages.css";
+
+export default function Category() {
+    const navigate = useNavigate();
+
+    const handleGoHome = () => {
+        navigate("/");
+    };
+
+    return (
+        <Box className="no-page-container">
+            <Typography variant="h1" className="no-page-title">
+                Category
+            </Typography>
+            <Typography variant="h5" className="no-page-subtitle">
+                Oops! The page you're looking for doesn't exist.
+            </Typography>
+            <Typography variant="body1" className="no-page-description">
+                It seems you may have taken a wrong turn. Let's get you back on track.
+            </Typography>
+            <Button
+                variant="contained"
+                color="primary"
+                size="large"
+                className="no-page-button"
+                onClick={handleGoHome}
+            >
+                Go Back to Home
+            </Button>
+        </Box>
+    );
+}
\ No newline at end of file