{"size": 1228, "ext": "js", "max_stars_repo_path": "resources/js/crud/index.js", "max_stars_repo_name": "fernandogarciag/prueba-nutrabiotics", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "resources/js/crud/index.js", "max_issues_repo_name": "fernandogarciag/prueba-nutrabiotics", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "resources/js/crud/index.js", "max_forks_repo_name": "fernandogarciag/prueba-nutrabiotics", "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": 27.9090909091, "max_line_length": 79, "alphanum_fraction": 0.4812703583}
import React from "react";
import ReactDOM from "react-dom";
import Layout from "../components/Layout";

const Root = ({ jsonData }) => {
  const data = JSON.parse(jsonData);
  const { title, products } = data;
  return (
    <Layout title={title}>
      <table className="table table-bordered">
        <thead>
          <tr>
            <th scope="col">#</th>
            <th scope="col">Nombre:</th>
            <th scope="col">
              <a className="btn btn-primary" href="/crud/create" role="button">
                Nuevo Producto
              </a>
            </th>
          </tr>
        </thead>
        <tbody>
          {products.map((product, index) => (
            <tr key={index}>
              <th scope="row">{index + 1}</th>
              <td>{product.name}</td>
              <td>
                <a className="btn btn-info" href={`/crud/${product.id}`}>
                  Información
                </a>
              </td>
            </tr>
          ))}
        </tbody>
      </table>
    </Layout>
  );
};

if (document.getElementById("root")) {
  const data = document.getElementById("root").getAttribute("data");
  ReactDOM.render(<Root jsonData={data} />, document.getElementById("root"));
}
