Merge branch '322714-fix-pipeline-header-actions-showing' into 'master'

Fix pipeline header actions from showing when user does not have permission

See merge request gitlab-org/gitlab!62137

app/assets/javascripts/pipelines/components/header_component.vue

@@ -132,6 +132,16 @@ export default {
           };
       }
     },
+    canRetryPipeline() {
+      const { retryable, userPermissions } = this.pipeline;
+
+      return retryable && userPermissions.updatePipeline;
+    },
+    canCancelPipeline() {
+      const { cancelable, userPermissions } = this.pipeline;
+
+      return cancelable && userPermissions.updatePipeline;
+    },
   },
   watch: {
     isFinished(finished) {
@@ -219,7 +229,7 @@ export default {
       item-name="Pipeline"
     >
       <gl-button
-        v-if="pipeline.retryable"
+        v-if="canRetryPipeline"
         :loading="isRetrying"
         :disabled="isRetrying"
         category="secondary"
@@ -232,7 +242,7 @@ export default {
       </gl-button>
 
       <gl-button
-        v-if="pipeline.cancelable"
+        v-if="canCancelPipeline"
         :loading="isCanceling"
         :disabled="isCanceling"
         class="gl-ml-3"

app/assets/javascripts/pipelines/graphql/queries/get_pipeline_header_data.query.graphql

@@ -8,6 +8,7 @@ query getPipelineHeaderData($fullPath: ID!, $iid: ID!) {
       cancelable
       userPermissions {
         destroyPipeline
+        updatePipeline
       }
       detailedStatus {
         detailsPath

spec/frontend/pipelines/header_component_spec.js

@@ -7,7 +7,9 @@ import retryPipelineMutation from '~/pipelines/graphql/mutations/retry_pipeline.
 import {
   mockCancelledPipelineHeader,
   mockFailedPipelineHeader,
+  mockFailedPipelineNoPermissions,
   mockRunningPipelineHeader,
+  mockRunningPipelineNoPermissions,
   mockSuccessfulPipelineHeader,
 } from './mock_data';
 
@@ -168,5 +170,19 @@ describe('Pipeline details header', () => {
         });
       });
     });
+
+    describe('Permissions', () => {
+      it('should not display the cancel action if user does not have permission', () => {
+        wrapper = createComponent(mockRunningPipelineNoPermissions);
+
+        expect(findCancelButton().exists()).toBe(false);
+      });
+
+      it('should not display the retry action if user does not have permission', () => {
+        wrapper = createComponent(mockFailedPipelineNoPermissions);
+
+        expect(findRetryButton().exists()).toBe(false);
+      });
+    });
   });
 });

spec/frontend/pipelines/mock_data.js

@@ -10,6 +10,7 @@ export const mockPipelineHeader = {
   id: 123,
   userPermissions: {
     destroyPipeline: true,
+    updatePipeline: true,
   },
   createdAt: threeWeeksAgo.toISOString(),
   user: {
@@ -34,6 +35,31 @@ export const mockFailedPipelineHeader = {
   },
 };
 
+export const mockFailedPipelineNoPermissions = {
+  id: 123,
+  userPermissions: {
+    destroyPipeline: false,
+    updatePipeline: false,
+  },
+  createdAt: threeWeeksAgo.toISOString(),
+  user: {
+    name: 'Foo',
+    username: 'foobar',
+    email: 'foo@bar.com',
+    avatarUrl: 'link',
+  },
+  status: PIPELINE_RUNNING,
+  retryable: true,
+  cancelable: false,
+  detailedStatus: {
+    group: 'running',
+    icon: 'status_running',
+    label: 'running',
+    text: 'running',
+    detailsPath: 'path',
+  },
+};
+
 export const mockRunningPipelineHeader = {
   ...mockPipelineHeader,
   status: PIPELINE_RUNNING,
@@ -48,6 +74,31 @@ export const mockRunningPipelineHeader = {
   },
 };
 
+export const mockRunningPipelineNoPermissions = {
+  id: 123,
+  userPermissions: {
+    destroyPipeline: false,
+    updatePipeline: false,
+  },
+  createdAt: threeWeeksAgo.toISOString(),
+  user: {
+    name: 'Foo',
+    username: 'foobar',
+    email: 'foo@bar.com',
+    avatarUrl: 'link',
+  },
+  status: PIPELINE_RUNNING,
+  retryable: false,
+  cancelable: true,
+  detailedStatus: {
+    group: 'running',
+    icon: 'status_running',
+    label: 'running',
+    text: 'running',
+    detailsPath: 'path',
+  },
+};
+
 export const mockCancelledPipelineHeader = {
   ...mockPipelineHeader,
   status: PIPELINE_CANCELED,