caremyway-client/src/components/App.jsx

import React, { Component } from "react";
import { Route, Switch } from "react-router-dom";

import ForgotPassword from "./Auth/ForgotPassword";
import Login from "./Auth/Login";
import Register from "./Auth/Register";
import ResetPassword from "./Auth/ResetPassword";
import Settings from "./Auth/Settings";
import VerifyEmail from "./Auth/VerifyEmail";
import CreateWorkTypeForm from "./User/Client/CreateWorkTypeForm";
import UpdateWorkTypeForm from "./User/Client/UpdateWorkTypeForm";
import CompleteRegistration from "./User/CompleteRegistration";
import EditProfile from "./User/EditProfile";
import Profile from "./User/Profile";
import PrivateRoute from "./Shared/PrivateRoute";
import About from "./Static/About";
import Footer from "./Static/Footer";
import Home from "./Static/Home";
import NoMatch from "./Static/NoMatch";
import Navbar from "./Navbar";

class App extends Component {
  render() {
    return (
      <div>
        <Navbar />
        <div
          style={{
            display: "flex",
            minHeight: "calc(100vh - 1px)",
            flexDirection: "column"
          }}
        >
          <div style={{ flex: "1" }}>
            <Switch>
              <Route exact path="/" component={Home} />
              <Route path="/about" component={About} />
              <Route path="/auth/login" component={Login} />
              <Route path="/auth/register" component={Register} />
              <Route
                path="/auth/verify-email/:emailKey"
                component={VerifyEmail}
              />
              <Route path="/auth/verify-email" component={VerifyEmail} />
              <PrivateRoute path="/auth/settings" component={Settings} />
              <Route path="/auth/forgot-password" component={ForgotPassword} />
              <Route
                path="/auth/reset-password/:uid/:token"
                component={ResetPassword}
              />
              <PrivateRoute
                path="/user/profile/client/update-worktype/:uuid"
                component={UpdateWorkTypeForm}
              />
              <PrivateRoute
                path="/user/profile/client/create-worktype"
                component={CreateWorkTypeForm}
              />
              <PrivateRoute path="/user/profile/edit" component={EditProfile} />
              <PrivateRoute path="/user/profile" component={Profile} />
              <Route path="/user/complete-registration" component={Profile} />
              <Route component={NoMatch} />
            </Switch>
            <Route
              path="/user/complete-registration"
              component={CompleteRegistration}
            />
          </div>
          <Footer />
        </div>
      </div>
    );
  }
}

export default App;