import { Dispatch, SetStateAction, useEffect } from "react";

import { eventHeaderContextMenu } from "shared/lib/slickgrid";

import { makeVisible } from "entities/popup";

import { HEADER_CONTEXT_MENU } from "../../model";

export function useSubscribeToEvent(
	setIsOpened: Dispatch<SetStateAction<boolean>>,
	tableId: string,
) {
	useEffect(() => {
		function callback() {
			const { table, x, y } = eventHeaderContextMenu;
			if (table?.id !== tableId) return;
			setIsOpened(true);
			setTimeout(() => {
				const menu = document.getElementById(HEADER_CONTEXT_MENU);
				if (!menu) return;
				makeVisible(menu, x, y);
			}, 0);
		}
		eventHeaderContextMenu.subscribe(callback);
		return () => {
			eventHeaderContextMenu.unsubscribe(callback);
		};
	}, [tableId]);
}