feat: delete confirm

packages/app/src/components/invite-members/index.tsx

@@ -11,6 +11,7 @@ interface LoginModalProps {
   open: boolean;
   onClose: () => void;
   workspaceId: string;
+  onInviteSuccess: () => void;
 }
 export const debounce = <T extends (...args: any) => any>(
   fn: T,
@@ -42,6 +43,7 @@ export const InviteMembers = ({
   open,
   onClose,
   workspaceId,
+  onInviteSuccess,
 }: LoginModalProps) => {
   const [canInvite, setCanInvite] = useState<boolean>(true);
   const [email, setEmail] = useState<string>('');
@@ -128,6 +130,7 @@ export const InviteMembers = ({
                 inviteMember({ id: workspaceId, email: email })
                   .then(() => {
                     onClose();
+                    onInviteSuccess && onInviteSuccess();
                   })
                   .catch(err => {
                     toast('Invite failed');

packages/app/src/components/workspace-setting/workspace-setting.tsx

@@ -129,7 +129,7 @@ export const WorkspaceSetting = ({
     }
   }, [isShow]);
   return (
-    <Modal onClose={onClose} open={isShow}>
+    <Modal open={isShow}>
       <StyledSettingContainer>
         <ModalCloseButton onClick={handleClickClose} />
         <StyledSettingSidebar>
@@ -184,7 +184,7 @@ const GeneralPage = ({ workspace }: { workspace?: Workspace }) => {
 const MembersPage = ({ workspace }: { workspace: Workspace }) => {
   const [isInviteModalShow, setIsInviteModalShow] = useState(false);
   const [members, setMembers] = useState<Member[]>([]);
-  useEffect(() => {
+  const refreshMembers = () => {
     getWorkspaceMembers({
       id: workspace.id,
     })
@@ -194,8 +194,10 @@ const MembersPage = ({ workspace }: { workspace: Workspace }) => {
       .catch(err => {
         console.log(err);
       });
+  };
+  useEffect(() => {
+    refreshMembers();
   }, [workspace.id]);
-  const { confirm } = useConfirm();
 
   return (
     <div>
@@ -239,19 +241,20 @@ const MembersPage = ({ workspace }: { workspace: Workspace }) => {
                       <>
                         <MenuItem
                           onClick={() => {
-                            confirm({
-                              title: 'Delete Member?',
-                              content: `will delete member`,
-                              confirmText: 'Delete',
-                              confirmType: 'danger',
-                            }).then(confirm => {
-                              removeMember({
-                                permissionId: member.id,
-                              }).then(data => {
-                                // console.log('data: ', data);
-                                toast('Moved to Trash');
-                              });
+                            // confirm({
+                            //   title: 'Delete Member?',
+                            //   content: `will delete member`,
+                            //   confirmText: 'Delete',
+                            //   confirmType: 'danger',
+                            // }).then(confirm => {
+                            removeMember({
+                              permissionId: member.id,
+                            }).then(data => {
+                              // console.log('data: ', data);
+                              toast('Moved to Trash');
+                              refreshMembers();
                             });
+                            // });
                           }}
                           icon={<TrashIcon />}
                         >
@@ -288,6 +291,9 @@ const MembersPage = ({ workspace }: { workspace: Workspace }) => {
           onClose={() => {
             setIsInviteModalShow(false);
           }}
+          onInviteSuccess={() => {
+            refreshMembers();
+          }}
           workspaceId={workspace.id}
           open={isInviteModalShow}
         ></InviteMembers>

packages/app/src/ui/confirm/confirm.tsx

@@ -27,7 +27,7 @@ export const Confirm = ({
 }: ConfirmProps) => {
   const [open, setOpen] = useState(true);
   return (
-    <Modal open={open} disablePortal={true}>
+    <Modal open={open}>
       <StyledModalWrapper>
         <ModalCloseButton
           onClick={() => {