import React from 'react' ; import { BrowserRouter } from 'react-router-dom' ; import { ThemeProvider , DefaultTheme } from 'styled-components' ; import usePeristedState from './utils/usePersistedState' ; import Routes from './routes' ; import GlobalStyle from './styles/global' ; import light from './styles/themes/light' ; import dark from './styles/themes/dark' ; const App = ( ) => { const [ theme , setTheme ] = usePeristedState < DefaultTheme > ( 'theme' , light ) ; const toggleTheme = ( ) => { setTheme ( theme . title === 'light' ? dark : light ) ; } ; return ( < ThemeProvider theme = { theme } > < BrowserRouter > < Routes toggleTheme = { toggleTheme } /> < GlobalStyle / > < /BrowserRouter> < /ThemeProvider>); } ; export default App ;