mirror of
https://github.com/Dvorinka/MyClubServer.git
synced 2026-06-03 18:22:57 +00:00
Tomas Dvorak
104 lines
3.3 KiB
Markdown
104 lines
3.3 KiB
Markdown
# Table Headers Internationalization - Implementation Summary
|
|
|
|
## Overview
|
|
Successfully implemented internationalization (i18n) for table headers in the homepage frontpage to support both English and Czech languages.
|
|
|
|
## Changes Made
|
|
|
|
### 1. StandingsCard Component (`/frontend/src/components/pack/StandingsCard.tsx`)
|
|
- **Added import**: `import { useTranslation } from 'react-i18next';`
|
|
- **Added hook**: `const { t } = useTranslation();`
|
|
- **Updated table headers** from hardcoded Czech to translation keys:
|
|
- `Tým` → `{t('homepage.team')}`
|
|
- `Z` → `{t('homepage.played')}`
|
|
- `V` → `{t('homepage.won')}`
|
|
- `R` → `{t('homepage.drawn')}`
|
|
- `P` → `{t('homepage.lost')}`
|
|
- `Skóre` → `{t('homepage.goals')}`
|
|
- `Body` → `{t('homepage.points')}`
|
|
- **Updated alt text**: Team logo alt text now uses `{t('homepage.team')}` instead of hardcoded `'Tým'`
|
|
|
|
### 2. Translation Keys (`/frontend/src/i18n/index.ts`)
|
|
- **Czech translations** (already existed):
|
|
```json
|
|
homepage: {
|
|
team: "Tým",
|
|
played: "Zápasy",
|
|
won: "V",
|
|
drawn: "R",
|
|
lost: "P",
|
|
goals: "Góly",
|
|
points: "Body"
|
|
}
|
|
```
|
|
- **English translations** (already existed):
|
|
```json
|
|
homepage: {
|
|
team: "Team",
|
|
played: "Played",
|
|
won: "W",
|
|
drawn: "D",
|
|
lost: "L",
|
|
goals: "Goals",
|
|
points: "Points"
|
|
}
|
|
```
|
|
- **Added missing Czech table keys**:
|
|
```json
|
|
tables: {
|
|
rank: "#",
|
|
team: "Tým",
|
|
played: "Z",
|
|
wins: "V",
|
|
draws: "R",
|
|
losses: "P",
|
|
score: "Skóre",
|
|
points: "Body"
|
|
}
|
|
```
|
|
|
|
## Translation Mapping
|
|
|
|
| Original (Czech) | Translation Key | Czech Value | English Value |
|
|
|------------------|----------------|-------------|---------------|
|
|
| Tým | `homepage.team` | "Tým" | "Team" |
|
|
| Z | `homepage.played` | "Zápasy" | "Played" |
|
|
| V | `homepage.won` | "V" | "W" |
|
|
| R | `homepage.drawn` | "R" | "D" |
|
|
| P | `homepage.lost` | "P" | "L" |
|
|
| Skóre | `homepage.goals` | "Góly" | "Goals" |
|
|
| Body | `homepage.points` | "Body" | "Points" |
|
|
|
|
### TablesPage Translation Mapping
|
|
| Translation Key | Czech Value | English Value |
|
|
|----------------|-------------|---------------|
|
|
| `tables.rank` | "#" | "#" |
|
|
| `tables.team` | "Tým" | "Team" |
|
|
| `tables.played` | "Z" | "P" |
|
|
| `tables.wins` | "V" | "W" |
|
|
| `tables.draws` | "R" | "D" |
|
|
| `tables.losses` | "P" | "L" |
|
|
| `tables.score` | "Skóre" | "Score" |
|
|
| `tables.points` | "Body" | "Points" |
|
|
|
|
## Components Affected
|
|
- ✅ `StandingsCard.tsx` - Main table component used in homepage
|
|
- ✅ `TablesPage.tsx` - Already using translations (added missing Czech keys)
|
|
- ✅ `StandingsPage.tsx` - Already using translations (no changes needed)
|
|
|
|
## Testing
|
|
- ✅ Frontend builds successfully without errors
|
|
- ✅ All translation keys exist in both Czech and English
|
|
- ✅ TypeScript compilation successful
|
|
|
|
## Usage
|
|
The table headers will now automatically display in the user's selected language:
|
|
- **Czech users** will see: "Tým", "Zápasy", "V", "R", "P", "Góly", "Body"
|
|
- **English users** will see: "Team", "Played", "W", "D", "L", "Goals", "Points"
|
|
|
|
## Language Switching
|
|
Users can switch languages using the language switcher (if available) or the system will detect their browser language preference automatically.
|
|
|
|
## Status: ✅ COMPLETE
|
|
All table headers in the homepage frontpage now support proper internationalization for both English and Czech languages.
|