Port b0780cfeed
to glitch-soc
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
local
parent
734e186717
commit
9e66c07be7
14 changed files with 151 additions and 86 deletions
@ -1,21 +0,0 @@ |
|||||||
import { setLocale } from 'locales'; |
|
||||||
|
|
||||||
export async function loadLocale() { |
|
||||||
const locale = document.querySelector('html').lang || 'en'; |
|
||||||
|
|
||||||
const upstreamLocaleData = await import( |
|
||||||
/* webpackMode: "lazy" */ |
|
||||||
/* webpackChunkName: "locales/vanilla/[request]" */ |
|
||||||
/* webpackInclude: /\.json$/ */ |
|
||||||
/* webpackPreload: true */ |
|
||||||
`mastodon/locales/${locale}.json`); |
|
||||||
|
|
||||||
const localeData = await import( |
|
||||||
/* webpackMode: "lazy" */ |
|
||||||
/* webpackChunkName: "locales/glitch/[request]" */ |
|
||||||
/* webpackInclude: /\.json$/ */ |
|
||||||
/* webpackPreload: true */ |
|
||||||
`flavours/glitch/locales/${locale}.json`); |
|
||||||
|
|
||||||
setLocale({ messages: {...upstreamLocaleData, ...localeData} }); |
|
||||||
} |
|
@ -0,0 +1,22 @@ |
|||||||
|
export interface LocaleData { |
||||||
|
locale: string; |
||||||
|
messages: Record<string, string>; |
||||||
|
} |
||||||
|
|
||||||
|
let loadedLocale: LocaleData; |
||||||
|
|
||||||
|
export function setLocale(locale: LocaleData) { |
||||||
|
loadedLocale = locale; |
||||||
|
} |
||||||
|
|
||||||
|
export function getLocale() { |
||||||
|
if (!loadedLocale && process.env.NODE_ENV === 'development') { |
||||||
|
throw new Error('getLocale() called before any locale has been set'); |
||||||
|
} |
||||||
|
|
||||||
|
return loadedLocale; |
||||||
|
} |
||||||
|
|
||||||
|
export function isLocaleLoaded() { |
||||||
|
return !!loadedLocale; |
||||||
|
} |
@ -0,0 +1,5 @@ |
|||||||
|
export type { LocaleData } from './global_locale'; |
||||||
|
export { setLocale, getLocale, isLocaleLoaded } from './global_locale'; |
||||||
|
export { loadLocale } from './load_locale'; |
||||||
|
|
||||||
|
export { IntlProvider } from './intl_provider'; |
@ -0,0 +1,56 @@ |
|||||||
|
import { useEffect, useState } from 'react'; |
||||||
|
|
||||||
|
import { IntlProvider as BaseIntlProvider } from 'react-intl'; |
||||||
|
|
||||||
|
import { getLocale, isLocaleLoaded } from './global_locale'; |
||||||
|
import { loadLocale } from './load_locale'; |
||||||
|
|
||||||
|
function onProviderError(error: unknown) { |
||||||
|
// Silent the error, like upstream does
|
||||||
|
if (process.env.NODE_ENV === 'production') return; |
||||||
|
|
||||||
|
// This browser does not advertise Intl support for this locale, we only print a warning
|
||||||
|
// As-per the spec, the browser should select the best matching locale
|
||||||
|
if ( |
||||||
|
error && |
||||||
|
typeof error === 'object' && |
||||||
|
error instanceof Error && |
||||||
|
error.message.match('MISSING_DATA') |
||||||
|
) { |
||||||
|
console.warn(error.message); |
||||||
|
} |
||||||
|
|
||||||
|
console.error(error); |
||||||
|
} |
||||||
|
|
||||||
|
export const IntlProvider: React.FC< |
||||||
|
Omit<React.ComponentProps<typeof BaseIntlProvider>, 'locale' | 'messages'> |
||||||
|
> = ({ children, ...props }) => { |
||||||
|
const [localeLoaded, setLocaleLoaded] = useState(false); |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
async function loadLocaleData() { |
||||||
|
if (!isLocaleLoaded()) { |
||||||
|
await loadLocale(); |
||||||
|
} |
||||||
|
|
||||||
|
setLocaleLoaded(true); |
||||||
|
} |
||||||
|
void loadLocaleData(); |
||||||
|
}, []); |
||||||
|
|
||||||
|
if (!localeLoaded) return null; |
||||||
|
|
||||||
|
const { locale, messages } = getLocale(); |
||||||
|
|
||||||
|
return ( |
||||||
|
<BaseIntlProvider |
||||||
|
locale={locale} |
||||||
|
messages={messages} |
||||||
|
onError={onProviderError} |
||||||
|
{...props} |
||||||
|
> |
||||||
|
{children} |
||||||
|
</BaseIntlProvider> |
||||||
|
); |
||||||
|
}; |
@ -0,0 +1,37 @@ |
|||||||
|
import { Semaphore } from 'async-mutex'; |
||||||
|
|
||||||
|
import type { LocaleData } from './global_locale'; |
||||||
|
import { isLocaleLoaded, setLocale } from './global_locale'; |
||||||
|
|
||||||
|
const localeLoadingSemaphore = new Semaphore(1); |
||||||
|
|
||||||
|
export async function loadLocale() { |
||||||
|
const locale = document.querySelector<HTMLElement>('html')?.lang || 'en'; |
||||||
|
|
||||||
|
// We use a Semaphore here so only one thing can try to load the locales at
|
||||||
|
// the same time. If one tries to do it while its in progress, it will wait
|
||||||
|
// for the initial load to finish before it is resumed (and will see that locale
|
||||||
|
// data is already loaded)
|
||||||
|
await localeLoadingSemaphore.runExclusive(async () => { |
||||||
|
// if the locale is already set, then do nothing
|
||||||
|
if (isLocaleLoaded()) return; |
||||||
|
|
||||||
|
const upstreamLocaleData = await import( |
||||||
|
/* webpackMode: "lazy" */ |
||||||
|
/* webpackChunkName: "locales/vanilla/[request]" */ |
||||||
|
/* webpackInclude: /\.json$/ */ |
||||||
|
/* webpackPreload: true */ |
||||||
|
`mastodon/locales/${locale}.json` |
||||||
|
) as LocaleData['messages']; |
||||||
|
|
||||||
|
const localeData = await import( |
||||||
|
/* webpackMode: "lazy" */ |
||||||
|
/* webpackChunkName: "locales/glitch/[request]" */ |
||||||
|
/* webpackInclude: /\.json$/ */ |
||||||
|
/* webpackPreload: true */ |
||||||
|
`flavours/glitch/locales/${locale}.json` |
||||||
|
) as LocaleData['messages']; |
||||||
|
|
||||||
|
setLocale({ messages: { ...upstreamLocaleData, ...localeData }, locale }); |
||||||
|
}); |
||||||
|
} |
@ -1,11 +1,11 @@ |
|||||||
import 'packs/public-path'; |
import 'packs/public-path'; |
||||||
import { loadLocale } from 'flavours/glitch/load_locale'; |
import { loadLocale } from 'flavours/glitch/locales'; |
||||||
|
import main from "flavours/glitch/main"; |
||||||
import { loadPolyfills } from 'flavours/glitch/polyfills'; |
import { loadPolyfills } from 'flavours/glitch/polyfills'; |
||||||
|
|
||||||
loadPolyfills().then(loadLocale).then(async () => { |
loadPolyfills() |
||||||
const { default: main } = await import('flavours/glitch/main'); |
.then(loadLocale) |
||||||
|
.then(main) |
||||||
return main(); |
.catch(e => { |
||||||
}).catch(e => { |
console.error(e); |
||||||
console.error(e); |
}); |
||||||
}); |
|
||||||
|
Loading…
Reference in new issue