import React from 'react';
import { Switch , Route } from 'react-router';
import Loadable from 'react-loadable';
import Loading from '../../../Loading';
import SubMenu from '../sub/SubMenu';
import "./version.scss";

const CoderRootVersion = Loadable({
  loader: () => import('./version'),
  loading: Loading,
})
const CoderRootVersionNew = Loadable({
  loader: () => import('./New'),
  loading: Loading,
})
function Index(props) {
  const { projectsId , owner } = props.match.params;
  return(
    <div>
      <SubMenu tab={"releases"} projectsId={projectsId} owner={owner}/>
      <Switch>
        <Route path="/:owner/:projectsId/releases/:versionId/update"
          render={
            (p) => (<CoderRootVersionNew {...props} {...p} />)
          }
        ></Route>
        <Route path="/:owner/:projectsId/releases/new"
          render={
            (p) => (<CoderRootVersionNew {...props} {...p} />)
          }
        ></Route>
        <Route path="/:owner/:projectsId/releases"
          render={
            (p) => (<CoderRootVersion {...props} {...p} />)
          }
        ></Route>
      </Switch>
    </div>
  )
}
export default Index;