/** @format */

import React from "react";
import { IconData } from "../constant/Constant";

const DeleteModal = ({ isOpen, handleClose, modalPosition }) => {
  const { x, y } = modalPosition;
  return (
    isOpen && (
      <div
        className='modal-overlay fixed inset-0 '
        onClick={handleClose}>
        <div
          className='bg-white p-4 rounded shadow-lg w-56 max-h-60 overflow-y-auto z-10 absolute'
          style={{
            top: `${y - 75}px`, // Set dynamic top value
            left: `${x - 95}px`, // Set dynamic left value
          }}
          onClick={(e) => e.stopPropagation()}>
          <div className='space-y-2'>
            {IconData.map((item, index) => (
              <div
                key={index}
                className='flex items-center space-x-2'>
                <span>{item.icon}</span>
                <span>{item.text}</span>
              </div>
            ))}
          </div>
        </div>
      </div>
    )
  );
};

export default DeleteModal;
