Need Loader fallbacks

This commit is contained in:
Lim Chee Aun 2024-03-27 08:09:24 +08:00
parent 7049166b40
commit 7cac17a043

View file

@ -2,11 +2,13 @@ import { shouldPolyfill } from '@formatjs/intl-segmenter/should-polyfill';
import { Suspense } from 'preact/compat';
import { useEffect, useState } from 'preact/hooks';
import Loader from './loader';
const supportsIntlSegmenter = !shouldPolyfill();
export default function IntlSegmenterSuspense({ children }) {
if (supportsIntlSegmenter) {
return <Suspense>{children}</Suspense>;
return <Suspense fallback={<Loader />}>{children}</Suspense>;
}
const [polyfillLoaded, setPolyfillLoaded] = useState(false);
@ -17,5 +19,9 @@ export default function IntlSegmenterSuspense({ children }) {
})();
}, []);
return polyfillLoaded && <Suspense>{children}</Suspense>;
return polyfillLoaded ? (
<Suspense fallback={<Loader />}>{children}</Suspense>
) : (
<Loader />
);
}