Merge branch '32959-dismissal-ux-improvement' into 'master'

Resolve "Finding vulnerability as dismissed before the action"

See merge request gitlab-org/gitlab!20768

changelogs/unreleased/32959-dismissal-ux-improvement.yml

+---
+title: Improve UX for vulnerability dismissal note
+merge_request: 20768
+author:
+type: fixed

ee/app/assets/javascripts/vue_shared/security_reports/components/dismissal_note.vue

@@ -99,7 +99,7 @@ export default {
       icon-name="cancel"
       icon-style="ci-status-icon-pending"
     >
-      <div v-html="eventText"></div>
+      <div v-if="feedback.created_at" v-html="eventText"></div>
     </event-item>
     <template v-if="commentDetails && !isCommentingOnDismissal">
       <hr class="my-3" />

ee/app/assets/javascripts/vue_shared/security_reports/components/modal.vue

@@ -148,10 +148,7 @@ export default {
         current_username,
       } = gon;
 
-      const currentDate = new Date();
-
       return {
-        created_at: currentDate.toString(),
         project_id: this.project ? this.project.id : null,
         author: {
           id: current_user_id,

ee/spec/frontend/vue_shared/security_reports/components/modal_spec.js

@@ -21,6 +21,7 @@ describe('Security Reports modal', () => {
         propsData.modal.vulnerability.dismissalFeedback = {
           author: { username: 'jsmith', name: 'John Smith' },
           pipeline: { id: '123', path: '#' },
+          created_at: new Date().toString(),
         };
         mountComponent({ propsData }, mount);
       });
@@ -36,6 +37,26 @@ describe('Security Reports modal', () => {
       });
     });
 
+    describe('with about to be dismissed issue', () => {
+      beforeEach(() => {
+        const propsData = {
+          modal: createState().modal,
+          canDismissVulnerability: true,
+        };
+        propsData.modal.vulnerability.dismissalFeedback = {
+          author: { username: 'jsmith', name: 'John Smith' },
+          pipeline: { id: '123', path: '#' },
+        };
+        mountComponent({ propsData }, mount);
+      });
+
+      it('renders dismissal author and hides associated pipeline', () => {
+        expect(wrapper.text().trim()).toContain('John Smith');
+        expect(wrapper.text().trim()).toContain('@jsmith');
+        expect(wrapper.text().trim()).not.toContain('#123');
+      });
+    });
+
     describe('with not dismissed issue', () => {
       beforeEach(() => {
         const propsData = {