Dropdown

// import PastQuoteDialog from "@components/Quotation/admin/PastQuoteDialog";
// import PastQuote from "@components/Quotation/admin/PastQuoteDialog";
// import ProjectDetailsDialog from "@components/Quotation/admin/ProjectDetailsDialog";
import React, { useState } from "react";



interface WithHandleClose {
    handleClose: () => void;
}

type DropdownProps = {
    children: React.ReactNode;
    overlay: React.ReactElement<WithHandleClose>;  // Modified this line
    onOverlayClose?: () => void;
};

export const Dropdown: React.FC<DropdownProps> = ({ children, overlay, onOverlayClose }) => {
    const [visible, setVisible] = useState(false);

    const handleClose = () => {
        setVisible(false);
        if (onOverlayClose) {
            onOverlayClose();
        }
    };

    return (
        <div className="relative">
            <div onClick={() => setVisible(!visible)} className="cursor-pointer">
                {children}
            </div>
            {visible && (
                <div className="absolute top-full right-0 z-20 bg-white rounded-md border border-[#E5E7EB] mt-1">
                    {React.isValidElement(overlay) ? React.cloneElement(overlay, { handleClose }) : null}
                </div>
            )}
        </div>
    );
};



type IncrementerProps = {
    handleClose?: () => void;
};

export const Options: React.FC<IncrementerProps> = ({  }) => {

    const [clickedDialog, setClickedDialog] = useState('')
        
    
    


    return (
        <div className=' w-56 px-5 py-4  text-black flex flex-col gap-2 rounded-md shadow-md '>
            <button className="text-left">View project details</button>
            {/* <ProjectDetailsDialog/> */}
            <button className="text-left">Download file</button>
            {/* <DownloadFileDialog/> */}
            <button className="text-left">Select vendors RFQ</button>
            {/* <SelectVendorDialog/> */}
            <button className="text-left">Add to quotaitons</button>
            {/* <AddQuotationDilog /> */}
            <button className="text-left">Add to orders</button>
            {/* <AddOrderDilog/> */}
            <button className="text-left">Paste quote</button>
            {/* <PastQuoteDialog/> */}
        </div>
    );
};