/* eslint-disable react/no-danger */ /* eslint-disable react/no-unescaped-entities */ import { useRecoilValue } from 'recoil'; import Head from 'next/head'; import { FC, useEffect, useRef } from 'react'; import { useLockBodyScroll } from 'react-use'; import dynamic from 'next/dynamic'; import { ClientConfigStore, isChatAvailableSelector, clientConfigStateAtom, fatalErrorStateAtom, } from '../stores/ClientConfigStore'; import { Header } from '../ui/Header/Header'; import { ClientConfig } from '../../interfaces/client-config.model'; import { DisplayableError } from '../../types/displayable-error'; import setupNoLinkReferrer from '../../utils/no-link-referrer'; import { ServerRenderedHydration } from '../ServerRendered/ServerRenderedHydration'; import { Content } from '../ui/Content/Content'; import { TitleNotifier } from '../TitleNotifier/TitleNotifier'; import { PushNotificationServiceWorker } from '../workers/PushNotificationServiceWorker/PushNotificationServiceWorker'; import { Theme } from '../theme/Theme'; // Lazy loaded components const FatalErrorStateModal = dynamic( () => import('../modals/FatalErrorStateModal/FatalErrorStateModal').then( mod => mod.FatalErrorStateModal, ), { ssr: false, }, ); export const Main: FC = () => { const clientConfig = useRecoilValue(clientConfigStateAtom); const { name, title, customStyles } = clientConfig; const isChatAvailable = useRecoilValue(isChatAvailableSelector); const fatalError = useRecoilValue(fatalErrorStateAtom); const layoutRef = useRef(null); const { chatDisabled } = clientConfig; useLockBodyScroll(true); useEffect(() => { setupNoLinkReferrer(layoutRef.current); }, []); const isProduction = process.env.NODE_ENV === 'production'; return ( <> {isProduction && } {isProduction ? ( {name ? {name} : {'{{.Name}}'}} ) : ( {name} )}
{fatalError && ( )}
); };