diff --git a/react/I18n/index.jsx b/react/I18n/index.jsx index 00f9f9e9f6..2facf52e5d 100644 --- a/react/I18n/index.jsx +++ b/react/I18n/index.jsx @@ -74,14 +74,20 @@ I18n.childContextTypes = i18nContextTypes // higher order decorator for components that need `t` and/or `f` export const translate = () => WrappedComponent => { - const Wrapper = (props, context) => ( - - ) + const Wrapper = (props, context) => { + return ( + + ) + } + Wrapper.propTypes = { + ...(WrappedComponent.propTypes || {}), + ...i18nContextTypes + } Wrapper.contextTypes = i18nContextTypes return Wrapper } diff --git a/react/I18n/withLocales.jsx b/react/I18n/withLocales.jsx index 25bf44c2be..790b11c27b 100644 --- a/react/I18n/withLocales.jsx +++ b/react/I18n/withLocales.jsx @@ -19,15 +19,21 @@ const withLocales = localesOrRequire => Component => { class Wrapped extends React.Component { render() { - // Do not pass t downwards - const { lang, ...rest } = omit(this.props, 't') + const { lang } = this.props + // Do not pass translate props downwards + // since the component is already augmented with translate() + const wrappedProps = omit(this.props, Object.keys(I18n.childContextTypes)) return ( - + ) } } + Wrapped.propTypes = { + ...(Component.propTypes || {}), + ...I18n.childContextTypes + } Wrapped.displayName = `withLocales(${Component.displayName || Component.name})` diff --git a/react/I18n/withLocales.spec.jsx b/react/I18n/withLocales.spec.jsx index 854323469f..5f385cf55e 100644 --- a/react/I18n/withLocales.spec.jsx +++ b/react/I18n/withLocales.spec.jsx @@ -20,7 +20,7 @@ const componentLocales = { } } -class Component extends React.Component { +class MockComponent extends React.Component { render() { const { t } = this.props return
{t('hello-world')}
@@ -48,9 +48,9 @@ describe('with locales', () => { }) } - const TComponentObj = withLocales(componentLocales)(Component) + const TComponentObj = withLocales(componentLocales)(MockComponent) const requireLang = lang => componentLocales[lang] - const TComponentFunc = withLocales(requireLang)(Component) + const TComponentFunc = withLocales(requireLang)(MockComponent) testComponent(TComponentObj, 'locales from object') testComponent(TComponentFunc, 'locales from require function')