added translation to account page

01-frontend/src/pages/Account.tsx

@@ -2,8 +2,11 @@ import { Box, Typography, Button, TextField, Paper, Divider, Stack } from "@mui/
 import { useNavigate } from "react-router-dom";
 import "./pages.css";
 import { useState } from "react";
+import {useTranslation} from "react-i18next";
 
 export default function Account() {
+
+    const { t } = useTranslation();
     const navigate = useNavigate();
 
     // Beispielhafte Userdaten (könnten aus Context/Backend kommen)
@@ -31,7 +34,7 @@ export default function Account() {
     };
     const handleDelete = () => {
         // Hier ggf. Dialog oder API-Call zum Löschen
-        alert("Konto gelöscht!");
+        alert(t('accountDeleted'));
         navigate("/");
     };
 
@@ -39,12 +42,12 @@ export default function Account() {
         <Box className="page-background" sx={{ minHeight: "100vh", justifyContent: "flex-start", pt: 4 }}>
             <Paper elevation={3} sx={{ p: 4, maxWidth: 500, width: "100%", mx: "auto" }}>
                 <Typography variant="h4" gutterBottom>
-                    Mein Konto
+                    {t('myAccount')}
                 </Typography>
                 <Divider sx={{ mb: 3 }} />
                 <Stack spacing={2}>
                     <TextField
-                        label="Name"
+                        label={t('name')}
                         name="name"
                         value={edit ? form.name : user.name}
                         onChange={handleChange}
@@ -52,7 +55,7 @@ export default function Account() {
                         fullWidth
                     />
                     <TextField
-                        label="E-Mail"
+                        label={t('email')}
                         name="email"
                         value={edit ? form.email : user.email}
                         onChange={handleChange}
@@ -60,7 +63,7 @@ export default function Account() {
                         fullWidth
                     />
                     <TextField
-                        label="Telefon"
+                        label={t('phone')}
                         name="phone"
                         value={edit ? form.phone : user.phone}
                         onChange={handleChange}
@@ -68,7 +71,7 @@ export default function Account() {
                         fullWidth
                     />
                     <TextField
-                        label="Adresse"
+                        label={t('address')}
                         name="address"
                         value={edit ? form.address : user.address}
                         onChange={handleChange}
@@ -80,15 +83,15 @@ export default function Account() {
                     {edit ? (
                         <>
                             <Button variant="contained" color="primary" onClick={handleSave}>
-                                Speichern
+                                {t('save')}
                             </Button>
                             <Button variant="outlined" color="secondary" onClick={handleCancel}>
-                                Abbrechen
+                                {t('cancel')}
                             </Button>
                         </>
                     ) : (
                         <Button variant="contained" color="primary" onClick={handleEdit}>
-                            Bearbeiten
+                            {t('edit')}
                         </Button>
                     )}
                     <Button
@@ -97,7 +100,7 @@ export default function Account() {
                         onClick={handleDelete}
                         sx={{ marginLeft: "auto" }}
                     >
-                        Konto löschen
+                        {t('deleteAccount')}
                     </Button>
                 </Box>
             </Paper>