45 lines
1.2 KiB
JavaScript
45 lines
1.2 KiB
JavaScript
import { useState } from 'react';
|
|
import CssBaseline from '@mui/material/CssBaseline';
|
|
import Container from '@mui/material/Container';
|
|
import { ThemeProvider, createTheme } from '@mui/material/styles';
|
|
import { SnackbarProvider } from 'notistack';
|
|
|
|
import NavbarComponent from './Navbar';
|
|
import SearchComponent from './Search';
|
|
import ResultComponent from './Result';
|
|
|
|
const darkTheme = createTheme({
|
|
palette: {
|
|
mode: 'dark',
|
|
},
|
|
});
|
|
|
|
export default function App() {
|
|
const [zip, setZip] = useState(0);
|
|
const [city, setCity] = useState("");
|
|
|
|
function handleSearch(value, zip, city) {
|
|
setZip(zip);
|
|
setCity(city);
|
|
|
|
if (window.history.replaceState) {
|
|
value = encodeURIComponent(value);
|
|
window.history.replaceState({}, null, `?s=${value}`);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<ThemeProvider theme={darkTheme}>
|
|
<CssBaseline />
|
|
<SnackbarProvider>
|
|
<NavbarComponent />
|
|
<Container sx={{ marginY: "1rem" }}>
|
|
<SearchComponent callback={handleSearch} />
|
|
</Container>
|
|
<Container sx={{ marginBottom: "2rem" }}>
|
|
<ResultComponent zip={zip} city={city} />
|
|
</Container>
|
|
</SnackbarProvider>
|
|
</ThemeProvider>
|
|
);
|
|
}
|