import React from "react"; // swr import { mutate } from "swr"; // react hook form import { useForm } from "react-hook-form"; // headless import { Dialog, Transition } from "@headlessui/react"; // fetch keys import { WORKSPACE_INVITATIONS } from "constants/fetch-keys"; // services import workspaceService from "lib/services/workspace.service"; // ui import { Button, Input, TextArea, Select } from "ui"; // hooks import useToast from "lib/hooks/useToast"; // types import { WorkspaceMember } from "types"; type Props = { isOpen: boolean; setIsOpen: React.Dispatch>; workspace_slug: string; members: any[]; }; const ROLE = { 5: "Guest", 10: "Viewer", 15: "Member", 20: "Admin", }; const defaultValues: Partial = { email: "", role: 5, message: "", }; const SendWorkspaceInvitationModal: React.FC = ({ isOpen, setIsOpen, workspace_slug, members, }) => { const { setToastAlert } = useToast(); const handleClose = () => { setIsOpen(false); const timeout = setTimeout(() => { reset(defaultValues); clearTimeout(timeout); }, 500); }; const { register, formState: { errors, isSubmitting }, handleSubmit, reset, } = useForm({ defaultValues, reValidateMode: "onChange", mode: "all", }); const onSubmit = async (formData: any) => { await workspaceService .inviteWorkspace(workspace_slug, formData) .then((res) => { console.log(res); setIsOpen(false); handleClose(); mutate( WORKSPACE_INVITATIONS, (prevData: any) => [{ ...res, ...formData }, ...(prevData ?? [])], false ); 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"; }, }} />