"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useCloseSidebarOnMobile = void 0;
const react_1 = require("react");
const DashboardSidebarProvider_1 = require("../../../../DashboardSidebarProvider");
const NavMenu_1 = require("../../../../NavMenu");
const useViewportType_1 = require("../../../../useViewportType");
const SidebarNav_1 = require("../../../SidebarNav");
const useCloseSidebarOnMobile = () => {
    const { isMobile } = (0, useViewportType_1.useViewportType)();
    const { collapsedIn, onToggleSidebar } = (0, react_1.useContext)(DashboardSidebarProvider_1.DashboardSidebarContext);
    const handleMenuListItemClick = () => {
        onToggleSidebar(false);
    };
    (0, react_1.useEffect)(() => {
        if (!isMobile || !collapsedIn) {
            return;
        }
        const sidebarNavElement = document.querySelector(`.${SidebarNav_1.sidebarNavClassnames.root}`);
        if (!sidebarNavElement) {
            return;
        }
        const listItems = sidebarNavElement.querySelectorAll(`.${NavMenu_1.navMenuItemButtonClassnames.root}:not(.${NavMenu_1.navMenuItemButtonClassnames.hasGroup})`);
        listItems.forEach((item) => {
            item.addEventListener('click', handleMenuListItemClick);
        });
        return () => {
            listItems.forEach((item) => {
                item.removeEventListener('click', handleMenuListItemClick);
            });
        };
    }, [isMobile, collapsedIn]);
};
exports.useCloseSidebarOnMobile = useCloseSidebarOnMobile;
