diff --git a/app/soapbox/containers/soapbox.js b/app/soapbox/containers/soapbox.js index 708cf6688..b0577a535 100644 --- a/app/soapbox/containers/soapbox.js +++ b/app/soapbox/containers/soapbox.js @@ -69,9 +69,35 @@ class SoapboxMount extends React.PureComponent { dispatch: PropTypes.func, }; + state = { + messages: {}, + localeLoading: true, + } + + setMessages = () => { + messages[this.props.locale]().then(messages => { + this.setState({ messages, localeLoading: false }); + }).catch(() => {}); + } + + maybeUpdateMessages = prevProps => { + if (this.props.locale !== prevProps.locale) { + this.setMessages(); + }; + } + + componentDidMount() { + this.setMessages(); + } + + componentDidUpdate(prevProps) { + this.maybeUpdateMessages(prevProps); + } + render() { const { me, themeCss, locale } = this.props; if (me === null) return null; + if (this.state.localeLoading) return null; // Disabling introduction for launch // const { showIntroduction } = this.props; @@ -88,7 +114,7 @@ class SoapboxMount extends React.PureComponent { }); return ( - + <> diff --git a/app/soapbox/features/preferences/index.js b/app/soapbox/features/preferences/index.js index d9d3489da..3530c3530 100644 --- a/app/soapbox/features/preferences/index.js +++ b/app/soapbox/features/preferences/index.js @@ -125,7 +125,7 @@ class Preferences extends ImmutablePureComponent { diff --git a/app/soapbox/locales/messages.js b/app/soapbox/locales/messages.js index ab4050c8a..4118776cd 100644 --- a/app/soapbox/locales/messages.js +++ b/app/soapbox/locales/messages.js @@ -1,64 +1,64 @@ export default { - 'ar': require('./ar.json'), - 'ast': require('./ast.json'), - 'bg': require('./bg.json'), - 'bn': require('./bn.json'), - 'br': require('./br.json'), - 'ca': require('./ca.json'), - 'co': require('./co.json'), - 'cs': require('./cs.json'), - 'cy': require('./cy.json'), - 'da': require('./da.json'), - 'de': require('./de.json'), - 'el': require('./el.json'), - 'en': require('./en.json'), - 'eo': require('./eo.json'), - 'es-AR': require('./es-AR.json'), - 'es': require('./es.json'), - 'et': require('./et.json'), - 'eu': require('./eu.json'), - 'fa': require('./fa.json'), - 'fi': require('./fi.json'), - 'fr': require('./fr.json'), - 'ga': require('./ga.json'), - 'gl': require('./gl.json'), - 'he': require('./he.json'), - 'hi': require('./hi.json'), - 'hr': require('./hr.json'), - 'hu': require('./hu.json'), - 'hy': require('./hy.json'), - 'id': require('./id.json'), - 'io': require('./io.json'), - 'it': require('./it.json'), - 'ja': require('./ja.json'), - 'ka': require('./ka.json'), - 'kk': require('./kk.json'), - 'ko': require('./ko.json'), - 'lt': require('./lt.json'), - 'lv': require('./lv.json'), - 'mk': require('./mk.json'), - 'ms': require('./ms.json'), - 'nl': require('./nl.json'), - 'nn': require('./nn.json'), - 'no': require('./no.json'), - 'oc': require('./oc.json'), - 'pl': require('./pl.json'), - 'pt-BR': require('./pt-BR.json'), - 'pt': require('./pt.json'), - 'ro': require('./ro.json'), - 'ru': require('./ru.json'), - 'sk': require('./sk.json'), - 'sl': require('./sl.json'), - 'sq': require('./sq.json'), - 'sr': require('./sr.json'), - 'sr-Latn': require('./sr-Latn.json'), - 'sv': require('./sv.json'), - 'ta': require('./ta.json'), - 'te': require('./te.json'), - 'th': require('./th.json'), - 'tr': require('./tr.json'), - 'uk': require('./uk.json'), - 'zh-CN': require('./zh-CN.json'), - 'zh-HK': require('./zh-HK.json'), - 'zh-TW': require('./zh-TW.json'), + 'ar': () => import(/* webpackChunkName: "locale_ar" */'./ar.json'), + 'ast': () => import(/* webpackChunkName: "locale_ast" */'./ast.json'), + 'bg': () => import(/* webpackChunkName: "locale_bg" */'./bg.json'), + 'bn': () => import(/* webpackChunkName: "locale_bn" */'./bn.json'), + 'br': () => import(/* webpackChunkName: "locale_br" */'./br.json'), + 'ca': () => import(/* webpackChunkName: "locale_ca" */'./ca.json'), + 'co': () => import(/* webpackChunkName: "locale_co" */'./co.json'), + 'cs': () => import(/* webpackChunkName: "locale_cs" */'./cs.json'), + 'cy': () => import(/* webpackChunkName: "locale_cy" */'./cy.json'), + 'da': () => import(/* webpackChunkName: "locale_da" */'./da.json'), + 'de': () => import(/* webpackChunkName: "locale_de" */'./de.json'), + 'el': () => import(/* webpackChunkName: "locale_el" */'./el.json'), + 'en': () => import(/* webpackChunkName: "locale_en" */'./en.json'), + 'eo': () => import(/* webpackChunkName: "locale_eo" */'./eo.json'), + 'es-AR': () => import(/* webpackChunkName: "locale_es-AR" */'./es-AR.json'), + 'es': () => import(/* webpackChunkName: "locale_es" */'./es.json'), + 'et': () => import(/* webpackChunkName: "locale_et" */'./et.json'), + 'eu': () => import(/* webpackChunkName: "locale_eu" */'./eu.json'), + 'fa': () => import(/* webpackChunkName: "locale_fa" */'./fa.json'), + 'fi': () => import(/* webpackChunkName: "locale_fi" */'./fi.json'), + 'fr': () => import(/* webpackChunkName: "locale_fr" */'./fr.json'), + 'ga': () => import(/* webpackChunkName: "locale_ga" */'./ga.json'), + 'gl': () => import(/* webpackChunkName: "locale_gl" */'./gl.json'), + 'he': () => import(/* webpackChunkName: "locale_he" */'./he.json'), + 'hi': () => import(/* webpackChunkName: "locale_hi" */'./hi.json'), + 'hr': () => import(/* webpackChunkName: "locale_hr" */'./hr.json'), + 'hu': () => import(/* webpackChunkName: "locale_hu" */'./hu.json'), + 'hy': () => import(/* webpackChunkName: "locale_hy" */'./hy.json'), + 'id': () => import(/* webpackChunkName: "locale_id" */'./id.json'), + 'io': () => import(/* webpackChunkName: "locale_io" */'./io.json'), + 'it': () => import(/* webpackChunkName: "locale_it" */'./it.json'), + 'ja': () => import(/* webpackChunkName: "locale_ja" */'./ja.json'), + 'ka': () => import(/* webpackChunkName: "locale_ka" */'./ka.json'), + 'kk': () => import(/* webpackChunkName: "locale_kk" */'./kk.json'), + 'ko': () => import(/* webpackChunkName: "locale_ko" */'./ko.json'), + 'lt': () => import(/* webpackChunkName: "locale_lt" */'./lt.json'), + 'lv': () => import(/* webpackChunkName: "locale_lv" */'./lv.json'), + 'mk': () => import(/* webpackChunkName: "locale_mk" */'./mk.json'), + 'ms': () => import(/* webpackChunkName: "locale_ms" */'./ms.json'), + 'nl': () => import(/* webpackChunkName: "locale_nl" */'./nl.json'), + 'nn': () => import(/* webpackChunkName: "locale_nn" */'./nn.json'), + 'no': () => import(/* webpackChunkName: "locale_no" */'./no.json'), + 'oc': () => import(/* webpackChunkName: "locale_oc" */'./oc.json'), + 'pl': () => import(/* webpackChunkName: "locale_pl" */'./pl.json'), + 'pt-BR': () => import(/* webpackChunkName: "locale_pt-BR" */'./pt-BR.json'), + 'pt': () => import(/* webpackChunkName: "locale_pt" */'./pt.json'), + 'ro': () => import(/* webpackChunkName: "locale_ro" */'./ro.json'), + 'ru': () => import(/* webpackChunkName: "locale_ru" */'./ru.json'), + 'sk': () => import(/* webpackChunkName: "locale_sk" */'./sk.json'), + 'sl': () => import(/* webpackChunkName: "locale_sl" */'./sl.json'), + 'sq': () => import(/* webpackChunkName: "locale_sq" */'./sq.json'), + 'sr': () => import(/* webpackChunkName: "locale_sr" */'./sr.json'), + 'sr-Latn': () => import(/* webpackChunkName: "locale_sr-Latn" */'./sr-Latn.json'), + 'sv': () => import(/* webpackChunkName: "locale_sv" */'./sv.json'), + 'ta': () => import(/* webpackChunkName: "locale_ta" */'./ta.json'), + 'te': () => import(/* webpackChunkName: "locale_te" */'./te.json'), + 'th': () => import(/* webpackChunkName: "locale_th" */'./th.json'), + 'tr': () => import(/* webpackChunkName: "locale_tr" */'./tr.json'), + 'uk': () => import(/* webpackChunkName: "locale_uk" */'./uk.json'), + 'zh-CN': () => import(/* webpackChunkName: "locale_zh-CN" */'./zh-CN.json'), + 'zh-HK': () => import(/* webpackChunkName: "locale_zh-HK" */'./zh-HK.json'), + 'zh-TW': () => import(/* webpackChunkName: "locale_zh-TW" */'./zh-TW.json'), };