import { CommandGroup } from "@reactive-resume/ui/components/command";
import { useCommandPaletteStore } from "../store";

type Props = {
	page?: string;
	heading: React.ReactNode;
	children: React.ReactNode;
};

export const BaseCommandGroup = ({ page, heading, children }: Props) => {
	const pages = useCommandPaletteStore((state) => state.pages);
	const currentPage = pages[pages.length - 1];
	const isEnabled = currentPage === page;

	if (!isEnabled) return null;

	return <CommandGroup heading={heading}>{children}</CommandGroup>;
};
