'use client';

import dynamic from 'next/dynamic';
import { Center, Spinner } from '@chakra-ui/react';
import ClientOnly from './ClientOnly';

const MainApp = dynamic(() => import('./MainApp'), {
  ssr: false,
  loading: () => (
    <Center h="100vh">
      <Spinner size="xl" />
    </Center>
  ),
});

export default function DynamicMainApp() {
  return (
    <ClientOnly>
      <MainApp />
    </ClientOnly>
  );
}