import React from "react";
import useLights from "../../Hooks/light";
import Light from "../Light";
import Loading from "../Loading";
import {Card, CardBody, CardHeader} from "reactstrap";

function LightPage() {
  const lights = useLights();
  if (lights === null) {
    return <Loading/>;
  }

  return (
    <Card className="mt-3">
      <CardHeader>
        Tilgjengelige lys
      </CardHeader>
      <CardBody>
        {lights.map(light => <Light {...light} />)}
      </CardBody>
    </Card>
  );
}

export default LightPage;