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: React.FC = () => { 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;