import { UsersIcon } from "@heroicons/react/outline"; import { useState } from "react"; import { Team } from "@lib/team"; import Button from "@components/ui/Button"; export default function MemberInvitationModal(props: { team: Team | undefined | null; onExit: () => void }) { const [errorMessage, setErrorMessage] = useState(""); const handleError = async (res: Response) => { 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}

)}
); }