Skip to content

Feature/turkish language support#841

Open
muminkoykiran wants to merge 3 commits into
esphome:mainfrom
muminkoykiran:feature/turkish-language-support
Open

Feature/turkish language support#841
muminkoykiran wants to merge 3 commits into
esphome:mainfrom
muminkoykiran:feature/turkish-language-support

Conversation

@muminkoykiran
Copy link
Copy Markdown

This pull request introduces a major internationalization (i18n) update to the ESPHome Dashboard UI. It replaces nearly all hardcoded UI strings with translation function calls, ensuring that all user-facing text is ready for localization. Additionally, it introduces a new language selector component, allowing users to switch between available languages directly from the interface.

The most important changes are:

Internationalization of UI Text:

  • Replaced hardcoded strings with translation function t() calls across major components, including esphome-header-menu, device cards, dialogs, and the editor, making all user-facing text ready for localization. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12]

Language Selector Feature:

  • Added a new esphome-language-selector component, which provides a UI for users to choose their preferred language. This component is integrated into the header menu. [1] [2]

Dialog and Confirmation Updates:

  • Updated confirmation dialogs and device deletion dialogs to use translated strings, ensuring consistency in modals and prompts. [1] [2] [3]

Import Updates for Translations:

  • Added imports of the translation utility to all relevant files to enable the use of the t() function for UI strings. [1] [2] [3] [4]

These changes collectively enable full support for multiple languages in the ESPHome Dashboard interface.

- Create locales folder with translation system (en.ts, tr.ts, index.ts)
- Add t() function for string translation with interpolation support
- Implement language selector component with persistence
- Update header menu, editor, device cards, and dialogs to use translations
- Support automatic language detection from browser settings
- Language preference stored in localStorage
Updated all Turkish translations to use proper Turkish special characters:
- ş, ğ, ü, ö, ç for lowercase letters
- Ş, Ğ, Ü, Ö, Ç, İ for uppercase letters
- ı for dotless lowercase i

Examples:
- "Iptal" → "İptal"
- "Yukle" → "Yükle"
- "Guncelle" → "Güncelle"
- "Duzenle" → "Düzenle"
- "Cikis Yap" → "Çıkış Yap"
Copilot AI review requested due to automatic review settings December 17, 2025 21:16
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This pull request introduces comprehensive internationalization (i18n) support to the ESPHome Dashboard by replacing hardcoded UI strings with translation function calls and adding Turkish language support. The implementation includes a lightweight translation system with locale persistence, browser language detection, and a user-facing language selector component.

Key Changes:

  • Implemented a translation system with t() function for translating UI strings using dot-notation keys (e.g., t('device.update'))
  • Added Turkish translations for all user-facing text across the dashboard
  • Introduced a language selector component allowing users to switch between English and Turkish

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
src/locales/index.ts Core i18n module with translation function, locale management, and localStorage persistence
src/locales/en.ts Complete English translation strings organized by component and feature area
src/locales/tr.ts Complete Turkish translation strings mirroring the English structure
src/components/esphome-language-selector.ts New language selector component with dropdown menu for switching languages
src/components/esphome-header-menu.ts Updated header menu to use translations and integrate the language selector
src/editor/esphome-editor.ts Replaced hardcoded editor strings with translation calls
src/devices/configured-device-card.ts Replaced device card UI strings with translation calls
src/delete-device/delete-device-dialog.ts Updated delete confirmation dialog to use translations

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/components/esphome-language-selector.ts Outdated
Comment thread src/locales/index.ts Outdated
Comment thread src/components/esphome-language-selector.ts
- Fix Turkish nativeName: "Turkce" → "Türkçe"
- Fix mwc-menu anchor positioning (use query decorator and anchor property like esphome-button-menu)
- Apply Prettier formatting to all modified files

Note: Page reload on locale change is kept for now as implementing
reactive updates without reload would require significant changes
to all components using the t() function.
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