Update revoke invite modal title and remove unneeded checkbox

Change title to "Revoke invite" and remove "issuables checkbox"

app/assets/javascripts/members/components/action_buttons/invite_action_buttons.vue

@@ -42,6 +42,7 @@ export default {
         :member-id="member.id"
         :message="message"
         :title="s__('Member|Revoke invite')"
+        is-invite
       />
     </div>
   </action-button-group>

app/assets/javascripts/members/components/action_buttons/remove_member_button.vue

@@ -36,6 +36,11 @@ export default {
       required: false,
       default: false,
     },
+    isInvite: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   computed: {
     ...mapState(['memberPath']),
@@ -57,6 +62,7 @@ export default {
     :data-member-path="computedMemberPath"
     :data-member-type="memberType"
     :data-is-access-request="isAccessRequest"
+    :data-is-invite="isInvite"
     :data-message="message"
     data-qa-selector="delete_member_button"
   />

app/assets/javascripts/vue_shared/components/remove_member_modal.vue

@@ -2,7 +2,7 @@
 import { GlFormCheckbox, GlModal } from '@gitlab/ui';
 import { parseBoolean } from '~/lib/utils/common_utils';
 import csrf from '~/lib/utils/csrf';
-import { __ } from '~/locale';
+import { s__, __ } from '~/locale';
 
 export default {
   actionCancel: {
@@ -22,11 +22,20 @@ export default {
     isAccessRequest() {
       return parseBoolean(this.modalData.isAccessRequest);
     },
+    isInvite() {
+      return parseBoolean(this.modalData.isInvite);
+    },
     isGroupMember() {
       return this.modalData.memberType === 'GroupMember';
     },
     actionText() {
-      return this.isAccessRequest ? __('Deny access request') : __('Remove member');
+      if (this.isAccessRequest) {
+        return __('Deny access request');
+      } else if (this.isInvite) {
+        return s__('Member|Revoke invite');
+      }
+
+      return __('Remove member');
     },
     actionPrimary() {
       return {
@@ -36,6 +45,9 @@ export default {
         },
       };
     },
+    showUnassignIssuablesCheckbox() {
+      return !this.isAccessRequest && !this.isInvite;
+    },
   },
   mounted() {
     document.addEventListener('click', this.handleClick);
@@ -76,7 +88,7 @@ export default {
       <gl-form-checkbox v-if="isGroupMember" name="remove_sub_memberships">
         {{ __('Also remove direct user membership from subgroups and projects') }}
       </gl-form-checkbox>
-      <gl-form-checkbox v-if="!isAccessRequest" name="unassign_issuables">
+      <gl-form-checkbox v-if="showUnassignIssuablesCheckbox" name="unassign_issuables">
         {{ __('Also unassign this user from related issues and merge requests') }}
       </gl-form-checkbox>
     </form>

changelogs/unreleased/259794-members-view-update-revoke-invite-modal-header-and-button.yml

+---
+title: Update title on revoke member invite modal and hide unneeded related issues and merge requests checkbox
+merge_request: 57755
+author:
+type: changed

spec/frontend/members/components/action_buttons/access_request_action_buttons_spec.js

@@ -42,6 +42,7 @@ describe('AccessRequestActionButtons', () => {
         memberId: member.id,
         title: 'Deny access',
         isAccessRequest: true,
+        isInvite: false,
         icon: 'close',
       });
     });

spec/frontend/members/components/action_buttons/invite_action_buttons_spec.js

@@ -43,6 +43,7 @@ describe('InviteActionButtons', () => {
         message: `Are you sure you want to revoke the invitation for ${member.invite.email} to join "${member.source.fullName}"`,
         title: 'Revoke invite',
         isAccessRequest: false,
+        isInvite: true,
         icon: 'remove',
       });
     });

spec/frontend/members/components/action_buttons/remove_member_button_spec.js

@@ -28,6 +28,7 @@ describe('RemoveMemberButton', () => {
         message: 'Are you sure you want to remove John Smith?',
         title: 'Remove member',
         isAccessRequest: true,
+        isInvite: true,
         ...propsData,
       },
       directives: {
@@ -48,6 +49,7 @@ describe('RemoveMemberButton', () => {
       'data-member-type': 'GroupMember',
       'data-message': 'Are you sure you want to remove John Smith?',
       'data-is-access-request': 'true',
+      'data-is-invite': 'true',
       'aria-label': 'Remove member',
       title: 'Remove member',
       icon: 'remove',

spec/frontend/members/components/action_buttons/user_action_buttons_spec.js

@@ -43,6 +43,7 @@ describe('UserActionButtons', () => {
         message: `Are you sure you want to remove ${member.user.name} from "${member.source.fullName}"`,
         title: 'Remove member',
         isAccessRequest: false,
+        isInvite: false,
         icon: 'remove',
       });
     });

spec/frontend/vue_shared/components/remove_member_modal_spec.js

@@ -15,16 +15,18 @@ describe('RemoveMemberModal', () => {
   });
 
   describe.each`
-    state                          | memberType         | isAccessRequest | actionText               | removeSubMembershipsCheckboxExpected | unassignIssuablesCheckboxExpected | message
-    ${'removing a group member'}   | ${'GroupMember'}   | ${'false'}      | ${'Remove member'}       | ${true}                              | ${true}                           | ${'Are you sure you want to remove Jane Doe from the Gitlab Org / Gitlab Test project?'}
-    ${'removing a project member'} | ${'ProjectMember'} | ${'false'}      | ${'Remove member'}       | ${false}                             | ${true}                           | ${'Are you sure you want to remove Jane Doe from the Gitlab Org / Gitlab Test project?'}
-    ${'denying an access request'} | ${'ProjectMember'} | ${'true'}       | ${'Deny access request'} | ${false}                             | ${false}                          | ${"Are you sure you want to deny Jane Doe's request to join the Gitlab Org / Gitlab Test project?"}
+    state                          | memberType         | isAccessRequest | isInvite   | actionText               | removeSubMembershipsCheckboxExpected | unassignIssuablesCheckboxExpected | message
+    ${'removing a group member'}   | ${'GroupMember'}   | ${'false'}      | ${'false'} | ${'Remove member'}       | ${true}                              | ${true}                           | ${'Are you sure you want to remove Jane Doe from the Gitlab Org / Gitlab Test project?'}
+    ${'removing a project member'} | ${'ProjectMember'} | ${'false'}      | ${'false'} | ${'Remove member'}       | ${false}                             | ${true}                           | ${'Are you sure you want to remove Jane Doe from the Gitlab Org / Gitlab Test project?'}
+    ${'denying an access request'} | ${'ProjectMember'} | ${'true'}       | ${'false'} | ${'Deny access request'} | ${false}                             | ${false}                          | ${"Are you sure you want to deny Jane Doe's request to join the Gitlab Org / Gitlab Test project?"}
+    ${'revoking invite'}           | ${'ProjectMember'} | ${'false'}      | ${'true'}  | ${'Revoke invite'}       | ${false}                             | ${false}                          | ${'Are you sure you want to revoke the invitation for foo@bar.com to join the Gitlab Org / Gitlab Test project?'}
   `(
     'when $state',
     ({
       actionText,
       memberType,
       isAccessRequest,
+      isInvite,
       message,
       removeSubMembershipsCheckboxExpected,
       unassignIssuablesCheckboxExpected,
@@ -35,6 +37,7 @@ describe('RemoveMemberModal', () => {
             return {
               modalData: {
                 isAccessRequest,
+                isInvite,
                 message,
                 memberPath,
                 memberType,