github.com/martinohmann/rfoutlet@v1.2.1-0.20220707195255-8a66aa411105/web/src/App.js (about) 1 import React, { useState, useEffect } from 'react'; 2 import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'; 3 import { MuiPickersUtilsProvider } from '@material-ui/pickers'; 4 import LuxonUtils from '@date-io/luxon'; 5 import cyan from '@material-ui/core/colors/cyan'; 6 import { HashRouter } from 'react-router-dom'; 7 import { I18nextProvider } from 'react-i18next'; 8 import { GroupProvider } from './Context'; 9 import i18n from './i18n'; 10 import Routes from './components/Routes'; 11 import dispatcher from './dispatcher'; 12 13 const theme = createMuiTheme({ 14 palette: { 15 primary: cyan, 16 }, 17 typography: { 18 useNextVariants: true, 19 }, 20 overrides: { 21 MuiPickersToolbarText: { 22 toolbarTxt: { 23 color: "rgba(255, 255, 255, 0.54)", 24 }, 25 toolbarBtnSelected: { 26 color: "white", 27 }, 28 }, 29 }, 30 }); 31 32 export default function App() { 33 const [groups, setGroups] = useState([]); 34 const [ready, setReady] = useState(false); 35 36 useEffect(() => { 37 dispatcher.addMessageListener(groups => { 38 setGroups(groups); 39 setReady(true); 40 }); 41 42 dispatcher.dispatchStatusMessage(); 43 }, []); 44 45 return ( 46 <HashRouter> 47 <I18nextProvider i18n={i18n}> 48 <MuiThemeProvider theme={theme}> 49 <MuiPickersUtilsProvider utils={LuxonUtils} locale={i18n.language}> 50 <GroupProvider groups={groups}> 51 <Routes ready={ready} groups={groups} /> 52 </GroupProvider> 53 </MuiPickersUtilsProvider> 54 </MuiThemeProvider> 55 </I18nextProvider> 56 </HashRouter> 57 ); 58 }