import * as ContextMenu from '@radix-ui/react-context-menu';
import { useFlowStoreActions } from '@/stores/flow-store';
import { Trash2Icon } from 'lucide-react';

export const CommonMenuItems = ({ id }: { id: string }) => {
    const { deleteNode, duplicateNode } = useFlowStoreActions();
    return (
        <>
            <ContextMenu.Item
                asChild
                className="text-sm px-2 py-1.5 outline-none cursor-pointer hover:bg-orange-100 rounded-sm flex items-center"
                onSelect={() => duplicateNode(id)}
            >
                <div className="flex items-center">
                    Duplicate Node
                </div>
            </ContextMenu.Item>
            <ContextMenu.Separator className="h-[1px] bg-gray-200 m-1" />
            <ContextMenu.Item
                asChild
                className="text-sm px-2 py-1.5 outline-none cursor-pointer hover:bg-red-100 rounded-sm flex items-center text-red-600"
                onSelect={() => deleteNode(id)}
            >
                <div className="flex items-center">
                    <Trash2Icon className="w-4 h-4 mr-2" />
                    Delete Node
                </div>
            </ContextMenu.Item>
        </>
    );
};