import { jsx as _jsx } from "react/jsx-runtime";
// (C) 2024-2026 GoodData Corporation
import { createContext, useContext, useEffect, useState, } from "react";
import { setScreenSize as setScreenSizeAction } from "../../../model/commands/layout.js";
import { useDashboardDispatch, useDashboardSelector } from "../../../model/react/DashboardStoreProvider.js";
import { selectScreen } from "../../../model/store/tabs/layout/layoutSelectors.js";
import { DASHBOARD_LAYOUT_BREAK_POINTS } from "../../constants/layout.js";
const getCurrentScreenSize = () => {
    let viewportWidth = 0;
    if (typeof window !== "undefined" && window.innerWidth) {
        viewportWidth = window.innerWidth;
    }
    if (viewportWidth === 0) {
        return undefined;
    }
    if (viewportWidth >= DASHBOARD_LAYOUT_BREAK_POINTS[3]) {
        return "xl";
    }
    if (viewportWidth >= DASHBOARD_LAYOUT_BREAK_POINTS[2]) {
        return "lg";
    }
    if (viewportWidth >= DASHBOARD_LAYOUT_BREAK_POINTS[1]) {
        return "md";
    }
    if (viewportWidth >= DASHBOARD_LAYOUT_BREAK_POINTS[0]) {
        return "sm";
    }
    return "xs";
};
function setNewSize(prevSize, setScreenSize, dispatch) {
    const newSize = getCurrentScreenSize();
    if (newSize && newSize !== prevSize) {
        // prevent unnecessary re-renders
        setScreenSize(newSize);
        dispatch(setScreenSizeAction(newSize));
    }
}
const DashboardScreenSizeContext = createContext(undefined);
DashboardScreenSizeContext.displayName = "DashboardScreenSizeContext";
export function DashboardScreenSizeProvider({ children }) {
    const [screenSize, setScreenSize] = useState();
    const dispatch = useDashboardDispatch();
    const appStateScreenSize = useDashboardSelector(selectScreen);
    useEffect(() => {
        // set initial screen size to app state for usage in sagas
        setNewSize(screenSize, setScreenSize, dispatch);
        // register event listener for window resize
        const handleWindowResized = () => {
            setNewSize(screenSize, setScreenSize, dispatch);
        };
        window.addEventListener("resize", handleWindowResized, false);
        return () => {
            window.removeEventListener("resize", handleWindowResized, false);
        };
    }, [screenSize, dispatch]);
    return (_jsx("div", { className: "s-screen-size-container", children: _jsx(DashboardScreenSizeContext.Provider, { value: screenSize, children: appStateScreenSize ? children : null }) }));
}
/**
 * Return current screen size.
 */
export const useScreenSize = () => {
    const screenSize = useContext(DashboardScreenSizeContext);
    return screenSize ?? "xl";
};
