EscolaLMS/Front

View on GitHub
src/components/Routes/index.tsx

Summary

Maintainability
A
3 hrs
Test Coverage
import React, { ReactElement, lazy, Suspense } from "react";
import { Switch, Route } from "react-router-dom";

import routes from "./routes";

import PrivateRoute from "./private";
import ConfigRoute from "./config";
import ConfigRouteExtend from "./configExtend";

import { HashRouter, BrowserRouter } from "react-router-dom";

import { routerType } from "@/utils/router";
import ScrollToTop from "../Common/ScrollToTop";

import { Loader } from "./../_App/Loader/Loader";
import routeRoutes from "./routes";

const HomePage = lazy(() => import("../../pages/index"));

const RegisterPage = lazy(() => import("../../pages/register/index"));
const LoginPage = lazy(() => import("../../pages/login/index"));
const VerifyEmail = lazy(() => import("../../pages/verify-email"));

const StaticPage = lazy(() => import("../../pages/static-page/index"));
const NotFoundPage = lazy(() => import("../../pages/404/index"));

// platform visibility
// const TutorsPage = lazy(() => import("../../pages/tutors/index"));
// const TutorPage = lazy(() => import("../../pages/tutors/tutor/index"));
const CoursesPage = lazy(() => import("../../pages/courses"));
const CoursePage = lazy(() => import("../../pages/courses/course/index"));
const CoursePreviewPage = lazy(() => import("../../pages/courses/preview"));
const ConsultationPage = lazy(() => import("../../pages/consultation/index"));
const ConsultationsPage = lazy(() => import("../../pages/consultations"));
const ResetPage = lazy(() => import("../../pages/reset-password/index"));
// const EventsPage = lazy(() => import("../../pages/events"));
// const EventPage = lazy(() => import("../../pages/event"));
// const WebinarsPage = lazy(() => import("../../pages/webinars"));
// const WebinarPage = lazy(() => import("../../pages/webinar"));
// const PackagesPage = lazy(() => import("../../pages/packages"));
const PackagePage = lazy(() => import("../../pages/package"));
const SubscriptionsPage = lazy(() => import("../../pages/subscriptions"));
const MySubscriptions = lazy(() => import("../../pages/user/my-subscriptions"));

// const RegisterPage = lazy(() => import("../../pages/register"));
// const LoginPage = lazy(() => import("../../pages/login"));

// privates
// const MyTasks = lazy(() => import("../../pages/user/MyTasks"));
// const MyBookmarks = lazy(() => import("../../pages/user/MyBookmarks"));
const MyProfilePage = lazy(() => import("../../pages/user/MyProfile"));
// const MyStationaryEvents = lazy(
//   () => import("../../pages/user/MyStationaryEvents")
// );
const MyOrdersPage = lazy(() => import("../../pages/user/my-orders"));
const MyNotificationsPage = lazy(
  () => import("../../pages/user/my-notifications")
);
const MyConsultationsPage = lazy(
  () => import("../../pages/user/my-consultations")
);
const MyDataPage = lazy(() => import("../../pages/user/my-data"));
const CourseProgramPage = lazy(() => import("../../pages/course/index"));
const CartPage = lazy(() => import("../../pages/cart/index"));
// const MyWebinarsPage = lazy(() => import("../../pages/user/MyWebinars"));
const MyCertificatesPage = lazy(
  () => import("../../pages/user/my-certificates")
);
const OnboardingPage = lazy(() => import("../../pages/onboarding/index"));
const ConditionalRouter: React.FC<{
  basename: string;
  children: React.ReactNode;
}> = (props) => {
  return routerType() === "BrowserRouter" ? (
    <BrowserRouter {...props} />
  ) : (
    <HashRouter {...props} />
  );
};

declare global {
  interface Window {
    VITE_APP_BASENAME: string;
  }
}

const BASENAME =
  window.VITE_APP_BASENAME || import.meta.env.BASE_URL || routeRoutes.home;

const Routes: React.FC = (): ReactElement => {
  const {
    home,
    // authentication,
    page,
    myProfile,
    myConsultations,
    myOrders,
    // tutors,
    // tutor,
    courses,
    course,
    preview,
    courseProgram,
    consultation,
    consultations,
    cart,
    reset,
    notFound,
    myNotifications,
    myData,
    login,
    register,
    emailVerify,
    // events,
    // event,
    // myStationaryEvents,
    // myTasks,
    // myBookmarks,
    // webinars,
    // webinar,
    // myWebinars,
    // packages,
    packageProduct,
    myCertificates,
    onboarding,
    subscriptions,
    mySubscriptions,
  } = routes;

  return (
    <ConditionalRouter basename={BASENAME}>
      <ScrollToTop />
      <Suspense fallback={<Loader />}>
        <Switch>
          <Route exact path={home} component={HomePage} />
          <Route exact path={register} component={RegisterPage} />

          <Route exact path={login} component={LoginPage} />

          <Route exact path={reset} component={ResetPage} />
          <Route exact path={emailVerify} component={VerifyEmail} />
          <Route exact path={subscriptions} component={SubscriptionsPage} />
          {/* <Route exact path={authentication} component={AuthPage} /> */}
          {/* platform visibility pages*/}
          {/* <ConfigRoute exact path={tutors} component={TutorsPage} /> */}
          <ConfigRoute
            exact
            path={consultations}
            component={ConsultationsPage}
          />
          <ConfigRoute exact path={consultation} component={ConsultationPage} />
          {/* <ConfigRoute exact path={tutor} component={TutorPage} /> */}
          <ConfigRoute exact path={course} component={CoursePage} />
          <ConfigRoute exact path={preview} component={CoursePreviewPage} />
          <ConfigRouteExtend exact path={courses} component={CoursesPage} />
          {/* <ConfigRoute exact path={events} component={EventsPage} />
          <ConfigRoute exact path={event} component={EventPage} />
          <ConfigRoute exact path={webinars} component={WebinarsPage} />
          <ConfigRoute exact path={webinar} component={WebinarPage} /> */}
          {/* <ConfigRoute exact path={packages} component={PackagesPage} /> */}
          <ConfigRoute exact path={packageProduct} component={PackagePage} />
          {/* privates pages*/}
          <PrivateRoute exact path={onboarding} component={OnboardingPage} />
          <PrivateRoute exact path={myProfile} component={MyProfilePage} />
          {/* <PrivateRoute exact path={myTasks} component={MyTasks} />
          <PrivateRoute exact path={myBookmarks} component={MyBookmarks} /> */}
          {/* <PrivateRoute exact path={myWebinars} component={MyWebinarsPage} /> */}
          <PrivateRoute
            exact
            path={mySubscriptions}
            component={MySubscriptions}
          />
          <PrivateRoute
            exact
            path={myCertificates}
            component={MyCertificatesPage}
          />
          {/* <PrivateRoute
            exact
            path={myStationaryEvents}
            component={MyStationaryEvents}
          /> */}
          <PrivateRoute
            exact
            path={myConsultations}
            component={MyConsultationsPage}
          />
          <PrivateRoute exact path={myOrders} component={MyOrdersPage} />
          <PrivateRoute
            exact
            path={myNotifications}
            component={MyNotificationsPage}
          />
          <PrivateRoute exact path={myData} component={MyDataPage} />
          <PrivateRoute
            exact
            path={courseProgram}
            component={CourseProgramPage}
          />
          <PrivateRoute exact path={home} component={MyProfilePage} />
          <PrivateRoute exact path={cart} component={CartPage} />
          <Route exact path={notFound} component={NotFoundPage} />
          <Route exact path={page} component={StaticPage} />
          <Route exact component={NotFoundPage} />
        </Switch>
      </Suspense>
    </ConditionalRouter>
  );
};

export default Routes;