fix(members-page): auto refresh members list after an invite is sent (#27213)

static/app/actionCreators/modal.tsx

@@ -3,6 +3,7 @@ import * as React from 'react';
 import ModalActions from 'app/actions/modalActions';
 import GlobalModal from 'app/components/globalModal';
 import type {DashboardWidgetModalOptions} from 'app/components/modals/addDashboardWidgetModal';
+import {InviteRow} from 'app/components/modals/inviteMembersModal/types';
 import type {ReprocessEventModalOptions} from 'app/components/modals/reprocessEventModal';
 import {AppStoreConnectContextProps} from 'app/components/projects/appStoreConnectContext';
 import {
@@ -51,6 +52,12 @@ type emailVerificationModalOptions = {
   actionMessage?: string;
 };
 
+type inviteMembersModalOptions = {
+  onClose?: () => void;
+  initialData?: Partial<InviteRow>[];
+  source?: string;
+};
+
 export async function openSudo({onClose, ...args}: OpenSudoModalOptions = {}) {
   const mod = await import('app/components/modals/sudoModal');
   const {default: Modal} = mod;
@@ -217,11 +224,14 @@ export async function openDebugFileSourceModal({
   });
 }
 
-export async function openInviteMembersModal(options = {}) {
+export async function openInviteMembersModal({
+  onClose,
+  ...args
+}: inviteMembersModalOptions = {}) {
   const mod = await import('app/components/modals/inviteMembersModal');
   const {default: Modal, modalCss} = mod;
 
-  openModal(deps => <Modal {...deps} {...options} />, {modalCss});
+  openModal(deps => <Modal {...deps} {...args} />, {modalCss, onClose});
 }
 
 export async function openAddDashboardWidgetModal(options: DashboardWidgetModalOptions) {

static/app/components/group/suggestedOwnerHovercard.tsx

@@ -46,6 +46,14 @@ class SuggestedOwnerHovercard extends React.Component<Props, State> {
   render() {
     const {actor, commits, rules, ...props} = this.props;
     const {commitsExpanded, rulesExpanded} = this.state;
+    const modalData = {
+      initialData: [
+        {
+          emails: actor.email ? new Set([actor.email]) : new Set([]),
+        },
+      ],
+      source: 'suggested_assignees',
+    };
 
     return (
       <Hovercard
@@ -62,20 +70,7 @@ class SuggestedOwnerHovercard extends React.Component<Props, State> {
                   {
                     actorEmail: <strong>{actor.email}</strong>,
                     accountSettings: <Link to="/settings/account/emails/" />,
-                    inviteUser: (
-                      <a
-                        onClick={() =>
-                          openInviteMembersModal({
-                            initialData: [
-                              {
-                                emails: new Set([actor.email]),
-                              },
-                            ],
-                            source: 'suggested_assignees',
-                          })
-                        }
-                      />
-                    ),
+                    inviteUser: <a onClick={() => openInviteMembersModal(modalData)} />,
                   }
                 )}
               </EmailAlert>

static/app/views/onboarding/components/fullIntroduction.tsx

@@ -37,7 +37,9 @@ export default function FullIntroduction({currentPlatform}: Props) {
               <Button
                 priority="link"
                 data-test-id="onboarding-getting-started-invite-members"
-                onClick={openInviteMembersModal}
+                onClick={() => {
+                  openInviteMembersModal();
+                }}
               />
             ),
           }

static/app/views/onboarding/integrationSetup.tsx

@@ -150,7 +150,14 @@ class IntegrationSetup extends Component<Props, State> {
           {tct(
             "Don't have have permissions to create a Cloudformation stack? [link:Invite your team instead].",
             {
-              link: <Button priority="link" onClick={openInviteMembersModal} />,
+              link: (
+                <Button
+                  priority="link"
+                  onClick={() => {
+                    openInviteMembersModal();
+                  }}
+                />
+              ),
             }
           )}
         </motion.p>

static/app/views/settings/organizationMembers/organizationMembersWrapper.tsx

@@ -108,7 +108,14 @@ class OrganizationMembersWrapper extends AsyncView<Props, State> {
       <Button
         priority="primary"
         size="small"
-        onClick={() => openInviteMembersModal({source: 'members_settings'})}
+        onClick={() =>
+          openInviteMembersModal({
+            onClose: () => {
+              this.fetchData();
+            },
+            source: 'members_settings',
+          })
+        }
         data-test-id="email-invite"
         icon={<IconMail />}
       >