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 "./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,
// });

class Index extends Component {

  componentDidUpdate = () => {
    this.props.history.listen(() => {
      if (document.body.scrollTop || document.documentElement.scrollTop > 0) {
        window.scrollTo(0, 0)
      }
    })
  }
  render() {
    
    return (
      <div className="newMain clearfix">
        <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/mirror/new"
            render={(props) => (
              <ProjectNew {...this.props} {...props} />
            )}
          ></Route>
          {/* <Route
            path="/:owner/:projectsId"
            render={(props) => (
              <ProjectDetail {...this.props} {...props} />
            )}
          ></Route> */}
          <Route
            path="/explore"
            render={(props) => (
              <ProjectIndex {...this.props} {...props} />
            )}
          ></Route>

          <Route
            path="/"
            render={(props) => (
              <ProjectIndex {...this.props} {...props} />
            )}
          ></Route>
          <Route
            path="/"
            render={(props) => (
              <ProjectIndex {...this.props} {...props} />
            )}
          ></Route>
        </Switch>
      </div>
    );
  }
}
export default withRouter(
  ImageLayerOfCommentHOC({
    imgSelector: ".imageLayerParent img, .imageLayerParent .imageTarget",
    parentSelector: ".newMain",
  })(CNotificationHOC()(SnackbarHOC()(TPMIndexHOC(Index))))
);

// export default withRouter(
//   ImageLayerOfCommentHOC({
//     imgSelector: ".imageLayerParent img, .imageLayerParent .imageTarget",
//     parentSelector: ".newMain",
//   })(Index)
// );
