Skip to content

Fix: Selecting a language does not update in real time #4366

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
iwiznia merged 2 commits into from
Aug 3, 2021
Merged

Fix: Selecting a language does not update in real time #4366

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
69fd992
fix: `withLocalize` does not trigger a rerender in children
kidroca Aug 2, 2021
777468d
Fix code style
kidroca Aug 2, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 9 additions & 7 deletions src/components/withLocalize.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,17 +44,19 @@ const localeProviderDefaultProps = {
};

class LocaleContextProvider extends React.Component {
constructor(props) {
super(props);

/* The context this component exposes to consumers */
this.translateUtils = {
/**
* The context this component exposes to child components
* @returns {object} translation util functions and locale
*/
getContextValue() {
return {
translate: this.translate.bind(this),
numberFormat: this.numberFormat.bind(this),
timestampToRelative: this.timestampToRelative.bind(this),
timestampToDateTime: this.timestampToDateTime.bind(this),
fromLocalPhone: this.fromLocalPhone.bind(this),
toLocalPhone: this.toLocalPhone.bind(this),
locale: this.props.preferredLocale,
};
}

Expand Down Expand Up @@ -115,7 +117,7 @@ class LocaleContextProvider extends React.Component {

render() {
return (
<LocaleContext.Provider value={this.translateUtils}>
<LocaleContext.Provider value={this.getContextValue()}>
{this.props.children}
</LocaleContext.Provider>
);
Expand All @@ -137,7 +139,7 @@ export default function withLocalize(WrappedComponent) {
const WithLocalize = forwardRef((props, ref) => (
<LocaleContext.Consumer>
{/* eslint-disable-next-line react/jsx-props-no-spreading */}
{ translateUtils => <WrappedComponent {...translateUtils} {...props} ref={ref} />}
{translateUtils => <WrappedComponent {...translateUtils} {...props} ref={ref} />}
</LocaleContext.Consumer>
));

Expand Down