added translation to account page

This commit is contained in:
Laura Dolibois
2025-05-25 13:21:40 +02:00
parent 5999ad1b37
commit 3cad3a8c9f
3 changed files with 35 additions and 12 deletions

View File

@@ -1,23 +1,33 @@
{ {
"account": "Account", "account": "Konto",
"accountDeleted": "Konto erfolgreich gelöscht!",
"address": "Adresse",
"addToCart": "In den Warenkorb", "addToCart": "In den Warenkorb",
"addedToCart": "Produkt wurde erfolgreich dem Warenkorb hinzugefügt", "addedToCart": "Produkt wurde erfolgreich dem Warenkorb hinzugefügt",
"almostSoldOut": "Fast ausverkauft", "almostSoldOut": "Fast ausverkauft",
"available": "Stück verfügbar", "available": "Stück verfügbar",
"cancel": "Abbrechen",
"categories": "Kategorien", "categories": "Kategorien",
"checkout": "Zur Kasse", "checkout": "Zur Kasse",
"close": "Schließen", "close": "Schließen",
"contact": "Kontakt", "contact": "Kontakt",
"currentAccount": "Account des aktuellen Benutzers", "currentAccount": "Konto des aktuellen Benutzers",
"deleteAccount": "Konto löschen",
"edit": "Bearbeiten",
"email": "E-Mail",
"freeShipping": "Kostenloser Versand ab 50 € Bestellwert", "freeShipping": "Kostenloser Versand ab 50 € Bestellwert",
"inStock": "Verfügbar", "inStock": "Verfügbar",
"logout": "Ausloggen", "logout": "Ausloggen",
"myAccount": "Mein Konto",
"name": "Name",
"orders": "Bestellungen", "orders": "Bestellungen",
"outOfStock": "Ausverkauft", "outOfStock": "Ausverkauft",
"phone": "Telefon",
"quantity": "Anzahl", "quantity": "Anzahl",
"rateThisProduct": "Dieses Produkt bewerten", "rateThisProduct": "Dieses Produkt bewerten",
"ratingFrom": "Bewertung vom", "ratingFrom": "Bewertung vom",
"review": "Produktrezension (optional)", "review": "Produktrezension (optional)",
"save": "Speichern",
"search": "Suchen", "search": "Suchen",
"submit": "Senden" "submit": "Senden"
} }

View File

@@ -1,23 +1,33 @@
{ {
"account": "Account", "account": "Account",
"accountDeleted": "Account deleted successfully!",
"address": "Address",
"addToCart": "Add to cart", "addToCart": "Add to cart",
"addedToCart": "Product added to shopping cart successfully", "addedToCart": "Product added to shopping cart successfully",
"almostSoldOut": "Almost sold out", "almostSoldOut": "Almost sold out",
"available": "items available", "available": "items available",
"cancel": "Cancel",
"categories": "Categories", "categories": "Categories",
"checkout": "Checkout", "checkout": "Checkout",
"close": "Close", "close": "Close",
"contact": "Contact", "contact": "Contact",
"currentAccount": "Account of current user", "currentAccount": "Account of current user",
"deleteAccount": "Delete Account",
"edit": "Edit",
"email": "Email",
"freeShipping": "Free shipping for orders over 50 €", "freeShipping": "Free shipping for orders over 50 €",
"inStock": "In stock", "inStock": "In stock",
"logout": "Logout", "logout": "Logout",
"myAccount": "My Account",
"name": "Name",
"orders": "Orders", "orders": "Orders",
"outOfStock": "Out of stock", "outOfStock": "Out of stock",
"phone": "Phone number",
"quantity": "Quantity", "quantity": "Quantity",
"rateThisProduct": "Rate this product", "rateThisProduct": "Rate this product",
"ratingFrom": "Rating from", "ratingFrom": "Rating from",
"review": "Product review (optional)", "review": "Product review (optional)",
"save": "Save",
"search": "Search", "search": "Search",
"submit": "Submit" "submit": "Submit"
} }

View File

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