TranslationLoader

Helper component to load translations and provide react-i18next context

NOTE: this component is experimental and subject to breaking changes

/* import { useTranslation } from 'react-i18next' */
/* import { initializeI18n } from '@octanner/prism-core/TranslationLoader' */
() => {
const translationUri = "https://www.culturecloud.com/t/prism-header"
const namespace = "digitalyearbook"
const defaultStrings = {
back: 'Put fallback/default strings here',
foobar: 'blah'
}
// put this outside of a component
initializeI18n({namespace, defaultStrings})
const SomeComponent = () => {
const { t } = useTranslation()
return <div>{t('back')}</div>
}
return (
<TranslationLoader translationUri={translationUri} namespace={namespace}>
<SomeComponent />
</TranslationLoader>
)
}

Props

PropTypeDefaultDescription
translationUristringUri to fetch and gather the translations from (required).
namespacestringNamespace used inside of i18n, must match app in translation api (required).
defaultStrings{ [key: string]: string }Default translations to be loaded into i18n (required).