Conversation
|
Caution Review failedPull request was closed or merged during review 📝 WalkthroughWalkthroughReplaces the simple Claude status spinner with a rich card-style Changes
Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 5
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/components/chat/view/subcomponents/ClaudeStatus.tsx`:
- Around line 118-159: The live region (role="status" aria-live="polite" in
ClaudeStatus.tsx) currently contains rapidly-updating UI (animatedDots and the
elapsed/timer display) which triggers noisy screen-reader announcements; fix by
removing these from the live region—either move the animated dots span
(animatedDots) and the elapsedLabel/timer out of the element with role="status"
or mark those elements with aria-hidden="true" (for example the span that
renders animatedDots and the element that renders elapsedLabel) so only
meaningful, infrequent status text (isLoading/cleanStatusText/providerLabel)
remains announced.
- Around line 28-33: The provider label translation should have a defensive
fallback so missing keys (e.g. messageTypes.gemini) don't render raw keys;
update the translation call(s) that use PROVIDER_LABEL_KEYS (the calls around
the current t(...) usage in ClaudeStatus.tsx) to pass a defaultValue (e.g. a
humanized provider name derived from the provider string or a capitalized
provider) so when i18n lookup fails it shows a usable label; ensure all
occurrences that reference PROVIDER_LABEL_KEYS (the lookup for
claude/codex/cursor/gemini) include this defaultValue fallback.
In `@src/i18n/locales/ja/chat.json`:
- Around line 209-235: The new claudeStatus localization entries are still in
English; update the values under "claudeStatus" (including all keys in
"actions": thinking, processing, analyzing, working, computing, reasoning;
"state": live, paused; "elapsed": seconds, minutesSeconds, label, startingNow;
"controls": stopGeneration, pressEscToStop; and "providers.assistant") to their
appropriate Japanese translations so the banner displays Japanese text for
Japanese users while preserving the same key names and interpolation
placeholders (e.g., {{count}}, {{minutes}}, {{seconds}}, {{time}}).
In `@src/i18n/locales/ko/chat.json`:
- Around line 218-244: Translate all English values under the claudeStatus
object to Korean while preserving interpolation tokens and keys; update
claudeStatus.actions (thinking, processing, analyzing, working, computing,
reasoning), claudeStatus.state (live, paused), claudeStatus.elapsed (seconds,
minutesSeconds, label, startingNow) and claudeStatus.controls (stopGeneration,
pressEscToStop) plus claudeStatus.providers.assistant with appropriate Korean
strings, keeping placeholders like {{count}}, {{minutes}}, {{seconds}}, and
{{time}} intact and not altering key names or punctuation.
In `@src/i18n/locales/zh-CN/chat.json`:
- Around line 218-244: The claudeStatus block in the zh-CN locale contains
English strings; update the values under the "claudeStatus" object to Simplified
Chinese for all keys so the processing banner and controls are translated.
Specifically translate the keys in claudeStatus.actions ("thinking",
"processing", "analyzing", "working", "computing", "reasoning"),
claudeStatus.state ("live", "paused"), claudeStatus.elapsed ("seconds",
"minutesSeconds", "label", "startingNow"), claudeStatus.controls
("stopGeneration", "pressEscToStop"), and claudeStatus.providers ("assistant")
to appropriate Simplified Chinese text while preserving the JSON keys and
interpolation placeholders like {{count}}, {{minutes}}, {{seconds}}, and
{{time}}.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: c92ae4ee-1187-4e4c-84d1-2b04c07c13b3
📒 Files selected for processing (5)
src/components/chat/view/subcomponents/ClaudeStatus.tsxsrc/i18n/locales/en/chat.jsonsrc/i18n/locales/ja/chat.jsonsrc/i18n/locales/ko/chat.jsonsrc/i18n/locales/zh-CN/chat.json
| const PROVIDER_LABEL_KEYS: Record<string, string> = { | ||
| claude: 'messageTypes.claude', | ||
| codex: 'messageTypes.codex', | ||
| cursor: 'messageTypes.cursor', | ||
| gemini: 'messageTypes.gemini', | ||
| }; |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
# First, verify the file exists and examine the code at the specified lines
head -110 src/components/chat/view/subcomponents/ClaudeStatus.tsx | tail -80Repository: siteboon/claudecodeui
Length of output: 2536
🏁 Script executed:
# Run the provided verification script to check locale coverage
#!/bin/bash
set -euo pipefail
python - <<'PY'
import json
import glob
required = ["claude", "cursor", "codex", "gemini"]
for path in sorted(glob.glob("src/i18n/locales/*/chat.json")):
with open(path, "r", encoding="utf-8") as f:
data = json.load(f)
message_types = data.get("messageTypes", {})
missing = [k for k in required if k not in message_types]
if missing:
print(f"{path}: missing messageTypes keys -> {', '.join(missing)}")
PYRepository: siteboon/claudecodeui
Length of output: 131
🏁 Script executed:
# Check the structure of the messageTypes in one locale file to understand the format
cat src/i18n/locales/en/chat.json | jq '.messageTypes' | head -20Repository: siteboon/claudecodeui
Length of output: 206
🏁 Script executed:
# Search for where PROVIDER_LABEL_KEYS is used, particularly around lines 98-101
grep -n "providerLabelKey\|PROVIDER_LABEL_KEYS" src/components/chat/view/subcomponents/ClaudeStatus.tsxRepository: siteboon/claudecodeui
Length of output: 256
Add a defensive fallback for provider label translations.
The Japanese locale (src/i18n/locales/ja/chat.json) is missing the messageTypes.gemini key. Without a defaultValue in the translation call at line 100, the UI will render the literal key string "messageTypes.gemini" instead of a user-facing label when this provider is selected with that locale.
🛡️ Suggested hardening
const PROVIDER_LABEL_KEYS: Record<string, string> = {
claude: 'messageTypes.claude',
codex: 'messageTypes.codex',
cursor: 'messageTypes.cursor',
gemini: 'messageTypes.gemini',
};
+
+const PROVIDER_LABEL_FALLBACKS: Record<string, string> = {
+ claude: 'Claude',
+ codex: 'Codex',
+ cursor: 'Cursor',
+ gemini: 'Gemini',
+};
@@
const providerLabelKey = PROVIDER_LABEL_KEYS[provider];
const providerLabel = providerLabelKey
- ? t(providerLabelKey)
+ ? t(providerLabelKey, {
+ defaultValue: PROVIDER_LABEL_FALLBACKS[provider] ?? 'Assistant',
+ })
: t('claudeStatus.providers.assistant', { defaultValue: 'Assistant' });Also applies to: 98-101
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/chat/view/subcomponents/ClaudeStatus.tsx` around lines 28 -
33, The provider label translation should have a defensive fallback so missing
keys (e.g. messageTypes.gemini) don't render raw keys; update the translation
call(s) that use PROVIDER_LABEL_KEYS (the calls around the current t(...) usage
in ClaudeStatus.tsx) to pass a defaultValue (e.g. a humanized provider name
derived from the provider string or a capitalized provider) so when i18n lookup
fails it shows a usable label; ensure all occurrences that reference
PROVIDER_LABEL_KEYS (the lookup for claude/codex/cursor/gemini) include this
defaultValue fallback.
| "claudeStatus": { | ||
| "actions": { | ||
| "thinking": "Thinking", | ||
| "processing": "Processing", | ||
| "analyzing": "Analyzing", | ||
| "working": "Working", | ||
| "computing": "Computing", | ||
| "reasoning": "Reasoning" | ||
| }, | ||
| "state": { | ||
| "live": "Live", | ||
| "paused": "Paused" | ||
| }, | ||
| "elapsed": { | ||
| "seconds": "{{count}}s", | ||
| "minutesSeconds": "{{minutes}}m {{seconds}}s", | ||
| "label": "{{time}} elapsed", | ||
| "startingNow": "Starting now" | ||
| }, | ||
| "controls": { | ||
| "stopGeneration": "Stop Generation", | ||
| "pressEscToStop": "Press Esc anytime to stop" | ||
| }, | ||
| "providers": { | ||
| "assistant": "Assistant" | ||
| } | ||
| } |
There was a problem hiding this comment.
Localize the new claudeStatus entries for Japanese users.
The added status/action/control strings are English, which breaks expected Japanese localization in the new banner.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/i18n/locales/ja/chat.json` around lines 209 - 235, The new claudeStatus
localization entries are still in English; update the values under
"claudeStatus" (including all keys in "actions": thinking, processing,
analyzing, working, computing, reasoning; "state": live, paused; "elapsed":
seconds, minutesSeconds, label, startingNow; "controls": stopGeneration,
pressEscToStop; and "providers.assistant") to their appropriate Japanese
translations so the banner displays Japanese text for Japanese users while
preserving the same key names and interpolation placeholders (e.g., {{count}},
{{minutes}}, {{seconds}}, {{time}}).
| "claudeStatus": { | ||
| "actions": { | ||
| "thinking": "Thinking", | ||
| "processing": "Processing", | ||
| "analyzing": "Analyzing", | ||
| "working": "Working", | ||
| "computing": "Computing", | ||
| "reasoning": "Reasoning" | ||
| }, | ||
| "state": { | ||
| "live": "Live", | ||
| "paused": "Paused" | ||
| }, | ||
| "elapsed": { | ||
| "seconds": "{{count}}s", | ||
| "minutesSeconds": "{{minutes}}m {{seconds}}s", | ||
| "label": "{{time}} elapsed", | ||
| "startingNow": "Starting now" | ||
| }, | ||
| "controls": { | ||
| "stopGeneration": "Stop Generation", | ||
| "pressEscToStop": "Press Esc anytime to stop" | ||
| }, | ||
| "providers": { | ||
| "assistant": "Assistant" | ||
| } | ||
| }, |
There was a problem hiding this comment.
Provide Korean translations for claudeStatus strings.
The new keys are currently in English, so this locale will not render a localized processing banner.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/i18n/locales/ko/chat.json` around lines 218 - 244, Translate all English
values under the claudeStatus object to Korean while preserving interpolation
tokens and keys; update claudeStatus.actions (thinking, processing, analyzing,
working, computing, reasoning), claudeStatus.state (live, paused),
claudeStatus.elapsed (seconds, minutesSeconds, label, startingNow) and
claudeStatus.controls (stopGeneration, pressEscToStop) plus
claudeStatus.providers.assistant with appropriate Korean strings, keeping
placeholders like {{count}}, {{minutes}}, {{seconds}}, and {{time}} intact and
not altering key names or punctuation.
| "claudeStatus": { | ||
| "actions": { | ||
| "thinking": "Thinking", | ||
| "processing": "Processing", | ||
| "analyzing": "Analyzing", | ||
| "working": "Working", | ||
| "computing": "Computing", | ||
| "reasoning": "Reasoning" | ||
| }, | ||
| "state": { | ||
| "live": "Live", | ||
| "paused": "Paused" | ||
| }, | ||
| "elapsed": { | ||
| "seconds": "{{count}}s", | ||
| "minutesSeconds": "{{minutes}}m {{seconds}}s", | ||
| "label": "{{time}} elapsed", | ||
| "startingNow": "Starting now" | ||
| }, | ||
| "controls": { | ||
| "stopGeneration": "Stop Generation", | ||
| "pressEscToStop": "Press Esc anytime to stop" | ||
| }, | ||
| "providers": { | ||
| "assistant": "Assistant" | ||
| } | ||
| }, |
There was a problem hiding this comment.
Translate claudeStatus copy in the zh-CN locale.
All newly added values are English, so the processing banner remains untranslated for Simplified Chinese users.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/i18n/locales/zh-CN/chat.json` around lines 218 - 244, The claudeStatus
block in the zh-CN locale contains English strings; update the values under the
"claudeStatus" object to Simplified Chinese for all keys so the processing
banner and controls are translated. Specifically translate the keys in
claudeStatus.actions ("thinking", "processing", "analyzing", "working",
"computing", "reasoning"), claudeStatus.state ("live", "paused"),
claudeStatus.elapsed ("seconds", "minutesSeconds", "label", "startingNow"),
claudeStatus.controls ("stopGeneration", "pressEscToStop"), and
claudeStatus.providers ("assistant") to appropriate Simplified Chinese text
while preserving the JSON keys and interpolation placeholders like {{count}},
{{minutes}}, {{seconds}}, and {{time}}.
Processing banner UI now looks like this:
Summary by CodeRabbit
Release Notes