"use client";
import { DropdownItem, DropdownMenu, DropdownTrigger, Dropdown as UIDropdown } from "@nextui-org/react"
import { MoreVerticalIcon } from "lucide-react"
import { deleteCookie } from "cookies-next"
import { useRouter } from "next/navigation";

const Dropdown = () => {
  const router = useRouter()

  const logout = () => {
    deleteCookie('credential')
    router.push('/login')
  }

  return (
    <UIDropdown>
      <DropdownTrigger>
        <button type="button" className="p-1">
          <MoreVerticalIcon size={20} />
        </button>
      </DropdownTrigger>
      <DropdownMenu>
        <DropdownItem
          key="logout"
          className="text-danger-600"
          color="danger"
          onPress={logout}
        >
          Logout
        </DropdownItem>
      </DropdownMenu>
    </UIDropdown>
  )
}

export default Dropdown