Skip to content

externalize hardcoded UI strings, add Hebrew translation and RTL support#488

Closed
cdtauman wants to merge 4 commits into
intel:mainfrom
cdtauman:main
Closed

externalize hardcoded UI strings, add Hebrew translation and RTL support#488
cdtauman wants to merge 4 commits into
intel:mainfrom
cdtauman:main

Conversation

@cdtauman
Copy link
Copy Markdown

Description:
This pull request externalizes remaining hardcoded UI text strings into dynamic localization keys in en-US.json (establishing a clean foundation for future language contributions) and introduces full Hebrew translation along with complete Right-to-Left (RTL) layout adaptations across all components.

Related Issue:
None.

Changes Made:

  1. Global UI String Externalization (Paving the way for future languages):

    • Replaced remaining static, hardcoded English strings in App.vue, Chat.vue, PromptArea.vue, and over 60 sub-components with dynamic languages.* references.
    • Restructured and populated en-US.json with unified keys for preset names, descriptions, tags, sample prompts, and advanced settings, allowing any future translation files to easily map the entire application.
  2. Hebrew Localization:

    • Created the core translation file he-IL.json synchronized 100% with the updated English dictionary (0 missing/extra keys).
    • Added Hebrew to the language options list.
  3. RTL Engine & Layout Adaptations:

    • Implemented an isRTL computed property in the i18n store.
    • Added a watcher to dynamically toggle document.documentElement.dir = 'rtl' (or 'ltr') and document.documentElement.lang globally on language swap.
    • Refactored layout margins, paddings, and alignment classes (replacing directional ml-*/mr-* with logical CSS properties like ms-*, me-*, start-*, end-*) to ensure perfect visual presentation in both LTR and RTL.
  4. Dynamic Translation Utilities:

    • Added helper functions (translatePresetName, translatePresetDescription, etc.) in utils.ts to translate dynamically populated presets, descriptions, and tags.

Testing Done:

  • Verified 100% key synchronization between the English and Hebrew dictionaries.
  • Ran static analysis checks:
    • ESLint check (npm run lint:ci) passed successfully with 0 errors.
    • Prettier formatting check (npm run format:ci) passed successfully.
    • TypeScript compilation (npx vue-tsc --noEmit) compiled successfully with no type errors.
  • Manually tested language toggling between LTR (English) and RTL (Hebrew) in the dev environment, verifying that layout flow shifts seamlessly.

cdtauman added 4 commits May 25, 2026 16:47
…implement RTL layout support

- i18n & Localization Dictionaries:
  * Restructured and added new keys to 'en-US.json' (sample prompts for chat/image/video, ComfyUI settings, and unified preset names/descriptions/tags).
  * Synchronized 'he-IL.json' to align 100% with the updated English dictionary (0 missing/extra keys).
  * Registered Hebrew ('he-IL') in the active language options list.

- RTL Layout & Navigation Integration:
  * Implemented 'isRTL' computed state in the i18n store.
  * Added watcher to dynamically toggle 'document.documentElement.dir' ('rtl' / 'ltr') and 'lang' attributes on language swap.
  * Migrated hardcoded margins/paddings (e.g., mr-*, ml-*) to logical CSS properties (me-*, ms-*, start-*, end-*) across 60+ components.

- UI & Code Cleanups:
  * Replaced hardcoded text with dynamic 'languages.*' translation keys in App.vue, Chat.vue, PromptArea.vue, and other sub-components.
  * Created helper translation functions in 'utils.ts' for dynamic presets, descriptions, variants, and tags (e.g., 'translatePresetName').
  * Formatted code to meet project Prettier rules and verified zero ESLint/TS errors.
@cdtauman
Copy link
Copy Markdown
Author

Superseded by #490, which is rebased on the latest main (no merge conflicts) and has a DCO Signed-off-by commit. Please review #490 instead.

@cdtauman cdtauman closed this May 28, 2026
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.

1 participant