"use client"
import { deleteBoard, removeEmailFromBoard } from "@/app/actions/boardActions";
import { RoomAccesses } from "@liveblocks/node";
import { useRouter } from "next/navigation";
import { IoTrashOutline } from "react-icons/io5";




const EmailAccessList = ({boardId, usersAccesses} : {boardId:string ,usersAccesses:RoomAccesses}) => {
    const router = useRouter();
    async function handleDelete(emailToDelete: string){
        await removeEmailFromBoard(boardId, emailToDelete)
        router.refresh();
    }



  return (
    <div className="max-w-xs">
        {Object.keys(usersAccesses).map(email => (
        <div key={email} className="flex gap-2 my-2 items-center max-w-xs justify-between border pl-2">
            {email} 
            <button onClick={() => handleDelete(email)} className="p-2 bg-gray-100">
                <IoTrashOutline className="text-[tomato] text-lg"/>
            </button>
        </div>
        ))}
    </div>
  )
}

export default EmailAccessList