'use client'
import { trpc } from "@/app/_trpc/client"
import {
    AlertDialog,
    AlertDialogAction,
    AlertDialogCancel,
    AlertDialogContent,
    AlertDialogFooter,
    AlertDialogHeader,
    AlertDialogTitle,
    AlertDialogTrigger,
  } from "@/components/ui/alert-dialog"
import { DropdownMenuItem } from "@/components/ui/dropdown-menu"
import useActivateDisableUser from "../hooks/useActivateDisableUser"
  
  interface AlertUnBanUnbanUserProps{
    userId:string
  }

  export function AlertUnBanUnbanUser({userId}:AlertUnBanUnbanUserProps) {

    const {unbanUser}=useActivateDisableUser()

    return (
      <AlertDialog>
        <AlertDialogTrigger asChild>
        <DropdownMenuItem onSelect={(e) => e.preventDefault()}>Reactivar</DropdownMenuItem>
        </AlertDialogTrigger>
        <AlertDialogContent>
          <AlertDialogHeader>
            <AlertDialogTitle>Esta seguro que quiere activar este usuario?</AlertDialogTitle>
          </AlertDialogHeader>
          <AlertDialogFooter>
            <AlertDialogCancel>Cancelar</AlertDialogCancel>
            <AlertDialogAction>
                <button disabled={unbanUser.isPending} type="button" onClick={()=>unbanUser.mutate({userId})}>Confirmar</button>
            </AlertDialogAction>
          </AlertDialogFooter>
        </AlertDialogContent>
      </AlertDialog>
    )
  }