feat(i18n): update product filtering on language change
- Enhance Content and ProductFilters components to re-filter products when the language changes or the translation function updates. - Implement logic in componentDidUpdate to regenerate availability values and filter products accordingly, improving internationalization support.
This commit is contained in:
@@ -224,6 +224,14 @@ class Content extends Component {
|
||||
this.fetchSearchData(this.props.searchParams?.get('q'));
|
||||
})
|
||||
}
|
||||
|
||||
// Re-filter products when language changes to update translated filter names
|
||||
const languageChanged = this.props.i18n && prevProps.i18n && this.props.i18n.language !== prevProps.i18n.language;
|
||||
const tFunctionChanged = this.props.t !== prevProps.t;
|
||||
|
||||
if(languageChanged || tFunctionChanged) {
|
||||
this.filterProducts();
|
||||
}
|
||||
}
|
||||
|
||||
processData(response) {
|
||||
|
||||
@@ -47,6 +47,18 @@ class ProductFilters extends Component {
|
||||
window.addEventListener('resize', this.adjustPaperHeight);
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
// Regenerate availability values when language changes
|
||||
// Check both i18n.language and the t function itself
|
||||
const languageChanged = this.props.i18n && prevProps.i18n && this.props.i18n.language !== prevProps.i18n.language;
|
||||
const tFunctionChanged = this.props.t !== prevProps.t;
|
||||
|
||||
if(languageChanged || tFunctionChanged) {
|
||||
const availabilityValues = this._getAvailabilityValues(this.props.products);
|
||||
this.setState({availabilityValues});
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
// Remove event listener when component unmounts
|
||||
window.removeEventListener('resize', this.adjustPaperHeight);
|
||||
|
||||
Reference in New Issue
Block a user