import React from "react";
import { Router, Switch, Route } from "react-router-dom";
import { SnackbarProvider } from "notistack";
import PrivateRoute from "./components/PrivateRoute";
import "./App.scss";
import TopBar from "./components/TopBar";
import Notifier from "./components/Notifier";
import AppBackdrop from "./components/Output/AppBackdrop";
import Footer from "./components/Output/Footer";
import SearchResults from "./components/Output/SearchResults";
import Restaurant from "./components/Output/Restaurant";
import Dialogs from "./components/Dialogs";
import { createMuiTheme, ThemeProvider } from "@material-ui/core/styles";
import LoginDialog from "./components/Dialogs/LoginDialog";
import NewRestaurant from "./components/Dialogs/NewRestaurant";
import RegisterDialog from "./components/Dialogs/RegisterDialog";
import ForgotPassword from "./components/Dialogs/ForgotPassword";
import ResetPassword from "./components/Dialogs/ResetPassword";
import Contact from "./components/Output/Contact";
import Settings from "./components/Dialogs/Settings";
import EditRestaurant from "./components/Dialogs/EditRestaurant";
import NewDish from "./components/Dialogs/NewDish";
import EditDish from "./components/Dialogs/EditDish";
import Dish from "./components/Dialogs/Dish";
import HomeScreen from "./components/Output/HomeScreen";
import Cookies from "./components/Dialogs/Cookies";

const theme = createMuiTheme({
  palette: {
    primary: {
      main: "#d68000",
    },
    secondary: {
      light: "#ffffff",
      main: "#ffffff",
      dark: "#ffffff",
      contrastText: "#ffffff",
    },
  },
});

function App(props) {
  return (
    <Router history={props.history}>
      <ThemeProvider theme={theme}>
        <SnackbarProvider
          maxSnack={3}
          anchorOrigin={{
            vertical: "bottom",
            horizontal: "center",
          }}
        >
          <div className="App">
            <AppBackdrop />
            <Notifier />
            <Cookies/>
            <TopBar />
            <div className="main-container">
              <Switch>
                <Route exact path="/">
                 <HomeScreen/>
                </Route>
                <Route path="/results">
                  <SearchResults />
                </Route>
                <Route path="/restaurant/:id">
                  <Restaurant />
                </Route>
                <PrivateRoute
                  path="/newDish/:restaurantID"
                  component={<NewDish />}
                />
                <Route path="/dish/:id">
                  <Dish />
                </Route>
                <Route path="/login">
                  <LoginDialog />
                </Route>
                <Route path="/register">
                  <RegisterDialog />
                </Route>
                <Route path="/kontakt">
                  <Contact />
                </Route>
                <PrivateRoute
                  path="/newRestaurant"
                  component={<NewRestaurant />}
                />
                <PrivateRoute path="/settings" component={<Settings />} />
                <PrivateRoute
                  path="/editRestaurant/:id"
                  component={<EditRestaurant />}
                />
                <PrivateRoute path="/editDish/:id" component={<EditDish />} />
                <Route path="/forgotpassword">
                  <ForgotPassword />
                </Route>
                <Route path="/resetpassword">
                  <ResetPassword />
                </Route>
              </Switch>
            </div>
            <Dialogs />
            <Footer />
          </div>
        </SnackbarProvider>
      </ThemeProvider>
    </Router>
  );
}

export default App;