pl-fe: Do not nest body in PlFeHead

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2024-10-20 13:20:31 +02:00
parent 77c0689321
commit 7c2eaf5702
2 changed files with 12 additions and 21 deletions

View file

@ -12,12 +12,8 @@ import { generateThemeCss } from 'pl-fe/utils/theme';
const Helmet = React.lazy(() => import('pl-fe/components/helmet'));
interface IPlFeHead {
children: React.ReactNode;
}
/** Injects metadata into site head with Helmet. */
const PlFeHead: React.FC<IPlFeHead> = ({ children }) => {
const PlFeHead = () => {
const { locale, direction } = useLocale();
const { demo, reduceMotion, underlineLinks, demetricator, systemFont } = useSettings();
const plFeConfig = usePlFeConfig();
@ -43,17 +39,13 @@ const PlFeHead: React.FC<IPlFeHead> = ({ children }) => {
}, [dsn]);
return (
<>
<Helmet>
<html lang={locale} className={clsx('h-full', { 'dark': theme === 'dark', 'dark black': theme === 'black' })} />
<body className={bodyClass} dir={direction} />
{themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>}
{['dark', 'black'].includes(theme) && <style type='text/css'>{':root { color-scheme: dark; }'}</style>}
<meta name='theme-color' content={plFeConfig.brandColor} />
</Helmet>
{children}
</>
<Helmet>
<html lang={locale} className={clsx('h-full', { 'dark': theme === 'dark', 'dark black': theme === 'black' })} />
<body className={bodyClass} dir={direction} />
{themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>}
{['dark', 'black'].includes(theme) && <style type='text/css'>{':root { color-scheme: dark; }'}</style>}
<meta name='theme-color' content={plFeConfig.brandColor} />
</Helmet>
);
};

View file

@ -30,11 +30,10 @@ const PlFe: React.FC = () => (
<QueryClientProvider client={queryClient}>
<StatProvider>
<HelmetProvider>
<PlFeHead>
<PlFeLoad>
<PlFeMount />
</PlFeLoad>
</PlFeHead>
<PlFeHead />
<PlFeLoad>
<PlFeMount />
</PlFeLoad>
</HelmetProvider>
</StatProvider>
</QueryClientProvider>