46 lines
1.0 KiB
TypeScript
46 lines
1.0 KiB
TypeScript
|
import { type ReactNode } from 'react'
|
||
|
|
import { IntlProvider as ReactIntlProvider } from 'react-intl'
|
||
|
|
|
||
|
|
const DEFAULT_LOCALE = 'en-US'
|
||
|
|
const enMessages = {
|
||
|
|
hello: 'hello',
|
||
|
|
}
|
||
|
|
|
||
|
|
const esMessages = {
|
||
|
|
hello: 'hola',
|
||
|
|
}
|
||
|
|
|
||
|
|
const getMessages = (locale: string) => {
|
||
|
|
const truncatedLocale = locale.toLowerCase().split(/[_-]+/)[0]
|
||
|
|
|
||
|
|
switch (truncatedLocale) {
|
||
|
|
case 'en':
|
||
|
|
return enMessages
|
||
|
|
case 'es':
|
||
|
|
return esMessages
|
||
|
|
default:
|
||
|
|
return enMessages
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export const IntlProvider = ({ children }: { children: ReactNode }) => {
|
||
|
|
const getLocale = () => {
|
||
|
|
if (typeof navigator === 'undefined') {
|
||
|
|
return DEFAULT_LOCALE
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
(navigator.languages && navigator.languages[0]) ||
|
||
|
|
navigator.language ||
|
||
|
|
DEFAULT_LOCALE
|
||
|
|
)
|
||
|
|
}
|
||
|
|
const locale = getLocale()
|
||
|
|
|
||
|
|
return (
|
||
|
|
<ReactIntlProvider locale={locale} messages={getMessages(locale)}>
|
||
|
|
{children}
|
||
|
|
</ReactIntlProvider>
|
||
|
|
)
|
||
|
|
}
|