import '@affine/component/theme/global.css'; import '@affine/component/theme/theme.css'; // bootstrap code before everything import '../bootstrap'; import { AffineContext } from '@affine/component/context'; import { WorkspaceFallback } from '@affine/component/workspace'; import { config } from '@affine/env'; import { createI18n, I18nextProvider } from '@affine/i18n'; import type { EmotionCache } from '@emotion/cache'; import { CacheProvider } from '@emotion/react'; import type { AppProps } from 'next/app'; import Head from 'next/head'; import { useRouter } from 'next/router'; import type { PropsWithChildren, ReactElement } from 'react'; import React, { lazy, Suspense } from 'react'; import { AffineErrorBoundary } from '../components/affine/affine-error-eoundary'; import { MessageCenter } from '../components/pure/message-center'; import type { NextPageWithLayout } from '../shared'; import createEmotionCache from '../utils/create-emotion-cache'; type AppPropsWithLayout = AppProps & { Component: NextPageWithLayout; }; const EmptyLayout = (page: ReactElement) => page; const clientSideEmotionCache = createEmotionCache(); const DevTools = lazy(() => import('jotai-devtools').then(m => ({ default: m.DevTools })) ); const DebugProvider = ({ children }: PropsWithChildren): ReactElement => { return ( <> {process.env.DEBUG_JOTAI === 'true' && } {children} ); }; const i18n = createI18n(); if (process.env.NODE_ENV === 'development') { console.log('Runtime Preset', config); } const App = function App({ Component, pageProps, emotionCache = clientSideEmotionCache, }: AppPropsWithLayout & { emotionCache?: EmotionCache; }) { const getLayout = Component.getLayout || EmptyLayout; return ( }> AFFiNE {getLayout()} ); }; export default App;