/* eslint-disable react/no-danger */
/* eslint-disable react/no-unescaped-entities */
import { Layout } from 'antd';
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 { TitleNotifier } from '../TitleNotifier/TitleNotifier';
import { ServerRenderedHydration } from '../ServerRendered/ServerRenderedHydration';
import { PushNotificationServiceWorker } from '../workers/PushNotificationServiceWorker/PushNotificationServiceWorker';
import { Content } from '../ui/Content/Content';
import { Theme } from '../theme/Theme';
// Lazy loaded components
const FatalErrorStateModal = dynamic(
() =>
import('../modals/FatalErrorStateModal/FatalErrorStateModal').then(
mod => mod.FatalErrorStateModal,
),
{
loading: () => Loading...
,
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 && (
)}
);
};