[Translations] Fix: search & field filters in Translations sidebar don't trigger on Enter/search icon - #4012
Open
albertmueller wants to merge 7 commits into
Conversation
SearchTermControl only wired onChange, but antd's Input.Search fires onSearch (not onChange) for the search icon click and the Enter key. As a result, the search & filter sidebar required using the "Apply" button, silently ignoring the search icon and Enter key. Add an onSearch handler that applies the term immediately, mirroring the working element listing's SearchTermFilter.
Text field filters (e.g. the "German" column) only wrote into the sidebar's draft store on blur, so a value typed there was silently dropped unless the user also clicked the separate "Apply" button. Give the field-filter dynamic type a search input and thread an optional onCommit callback through DynamicFilterProvider and FieldFilters so a committed value (Enter or the search icon) is written straight to the applied filter store, matching the existing "Apply" button behavior. Also stretch the input to the full sidebar width to match the main search field.
Contributor
There was a problem hiding this comment.
Pull request overview
Enables immediate submission of translation search and text field filters via Enter or the search icon.
Changes:
- Adds commit handling across dynamic and field-filter components.
- Uses
SearchInputfor text field filters. - Applies committed translation filters immediately.
Reviewed changes
Copilot reviewed 6 out of 7 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
filter-tab.tsx |
Connects field-filter commits. |
use-translations-field-filter-editor.ts |
Synchronizes committed field filters. |
filters.tsx |
Handles top-level search submission. |
dynamic-type-field-filter-text-component.tsx |
Adds searchable text-filter input. |
field-filters.tsx |
Propagates filter commits. |
dynamic-filter-provider.tsx |
Adds commit support to filter context. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Committing the search term or a field filter only wrote that single key into the applied filter store, so any other still-unsaved draft change (e.g. a field filter typed but not yet applied) was silently dropped instead of being applied together, unlike clicking "Apply" which applies the entire draft snapshot at once. Apply the full current draft values on commit, overriding just the field being committed to avoid reading a stale React state value for it.
Contributor
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 6 out of 7 changed files in this pull request and generated no new comments.
Suppressed comments (1)
assets/js/src/core/modules/element/dynamic-types/definitions/field-filters/components/dynamic-type-field-filter-text-component.tsx:32
- Use the
searchValuesupplied bySearchInputhere. The clear control invokesonSearchwith an empty value in the same event asonChange, before_valuehas re-rendered, so this closure can recommit the previous text and leave the filter applied instead of clearing it.
onSearch={ () => { commit(_value) } }
…state
The field filter's SearchInput read the committed value from local
component state (_value) rather than the value onSearch itself
received. Clicking the clear (x) icon fires onChange('') and
onSearch('') in the same event before the state update from onChange
has re-rendered, so the stale closure could recommit the previous
text and leave the filter applied instead of clearing it.
Commit the value passed into onSearch directly to avoid the race.
Contributor
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 6 out of 7 changed files in this pull request and generated no new comments.
Suppressed comments (2)
assets/js/src/core/components/field-filters/field-filters.tsx:67
- This newly added direct
undefinedcomparison bypasses the project's type-safe check convention. Invoke the optional callback directly (or useisUndefined) so this branch follows the required nullability pattern.
if (onCommit !== undefined) {
onCommit(updatedData)
}
assets/js/src/core/components/dynamic-filter/provider/dynamic-filter-provider.tsx:65
- This newly added direct
undefinedcomparison bypasses the project's type-safe check convention. Invoke the optional callback directly (or useisUndefined) so this branch follows the required nullability pattern.
if (onCommit !== undefined) {
onCommit(data)
}
|
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.
Summary
DynamicFilterProvider → FieldFilters → the translations field-filter hook, so Enter/search-icon immediately applies the filter, and stretched the input to full sidebar width.
Changes
Fixed state:
Fixes pimcore/platform-version#354
The issue was also reported as an enterprise issue: PEES-1392