import {useEffect, useState} from "react";
import CatHistoryLine from "./CatHistoryLine";

type CatHistoryRecord = {
    event: string,
    time: Date
}
function CatHistory() {

    const [history, setHistory] = useState<CatHistoryRecord[]>([])

    useEffect( () => {

        const newRecords = [
            {event: "entré", time: new Date()},
            {event: "entré", time: new Date()},
            {event: "sorti", time: new Date()}
        ];

        setHistory(newRecords)

    }, [])

    console.log(history)
    /*useEffect(() => {
        fetch("https://api.example.com/items")
            .then(res => res.json())
            .then(
                (result) => {
                    setIsLoaded(true);
                    setItems(result);
                },
                // Note: it's important to handle errors here
                // instead of a catch() block so that we don't swallow
                // exceptions from actual bugs in components.
                (error) => {
                    setIsLoaded(true);
                    setError(error);
                }
            )
    }, [])*/

    return(
        <div>
            {history.map((chl, index) => (<CatHistoryLine key={index} lineData={chl} />))}
        </div>
    )


}
export default CatHistory