import '@fontsource/roboto/300.css';
import '@fontsource/roboto/400.css';
import '@fontsource/roboto/500.css';
import '@fontsource/roboto/700.css';
import { applyPatch, applySnapshot } from 'mobx-state-tree';
import Button from "@mui/material/Button";
import CssBaseline from "@mui/material/CssBaseline";
import {
unstable_createMuiStrictModeTheme as createTheme,
ThemeProvider,
} from '@mui/material/styles';
import React from 'react';
import { render } from 'react-dom';
import { sharedStore } from '@sophie/shared';
import { exposeToReduxDevtools } from './devTools';
const isDevelopment = import.meta.env.MODE === 'development';
const store = sharedStore.create();
if (isDevelopment) {
exposeToReduxDevtools(store);
}
window.sophieRenderer.setSharedStoreListener({
onSnapshot(snapshot) {
applySnapshot(store, snapshot);
},
onPatch(patch) {
applyPatch(store, patch);
},
});
const theme = createTheme({
palette: {
mode: 'dark',
},
});
function App() {
return (
);
}
render(, document.querySelector('#app'));