Use user permissions

Ensure the user permissions
are taken into consideration
with a manual action on a pipeline
stage.

Changelog: fixed

app/assets/javascripts/pipelines/components/graph/graph_component.vue

@@ -207,6 +207,7 @@ export default {
                 :source-job-hovered="hoveredSourceJobName"
                 :pipeline-expanded="pipelineExpanded"
                 :pipeline-id="pipeline.id"
+                :user-permissions="pipeline.userPermissions"
                 @refreshPipelineGraph="$emit('refreshPipelineGraph')"
                 @jobHover="setJob"
                 @updateMeasurements="getMeasurements"

app/assets/javascripts/pipelines/components/graph/stage_column_component.vue

@@ -60,6 +60,10 @@ export default {
       required: false,
       default: '',
     },
+    userPermissions: {
+      type: Object,
+      required: true,
+    },
   },
   titleClasses: [
     'gl-font-weight-bold',
@@ -90,6 +94,9 @@ export default {
     hasAction() {
       return !isEmpty(this.action);
     },
+    canUpdatePipeline() {
+      return this.userPermissions.updatePipeline;
+    },
   },
   errorCaptured(err, _vm, info) {
     reportToSentry('stage_column_component', `error: ${err}, info: ${info}`);
@@ -132,7 +139,7 @@ export default {
       >
         <div>{{ formattedTitle }}</div>
         <action-component
-          v-if="hasAction"
+          v-if="hasAction && canUpdatePipeline"
           :action-icon="action.icon"
           :tooltip-text="action.title"
           :link="action.path"

app/graphql/queries/pipelines/get_pipeline_details.query.graphql

@@ -29,6 +29,9 @@ query getPipelineDetails($projectPath: ID!, $iid: ID!) {
       iid
       complete
       usesNeeds
+      userPermissions {
+        updatePipeline
+      }
       downstream {
         __typename
         nodes {

spec/frontend/pipelines/graph/mock_data.js

@@ -12,6 +12,10 @@ export const mockPipelineResponse = {
         usesNeeds: true,
         downstream: null,
         upstream: null,
+        userPermissions: {
+          __typename: 'PipelinePermissions',
+          updatePipeline: true,
+        },
         stages: {
           __typename: 'CiStageConnection',
           nodes: [
@@ -573,6 +577,10 @@ export const wrappedPipelineReturn = {
         iid: '38',
         complete: true,
         usesNeeds: true,
+        userPermissions: {
+          __typename: 'PipelinePermissions',
+          updatePipeline: true,
+        },
         downstream: {
           __typename: 'PipelineConnection',
           nodes: [],

spec/frontend/pipelines/graph/stage_column_component_spec.js

@@ -31,6 +31,9 @@ const defaultProps = {
   name: 'Fish',
   groups: mockGroups,
   pipelineId: 159,
+  userPermissions: {
+    updatePipeline: true,
+  },
 };
 
 describe('stage column component', () => {
@@ -152,36 +155,52 @@ describe('stage column component', () => {
   });
 
   describe('with action', () => {
-    beforeEach(() => {
+    const defaults = {
+      groups: [
+        {
+          id: 4259,
+          name: '<img src=x onerror=alert(document.domain)>',
+          status: {
+            icon: 'status_success',
+            label: 'success',
+            tooltip: '<img src=x onerror=alert(document.domain)>',
+          },
+          jobs: [mockJob],
+        },
+      ],
+      title: 'test',
+      hasTriggeredBy: false,
+      action: {
+        icon: 'play',
+        title: 'Play all',
+        path: 'action',
+      },
+    };
+
+    it('renders action button if permissions are permitted', () => {
       createComponent({
         method: mount,
         props: {
-          groups: [
-            {
-              id: 4259,
-              name: '<img src=x onerror=alert(document.domain)>',
-              status: {
-                icon: 'status_success',
-                label: 'success',
-                tooltip: '<img src=x onerror=alert(document.domain)>',
-              },
-              jobs: [mockJob],
-            },
-          ],
-          title: 'test',
-          hasTriggeredBy: false,
-          action: {
-            icon: 'play',
-            title: 'Play all',
-            path: 'action',
-          },
+          ...defaults,
         },
       });
-    });
 
-    it('renders action button', () => {
       expect(findActionComponent().exists()).toBe(true);
     });
+
+    it('does not render action button if permissions are not permitted', () => {
+      createComponent({
+        method: mount,
+        props: {
+          ...defaults,
+          userPermissions: {
+            updatePipeline: false,
+          },
+        },
+      });
+
+      expect(findActionComponent().exists()).toBe(false);
+    });
   });
 
   describe('without action', () => {