Added a complete yet concise i18n framework with support for four languages

[TangYuanLonelyCat]

Preface

Why did I do this?

Because I like the Heynote project, but when I recommend it to my friends, they often say: "This software is great, too bad there's no Chinese localization." Out of my deep agreement with the project's philosophy, I added an i18n framework and submitted a PR. I sincerely hope this PR can be merged into the main branch – I believe many users will need it.

About using AI assistance

Yes, this PR was generated with AI assistance, specifically in the following areas:

• Language translation (provided by Doubao AI, a subsidiary of ByteDance, China)
• Hardcoded string detection (provided by Qwen3-Coder, a subsidiary of Alibaba Group, China)
• Quick replacement of hardcoded strings (provided by Qwen3-Coder, a subsidiary of Alibaba Group, China)
• Translation of all comments I wrote from Chinese to English (provided by Doubao AI, a subsidiary of ByteDance, China)

Note: The core i18n framework in this PR was created by myself.

Files modified by these changes

1. New i18n core files

1.1 src/locales/i18n-core.ts

• Purpose: Build core translation functionality, no Vue dependency, usable in any environment
• Changes:
  • Define Locale type, supporting 'en', 'zh', 'ja', 'ko', and 'zh-TW' (Traditional Chinese, as a variant of Simplified Chinese, counted under the same language)
  • Import all language files
  • Define messages object to store all language data
  • Implement safeTranslate function, providing safe translation with language fallback and parameter interpolation

1.2 src/locales/i18n.ts

• Purpose: Build Vue plugin to provide i18n functionality for the app
• Changes:
  • Import core functions from ./i18n-core
  • Implement createI18n function to create an i18n instance
  • Add language detection logic, supporting language detection from browser and Electron system
  • Provide Vue plugin installation method
  • Create and export a default i18n instance

1.3 Language files

• Purpose: Provide multilingual support
• Changes:
  • src/locales/en.js: English language file – includes translations for UI, commands, initial content, and keyboard shortcuts
  • src/locales/zh.js: Simplified Chinese language file – includes translations for UI, commands, initial content, and keyboard shortcuts
  • src/locales/ja.js: Japanese language file – includes translations for UI, commands, initial content, and keyboard shortcuts
  • src/locales/ko.js: Korean language file – includes translations for UI, commands, initial content, and keyboard shortcuts
  • src/locales/zh-TW.js: Traditional Chinese language file – as a variant of Simplified Chinese, it is considered under the same language support. Provides Traditional Chinese translations based on the Simplified Chinese version.

2. Modified application files to support i18n

2.1 electron/initial-content.ts

• Purpose: Support multilingual initial hint document
• Changes:
  • Import safeTranslate from ../src/locales/i18n-core
  • Add language detection logic, supporting both development and production modes
  • Use safeTranslate function to translate the initial hint document content
  • Ensure initial content selects language only at initialization

2.2 shared-utils/key-helper.ts

• Purpose: Support multilingual keyboard shortcut hints
• Changes:
  • Import safeTranslate from ../src/locales/i18n-core
  • Add getSystemLocale function to get the current language
  • Modify keyHelpStr function to use safeTranslate for translating shortcut hints

2.3 src/editor/commands.js

• Purpose: Support multilingual commands
• Changes:
  • Import i18n from ../locales/i18n
  • Modify command descriptions to use i18n.t() for translating command names
  • Use getter properties to ensure command descriptions update when language changes

2.4 Component files

• Purpose: Support multilingual UI
• Changes:
  • src/components/BufferSelector.vue: Import i18n, translate UI elements
  • src/components/settings/Settings.vue: Import i18n, translate settings UI
  • src/components/UpdateStatusItem.vue: Import i18n, translate update status
  • src/components/EditBuffer.vue: Import i18n, translate editing UI
  • src/components/App.vue: Import i18n, translate application UI
  • src/components/NewBuffer.vue: Import i18n, translate new buffer UI
  • src/editor/search/InputToggle.vue: Import i18n, translate search UI

Final results

3.1 Language detection

• Implementation:
  • First try to get language from the browser
  • Then try to get language from the Electron system
  • When an unsupported language is detected, default to English

3.2 Translation system

• Implementation:
  • Core translation functionality implemented in i18n-core.ts
  • Vue plugin implemented in i18n.ts
  • Supports language fallback – falls back to English when a translation is missing
  • Supports parameter interpolation and simple pluralization

3.3 Multilingual support

• Implementation:
  • Create separate language files for each language (English, Simplified Chinese, Japanese, Korean), with Traditional Chinese as a variant of Simplified Chinese
  • Define translation key-value pairs in language files
  • Use safeTranslate function to retrieve translations

4. Error handling and compatibility

1. Language detection optimization: Ensure correct language detection in different environments
2. Complete translation coverage: Includes UI elements, command palette commands, initial hint document, and keyboard shortcut hints
3. Error handling: When translation fails, return the original key name to ensure the app does not crash
4. Backward compatibility: Maintain compatibility with the original API

Summary

• Multilingual support: Supports four languages – English, Simplified Chinese, Japanese, and Korean. Traditional Chinese is provided as a variant of Simplified Chinese, not counted as a separate language.
• Complete translation coverage: All visible parts of the application support multiple languages
• Reliable language detection: Correctly detects language in both development and production modes
• Modular design: Core translation functionality is decoupled from Vue and can be used in any environment

All modifications have been tested to ensure the stability and reliability of the i18n framework.

By TangYuanLonelyCat
This document was summarized by myself and translated by DeepSeek. It has been confirmed that all m
eanings are conveyed accurately.

[TangYuanLonelyCat]

Oh, by the way, I might have forgotten to mention that the initial hint document is generated based on the user's system language, not just English.

[TangYuanLonelyCat]

OK, I've resolved this conflict, and it can now be merged cleanly.
Still, I'd like to hear your thoughts, @heyman.