{"size": 788, "ext": "js", "max_stars_repo_path": "src/products-grid.js", "max_stars_repo_name": "orwa337/bootstrap-carosel", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/products-grid.js", "max_issues_repo_name": "orwa337/bootstrap-carosel", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/products-grid.js", "max_forks_repo_name": "orwa337/bootstrap-carosel", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 30.3076923077, "max_line_length": 101, "alphanum_fraction": 0.6611675127}
import $ from 'jquery';
import productCardTemmplate from './templates/product-card.html';


function mkProductCard(product) {
  const $card = $(productCardTemmplate);
  $card.find('.card-title').text(product.name);
  $card.find('.card-img-top').attr('src', `http://via.placeholder.com/320x240?text=${product.name}`);
  $card.find('.card-text').text(`Price: ${product.price}€`);
  return $card;
}

export default function mkProductGrid(products) {
  const $containerEl = $('<div class="container-fluid"></div>');

  const $rowEl = $('<div class="row"></div>');
  $containerEl.append($rowEl);
  products.forEach((product) => {
    const $colEl = $('<div class="col-12 col-md-4"></div>');
    $colEl.append(mkProductCard(product));
    $rowEl.append($colEl);
  });

  return $containerEl;
}
