import {useEffect, useState} from "react"; import {UsersIcon,UserRemoveIcon} from "@heroicons/react/outline"; import {useSession} from "next-auth/client"; export default function EditTeamModal(props) { const [ session, loading ] = useSession(); const [ members, setMembers ] = useState([]); const [ checkedDisbandTeam, setCheckedDisbandTeam ] = useState(false); const loadMembers = () => fetch('/api/teams/' + props.team.id + '/membership') .then( (res: any) => res.json() ).then( (data) => setMembers(data.members) ); useEffect( () => { loadMembers(); }, []); const deleteTeam = (e) => { e.preventDefault(); return fetch('/api/teams/' + props.team.id, { method: 'DELETE', }).then(props.onExit); } const removeMember = (member) => { return fetch('/api/teams/' + props.team.id + '/membership', { method: 'DELETE', body: JSON.stringify({ userId: member.id }), headers: { 'Content-Type': 'application/json' } }).then(loadMembers); } return (

Manage and delete your team.

{members.length > 0 &&

Members

{members.map( (member) => )}
{member.name} {member.name && '(' + member.email + ')' }{!member.name && member.email} {member.role.toLowerCase()} {member.email !== session.user.email && }
}

Tick the box to disband this team.

{/*!checkedDisbandTeam && */} {checkedDisbandTeam && }
); }