added translation to 404

01-frontend/public/locales/de/translation.json

@@ -6,6 +6,7 @@
   "addedToCart": "Produkt wurde erfolgreich dem Warenkorb hinzugefügt",
   "almostSoldOut": "Fast ausverkauft",
   "available": "Stück verfügbar",
+  "backToHome": "Zurück zur Startseite",
   "cancel": "Abbrechen",
   "categories": "Kategorien",
   "checkout": "Zur Kasse",
@@ -22,6 +23,7 @@
   "name": "Name",
   "orders": "Bestellungen",
   "outOfStock": "Ausverkauft",
+  "pageDoesNotExist": "Ups! Diese Seite existiert nicht.",
   "phone": "Telefon",
   "quantity": "Anzahl",
   "rateThisProduct": "Dieses Produkt bewerten",
@@ -29,5 +31,6 @@
   "review": "Produktrezension (optional)",
   "save": "Speichern",
   "search": "Suchen",
-  "submit": "Senden"
+  "submit": "Senden",
+  "wrongTurn": "Ein falscher Weg wurde eingeschlagen. Zurück auf den richtigen Pfad."
 }

01-frontend/public/locales/en/translation.json

@@ -6,6 +6,7 @@
   "addedToCart": "Product added to shopping cart successfully",
   "almostSoldOut": "Almost sold out",
   "available": "items available",
+  "backToHome": "Go back to home",
   "cancel": "Cancel",
   "categories": "Categories",
   "checkout": "Checkout",
@@ -22,6 +23,7 @@
   "name": "Name",
   "orders": "Orders",
   "outOfStock": "Out of stock",
+  "pageDoesNotExist": "Oops! The page you're looking for doesn't exist.",
   "phone": "Phone number",
   "quantity": "Quantity",
   "rateThisProduct": "Rate this product",
@@ -29,5 +31,6 @@
   "review": "Product review (optional)",
   "save": "Save",
   "search": "Search",
-  "submit": "Submit"
+  "submit": "Submit",
+  "wrongTurn": "It seems you may have taken a wrong turn. Let's get you back on track."
 }

01-frontend/src/pages/NoPage.tsx

@@ -1,8 +1,11 @@
 import { Box, Typography, Button } from "@mui/material";
 import { useNavigate } from "react-router-dom";
 import "./pages.css";
+import {useTranslation} from "react-i18next";
 
 export default function NoPage() {
+
+    const { t } = useTranslation();
     const navigate = useNavigate();
 
     const handleGoHome = () => {
@@ -15,10 +18,10 @@ export default function NoPage() {
                 404
             </Typography>
             <Typography variant="h5" className="no-page-subtitle">
-                Oops! The page you're looking for doesn't exist.
+                {t('pageDoesNotExist')}
             </Typography>
             <Typography variant="body1" className="no-page-description">
-                It seems you may have taken a wrong turn. Let's get you back on track.
+                {t('wrongTurn')}
             </Typography>
             <Button
                 variant="contained"
@@ -27,7 +30,7 @@ export default function NoPage() {
                 className="no-page-button"
                 onClick={handleGoHome}
             >
-                Go Back to Home
+                {t('backToHome')}
             </Button>
         </Box>
     );