Skip to content

feat: add header language toggle - #71

Merged
aiedwardyi merged 2 commits into
mainfrom
feat/header-language-toggle
Jul 29, 2026
Merged

aiedwardyi merged 2 commits into
mainfrom
feat/header-language-toggle

Conversation

@aiedwardyi

@aiedwardyi aiedwardyi commented Jul 29, 2026

Copy link
Copy Markdown
Owner

Adds a persisted EN/한글 header toggle for desktop and mobile.

Review fixes applied

  • 292bb55 preserves locale preference and mobile fit.

@coderabbitai

coderabbitai Bot commented Jul 29, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Summary by CodeRabbit

  • New Features
    • Added a language toggle to the chat header, allowing users to switch between English and Korean.
    • Saves the selected language and keeps it available across sessions.
    • Improved language switch accessibility by updating the toggle’s label to indicate the target language.
  • Bug Fixes
    • Prevented thread-provided locale from overriding a previously saved user language preference.

Walkthrough

The locale toggle is centralized in ChatPageContent, persisted to localStorage, and shared by ChatHeader and SettingsModal. Thread locale hydration now preserves an existing stored preference, and ChatHeader renders a language button.

Changes

Locale toggle

Layer / File(s) Summary
Shared locale state and wiring
src/app/page.tsx
toggleLocale switches between English and Korean, persists quorum_locale, is passed to both locale controls, and does not overwrite an existing stored preference during thread loading.
Header language control
src/components/Header.tsx
ChatHeader accepts the callback and renders a locale-aware language button with an updated aria-label and responsive spacing.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant ChatHeader
  participant ChatPageContent
  participant localStorage
  User->>ChatHeader: Click language toggle
  ChatHeader->>ChatPageContent: Invoke toggleLocale
  ChatPageContent->>ChatPageContent: Switch locale state
  ChatPageContent->>localStorage: Persist quorum_locale
  ChatPageContent-->>ChatHeader: Updated locale
  ChatHeader-->>User: Display updated language label
Loading

Comment @coderabbitai help to get the list of available commands.

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 3180891981

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread src/components/Header.tsx Outdated

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Actionable comments posted: 3

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/app/page.tsx`:
- Around line 289-295: Update toggleLocale so the functional setLocale updater
only computes and returns the next locale; move the localStorage.setItem side
effect outside that updater while preserving the existing locale toggle behavior
and persistence.
- Around line 289-295: Update toggleLocale and the existing thread update flow
so changing language persists the new locale on the current thread, ensuring
reloads retain the selected language when loading thread.locale. Alternatively,
stop the thread-loading logic from overriding the stored locale, while
preserving locale persistence for both new and existing threads.

In `@src/components/Header.tsx`:
- Around line 366-374: Update the visible text in the locale toggle
motion.button using the same locale condition as aria-label, so it displays the
target language rather than the current language: show Korean when locale is
English and English when locale is Korean. Keep the existing onToggleLocale
behavior and accessibility label unchanged.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro

Run ID: 0f0ce45a-adff-448a-93b6-6d0e380fd585

📥 Commits

Reviewing files that changed from the base of the PR and between cf3342a and 3180891.

📒 Files selected for processing (2)
  • src/app/page.tsx
  • src/components/Header.tsx
📜 Review details
🧰 Additional context used
🪛 React Doctor (0.9.1)
src/app/page.tsx

[error] 290-290: This state updater performs setItem(). React may run updater functions more than once, so side effects here can repeat or observe inconsistent external state.

Keep state updater callbacks pure and return only the next state. Move notifications, storage, timers, ref writes, and other external work into the event or effect that queues the update.

(no-impure-state-updater)


[error] 292-292: This side-effecting call runs inside a state updater, which React may invoke more than once. Move it outside the setter after computing the next state.

React may replay a state updater, so callbacks, analytics, and persistence inside it can run more than once. Compute state purely, then perform the side effect outside the setter.

(no-side-effect-in-state-updater-function)

🔇 Additional comments (2)
src/app/page.tsx (1)

552-552: LGTM!

Also applies to: 567-567

src/components/Header.tsx (1)

87-87: LGTM!

Also applies to: 105-105

Comment thread src/app/page.tsx Outdated
Comment thread src/components/Header.tsx

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/app/page.tsx`:
- Line 503: Update the mount logic around setLocale and quorum_locale so a
stored locale is treated as authoritative only when it is valid ("en" or "ko").
Reuse the existing locale validation used elsewhere, allowing thread.locale
hydration when the stored value is missing or invalid.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro

Run ID: f2ba403b-ac66-4f0a-bbf5-d97dcaf49fa8

📥 Commits

Reviewing files that changed from the base of the PR and between 3180891 and 292bb55.

📒 Files selected for processing (2)
  • src/app/page.tsx
  • src/components/Header.tsx
📜 Review details
⏰ Context from checks skipped due to timeout. (1)
  • GitHub Check: ci
🔇 Additional comments (3)
src/components/Header.tsx (2)

365-374: The visible label still shows the current language.

This is the same unresolved issue previously reported: when the locale is "en", the button displays "EN" even though it switches to Korean, and vice versa. Display the target language instead.


87-87: LGTM!

Also applies to: 105-105, 185-185

src/app/page.tsx (1)

289-294: LGTM!

Also applies to: 550-550, 565-565

Comment thread src/app/page.tsx
@aiedwardyi
aiedwardyi merged commit 4f4362a into main Jul 29, 2026
2 checks passed
@aiedwardyi
aiedwardyi deleted the feat/header-language-toggle branch July 29, 2026 15:51
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