Skip to content

feat: Add UI localization with German (default) and English language support#37

Merged
milljoniaer merged 7 commits intomainfrom
copilot/add-localization-support
Mar 24, 2026
Merged

feat: Add UI localization with German (default) and English language support#37
milljoniaer merged 7 commits intomainfrom
copilot/add-localization-support

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 21, 2026

Introduces i18n to the entire client UI. German is the default language; English is the alternative. Language preference persists in localStorage. Prompts, markdown content, and PDF resources remain in German.

Infrastructure

  • i18next + react-i18next — inline resources, no suspense, reads localStorage["language"] on init (defaults to "de")
  • LanguageContext — mirrors ThemeContext pattern; setLanguage() updates both React state and i18n.changeLanguage()
  • useLanguage hook — mirrors useTheme
  • LanguageSwitcher component — DE/EN toggle buttons, placed in UserHeader next to the theme toggle
// UserHeader.tsx
<LanguageSwitcher />
<ThemeToggle />

Translations

  • src/locales/de.json and src/locales/en.json — 246 keys across navigation, all pages, forms, and layout components
  • Navigation labels resolved via t("nav.<tab.id>") in NavigationItem — no changes to the NAVIGATION_TABS constant needed

Components updated

All user-visible strings replaced with t() calls across: MainLayout, UserHeader, Footer, NavigationItem, RecommendationForm, ResultsDisplay, LoginPage, AuthVerifyPage, RecommendationsPage, LibraryPage, FavouritesPage, SearchHistoryPage, AccountDashboardPage, ImpressumPage

Tests

src/test/setup.ts initializes i18next with the actual translation resources so existing component tests continue to resolve translated strings rather than raw keys.


⚡ Quickly spin up Copilot coding agent tasks from anywhere on your macOS or Windows machine with Raycast.

Copilot AI and others added 3 commits March 21, 2026 18:21
- Add i18next and react-i18next configuration (i18n.ts)
- Create German (de) and English (en) locale JSON files with all UI strings
- Add LanguageContext following ThemeContext pattern for language state management
- Add useLanguage hook following useTheme pattern
- Add LanguageSwitcher component (DE/EN toggle buttons) in sidebar
- Wrap App with LanguageProvider inside ThemeProvider
- Import i18n in main.tsx before App
- Update UserHeader with translations and LanguageSwitcher
- Update MainLayout with translations
- Update NavigationItem to use t('nav.<id>') for tab labels
- Update Footer with translations
- Update all pages: Recommendations, Favourites, SearchHistory, AuthVerify, Impressum, Account, Library, Login
- Update RecommendationForm and ResultsDisplay components
- German (de) is the default language; persisted in localStorage under 'language' key
- Prompts, markdown content, proper names, and 'DELETE' confirmation text remain untranslated

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…nslation

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…e support

Co-authored-by: milljoniaer <78978542+milljoniaer@users.noreply.github.com>
Agent-Logs-Url: https://github.com/ls1intum/LEARN-Hub/sessions/16f04be8-eb5b-4046-aaf9-4aca218b1785
Copilot AI changed the title [WIP] Add localization to the application with sidebar switch feat: Add UI localization with German (default) and English language support Mar 21, 2026
Copilot AI requested a review from milljoniaer March 21, 2026 18:32
@milljoniaer milljoniaer marked this pull request as ready for review March 24, 2026 20:00
@milljoniaer milljoniaer merged commit 7254f86 into main Mar 24, 2026
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants