forgeplus-react/src/forge/Index.js

import React, { Component } from "react";

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

import { SnackbarHOC } from "educoder";
import { CNotificationHOC } from "../modules/courses/common/CNotificationHOC";
import { TPMIndexHOC } from "../modules/tpm/TPMIndexHOC";
import Handbook from './Component/Handbook';
import "./css/index.scss";

import Loadable from "react-loadable";
import Loading from "../Loading";
import { ImageLayerOfCommentHOC } from "../modules/page/layers/ImageLayerOfCommentHOC";

const ProjectNew = Loadable({
  loader: () => import("./New/Index"), 
  loading: Loading,
});
const ProjectIndex = Loadable({
  loader: () => import("./Main/Index"),
  loading: Loading,
});

const ProjectDetail = Loadable({
  loader: () => import("./Main/Detail"),
  loading: Loading,
});

const Infos = Loadable({
  loader: () => import("./users/Infos"),
  loading: Loading,
});
class Index extends Component {
  render() {
    return (
      <div className="newMain clearfix">
        <Handbook />
        <Switch {...this.props}>
          <Route
            path="/projects/:projectsType/new/:OIdentifier"
            render={(props) => (
              <ProjectNew {...this.props} {...props} />
            )}
          ></Route>
          <Route
            path="/projects/:projectsType/new"
            render={(props) => (
              <ProjectNew {...this.props} {...props} />
            )}
          ></Route>
          <Route
            path="/projects/:owner/:projectsId"
            render={(props) => (
              <ProjectDetail {...this.props} {...props} />
            )}
          ></Route>
          <Route
            path="/projects"
            render={(props) => (
              <ProjectIndex {...this.props} {...props} />
            )}
          ></Route>
          <Route
            exact
            path="/"
            render={(props) => (
              this.props.current_user && this.props.current_user.login ?
              <Infos {...this.props} {...props} />
              :
              <ProjectIndex {...this.props} {...props} />
            )}
          ></Route>
        </Switch>
      </div>
    );
  }
}
export default withRouter(
  ImageLayerOfCommentHOC({
    imgSelector: ".imageLayerParent img, .imageLayerParent .imageTarget",
    parentSelector: ".newMain",
  })(CNotificationHOC()(SnackbarHOC()(TPMIndexHOC(Index))))
);