{"size": 2288, "ext": "js", "max_stars_repo_path": "src/components/AdvertCard/AdvertCard.js", "max_stars_repo_name": "falces/kcPracticaReactRedux", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/AdvertCard/AdvertCard.js", "max_issues_repo_name": "falces/kcPracticaReactRedux", "max_issues_repo_issues_event_min_datetime": "2021-05-10T21:07:18.000Z", "max_issues_repo_issues_event_max_datetime": "2021-05-10T21:07:18.000Z", "max_forks_repo_path": "src/components/AdvertCard/AdvertCard.js", "max_forks_repo_name": "falces/kcPracticaReactRedux", "max_forks_repo_forks_event_min_datetime": "2019-12-05T17:10:57.000Z", "max_forks_repo_forks_event_max_datetime": "2020-06-20T13:13:02.000Z"}
{"max_stars_count": null, "max_issues_count": 1, "max_forks_count": 6, "avg_line_length": 29.7142857143, "max_line_length": 79, "alphanum_fraction": 0.5048076923}
/* NPM modules */
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import Moment from 'react-moment';
/* Material UI */
import VisibilityIcon from '@material-ui/icons/Visibility';
import EditIcon from '@material-ui/icons/Edit';
import Chip from '@material-ui/core/Chip';
/* Own modules */
/* Assets */
import imageBuy from '../../assets/images/buy.png';
import imageSell from '../../assets/images/sell.png';
/* CSS */
import './AdvertCard.css';

/**
 * Main App
 */
export default class AdvertCard extends Component {
  /**
   * Render
   */
  render() {
    return (
      <article className="AdvertCard">
        <header className="AdvertCard__Header">
          <img
            src={`${this.props.type === 'buy' ? imageBuy : imageSell}`}
            alt="avatar"
          />
          <div className="AdvertCard__HeaderTitle">
            <Link to={`/advert/${this.props.id}`} className="AdvertCard__Link">
              <h2>{this.props.name}</h2>
            </Link>
            <Moment className="AdvertCard__Date" fromNow>
              {this.props.createdAt}
            </Moment>
          </div>
        </header>
        <div className="AdvertCard__Media">
          <img src={this.props.photo} alt="caption" />
          <p className="AdvertCard__Price">
            {this.props.price}
            <span className="AdvertCard__Currency">€</span>
          </p>
        </div>
        <div className="AdvertCard__Footer">
          <div className="AdvertCard__FooterActions">
            <Link to={`/advert/${this.props.id}`} className="AdvertCard__Link">
              <VisibilityIcon />
            </Link>
            <Link
              to={`/advert/${this.props.id}/edit`}
              className="AdvertCard__Link"
            >
              <EditIcon />
            </Link>
          </div>
          <div className="Ad__Tags">
            {this.props.tags &&
              this.props.tags.map((value, i) => {
                return (
                  <Chip
                    key={i}
                    size="small"
                    label={value}
                    className={`Ad__Tag Ad__Tag--${value}`}
                  />
                );
              })}
          </div>
        </div>
      </article>
    );
  }
}
