# 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.