chore(clerk-js,localizations,types): Localize UserButton and OrgSwitcher triggers
#7086
Conversation
🦋 Changeset detectedLatest commit: 00b06d5 The changes in this PR will be included in the next version bump. This PR includes changesets to release 22 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
WalkthroughReplace hardcoded aria-labels in UserButton and OrganizationSwitcher triggers with localized strings; add four localization keys (open/close for user menu and org switcher) to types and many locale files; update English translations, tests, and a changeset to use the new labels. Changes
Sequence Diagram(s)sequenceDiagram
participant Trigger as Component Trigger
participant Loc as useLocalizations()
participant Keys as localizationKeys
participant DOM as Button (aria-label)
Note over Trigger: render / state change
Trigger->>Loc: const t = useLocalizations()
Trigger->>Keys: localizationKeys('userButton.action__openUserMenu' / '...closeUserMenu' or org keys)
Keys-->>Trigger: keyIdentifier
Trigger->>Loc: t(keyIdentifier)
Loc-->>Trigger: localized string
Trigger->>DOM: set aria-label = localized string
Note over DOM: Screen reader announces label (omits redundant "button")
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Comment |
@clerk/agent-toolkit
@clerk/astro
@clerk/backend
@clerk/chrome-extension
@clerk/clerk-js
@clerk/dev-cli
@clerk/elements
@clerk/clerk-expo
@clerk/expo-passkeys
@clerk/express
@clerk/fastify
@clerk/localizations
@clerk/nextjs
@clerk/nuxt
@clerk/clerk-react
@clerk/react-router
@clerk/remix
@clerk/shared
@clerk/tanstack-react-start
@clerk/testing
@clerk/themes
@clerk/types
@clerk/upgrade
@clerk/vue
commit: |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (2)
.changeset/weak-crews-shave.md(1 hunks)packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx(1 hunks)
🧰 Additional context used
📓 Path-based instructions (10)
packages/clerk-js/src/ui/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/clerk-js-ui.mdc)
packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use Prettier for consistent code formatting
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
packages/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
TypeScript is required for all packages
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
packages/**/*.{ts,tsx,d.ts}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Packages should export TypeScript types alongside runtime code
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use proper TypeScript error types
**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoidanytype - preferunknownwhen type is uncertain, then narrow with type guards
Useinterfacefor object shapes that might be extended
Usetypefor unions, primitives, and computed types
Preferreadonlyproperties for immutable data structures
Useprivatefor internal implementation details
Useprotectedfor inheritance hierarchies
Usepublicexplicitly for clarity in public APIs
Preferreadonlyfor properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Useconst assertionsfor literal types:as const
Usesatisfiesoperator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports:import type { ... } from ...
Noanytypes without justification
Proper error handling with typed errors
Consistent use ofreadonlyfor immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
**/*.{jsx,tsx}: Use error boundaries in React components
Minimize re-renders in React components
**/*.{jsx,tsx}: Always use functional components with hooks instead of class components
Follow PascalCase naming for components:UserProfile,NavigationMenu
Keep components focused on a single responsibility - split large components
Limit component size to 150-200 lines; extract logic into custom hooks
Use composition over inheritance - prefer smaller, composable components
Export components as named exports for better tree-shaking
One component per file with matching filename and component name
Use useState for simple state management
Use useReducer for complex state logic
Implement proper state initialization
Use proper state updates with callbacks
Implement proper state cleanup
Use Context API for theme/authentication
Implement proper state selectors
Use proper state normalization
Implement proper state persistence
Use React.memo for expensive components
Implement proper useCallback for handlers
Use proper useMemo for expensive computations
Implement proper virtualization for lists
Use proper code splitting with React.lazy
Implement proper cleanup in useEffect
Use proper refs for DOM access
Implement proper event listener cleanup
Use proper abort controllers for fetch
Implement proper subscription cleanup
Use proper HTML elements
Implement proper ARIA attributes
Use proper heading hierarchy
Implement proper form labels
Use proper button types
Implement proper focus management
Use proper keyboard shortcuts
Implement proper tab order
Use proper skip links
Implement proper focus traps
Implement proper error boundaries
Use proper error logging
Implement proper error recovery
Use proper error messages
Implement proper error fallbacks
Use proper form validation
Implement proper error states
Use proper error messages
Implement proper form submission
Use proper form reset
Use proper component naming
Implement proper file naming
Use proper prop naming
Implement proper...
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.{js,ts,tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/react.mdc)
**/*.tsx: Use proper type definitions for props and state
Leverage TypeScript's type inference where possible
Use proper event types for handlers
Implement proper generic types for reusable components
Use proper type guards for conditional rendering
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
.changeset/**
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Automated releases must use Changesets.
Files:
.changeset/weak-crews-shave.md
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (29)
- GitHub Check: Integration Tests (billing, chrome)
- GitHub Check: Integration Tests (nextjs, chrome, 14)
- GitHub Check: Integration Tests (quickstart, chrome, 16)
- GitHub Check: Integration Tests (expo-web, chrome)
- GitHub Check: Integration Tests (quickstart, chrome, 15)
- GitHub Check: Integration Tests (custom, chrome)
- GitHub Check: Integration Tests (react-router, chrome)
- GitHub Check: Integration Tests (nextjs, chrome, 16)
- GitHub Check: Integration Tests (machine, chrome)
- GitHub Check: Integration Tests (astro, chrome)
- GitHub Check: Integration Tests (nextjs, chrome, 15)
- GitHub Check: Integration Tests (vue, chrome)
- GitHub Check: Integration Tests (tanstack-react-start, chrome)
- GitHub Check: Integration Tests (handshake:staging, chrome)
- GitHub Check: Integration Tests (nuxt, chrome)
- GitHub Check: Integration Tests (sessions:staging, chrome)
- GitHub Check: Integration Tests (sessions, chrome)
- GitHub Check: Integration Tests (localhost, chrome)
- GitHub Check: Integration Tests (express, chrome)
- GitHub Check: Integration Tests (handshake, chrome)
- GitHub Check: Integration Tests (elements, chrome)
- GitHub Check: Integration Tests (generic, chrome)
- GitHub Check: Integration Tests (ap-flows, chrome)
- GitHub Check: Unit Tests (22, **)
- GitHub Check: Unit Tests (18, --filter=@clerk/astro --filter=@clerk/backend --filter=@clerk/express --filter=@c...
- GitHub Check: Static analysis
- GitHub Check: Publish with pkg-pr-new
- GitHub Check: semgrep-cloud-platform/scan
- GitHub Check: semgrep-cloud-platform/scan
🔇 Additional comments (1)
.changeset/weak-crews-shave.md (1)
1-5: LGTM! Changeset format is correct.The changeset follows the proper format and correctly identifies this as a patch release. The description clearly documents the aria-label update.
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx
Outdated
Show resolved
Hide resolved
alexcarpenter
changed the title
UserButtonTrigger aria-labelUserButton and OrgSwitcher triggers
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx (1)
29-31: Align label with popup role and simplify expression.
- Label says “...menu” while aria-haspopup='dialog'. Confirm actual popup role and align:
- Option A: if it’s a menu, set aria-haspopup='menu'.
- Option B: if it’s a dialog, keep aria-haspopup='dialog' and update the localized text to “...dialog” (or “account”).
Also drop the unnecessary template string:
- aria-label={`${props.isOpen ? t(localizationKeys('userButton.action__closeUserMenu')) : t(localizationKeys('userButton.action__openUserMenu'))}`} + aria-label={props.isOpen + ? t(localizationKeys('userButton.action__closeUserMenu')) + : t(localizationKeys('userButton.action__openUserMenu'))}Run to verify usage and fallbacks:
#!/bin/bash # 1) Ensure these keys exist with strings in en-US (fallback) rg -n "action__openUserMenu|action__closeUserMenu|action__openOrganizationSwitcher|action__closeOrganizationSwitcher" packages/localizations/src/en-US.ts -C2 || true # 2) Ensure OrganizationSwitcherTrigger consumes new keys rg -nP "OrganizationSwitcherTrigger|organizationSwitcher\.action__openOrganizationSwitcher|organizationSwitcher\.action__closeOrganizationSwitcher" packages -C2 || true
🧹 Nitpick comments (46)
packages/localizations/src/he-IL.ts (1)
487-487: Structure is correct; consider adding Hebrew translations for accessibility.The new localization keys are correctly placed and consistent with the file's existing pattern of using
undefinedfor untranslated strings. However, since these keys provide ARIA labels for screen reader users, having them undefined may degrade the accessibility experience for Hebrew-speaking users with disabilities.Consider translating these keys:
action__closeOrganizationSwitcher→ "סגור מחליף ארגון"action__openOrganizationSwitcher→ "פתח מחליף ארגון"action__closeUserMenu→ "סגור תפריט משתמש"action__openUserMenu→ "פתח תפריט משתמש"Would you like me to open an issue to track adding Hebrew translations for these accessibility strings, or would you prefer to handle the translations in this PR?
Also applies to: 491-491, 936-936, 938-938
packages/localizations/src/vi-VN.ts (2)
497-497: Vietnamese translations missing for new OrganizationSwitcher aria-labels.The new localization keys are set to
undefined, which means Vietnamese users will fall back to default strings. While this is consistent with the file's existing pattern (many keys are undefined), consider adding Vietnamese translations for better accessibility:
action__closeOrganizationSwitcher: Could be "Đóng bộ chuyển đổi tổ chức"action__openOrganizationSwitcher: Could be "Mở bộ chuyển đổi tổ chức"Apply this diff to add Vietnamese translations:
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Đóng bộ chuyển đổi tổ chức', action__createOrganization: 'Tạo tổ chức', action__invitationAccept: 'Tham gia', action__manageOrganization: 'Quản lý', - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Mở bộ chuyển đổi tổ chức',Also applies to: 501-501
952-952: Vietnamese translations missing for new UserButton aria-labels.The new localization keys are set to
undefined, which means Vietnamese users will fall back to default strings. While this is consistent with the file's existing pattern, consider adding Vietnamese translations to improve accessibility for Vietnamese users:
action__closeUserMenu: Could be "Đóng menu người dùng"action__openUserMenu: Could be "Mở menu người dùng"Note: These keys correctly use "menu" instead of "button" to address the WCAG accessibility issue mentioned in the PR objectives.
Apply this diff to add Vietnamese translations:
action__addAccount: 'Thêm tài khoản', - action__closeUserMenu: undefined, + action__closeUserMenu: 'Đóng menu người dùng', action__manageAccount: 'Quản lý tài khoản', - action__openUserMenu: undefined, + action__openUserMenu: 'Mở menu người dùng', action__signOut: 'Đăng xuất',Also applies to: 954-954
packages/localizations/src/da-DK.ts (1)
941-948: Consider providing Danish translations for the new accessibility aria-label keys.These keys directly address the WCAG audit failure mentioned in the PR objectives. While
undefinedis consistent with the community-maintained nature of this file, providing Danish translations would ensure Danish-speaking users also benefit from the accessibility improvements.Suggested Danish translations:
action__openUserMenu: 'Åbn brugermenu'action__closeUserMenu: 'Luk brugermenu'Note: The key naming correctly uses "UserMenu" instead of "UserButton", avoiding the redundant "button" announcement that triggered the WCAG audit failure.
packages/localizations/src/bg-BG.ts (1)
944-944: User menu aria-label keys added; good.Same note: fallback to en-US is acceptable short-term; consider adding BG translations later.
Also applies to: 947-947
packages/localizations/src/es-MX.ts (2)
496-496: Provide es-MX translations for selector aria-labels.Recommended strings:
- Abrir selector de organización
- Cerrar selector de organización
Apply:
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Cerrar selector de organización', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Abrir selector de organización',Also applies to: 500-500
956-956: Provide es-MX translations for user menu aria-labels.Recommended strings:
- Abrir menú de usuario
- Cerrar menú de usuario
- action__closeUserMenu: undefined, + action__closeUserMenu: 'Cerrar menú de usuario', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Abrir menú de usuario',Also applies to: 959-959
packages/localizations/src/sr-RS.ts (2)
491-491: Keys added; rely on fallback for now.Optional future translations (to be validated by a native speaker):
- Zatvori birač organizacije
- Otvori birač organizacije
Also applies to: 495-495
945-945: Keys added; rely on fallback for now.Optional future translations:
- Zatvori korisnički meni
- Otvori korisnički meni
Also applies to: 947-947
packages/localizations/src/kk-KZ.ts (2)
484-484: Keys added; OK to fallback to en-US.Consider native translations later (examples only):
- Ұйым таңдағышын жабу / ашу
Also applies to: 488-488
935-935: Keys added; OK to fallback to en-US.Consider native translations later:
- Пайдаланушы мәзірін жабу / ашу
Also applies to: 937-937
packages/localizations/src/ru-RU.ts (2)
499-499: Add ru-RU translations for selector aria-labels.Recommended:
- Открыть выбор организации
- Закрыть выбор организации
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Закрыть выбор организации', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Открыть выбор организации',Also applies to: 503-503
960-960: Add ru-RU translations for user menu aria-labels.Recommended:
- Открыть меню пользователя
- Закрыть меню пользователя
- action__closeUserMenu: undefined, + action__closeUserMenu: 'Закрыть меню пользователя', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Открыть меню пользователя',Also applies to: 962-962
packages/localizations/src/nb-NO.ts (1)
492-497: Localize ARIA labels (avoid “knapp”).Recommended Bokmål strings:
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Lukk organisasjonsvelger', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Åpne organisasjonsvelger', @@ userButton: { action__addAccount: 'Legg til konto', - action__closeUserMenu: undefined, + action__closeUserMenu: 'Lukk brukermeny', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Åpne brukermeny',Also applies to: 945-948
packages/localizations/src/ja-JP.ts (1)
492-497: Add Japanese ARIA labels (avoid 「ボタン」).Concise, imperative labels:
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: '組織スイッチャーを閉じる', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: '組織スイッチャーを開く', @@ userButton: { action__addAccount: 'アカウントの追加', - action__closeUserMenu: undefined, + action__closeUserMenu: 'ユーザーメニューを閉じる', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'ユーザーメニューを開く',Also applies to: 948-951
packages/localizations/src/pl-PL.ts (1)
492-497: Add Polish ARIA labels (avoid “przycisk”).Suggested translations:
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Zamknij przełącznik organizacji', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Otwórz przełącznik organizacji', @@ userButton: { action__addAccount: 'Dodaj konto', - action__closeUserMenu: undefined, + action__closeUserMenu: 'Zamknij menu użytkownika', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Otwórz menu użytkownika',Also applies to: 954-957
packages/localizations/src/ro-RO.ts (1)
500-505: Localize Romanian ARIA labels (avoid “buton”).Recommended strings:
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Închide selectorul de organizații', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Deschide selectorul de organizații', @@ userButton: { action__addAccount: 'Adaugă cont', - action__closeUserMenu: undefined, + action__closeUserMenu: 'Închide meniul utilizatorului', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Deschide meniul utilizatorului',Also applies to: 960-963
packages/localizations/src/hu-HU.ts (1)
492-497: Add Hungarian translations for 4 ARIA label keys to prevent English fallback strings.The keys
action__closeOrganizationSwitcher,action__openOrganizationSwitcher,action__closeUserMenu, andaction__openUserMenuare currentlyundefinedin hu-HU.ts (lines 492, 496, 947, 949), causing Hungarian users to see the en-US fallback strings instead.organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Szervezetválasztó bezárása', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Szervezetválasztó megnyitása', @@ userButton: { action__addAccount: 'Fiók hozzáadása', - action__closeUserMenu: undefined, + action__closeUserMenu: 'Felhasználói menü bezárása', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Felhasználói menü megnyitása',packages/localizations/src/pt-BR.ts (1)
500-505: Provide pt-BR strings for new ARIA labelsRecommend adding translations so pt-BR users get localized labels now.
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Fechar seletor de organização', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Abrir seletor de organização', @@ userButton: { @@ - action__closeUserMenu: undefined, + action__closeUserMenu: 'Fechar menu do usuário', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Abrir menu do usuário',Also applies to: 960-966
.changeset/pretty-walls-burn.md (1)
1-7: Add issue reference and user-facing noteConsider noting the WCAG fix and linking the issue for traceability.
Localize aria-labels within `UserButton` and `OrganizationSwitcher` triggers. + - Fixes USER-3793 (WCAG): remove redundant “button” wording; UserButton trigger now reads “Open user menu”.packages/localizations/src/nl-NL.ts (1)
493-499: Provide nl-NL strings for new ARIA labelsAdd Dutch strings so users get localized labels now.
organizationSwitcher: { - action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Organisatiekiezer sluiten', @@ - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Organisatiekiezer openen', @@ userButton: { @@ - action__closeUserMenu: undefined, + action__closeUserMenu: 'Gebruikersmenu sluiten', @@ - action__openUserMenu: undefined, + action__openUserMenu: 'Gebruikersmenu openen',Also applies to: 944-950
packages/localizations/src/hi-IN.ts (1)
956-959: ARIA label keys for UserButton added — LGTM; consider adding translations later.Good keys; undefined values will fall back to en-US for now. Optional: add locale translations when available to fully localize a11y.
packages/localizations/src/sk-SK.ts (1)
952-955: Add open/close UserButton labels — looks good.Consistent with other locales. Optional: provide SK translations in a follow-up.
packages/localizations/src/uk-UA.ts (1)
942-945: UserButton a11y keys added — OK.Keys align with pattern; fallback will cover until translations are provided.
packages/localizations/src/es-CR.ts (2)
495-500: Add OrganizationSwitcher open/close labels — approved.Consistent keys and formatting. Optional follow-up to add Spanish (CR) translations.
955-958: Add UserButton open/close labels — approved.Matches naming; undefined fallback acceptable. Consider localized strings later to complete a11y coverage.
packages/localizations/src/id-ID.ts (1)
955-958: UserButton a11y keys — LGTM.Consistent with other locales. Optional: add Indonesian translations in a later pass.
packages/localizations/src/en-GB.ts (2)
492-497: Keys added for OrganizationSwitcher actions.
Looks good. Ensure en-US provides default strings so en-GB can safely fall back. Optionally, provide en-GB strings to avoid fallback.
951-954: Keys added for UserButton actions.
Matches component usage. Same note on ensuring en-US fallbacks or adding en-GB strings.packages/localizations/src/de-DE.ts (2)
503-508: Add German strings when ready; fallback acceptable meanwhile.
Keys added for OrganizationSwitcher actions. Approve; consider providing German translations in a follow-up.
972-975: UserButton action keys added.
Approve; same optional note on adding German strings to avoid fallback.packages/localizations/src/te-IN.ts (1)
494-494: Localize or annotate ARIA labels (no “button” in text).Consider adding Telugu strings for these keys, or at least translator notes to avoid English fallback and to keep labels as “Open/Close … menu/switcher” without the control type.
Also applies to: 498-498, 957-957, 960-960
packages/localizations/src/es-UY.ts (1)
494-494: Provide Spanish (UY) strings to avoid English fallback.Proposed translations (concise, no “button” term):
- OrganizationSwitcher: “Cerrar selector de organización” / “Abrir selector de organización”
- UserButton: “Cerrar menú de usuario” / “Abrir menú de usuario”
Apply this diff in-place:
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Cerrar selector de organización', ... - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Abrir selector de organización', ... - action__closeUserMenu: undefined, + action__closeUserMenu: 'Cerrar menú de usuario', ... - action__openUserMenu: undefined, + action__openUserMenu: 'Abrir menú de usuario',Also applies to: 498-498, 957-957, 960-960
packages/localizations/src/es-ES.ts (1)
493-493: Fill new ARIA label keys with es-ES strings.Suggested:
- OrganizationSwitcher: “Cerrar selector de organización” / “Abrir selector de organización”
- UserButton: “Cerrar menú de usuario” / “Abrir menú de usuario”
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Cerrar selector de organización', ... - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Abrir selector de organización', ... - action__closeUserMenu: undefined, + action__closeUserMenu: 'Cerrar menú de usuario', ... - action__openUserMenu: undefined, + action__openUserMenu: 'Abrir menú de usuario',Also applies to: 497-497, 949-949, 952-952
packages/localizations/src/nl-BE.ts (1)
493-493: Add Dutch (BE) strings for ARIA labels.Suggested:
- OrganizationSwitcher: “Organisatiekiezer sluiten” / “Organisatiekiezer openen”
- UserButton: “Gebruikersmenu sluiten” / “Gebruikersmenu openen”
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Organisatiekiezer sluiten', ... - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Organisatiekiezer openen', ... - action__closeUserMenu: undefined, + action__closeUserMenu: 'Gebruikersmenu sluiten', ... - action__openUserMenu: undefined, + action__openUserMenu: 'Gebruikersmenu openen',Also applies to: 497-497, 945-945, 948-948
packages/localizations/src/ar-SA.ts (1)
490-495: New a11y localization keys added as placeholdersFour new keys are
undefined. If this locale is enabled in production, ensure fallback to en-US works so aria-labels aren’t empty. Optionally add Arabic translations to avoid English fallback.Also applies to: 943-946
packages/localizations/src/ko-KR.ts (1)
489-494: Placeholders for new a11y labelsThese keys are
undefined. Please confirm fallback to en-US exists for aria-labels, or provide Korean strings to avoid English in ko-KR UIs.Also applies to: 939-942
packages/localizations/src/pt-PT.ts (1)
491-496: Add translations or confirm fallback for new aria-label keysThe new keys are
undefined. If pt-PT is shipped, confirm en-US fallback; optionally translate:
- organizationSwitcher.open/close → “Abrir/Fechar seletor de organização”
- userButton.open/close → “Abrir/Fechar menu do utilizador”
Also applies to: 945-948
packages/localizations/src/zh-TW.ts (1)
483-488: Ensure non-empty aria-labels via fallback or provide zh-TW stringsKeys are
undefined. Please confirm en-US fallback is active, or add zh-TW:
- 開啟/關閉組織切換器
- 開啟/關閉使用者選單
Also applies to: 930-933
packages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx (2)
25-47: Avoidtshadowing (theme vs localization) for readabilityBoth the theme function in
sxand the localization translator are namedt. Rename the localization binding to prevent confusion.- const { t } = useLocalizations(); + const { t: l10n } = useLocalizations(); ... - aria-label={`${props.isOpen ? t(localizationKeys('organizationSwitcher.action__closeOrganizationSwitcher')) : t(localizationKeys('organizationSwitcher.action__openOrganizationSwitcher'))}`} + aria-label={ + props.isOpen + ? l10n(localizationKeys('organizationSwitcher.action__closeOrganizationSwitcher')) + : l10n(localizationKeys('organizationSwitcher.action__openOrganizationSwitcher')) + }Also applies to: 49-49
81-112: Add explicit return typeFor consistency with repo TS guidelines, annotate the component’s return type.
-const NotificationCountBadgeSwitcherTrigger = () => { +const NotificationCountBadgeSwitcherTrigger = (): JSX.Element | null => {packages/localizations/src/fi-FI.ts (1)
493-498: Fill or verify fallback for new aria-label keysKeys are
undefined. Confirm en-US fallback or add Finnish:
- organizationSwitcher.open/close → “Avaa/Sulje organisaatiovalitsin”
- userButton.open/close → “Avaa/Sulje käyttäjävalikko”
Also applies to: 946-949
packages/localizations/src/sv-SE.ts (1)
492-497: Keys added; confirm fallback to en-US for undefined values.If runtime falls back to en-US, this is fine to ship; otherwise, consider adding Swedish strings before release. I can help open a translation follow-up.
Also applies to: 948-951
packages/localizations/src/fr-FR.ts (1)
505-510: Provide FR translations for new ARIA labels.Suggested translations below.
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Fermer le sélecteur d’organisation', ... - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Ouvrir le sélecteur d’organisation',- action__closeUserMenu: undefined, + action__closeUserMenu: 'Fermer le menu utilisateur', ... - action__openUserMenu: undefined, + action__openUserMenu: 'Ouvrir le menu utilisateur',Also applies to: 965-968
packages/localizations/src/be-BY.ts (1)
496-501: Add translator context or confirm fallback.Undefined is OK if fallback renders en-US. If possible, add a brief comment for translators (context: trigger button label for opening/closing menus).
Also applies to: 952-955
packages/localizations/src/fa-IR.ts (1)
498-503: Add FA translations for ARIA labels (RTL-friendly).Proposed strings; please have a native speaker review.
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'بستن انتخابگر سازمان', ... - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'باز کردن انتخابگر سازمان',- action__closeUserMenu: undefined, + action__closeUserMenu: 'بستن منوی کاربر', ... - action__openUserMenu: undefined, + action__openUserMenu: 'باز کردن منوی کاربر',Also applies to: 955-958
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (53)
.changeset/pretty-walls-burn.md(1 hunks)packages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx(3 hunks)packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx(2 hunks)packages/localizations/src/ar-SA.ts(2 hunks)packages/localizations/src/be-BY.ts(2 hunks)packages/localizations/src/bg-BG.ts(2 hunks)packages/localizations/src/bn-IN.ts(2 hunks)packages/localizations/src/ca-ES.ts(2 hunks)packages/localizations/src/cs-CZ.ts(2 hunks)packages/localizations/src/da-DK.ts(2 hunks)packages/localizations/src/de-DE.ts(2 hunks)packages/localizations/src/el-GR.ts(2 hunks)packages/localizations/src/en-GB.ts(2 hunks)packages/localizations/src/en-US.ts(2 hunks)packages/localizations/src/es-CR.ts(2 hunks)packages/localizations/src/es-ES.ts(2 hunks)packages/localizations/src/es-MX.ts(2 hunks)packages/localizations/src/es-UY.ts(2 hunks)packages/localizations/src/fa-IR.ts(2 hunks)packages/localizations/src/fi-FI.ts(2 hunks)packages/localizations/src/fr-FR.ts(2 hunks)packages/localizations/src/he-IL.ts(2 hunks)packages/localizations/src/hi-IN.ts(2 hunks)packages/localizations/src/hr-HR.ts(2 hunks)packages/localizations/src/hu-HU.ts(2 hunks)packages/localizations/src/id-ID.ts(2 hunks)packages/localizations/src/is-IS.ts(2 hunks)packages/localizations/src/it-IT.ts(2 hunks)packages/localizations/src/ja-JP.ts(2 hunks)packages/localizations/src/kk-KZ.ts(2 hunks)packages/localizations/src/ko-KR.ts(2 hunks)packages/localizations/src/mn-MN.ts(2 hunks)packages/localizations/src/ms-MY.ts(2 hunks)packages/localizations/src/nb-NO.ts(2 hunks)packages/localizations/src/nl-BE.ts(2 hunks)packages/localizations/src/nl-NL.ts(2 hunks)packages/localizations/src/pl-PL.ts(2 hunks)packages/localizations/src/pt-BR.ts(2 hunks)packages/localizations/src/pt-PT.ts(2 hunks)packages/localizations/src/ro-RO.ts(2 hunks)packages/localizations/src/ru-RU.ts(2 hunks)packages/localizations/src/sk-SK.ts(2 hunks)packages/localizations/src/sr-RS.ts(2 hunks)packages/localizations/src/sv-SE.ts(2 hunks)packages/localizations/src/ta-IN.ts(2 hunks)packages/localizations/src/te-IN.ts(2 hunks)packages/localizations/src/th-TH.ts(2 hunks)packages/localizations/src/tr-TR.ts(2 hunks)packages/localizations/src/uk-UA.ts(2 hunks)packages/localizations/src/vi-VN.ts(2 hunks)packages/localizations/src/zh-CN.ts(2 hunks)packages/localizations/src/zh-TW.ts(2 hunks)packages/types/src/localization.ts(2 hunks)
✅ Files skipped from review due to trivial changes (2)
- packages/localizations/src/th-TH.ts
- packages/localizations/src/zh-CN.ts
🧰 Additional context used
📓 Path-based instructions (11)
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use Prettier for consistent code formatting
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
packages/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
TypeScript is required for all packages
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
packages/**/*.{ts,tsx,d.ts}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Packages should export TypeScript types alongside runtime code
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use proper TypeScript error types
**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoidanytype - preferunknownwhen type is uncertain, then narrow with type guards
Useinterfacefor object shapes that might be extended
Usetypefor unions, primitives, and computed types
Preferreadonlyproperties for immutable data structures
Useprivatefor internal implementation details
Useprotectedfor inheritance hierarchies
Usepublicexplicitly for clarity in public APIs
Preferreadonlyfor properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Useconst assertionsfor literal types:as const
Usesatisfiesoperator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports:import type { ... } from ...
Noanytypes without justification
Proper error handling with typed errors
Consistent use ofreadonlyfor immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
packages/localizations/**/*
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Localization files must be placed in 'packages/localizations/'.
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
**/*.{js,ts,tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.
Files:
packages/localizations/src/nl-NL.tspackages/localizations/src/da-DK.tspackages/localizations/src/ms-MY.tspackages/localizations/src/ru-RU.tspackages/localizations/src/pt-PT.tspackages/localizations/src/en-US.tspackages/localizations/src/de-DE.tspackages/localizations/src/bg-BG.tspackages/localizations/src/ta-IN.tspackages/localizations/src/hu-HU.tspackages/localizations/src/sr-RS.tspackages/localizations/src/pl-PL.tspackages/localizations/src/hr-HR.tspackages/localizations/src/ko-KR.tspackages/localizations/src/he-IL.tspackages/localizations/src/sk-SK.tspackages/localizations/src/tr-TR.tspackages/localizations/src/sv-SE.tspackages/localizations/src/pt-BR.tspackages/localizations/src/id-ID.tspackages/localizations/src/en-GB.tspackages/localizations/src/fa-IR.tspackages/localizations/src/nb-NO.tspackages/localizations/src/fr-FR.tspackages/localizations/src/bn-IN.tspackages/localizations/src/is-IS.tspackages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/localizations/src/ja-JP.tspackages/localizations/src/es-UY.tspackages/localizations/src/es-MX.tspackages/localizations/src/es-ES.tspackages/localizations/src/ro-RO.tspackages/localizations/src/ca-ES.tspackages/localizations/src/hi-IN.tspackages/types/src/localization.tspackages/localizations/src/be-BY.tspackages/localizations/src/kk-KZ.tspackages/localizations/src/ar-SA.tspackages/localizations/src/cs-CZ.tspackages/localizations/src/uk-UA.tspackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsxpackages/localizations/src/zh-TW.tspackages/localizations/src/el-GR.tspackages/localizations/src/nl-BE.tspackages/localizations/src/fi-FI.tspackages/localizations/src/te-IN.tspackages/localizations/src/mn-MN.tspackages/localizations/src/es-CR.tspackages/localizations/src/it-IT.tspackages/localizations/src/vi-VN.ts
packages/clerk-js/src/ui/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/clerk-js-ui.mdc)
packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
**/*.{jsx,tsx}: Use error boundaries in React components
Minimize re-renders in React components
**/*.{jsx,tsx}: Always use functional components with hooks instead of class components
Follow PascalCase naming for components:UserProfile,NavigationMenu
Keep components focused on a single responsibility - split large components
Limit component size to 150-200 lines; extract logic into custom hooks
Use composition over inheritance - prefer smaller, composable components
Export components as named exports for better tree-shaking
One component per file with matching filename and component name
Use useState for simple state management
Use useReducer for complex state logic
Implement proper state initialization
Use proper state updates with callbacks
Implement proper state cleanup
Use Context API for theme/authentication
Implement proper state selectors
Use proper state normalization
Implement proper state persistence
Use React.memo for expensive components
Implement proper useCallback for handlers
Use proper useMemo for expensive computations
Implement proper virtualization for lists
Use proper code splitting with React.lazy
Implement proper cleanup in useEffect
Use proper refs for DOM access
Implement proper event listener cleanup
Use proper abort controllers for fetch
Implement proper subscription cleanup
Use proper HTML elements
Implement proper ARIA attributes
Use proper heading hierarchy
Implement proper form labels
Use proper button types
Implement proper focus management
Use proper keyboard shortcuts
Implement proper tab order
Use proper skip links
Implement proper focus traps
Implement proper error boundaries
Use proper error logging
Implement proper error recovery
Use proper error messages
Implement proper error fallbacks
Use proper form validation
Implement proper error states
Use proper error messages
Implement proper form submission
Use proper form reset
Use proper component naming
Implement proper file naming
Use proper prop naming
Implement proper...
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/react.mdc)
**/*.tsx: Use proper type definitions for props and state
Leverage TypeScript's type inference where possible
Use proper event types for handlers
Implement proper generic types for reusable components
Use proper type guards for conditional rendering
Files:
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsxpackages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx
.changeset/**
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Automated releases must use Changesets.
Files:
.changeset/pretty-walls-burn.md
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: Build Packages
- GitHub Check: Formatting | Dedupe | Changeset
- GitHub Check: Analyze (javascript-typescript)
- GitHub Check: semgrep-cloud-platform/scan
- GitHub Check: semgrep-cloud-platform/scan
🔇 Additional comments (27)
packages/localizations/src/tr-TR.ts (2)
492-492: LGTM! OrganizationSwitcher localization keys added correctly.The new
action__closeOrganizationSwitcherandaction__openOrganizationSwitcherkeys are properly structured and positioned within theorganizationSwitchersection. While currentlyundefined, this aligns with the community-maintained nature of this locale (as noted in the file disclaimer) and establishes the foundation for future Turkish translations of the ARIA labels.Also applies to: 496-496
949-949: LGTM! UserButton localization keys support the accessibility improvement.The new
action__closeUserMenuandaction__openUserMenukeys are correctly structured within theuserButtonsection. These keys support the WCAG accessibility fix by enabling localized labels that avoid the redundant "button" announcement issue identified in the audit. Theundefinedplaceholder values are consistent with this community-maintained locale's pattern and allow for future Turkish translations.Also applies to: 951-951
packages/localizations/src/el-GR.ts (2)
491-501: LGTM! Localization keys added correctly.The new
action__closeOrganizationSwitcherandaction__openOrganizationSwitcherkeys follow the established naming convention and are appropriately placed. Theundefinedvalues are expected for this community-maintained locale per the file header disclaimer (lines 1-11). These keys will support localized aria-labels for the OrganizationSwitcher component, improving accessibility.
949-956: LGTM! Accessibility improvements implemented correctly.The new
action__closeUserMenuandaction__openUserMenukeys are properly structured and directly support the WCAG accessibility fix described in the PR objectives. The naming clearly indicates these are for menu states (not "button"), which will eliminate the redundant screen reader announcements when Greek translations are eventually provided. Theundefinedvalues are consistent with this community-maintained locale's pattern.packages/localizations/src/da-DK.ts (1)
491-501: The code is correct as-is; the original suggestion was based on a misunderstanding of how localization fallback works.The four new keys in da-DK.ts are properly set to
undefined, which is the correct approach for community-maintained locales. Clerk's localization system automatically falls back to English translations when keys are undefined, ensuring aria-labels are properly populated for WCAG compliance. The en-US.ts file confirms all four keys have proper English translations:
action__closeOrganizationSwitcher: 'Close organization switcher'action__openOrganizationSwitcher: 'Open organization switcher'action__closeUserMenu: 'Close user menu'action__openUserMenu: 'Open user menu'No Danish translations are needed; the changes correctly maintain accessibility through the fallback mechanism.
Likely an incorrect or invalid review comment.
packages/localizations/src/bg-BG.ts (1)
493-493: Fallback approach confirmed; all aria-label keys have en-US defaults.The undefined values in bg-BG.ts are valid. All four keys (
action__openUserMenu,action__closeUserMenu,action__openOrganizationSwitcher,action__closeOrganizationSwitcher) are defined in en-US with proper strings and will fall back correctly. The components use the translation function to resolve these, and the type system enforces their existence.packages/localizations/src/is-IS.ts (1)
493-499: New aria-label keys added as placeholdersLooks good as placeholder entries; ensure fallback to en-US is wired and no runtime “undefined” leaks to
aria-label.Also applies to: 948-954
packages/localizations/src/bn-IN.ts (1)
493-499: Placeholders added; confirm fallbackThese
undefinedentries are fine if en-US covers them and fallback is guaranteed.Also applies to: 954-960
packages/localizations/src/it-IT.ts (1)
500-506: No action needed—all requirements are met.Verification confirms the implementation is correct:
- en-US provides concrete strings for all keys (
action__openUserMenu,action__closeUserMenu,action__openOrganizationSwitcher,action__closeOrganizationSwitcher)- Type definitions include these keys as
LocalizationValue- Components properly use keys with
isOpenternary logic for aria-labels- Fallback to en-US is guaranteed
packages/localizations/src/sk-SK.ts (1)
492-497: Add open/close OrganizationSwitcher labels — looks good.Naming aligns with surface. Fallback via undefined is acceptable.
Ensure en-US entries exist and components toggle based on expanded state (same script as above).
packages/localizations/src/uk-UA.ts (1)
491-496: OrganizationSwitcher a11y keys added — OK.Keys match the new surface; undefined fallback is fine.
Please confirm en-US text is “Open organization switcher”/“Close organization switcher” (or your chosen phrasing without “button”) and mapped correctly.
packages/localizations/src/id-ID.ts (1)
493-498: OrganizationSwitcher a11y keys — LGTM.Keys are correct; leaving undefined for fallback is fine.
Double-check the triggers bind these keys based on open/close state (same script as earlier).
packages/localizations/src/hi-IN.ts (1)
492-497: ARIA label keys for OrganizationSwitcher and UserButton — verified ✅All implementation details confirmed:
- Types properly defined in
packages/types/src/localization.ts- Components toggle between open/close labels correctly based on
isOpenstate- aria-expanded attributes properly reflect state
- hi-IN undefined values correctly fall back to en-US strings
- No issues found
packages/clerk-js/src/ui/components/UserButton/UserButtonTrigger.tsx (1)
8-8: Good localization wiring.
Using useLocalizations/localizationKeys is correct and aligns with guidelines.Also applies to: 21-21
packages/localizations/src/hr-HR.ts (2)
491-496: OrganizationSwitcher action keys added.
OK to export as undefined placeholders; verify fallback strings exist in en-US.
951-954: UserButton action keys added.
Aligned with UserButtonTrigger usage. Verify en-US has concrete strings.packages/localizations/src/mn-MN.ts (2)
493-498: OrganizationSwitcher action keys introduced.
Consistent with the new accessibility surface. Confirm fallback strings exist.
946-949: UserButton action keys introduced.
Matches the component consumption; rely on en-US fallback until translated.packages/localizations/src/ca-ES.ts (2)
493-498: OrganizationSwitcher open/close keys added.
All good; ensure default strings exist in en-US.
947-950: UserButton open/close keys added.
Good; relies on fallback until localized.packages/localizations/src/ta-IN.ts (1)
495-495: Ensure Tamil translations or translator notes are added to complete localization for new ARIA labels.The en-US defaults ("Close/Open menu/switcher") are already WCAG-compliant and properly used in aria-label attributes. However, ta-IN.ts has undefined values for
action__closeUserMenu,action__openUserMenu,action__closeOrganizationSwitcher, andaction__openOrganizationSwitcher(lines 495, 499, 961, 964). These will fall back to English until translated. Add Tamil strings or translator notes to complete the localization work.packages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherTrigger.tsx (2)
54-67: Possible UI regression: selected organization preview no longer rendersThe trigger only renders PersonalWorkspacePreview when there is no organization. Previously, OrganizationPreview was shown when an org is selected. Confirm this removal was intentional and doesn’t degrade discoverability/target size.
49-51: Aria-label localization verified; implementation is correct.All localization concerns have been confirmed:
- ✓ en-US has both keys populated:
action__closeOrganizationSwitcher("Close organization switcher") andaction__openOrganizationSwitcher("Open organization switcher")- ✓ Old "Open user button" / "Close user button" text fully removed
- ✓ Implementation at line 49 correctly uses localization keys matching the pattern
- ✓ Fallback to en-US works via Clerk's framework default
- ✓ Wording aligns with UserButton pattern ("Open user menu" / "Close user menu")
- ✓ WCAG redundancy eliminated with context-aware aria-labels
packages/localizations/src/ms-MY.ts (1)
494-494: LGTM! Community locale keys properly added with undefined values.The four new localization keys for aria-labels (
action__closeOrganizationSwitcher,action__openOrganizationSwitcher,action__closeUserMenu,action__openUserMenu) are correctly added with undefined values, which is appropriate for community-maintained locales. At runtime, these will fall back to the default English translations until the community provides Malay translations.Also applies to: 498-498, 960-960, 962-962
packages/localizations/src/cs-CZ.ts (1)
497-497: LGTM! Consistent with other community locale additions.The four new aria-label keys are correctly added with undefined values, following the same pattern as the Malay locale and other community contributions in this file. Czech translations can be contributed by the community later.
Also applies to: 501-501, 956-956, 958-958
packages/types/src/localization.ts (2)
935-936: LGTM! Type definitions for UserButton aria-labels correctly added.The two new keys (
action__openUserMenu,action__closeUserMenu) are properly typed asLocalizationValuewithout parameters, which is correct for simple string labels without interpolation. The placement maintains alphabetical ordering within theuserButtonsection.
945-946: LGTM! Type definitions for OrganizationSwitcher aria-labels correctly added.The two new keys (
action__openOrganizationSwitcher,action__closeOrganizationSwitcher) follow the same pattern as the UserButton keys. Proper typing and placement within theorganizationSwitchersection.
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (3)
packages/localizations/src/ru-RU.ts (1)
499-503: Consider providing Russian translations for organization switcher aria-labels.The
organizationSwitcherkeys are currently undefined, which means they'll fall back to the default language. While this is acceptable for a community-contributed localization file, consider adding Russian translations for consistency with theuserButtonsection (lines 960, 962) which already includes translations.Example translations:
- action__closeOrganizationSwitcher: undefined, + action__closeOrganizationSwitcher: 'Закрыть переключатель организаций', action__createOrganization: 'Создать организацию', action__invitationAccept: 'Присоединиться', action__manageOrganization: 'Настройки', - action__openOrganizationSwitcher: undefined, + action__openOrganizationSwitcher: 'Открыть переключатель организаций',packages/localizations/src/pt-PT.ts (1)
491-495: Consider adding Portuguese translations for organization switcher actions.Since the PT-PT locale provides translations for the user menu actions (lines 945-947), it would be more consistent and complete to also provide translations for the organization switcher actions. The expected translations would be:
action__closeOrganizationSwitcher: "Fechar seletor de organização"action__openOrganizationSwitcher: "Abrir seletor de organização"This is not blocking since the application likely has fallback mechanisms for undefined localization values.
packages/localizations/src/es-ES.ts (1)
493-497: Consider adding Spanish translations for OrganizationSwitcher aria-labels.The
userButtonsection (lines 949-951) provides Spanish translations, but theseorganizationSwitcherkeys are undefined. While this is consistent with the incremental translation pattern used throughout this community-contributed file, consider providing translations for consistency:
action__closeOrganizationSwitcher: "Cerrar selector de organización"action__openOrganizationSwitcher: "Abrir selector de organización"
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (15)
packages/localizations/src/ar-SA.ts(2 hunks)packages/localizations/src/bn-IN.ts(2 hunks)packages/localizations/src/de-DE.ts(2 hunks)packages/localizations/src/es-ES.ts(2 hunks)packages/localizations/src/fr-FR.ts(2 hunks)packages/localizations/src/hi-IN.ts(2 hunks)packages/localizations/src/it-IT.ts(2 hunks)packages/localizations/src/ja-JP.ts(2 hunks)packages/localizations/src/ko-KR.ts(2 hunks)packages/localizations/src/nl-NL.ts(2 hunks)packages/localizations/src/pt-BR.ts(2 hunks)packages/localizations/src/pt-PT.ts(2 hunks)packages/localizations/src/ru-RU.ts(2 hunks)packages/localizations/src/zh-CN.ts(2 hunks)packages/localizations/src/zh-TW.ts(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (10)
- packages/localizations/src/zh-CN.ts
- packages/localizations/src/it-IT.ts
- packages/localizations/src/zh-TW.ts
- packages/localizations/src/ar-SA.ts
- packages/localizations/src/de-DE.ts
- packages/localizations/src/nl-NL.ts
- packages/localizations/src/ja-JP.ts
- packages/localizations/src/pt-BR.ts
- packages/localizations/src/ko-KR.ts
- packages/localizations/src/fr-FR.ts
🧰 Additional context used
📓 Path-based instructions (7)
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use Prettier for consistent code formatting
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
packages/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
TypeScript is required for all packages
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
packages/**/*.{ts,tsx,d.ts}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Packages should export TypeScript types alongside runtime code
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/development.mdc)
Use proper TypeScript error types
**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoidanytype - preferunknownwhen type is uncertain, then narrow with type guards
Useinterfacefor object shapes that might be extended
Usetypefor unions, primitives, and computed types
Preferreadonlyproperties for immutable data structures
Useprivatefor internal implementation details
Useprotectedfor inheritance hierarchies
Usepublicexplicitly for clarity in public APIs
Preferreadonlyfor properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Useconst assertionsfor literal types:as const
Usesatisfiesoperator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports:import type { ... } from ...
Noanytypes without justification
Proper error handling with typed errors
Consistent use ofreadonlyfor immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
packages/localizations/**/*
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Localization files must be placed in 'packages/localizations/'.
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
**/*.{js,ts,tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)
Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.
Files:
packages/localizations/src/ru-RU.tspackages/localizations/src/bn-IN.tspackages/localizations/src/pt-PT.tspackages/localizations/src/es-ES.tspackages/localizations/src/hi-IN.ts
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: Formatting | Dedupe | Changeset
- GitHub Check: Analyze (javascript-typescript)
- GitHub Check: semgrep-cloud-platform/scan
- GitHub Check: semgrep-cloud-platform/scan
🔇 Additional comments (5)
packages/localizations/src/ru-RU.ts (1)
960-962: LGTM! Accurate Russian translations provided.The Russian translations for the user menu aria-labels are correct and properly reflect the change from "user button" to "user menu" terminology mentioned in the PR objectives.
packages/localizations/src/pt-PT.ts (1)
945-947: LGTM! User menu translations are accurate.The Portuguese translations for the user menu actions are correct and appropriate for the PT-PT locale.
packages/localizations/src/es-ES.ts (1)
949-951: LGTM! Spanish translations are correct.The Spanish translations for the UserButton aria-labels are accurate and properly address the WCAG audit requirement:
- "Abrir menú de usuario" (Open user menu)
- "Cerrar menú de usuario" (Close user menu)
This correctly removes the redundant "button" wording from the aria-label.
packages/localizations/src/bn-IN.ts (2)
955-955: LGTM! Bengali translations for user menu actions.The Bengali translations correctly reflect the updated terminology from "user button" to "user menu", which aligns with the PR's accessibility objective to avoid redundant screen reader announcements.
- Line 955: "Close user menu" - ব্যবহারকারী মেনু বন্ধ করুন
- Line 957: "Open user menu" - ব্যবহারকারী মেনু খুলুন
Also applies to: 957-957
493-493: ****The original review comment misidentifies a non-issue. The
undefinedvalues fororganizationSwitcherkeys inbn-IN.tsare not inconsistent behavior—they are the intended and consistent pattern across all 60+ locale files in this PR. Specifically:
organizationSwitcherkeys areundefinedin all locales excepten-US(which has full English translations)userButtonkey coverage varies by locale;bn-INhas Bengali translations, which is correct- This follows the established localization strategy for this PR and requires no changes
The code is working as designed.
Likely an incorrect or invalid review comment.
| }, | ||
| }, | ||
| organizationSwitcher: { | ||
| action__closeOrganizationSwitcher: undefined, |
There was a problem hiding this comment.
Undefined translations for OrganizationSwitcher actions.
The organizationSwitcher action keys are set to undefined, while the corresponding userButton action keys have Hindi translations. This creates an inconsistency within the same change.
If Hindi translations are not yet available for OrganizationSwitcher, consider adding a TODO comment or ensuring this is documented. Otherwise, please provide the Hindi translations to match the completeness of the userButton localization.
Also applies to: 496-496
🤖 Prompt for AI Agents
In packages/localizations/src/hi-IN.ts around lines 492 and 496, the
OrganizationSwitcher action keys are set to undefined which creates
inconsistency with the translated userButton keys; replace the undefined values
with the appropriate Hindi translations to match the corresponding userButton
action texts (or if translations are not available yet, add a clear TODO comment
next to each key and include a short note in the localization README documenting
pending translations) so that either actual Hindi strings are present or the
missing-state is explicitly documented.
| action__closeUserMenu: 'उपयोगकर्ता मेनू बंद करें', | ||
| action__manageAccount: 'खाता प्रबंधित करें', | ||
| action__openUserMenu: 'उपयोगकर्ता मेनू खोलें', |
There was a problem hiding this comment.
Inconsistent spelling of "menu" in Hindi translations.
The word "menu" is spelled differently across these two lines:
- Line 956 uses: 'मेनू'
- Line 958 uses: 'मेन्यू'
Please ensure consistent transliteration throughout. Apply this diff to standardize the spelling:
- action__closeUserMenu: 'उपयोगकर्ता मेनू बंद करें',
+ action__closeUserMenu: 'उपयोगकर्ता मेन्यू बंद करें',Or alternatively, use 'मेनू' in both places if that's the preferred spelling. The key is consistency.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| action__closeUserMenu: 'उपयोगकर्ता मेनू बंद करें', | |
| action__manageAccount: 'खाता प्रबंधित करें', | |
| action__openUserMenu: 'उपयोगकर्ता मेनू खोलें', | |
| action__closeUserMenu: 'उपयोगकर्ता मेन्यू बंद करें', | |
| action__manageAccount: 'खाता प्रबंधित करें', | |
| action__openUserMenu: 'उपयोगकर्ता मेन्यू खोलें', |
🤖 Prompt for AI Agents
In packages/localizations/src/hi-IN.ts around lines 956 to 958, the Hindi
transliteration of "menu" is inconsistent between 'मेनू' and 'मेन्यू'; update
the entries so both use the same spelling (preferably 'मेनू') for
action__closeUserMenu, action__manageAccount, and action__openUserMenu to ensure
consistent localization.
…n-userbuttontrigger
Description
Open user menuvsOpen user buttonUserButtonandOrganizationSwitcherresolves USER-3793
Checklist
pnpm testruns as expected.pnpm buildruns as expected.Type of change
Summary by CodeRabbit
New Features
Bug Fixes / UX
Localization
Tests