fix: sort tooltip shows raw %{field_lower_first} instead of column name (#716)#823
Open
dotWee wants to merge 2 commits into
Open
fix: sort tooltip shows raw %{field_lower_first} instead of column name (#716)#823dotWee wants to merge 2 commits into
dotWee wants to merge 2 commits into
Conversation
…me (Awesome-Technologies#716) The upstream ra-language-english v5.14.4 changed the ra.sort.sort_by translation string from "%{field}" to "%{field_lower_first}". React-admin's DataTableHeadCell computes field_lower_first from the resolved field label, but only when that label is a string: field_lower_first: typeof fieldLabel === 'string' ? fieldLabel.charAt(0).toLowerCase() + fieldLabel.slice(1) : undefined When fieldLabel is not a string (e.g. undefined or a React element), field_lower_first is passed as undefined. Polyglot.js does not interpolate placeholders whose value is undefined, so the literal text "%{field_lower_first}" leaks into the tooltip. The "%{field}" variable, by contrast, is always passed by react-admin regardless of the fieldLabel type. Override ra.sort.sort_by in the English and French locale files to use "%{field}" instead of "%{field_lower_first}". The other five locales (German, Chinese, Italian, Farsi, Russian) already use "%{field}" and are unaffected. Add sortTranslations.test.ts covering all seven locales with six assertions each: no field_lower_first in the template, correct interpolation, and resilience when field_lower_first is undefined or omitted.
There was a problem hiding this comment.
Pull request overview
Updates react-admin sort tooltip translations to avoid leaking the raw %{field_lower_first} placeholder (introduced upstream in ra-language-english@5.14.4) by overriding ra.sort.sort_by to use %{field} and adding regression tests across supported locales.
Changes:
- Override
ra.sort.sort_byin English and French message bundles to interpolate%{field}(not%{field_lower_first}). - Add a new Vitest suite asserting
ra.sort.sort_bynever outputs raw placeholders whenfield_lower_firstis missing/undefined. - Add basic checks that
ra.sort.ASC/ra.sort.DESCare defined for each locale.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| src/i18n/sortTranslations.test.ts | Adds regression tests ensuring sort tooltip translations don’t leak raw placeholders across locales. |
| src/i18n/en.ts | Overrides ra.sort.sort_by to use %{field} interpolation for English. |
| src/i18n/fr.ts | Overrides ra.sort.sort_by to use %{field} interpolation for French. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The upstream ra-language-english v5.14.4 changed the ra.sort.sort_by translation string from "%{field}" to "%{field_lower_first}". React-admin's DataTableHeadCell computes field_lower_first from the resolved field label, but only when that label is a string:
When fieldLabel is not a string (e.g. undefined or a React element), field_lower_first is passed as undefined.
Polyglot.js does not interpolate placeholders whose value is undefined, so the literal text "%{field_lower_first}" leaks into the tooltip.
The "%{field}" variable, by contrast, is always passed by react-admin regardless of the fieldLabel type.