import React, { Component } from "react";
import { getImageUrl } from "educoder";
import { Link } from 'react-router-dom';
import FocusButton from "./focus_button";
import { Button } from "antd";
import "./list.css";
class UserList extends Component {

  renderList = (users, userClass, current_user, type_title , successFunc , notReset) => {
    if (users && users.length > 0) {
      return users.map((item, key) => {
        return (
          <div className={`pull-left ${userClass}`} key={key}>
            <div className="pbt25 grid-item mlr10  border-b-line">
              <div>
                <a
                  href={`/${item.login}`}
                  className="show-user-link"
                >
                  <img
                    className="avatar-60"
                    src={getImageUrl(`/${item.image_url}`)}
                    alt=""
                  />
                </a>
              </div>
              <div className="ml12">
                <div>
                  <Link
                    to={`/${item.login}`}
                    className="font-16 text-primary task-hide max-w-200"
                    style={{display:"block"}}
                    title={item.name}
                  >
                    {item.name}
                  </Link>
                </div>
                <div className="font-12 text-gray grid-item pb5">
                  <i className="iconfont icon-shijian user-join-time"></i>
                  <span className="ml4">{type_title === '点赞列表' ? "点赞" : type_title === "关注列表" ? "关注":'fork'}时间：{item.format_time}</span>
                </div>
                {
                  current_user && current_user.login === item.login ?
                  <Button type="default">当前用户</Button>
                  :
                  <FocusButton is_watch={item.is_watch} notReset={notReset} id={item.login} successFunc={successFunc}/>
                }
              </div>
            </div>
          </div>
        );
      });
    }
  }
  render() {
    const { users, userClass, current_user , type_title , successFunc , notReset , title_type } = this.props;
    return (
      this.renderList(users, userClass, current_user, type_title , successFunc , notReset , title_type)
    );
  }
}

export default UserList;
