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

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

import Styled from "../ContextMenu.style";

export const ButtonUngroup: FC<IProps> = ({ setIsOpened }) => {
	const table = eventContextMenu.table;

	function group() {
		if (!table) return;
		table.grouping = { isGrouped: false };
		setIsOpened(false);
	}

	if (!table?.grouping.isGrouped) return null;

	return (
		<Styled.Li onClick={group}>
			<Styled.Icon className={"sgi sgi-link-off"}></Styled.Icon>
			Ungroup
		</Styled.Li>
	);
};

interface IProps {
	setIsOpened: Dispatch<SetStateAction<boolean>>;
}