{"size": 605, "ext": "js", "max_stars_repo_path": "src/Components/Cell.js", "max_stars_repo_name": "AmMiRo/CS-Build_Week-1", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/Components/Cell.js", "max_issues_repo_name": "AmMiRo/CS-Build_Week-1", "max_issues_repo_issues_event_min_datetime": "2020-09-30T03:17:52.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T07:17:51.000Z", "max_forks_repo_path": "src/Components/Cell.js", "max_forks_repo_name": "AmMiRo/CS-Build_Week-1", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 13, "max_forks_count": null, "avg_line_length": 20.8620689655, "max_line_length": 62, "alphanum_fraction": 0.4132231405}
import React from "react";

const Cell = ({ i, j, grid, setGrid, running }) => {
  //   console.log(running);
  return (
    <div
      key={`${i}-${j}`}
      onClick={
        running
          ? () => {}
          : () => {
              const g = grid;
              const g2 = JSON.parse(JSON.stringify(grid));
              g2[i][j] = g[i][j] ? 0 : 1;
              setGrid(g2);
            }
      }
      style={{
        width: 15,
        height: 15,
        backgroundColor: grid[i][j] ? "LightGray" : undefined,
        border: "solid 1px black",
      }}
    />
  );
};

export default Cell;
