import React from "react"; import { mutate } from "swr"; import { Controller, useForm } from "react-hook-form"; // headless import { Dialog, Transition } from "@headlessui/react"; // services import workspaceService from "services/workspace.service"; // ui import { CustomSelect, Input, PrimaryButton, SecondaryButton } from "components/ui"; // hooks import useToast from "hooks/use-toast"; // types import { IWorkspaceMemberInvitation } from "types"; // fetch keys import { WORKSPACE_INVITATIONS } from "constants/fetch-keys"; // constants import { ROLE } from "constants/workspace"; type Props = { isOpen: boolean; setIsOpen: React.Dispatch>; workspace_slug: string; members: any[]; }; const defaultValues: Partial = { email: "", role: 5, }; const SendWorkspaceInvitationModal: React.FC = ({ isOpen, setIsOpen, workspace_slug, members, }) => { const { setToastAlert } = useToast(); const { control, register, formState: { errors, isSubmitting }, handleSubmit, reset, } = useForm({ defaultValues, reValidateMode: "onChange", }); const handleClose = () => { setIsOpen(false); reset(defaultValues); }; const onSubmit = async (formData: IWorkspaceMemberInvitation) => { await workspaceService .inviteWorkspace(workspace_slug, { emails: [formData] }) .then((res) => { console.log(res); setIsOpen(false); handleClose(); mutate(WORKSPACE_INVITATIONS, (prevData: any) => [ { ...res, ...formData }, ...(prevData ?? []), ]); setToastAlert({ title: "Success", type: "success", message: "Member invited successfully", }); }) .catch((err) => console.log(err)); }; return (
Members

Invite members to work on your workspace.

{ if (members.find((member) => member.email === value)) return "Email already exist"; }, }} />
( {Object.entries(ROLE).map(([key, value]) => ( {value} ))} )} />
Cancel {isSubmitting ? "Sending Invitation..." : "Send Invitation"}
); }; export default SendWorkspaceInvitationModal;