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

import { AuthRoute, TYPES } from "../Routes/AuthRoute";
import { MessageBar } from "../MessageBar";
import { useUserContext } from "../Contexts/UserContext";
import { Roles } from "../../utils/roles";

const SSOForm = React.lazy(() => import("../SSOForm"));
const Home = React.lazy(() => import("../Home"));
const VehicleAddForm = React.lazy(() => import("../Cars/Add"));
const PageNotFound = React.lazy(() => import("../404"));
const CarUpdatesDeploy = React.lazy(() => import("../CarUpdates/Deploy"));
const CarUpdatesStatus = React.lazy(() => import("../CarUpdates/Status"));
const CarUpdates = React.lazy(() => import("../Cars/Status"));
const SendCommandBulk = React.lazy(() => import("../Cars/SendCommandBulk"));
const Datascope = React.lazy(() => import("../Datascope/Home"));
const BatteryDatascope = React.lazy(() => import("../Datascope/Battery"));
const Manifests = React.lazy(() => import("../Manifest/List"));
const ManifestDeploy = React.lazy(() => import("../Manifest/Deploy"));
const ManifestStatus = React.lazy(() => import("../Manifest/Status"));
const ManifestCreate = React.lazy(() => import("../Manifest/Create"));

const SiteRoutes = () => {
  const { token, groups } = useUserContext();
  return (
    <Suspense fallback={"Loading..."}>
      <MessageBar />
      <Switch>
        <AuthRoute
          path="/"
          exact
          render={() => <SSOForm />}
          type={TYPES.GUEST}
          token={token}
        />
        <AuthRoute
          path="/home"
          render={() => <Home />}
          type={TYPES.PROTECTED}
          token={token}
        />
        <AuthRoute
          path="/carupdate-deploy/:packageid"
          render={() => <CarUpdatesDeploy />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.CREATE]}
        />
        <AuthRoute
          path="/carupdate-status/:packageid"
          render={() => <CarUpdatesStatus />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/vehicles"
          render={() => <SendCommandBulk />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.CREATE]}
        />
        <AuthRoute
          path="/vehicle-add"
          render={() => <VehicleAddForm />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.CREATE]}
        />
        <AuthRoute
          path="/vehicle-status/:vin"
          render={() => <CarUpdates />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/datascope/battery"
          render={() => <BatteryDatascope />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/datascope"
          render={() => <Datascope />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/packages"
          render={() => <Manifests />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/package-deploy/:manifest_id"
          render={() => <ManifestDeploy />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.CREATE]}
        />
        <AuthRoute
          path="/package-status/:manifest_id"
          render={() => <ManifestStatus />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.READ, Roles.CREATE]}
        />
        <AuthRoute
          path="/package-create"
          render={() => <ManifestCreate />}
          type={TYPES.PROTECTED}
          token={token}
          groups={groups}
          roles={[Roles.CREATE]}
        />
        <PageNotFound />
      </Switch>
    </Suspense>
  );
};

export default SiteRoutes;
