{"size": 2067, "ext": "js", "max_stars_repo_path": "client/modules/core/components/server_list.js", "max_stars_repo_name": "jpJuni0r/rental.tf", "max_stars_repo_stars_event_min_datetime": "2017-05-10T21:24:01.000Z", "max_stars_repo_stars_event_max_datetime": "2017-05-10T21:24:01.000Z", "max_issues_repo_path": "client/modules/core/components/server_list.js", "max_issues_repo_name": "jpJuni0r/rental.tf", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "client/modules/core/components/server_list.js", "max_forks_repo_name": "jpJuni0r/rental.tf", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 27.9324324324, "max_line_length": 93, "alphanum_fraction": 0.3551040155}
import React from 'react';

class ServerList extends React.Component {
  render() {
    const {servers} = this.props;
    return (
      <section className="container">
        <h2>Recent Servers</h2>

        <table className="table table-striped">
          <thead>
            <tr>
              <th />
              <th>User</th>
              <th>Region</th>
              <th>Date</th>
            </tr>
          </thead>
          <tbody>
            {servers.length === 0 ? (
              <tr>
                <td colSpan="4" className="text-center">
                  <em>
                    No servers were created, yet. Go ahead and <a href="/new">create</a> one!
                  </em>
                </td>
              </tr>
            ) : null}
            {servers.map(server => (
              <tr key={server._id} onClick={this._gotoServer.bind(this, server._id)}
                className="pointer">
                <td className="text-center">
                  {(() => {
                    switch (server.stage) {
                      case 1:
                      case 2:
                      case 3:
                        return (
                          <i className="fa fa-spin fa-spinner text-warning" />
                        );
                      case 4:
                        return (
                          <i className="fa fa-check text-success" />
                        );
                      case 11:
                      case 12:
                        return (
                          <i className="fa fa-close" />
                        );

                    }
                  })()}
                </td>
                <td>
                  {server.username}
                </td>
                <td>{server.region.toUpperCase()}</td>
                <td>{server.createdAt}</td>
              </tr>
            ))}
          </tbody>
        </table>
      </section>
    );
  }

  _gotoServer(id) {
    const {gotoServer} = this.props;
    gotoServer(id);
  }
}

export default ServerList;
