MyClub/TRANSLATION_SUMMARY.md

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):

  homepage: {
    team: "Tým",
    played: "Zápasy", 
    won: "V",
    drawn: "R",
    lost: "P",
    goals: "Góly",
    points: "Body"
  }
  

• English translations (already existed):

  homepage: {
    team: "Team",
    played: "Played",
    won: "W", 
    drawn: "D",
    lost: "L",
    goals: "Goals",
    points: "Points"
  }
  

• Added missing Czech table keys:

  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.