66 lines
2.3 KiB
JavaScript
66 lines
2.3 KiB
JavaScript
import { createRoot } from 'react-dom/client';
|
|
import { lazy, Suspense } from 'react';
|
|
import Box from '@mui/material/Box';
|
|
import CssBaseline from '@mui/material/CssBaseline';
|
|
import { ThemeProvider } from '@mui/material/styles';
|
|
import { SnackbarProvider } from 'notistack';
|
|
import AuthBootstrap from './components/AuthBootstrap';
|
|
import App from './App';
|
|
import { getActiveTheme } from './theme';
|
|
import { installCssVars } from './colors';
|
|
import { disableTouchAutofocus } from './utils/touch';
|
|
import './index.css';
|
|
|
|
// Globally suppress automatic focus on touch devices to avoid virtual keyboard popups
|
|
disableTouchAutofocus();
|
|
|
|
// Publish the color tokens as CSS custom properties so index.css (and any
|
|
// other plain-CSS stylesheet) reads the same palette as the React components.
|
|
installCssVars();
|
|
|
|
// Dev-only Automat inspector. The `import.meta.env.DEV` branch is statically
|
|
// eliminated in production builds, so this module never ships to users.
|
|
const AutomatInspector = import.meta.env.DEV
|
|
? lazy(() => import('./devtools/AutomatInspector'))
|
|
: null;
|
|
|
|
async function clearDevServiceWorker() {
|
|
if (!import.meta.env.DEV || !('serviceWorker' in navigator)) return;
|
|
const regs = await navigator.serviceWorker.getRegistrations();
|
|
await Promise.all(regs.map((r) => r.unregister()));
|
|
if ('caches' in window) {
|
|
const keys = await caches.keys();
|
|
await Promise.all(keys.map((k) => caches.delete(k)));
|
|
}
|
|
}
|
|
|
|
if (import.meta.env.DEV) {
|
|
void clearDevServiceWorker();
|
|
}
|
|
|
|
createRoot(document.getElementById('root')).render(
|
|
<ThemeProvider theme={getActiveTheme()}>
|
|
<CssBaseline />
|
|
<SnackbarProvider
|
|
maxSnack={3}
|
|
autoHideDuration={2000}
|
|
anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
|
|
>
|
|
<AuthBootstrap>
|
|
{/* Flex row so the dev inspector docks beside the app instead of
|
|
overlaying it; the app content shrinks while the panel is open. */}
|
|
<Box sx={{ display: 'flex', alignItems: 'flex-start', minHeight: '100vh' }}>
|
|
<Box sx={{ flexGrow: 1, minWidth: 0 }}>
|
|
<App />
|
|
</Box>
|
|
{AutomatInspector ? (
|
|
<Suspense fallback={null}>
|
|
<AutomatInspector />
|
|
</Suspense>
|
|
) : null}
|
|
</Box>
|
|
</AuthBootstrap>
|
|
</SnackbarProvider>
|
|
</ThemeProvider>,
|
|
);
|