style(design): apply Minimal Dark Mode design system\n\n- Switched to complete Dark Mode (OLED-friendly)\n- Established standard color palette matching modern technical aesthetics\n- Changed font to Plus Jakarta Sans for increased legibility\n- Enforced dark mode as default in App.tsx\n- Fixed several React cascading render (setState in useEffect) warnings
This commit is contained in:
1 parent
b80531f8a8
commit
bac7b5591e
738 files changed
+138513
-138123
No files matched your search
@@ -1,30 +1,30 @@
|
||||
# Design: Multilingual Support
|
||||
|
||||
## Architecture
|
||||
|
||||
The application uses `react-i18next` for i18n and `i18next-browser-languagedetector` for language detection. Configuration is centralized in `src/localization/i18n.ts`.
|
||||
|
||||
### Language Resources
|
||||
|
||||
Translation resources are built as JSON objects in `i18n.ts` (or split into files if they grow large).
|
||||
We add a `zh-CN` key in the `resources` object.
|
||||
|
||||
### Default Language Strategy
|
||||
|
||||
We introduce the `LanguageDetector` plugin.
|
||||
`i18n.use(LanguageDetector).init({...})` is configured to check `localStorage` first, then `navigator` (browser/system language).
|
||||
`fallbackLng` remains `'en'` as the final fallback.
|
||||
|
||||
### Key Mapping
|
||||
|
||||
Existing English strings are mapped to semantic keys (for example, `home.title`, `settings.theme`).
|
||||
|
||||
## Data Flow
|
||||
|
||||
1. App starts.
|
||||
2. `i18next` initializes and determines language via `LanguageDetector`:
|
||||
* Check whether `localStorage` has a saved preference.
|
||||
* If not, check `navigator.language`.
|
||||
* If detected language is supported (`en` or `zh-CN`), use it.
|
||||
* Otherwise, use `fallbackLng` (`en`).
|
||||
3. Components use `useTranslation` to resolve strings for the active language.
|
||||
# Design: Multilingual Support
|
||||
|
||||
## Architecture
|
||||
|
||||
The application uses `react-i18next` for i18n and `i18next-browser-languagedetector` for language detection. Configuration is centralized in `src/localization/i18n.ts`.
|
||||
|
||||
### Language Resources
|
||||
|
||||
Translation resources are built as JSON objects in `i18n.ts` (or split into files if they grow large).
|
||||
We add a `zh-CN` key in the `resources` object.
|
||||
|
||||
### Default Language Strategy
|
||||
|
||||
We introduce the `LanguageDetector` plugin.
|
||||
`i18n.use(LanguageDetector).init({...})` is configured to check `localStorage` first, then `navigator` (browser/system language).
|
||||
`fallbackLng` remains `'en'` as the final fallback.
|
||||
|
||||
### Key Mapping
|
||||
|
||||
Existing English strings are mapped to semantic keys (for example, `home.title`, `settings.theme`).
|
||||
|
||||
## Data Flow
|
||||
|
||||
1. App starts.
|
||||
2. `i18next` initializes and determines language via `LanguageDetector`:
|
||||
* Check whether `localStorage` has a saved preference.
|
||||
* If not, check `navigator.language`.
|
||||
* If detected language is supported (`en` or `zh-CN`), use it.
|
||||
* Otherwise, use `fallbackLng` (`en`).
|
||||
3. Components use `useTranslation` to resolve strings for the active language.
|
||||
@@ -1,41 +1,41 @@
|
||||
# Proposal: App Localization (Automatic System Language Detection)
|
||||
|
||||
**Change ID:** `localize-app-auto-detect`
|
||||
|
||||
## Summary
|
||||
|
||||
Add multilingual support to Gemini Nexus and automatically set the default UI language based on the user's OS language. If the OS language is unsupported, fall back to English. This includes updating i18n configuration, adding Chinese translation resources, and integrating a language detection plugin.
|
||||
|
||||
## Motivation
|
||||
|
||||
To provide a better user experience, the app should adapt to users' preferred language environment. Automatically detecting system language reduces setup effort and improves first-run experience.
|
||||
|
||||
## Proposed Changes
|
||||
|
||||
1. **Integrate language detection:** Install and configure `i18next-browser-languagedetector` to auto-detect user language.
|
||||
2. **Update i18n config:** Modify `src/localization/i18n.ts` to enable language detection and define a fallback language (English).
|
||||
3. **Add Chinese resources:** Create `zh-CN` translation resources covering all app strings.
|
||||
4. **Update language actions:** Ensure `src/actions/language.ts` correctly handles auto-detection and manual override.
|
||||
5. **UI updates:** Ensure all UI components use translation keys instead of hardcoded text.
|
||||
|
||||
## Alternatives Considered
|
||||
|
||||
* **Force default Chinese:** Rejected, to support a broader international user base and respect system settings.
|
||||
* **Force default English:** Rejected, same reason.
|
||||
|
||||
## Risks
|
||||
|
||||
* **Detection failure:** In certain environments (for example, some Linux distros), language detection may be inaccurate. Fallback behavior must remain reliable.
|
||||
|
||||
## Acceptance Criteria
|
||||
|
||||
1. **Automatic detection:**
|
||||
* When OS language is Simplified Chinese, app defaults to Chinese on first launch.
|
||||
* When OS language is English or another non-Chinese language, app defaults to English on first launch.
|
||||
2. **Manual switching:**
|
||||
* Users can switch from Chinese to English in Settings, and UI updates immediately without restart.
|
||||
* Users can switch from English to Chinese in Settings, and UI updates immediately without restart.
|
||||
3. **Persistence:**
|
||||
* After users manually change language, app restart preserves the selected language instead of re-detecting.
|
||||
4. **Completeness:**
|
||||
* All visible strings (home page, settings page, status bar, popups) render correctly in the selected language with no leftover hardcoded text.
|
||||
# Proposal: App Localization (Automatic System Language Detection)
|
||||
|
||||
**Change ID:** `localize-app-auto-detect`
|
||||
|
||||
## Summary
|
||||
|
||||
Add multilingual support to Gemini Nexus and automatically set the default UI language based on the user's OS language. If the OS language is unsupported, fall back to English. This includes updating i18n configuration, adding Chinese translation resources, and integrating a language detection plugin.
|
||||
|
||||
## Motivation
|
||||
|
||||
To provide a better user experience, the app should adapt to users' preferred language environment. Automatically detecting system language reduces setup effort and improves first-run experience.
|
||||
|
||||
## Proposed Changes
|
||||
|
||||
1. **Integrate language detection:** Install and configure `i18next-browser-languagedetector` to auto-detect user language.
|
||||
2. **Update i18n config:** Modify `src/localization/i18n.ts` to enable language detection and define a fallback language (English).
|
||||
3. **Add Chinese resources:** Create `zh-CN` translation resources covering all app strings.
|
||||
4. **Update language actions:** Ensure `src/actions/language.ts` correctly handles auto-detection and manual override.
|
||||
5. **UI updates:** Ensure all UI components use translation keys instead of hardcoded text.
|
||||
|
||||
## Alternatives Considered
|
||||
|
||||
* **Force default Chinese:** Rejected, to support a broader international user base and respect system settings.
|
||||
* **Force default English:** Rejected, same reason.
|
||||
|
||||
## Risks
|
||||
|
||||
* **Detection failure:** In certain environments (for example, some Linux distros), language detection may be inaccurate. Fallback behavior must remain reliable.
|
||||
|
||||
## Acceptance Criteria
|
||||
|
||||
1. **Automatic detection:**
|
||||
* When OS language is Simplified Chinese, app defaults to Chinese on first launch.
|
||||
* When OS language is English or another non-Chinese language, app defaults to English on first launch.
|
||||
2. **Manual switching:**
|
||||
* Users can switch from Chinese to English in Settings, and UI updates immediately without restart.
|
||||
* Users can switch from English to Chinese in Settings, and UI updates immediately without restart.
|
||||
3. **Persistence:**
|
||||
* After users manually change language, app restart preserves the selected language instead of re-detecting.
|
||||
4. **Completeness:**
|
||||
* All visible strings (home page, settings page, status bar, popups) render correctly in the selected language with no leftover hardcoded text.
|
||||
@@ -1,59 +1,59 @@
|
||||
# Spec: Localization
|
||||
|
||||
## ADDED Requirements
|
||||
|
||||
### Requirement: Automatic Language Detection
|
||||
|
||||
On first launch, the application MUST automatically detect the user's system language and set the corresponding UI language.
|
||||
|
||||
#### Scenario: System language is Chinese
|
||||
|
||||
Given the user opens the app for the first time
|
||||
And the user's system language is set to Chinese (`zh-CN`)
|
||||
And no language preference is saved in local storage
|
||||
When the app loads
|
||||
Then the UI should be displayed in Simplified Chinese (`zh-CN`)
|
||||
|
||||
#### Scenario: System language is non-Chinese
|
||||
|
||||
Given the user opens the app for the first time
|
||||
And the user's system language is set to French (`fr`)
|
||||
And no language preference is saved in local storage
|
||||
When the app loads
|
||||
Then the UI should fall back to English (`en`)
|
||||
|
||||
### Requirement: Language Switching
|
||||
|
||||
Users MUST be able to switch between supported languages, and manual selection MUST override automatic detection.
|
||||
|
||||
#### Scenario: Switch language
|
||||
|
||||
Given the user is on the settings page
|
||||
When the user selects "English" from the language dropdown
|
||||
Then the UI should switch to English immediately
|
||||
And the preference should be saved to local storage
|
||||
|
||||
### Requirement: Persistence
|
||||
|
||||
The user's manual language preference MUST persist across sessions and take precedence over system language.
|
||||
|
||||
#### Scenario: Persist language preference
|
||||
|
||||
Given the user has manually selected "English" as preferred language
|
||||
And the user's system language is Chinese
|
||||
When the user restarts the app
|
||||
Then the UI should display English (respecting user preference)
|
||||
|
||||
## MODIFIED Requirements
|
||||
|
||||
### Requirement: Update i18n Configuration
|
||||
|
||||
i18n configuration MUST be updated to support the language detection plugin.
|
||||
|
||||
#### Scenario: i18n configuration
|
||||
|
||||
`src/localization/i18n.ts` must be updated to:
|
||||
|
||||
1. Integrate `i18next-browser-languagedetector`.
|
||||
2. Configure detection order as `['localStorage', 'navigator']`.
|
||||
3. Include `zh-CN` resource objects.
|
||||
# Spec: Localization
|
||||
|
||||
## ADDED Requirements
|
||||
|
||||
### Requirement: Automatic Language Detection
|
||||
|
||||
On first launch, the application MUST automatically detect the user's system language and set the corresponding UI language.
|
||||
|
||||
#### Scenario: System language is Chinese
|
||||
|
||||
Given the user opens the app for the first time
|
||||
And the user's system language is set to Chinese (`zh-CN`)
|
||||
And no language preference is saved in local storage
|
||||
When the app loads
|
||||
Then the UI should be displayed in Simplified Chinese (`zh-CN`)
|
||||
|
||||
#### Scenario: System language is non-Chinese
|
||||
|
||||
Given the user opens the app for the first time
|
||||
And the user's system language is set to French (`fr`)
|
||||
And no language preference is saved in local storage
|
||||
When the app loads
|
||||
Then the UI should fall back to English (`en`)
|
||||
|
||||
### Requirement: Language Switching
|
||||
|
||||
Users MUST be able to switch between supported languages, and manual selection MUST override automatic detection.
|
||||
|
||||
#### Scenario: Switch language
|
||||
|
||||
Given the user is on the settings page
|
||||
When the user selects "English" from the language dropdown
|
||||
Then the UI should switch to English immediately
|
||||
And the preference should be saved to local storage
|
||||
|
||||
### Requirement: Persistence
|
||||
|
||||
The user's manual language preference MUST persist across sessions and take precedence over system language.
|
||||
|
||||
#### Scenario: Persist language preference
|
||||
|
||||
Given the user has manually selected "English" as preferred language
|
||||
And the user's system language is Chinese
|
||||
When the user restarts the app
|
||||
Then the UI should display English (respecting user preference)
|
||||
|
||||
## MODIFIED Requirements
|
||||
|
||||
### Requirement: Update i18n Configuration
|
||||
|
||||
i18n configuration MUST be updated to support the language detection plugin.
|
||||
|
||||
#### Scenario: i18n configuration
|
||||
|
||||
`src/localization/i18n.ts` must be updated to:
|
||||
|
||||
1. Integrate `i18next-browser-languagedetector`.
|
||||
2. Configure detection order as `['localStorage', 'navigator']`.
|
||||
3. Include `zh-CN` resource objects.
|
||||
@@ -1,10 +1,10 @@
|
||||
# Tasks: App Localization (Automatic System Language Detection)
|
||||
|
||||
* \[x] Install `i18next-browser-languagedetector`. <!-- id: install-dependency -->
|
||||
* \[x] Update `src/localization/i18n.ts` to configure language detection and include `zh-CN` resources. <!-- id: update-i18n-config -->
|
||||
* \[x] Verify `src/actions/language.ts` logic is compatible with auto-detection. <!-- id: verify-language-actions -->
|
||||
* \[x] Update `src/components/StatusBar.tsx` to use translations. <!-- id: localize-statusbar -->
|
||||
* \[x] Update `src/components/AccountCard.tsx` to use translations. <!-- id: localize-accountcard -->
|
||||
* \[x] Update `src/pages/index.tsx` (home page) to use translations. <!-- id: localize-homepage -->
|
||||
* \[x] Update `src/pages/settings.tsx` to use translations and add a language switcher. <!-- id: localize-settings -->
|
||||
* \[x] Run the app to verify language detection and manual switching. <!-- id: verify-localization -->
|
||||
# Tasks: App Localization (Automatic System Language Detection)
|
||||
|
||||
* \[x] Install `i18next-browser-languagedetector`. <!-- id: install-dependency -->
|
||||
* \[x] Update `src/localization/i18n.ts` to configure language detection and include `zh-CN` resources. <!-- id: update-i18n-config -->
|
||||
* \[x] Verify `src/actions/language.ts` logic is compatible with auto-detection. <!-- id: verify-language-actions -->
|
||||
* \[x] Update `src/components/StatusBar.tsx` to use translations. <!-- id: localize-statusbar -->
|
||||
* \[x] Update `src/components/AccountCard.tsx` to use translations. <!-- id: localize-accountcard -->
|
||||
* \[x] Update `src/pages/index.tsx` (home page) to use translations. <!-- id: localize-homepage -->
|
||||
* \[x] Update `src/pages/settings.tsx` to use translations and add a language switcher. <!-- id: localize-settings -->
|
||||
* \[x] Run the app to verify language detection and manual switching. <!-- id: verify-localization -->
|
||||
Reference in new issue
Block a user