import { UsersIcon } from "@heroicons/react/outline"; import { useState } from "react"; export default function MemberInvitationModal(props) { const [errorMessage, setErrorMessage] = useState(""); const handleError = async (res) => { const responseData = await res.json(); if (res.ok === false) { setErrorMessage(responseData.message); throw new Error(responseData.message); } return responseData; }; const inviteMember = (e) => { e.preventDefault(); const payload = { role: e.target.elements["role"].value, usernameOrEmail: e.target.elements["inviteUser"].value, sendEmailInvitation: e.target.elements["sendInviteEmail"].checked, }; return fetch("/api/teams/" + props.team.id + "/invite", { method: "POST", body: JSON.stringify(payload), headers: { "Content-Type": "application/json", }, }) .then(handleError) .then(props.onExit) .catch(() => { // do nothing. }); }; return (

Invite someone to your team.

{errorMessage && (

Error: {errorMessage}

)}
); }