import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

//import views
import Home from "./views/Home";
import Components from "./views/Components";
import FormProductModel from "./components/FormProductModel";
import NewComponent from "./views/NewComponent";
import NewProductModel from "./views/NewProductModel";
import ProductModel from "./views/ProductModel";
import Layout from "./views/Layout";
import NewProductFabric from "./views/NewProductFabric";
import FabricDashboard from "./views/FabricDashboard";
import EditComponent from "./views/EditComponent";
import Supplies from "./views/Supplies";
import Calculator_View from "./views/Calculator_View";
import NewSupply from "./views/NewSupply";
import EditSupply from "./views/EditSupply";
import ProvidersDetail from "./views/ProvidersDetail";
import SuppliesArchived from "./views/SuppliesArchived";
import NewOrder_View from "./views/NewOrder_View";

//Utilizo el switch para que no se pierda el navbar a medida que uno se vaya moviendo por las diferentes vistas de la app :D

function App() {
  return (
    <div
      className="App"
      style={{
        minHeight: "100vh",
        margin: "0",
        padding: "0",
        boxSizing: "border-box",
      }}
    >
      <Router>
        <Layout>
          <Switch>
            <Route exact path="/" component={Home} />
            <Route exact path="/components" component={Components} />
            <Route exact path="/test" component={FormProductModel} />
            <Route exact path="/newcomponent" component={NewComponent} />
            <Route exact path="/newproductmodel" component={NewProductModel} />
            <Route exact path="/productmodel" component={ProductModel} />
            <Route
              exact
              path="/newproductfabric"
              component={NewProductFabric}
            />
            <Route exact path="/fabricdashboard" component={FabricDashboard} />
            <Route exact path="/editcomponent" component={EditComponent} />
            <Route exact path="/editsupply/:id" component={EditSupply} />
            <Route exact path="/supplies" component={Supplies} />
            <Route exact path="/archivedsupplies" component={SuppliesArchived} />
            <Route exact path="/newsupply" component={NewSupply} />
            <Route exact path="/calculator" component={Calculator_View} />
            <Route exact path="/providersDetail/:id" component={ProvidersDetail} />
            <Route exact path="/neworder/:id" component={NewOrder_View} />
          </Switch>
        </Layout>
      </Router>
    </div>
  );
}

export default App;