import React, { Component } from 'react';
import { Link } from 'react-router-dom';

class DetailTop extends Component {
  render() {
    const { coderCount , platform } = this.props;
    const { projectsId, owner } = this.props.match.params;
    const { pathname } = this.props.location;
    return (
      <p className="branch-wrapper">
        
        {
          platform ?
          <React.Fragment>
            <Link to={`/${owner}/${projectsId}/commits`} className={pathname.indexOf("/commits") > 0 ? "active" : ""}>
              <i className="iconfont icon-tijiaojilu font-20 mr3 font-bd"></i>
              <span>{(coderCount && coderCount.commits_count) || 0}</span>个提交
            </Link>
            <Link to={`/${owner}/${projectsId}/branches`} className={pathname.indexOf("/branches") > 0 ? "active" : ""}>
              <i className="iconfont icon-fenzhi1 font-18 mr3"></i>
              <span>{(coderCount && coderCount.branches_count) || 0}</span>个分支
            </Link>
            <Link to={`/${owner}/${projectsId}/tags`} className={pathname.indexOf("/tags") > 0 ? "active" : ""}>
              <i className="iconfont icon-biaoqian3 font-18 mr3"></i>
              <span>{(coderCount && coderCount.tags_count) || 0}</span>个标签
            </Link>
            <Link to={`/${owner}/${projectsId}/releases`} className={pathname.indexOf("/releases") > 0 ? "active" : ""}>
              <i className="iconfont icon-fahangban font-18 mr3"></i>
              <span>{(coderCount && coderCount.version_releasesed_count) || 0}</span>个发行版
            </Link>
          </React.Fragment>
          :
          <React.Fragment>
            <a href="javscript:void(0)" style={{cursor:"default"}}>
              <i className="iconfont icon-tijiaojilu font-20 mr3 font-bd"></i>
              <span>{(coderCount && coderCount.commits_count) || 0}</span>个提交
            </a>
            <a href="javscript:void(0)" style={{cursor:"default"}}>
              <i className="iconfont icon-fenzhi1 font-18 mr3"></i>
              <span>{(coderCount && coderCount.branches_count) || 0}</span>个分支
            </a>
            <a href="javscript:void(0)" style={{cursor:"default"}}>
              <i className="iconfont icon-biaoqian3 font-18 mr3"></i>
              <span>{(coderCount && coderCount.tags_count) || 0}</span>个标签
            </a>
            <a href="javscript:void(0)" style={{cursor:"default"}}>
              <i className="iconfont icon-fahangban font-18 mr3"></i>
              <span>{(coderCount && coderCount.version_releasesed_count) || 0}</span>个发行版
            </a>
          </React.Fragment>
        }
        
        <a href="javscript:void(0)" style={{cursor:"default"}}>
          <i className="iconfont icon-cangku font-18 mr3"></i>
          仓库 <span className="ml3">{(coderCount && coderCount.size) || 0}</span>
        </a>
      </p>
    )
  }
}
export default DetailTop;
