import { usePermission } from "@/utils/auth/permission";
import Link from "next/link";
import { FC, useState } from "react";
import { HiEye } from "react-icons/hi";
import { MdEditSquare } from "react-icons/md";
import { TSmacResellerSchema } from "../forms/schema/mac-reseller";
import MacResellerDelete from "./mac-reseller-delete";
type Props = {
  macReseller: TSmacResellerSchema;
  isOpen?: boolean;
};

const MacResellerAction: FC<Props> = ({ macReseller, isOpen = false }) => {
  const [isShow, setShow] = useState(isOpen);
  return (
    <>
      <div className="relative flex justify-center">
        <div
          id="dropdownUsers"
          className={`z-10  bg-white absolute -right-3 rounded-lg shadow w-48 dark:bg-gray-700 ${
            !isShow ? "hidden" : ""
          }`}
        >
          <ul
            className="h-auto overflow-y-auto text-gray-700 dark:text-gray-200"
            aria-labelledby="dropdownUsersButton"
          >
            <li className="hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
              {usePermission("mac-resellers.edit") && (
                <>
                  <Link href={`/mac-resellers/edit/${macReseller?.id}`}>
                    <div className="flex w-full px-4 py-3 cursor-pointer">
                      <MdEditSquare className="mr-2 text-lg" />
                      <span className="block">Edit</span>
                    </div>
                  </Link>
                </>
              )}
            </li>
            <li className="hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
              {usePermission("mac-resellers.show") && (
                <>
                  <Link href={`/mac-resellers/view/${macReseller?.id}`}>
                    <div className="flex w-full px-4 py-3 cursor-pointer">
                      <HiEye className="mr-2 text-lg" />
                      <span className="block">View</span>
                    </div>
                  </Link>
                </>
              )}
            </li>
            <li
              className="flex items-center px-4 py-3 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white cursor-pointer"
              onClick={() => setShow(false)}
            >
              {usePermission("mac-resellers.delete") && (
                <MacResellerDelete
                  macResellerIds={[macReseller?.id as string]}
                />
              )}
            </li>
          </ul>
        </div>
      </div>
    </>
  );
};

export default MacResellerAction;