import GridRow from "./GridRow.js";
import { CalendarStateContext } from "../pages/Calendar";
import { moveDate, toSunday } from "../utils/Dates";

import React, { useContext } from "react";

const Grid = () => {
  const { state } = useContext(CalendarStateContext);

  const renderRows = () => {
    const rows = [];
    const ndate = new Date(state.date);
    ndate.setDate(1);
    toSunday(ndate);

    for (let i = 0; i < 5; i++) {
      rows.push(<GridRow key={i} startDate={new Date(ndate)} />);
      moveDate(ndate, "week", 1);
    }

    return rows;
  };

  return <div className="Grid">{renderRows()}</div>;
};

export default Grid;