import EventHistoryItem from "../EventItem/EventItem";
import OneUptimeDate from "../../../Types/Date";
import React, { useState, useEffect, } from "react";
const EventHistoryDayList = (props) => {
    const [windowWidth, setWindowWidth] = useState(typeof window !== "undefined" ? window.innerWidth : 1024);
    useEffect(() => {
        const handleResize = () => {
            setWindowWidth(window.innerWidth);
        };
        window.addEventListener("resize", handleResize);
        // Cleanup event listener on component unmount
        return () => {
            window.removeEventListener("resize", handleResize);
        };
    }, []);
    const isMobile = windowWidth <= 768;
    return (React.createElement("div", { className: "md:flex bottom-Gray500-border", style: {
            marginLeft: "-10px",
            marginRight: "-10px",
            marginBottom: props.isLastItem ? "0px" : "20px",
            borderBottomWidth: props.isLastItem ? "0px" : "1px",
        } },
        React.createElement("div", { className: "text-gray-400 mt-2 text-sm", style: {
                padding: "20px",
                paddingLeft: "10px",
                paddingRight: "0px",
                width: isMobile ? "100%" : "15%",
            } }, OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(props.date, true)),
        React.createElement("div", { style: {
                padding: "10px",
                paddingTop: "0px",
                width: isMobile ? "100%" : "85%",
            } }, props.items.map((item, i) => {
            return React.createElement(EventHistoryItem, Object.assign({ key: i }, item));
        }))));
};
export default EventHistoryDayList;
//# sourceMappingURL=EventHistoryDayList.js.map