1 files changed, 68 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_actions.vue b/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_actions.vue
new file mode 100644
index 00000000000..8656e5d3536
--- /dev/null
+++ b/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_actions.vue
@@ -0,0 +1,68 @@
+<script>
+import { GlButton, GlButtonGroup, GlTooltipDirective as GlTooltip } from '@gitlab/ui';
+import { s__ } from '~/locale';
+
+export const i18n = {
+  playTooltip: s__('PipelineSchedules|Run pipeline schedule'),
+  editTooltip: s__('PipelineSchedules|Edit pipeline schedule'),
+  deleteTooltip: s__('PipelineSchedules|Delete pipeline schedule'),
+  takeOwnershipTooltip: s__('PipelineSchedules|Take ownership of pipeline schedule'),
+};
+
+export default {
+  i18n,
+  components: {
+    GlButton,
+    GlButtonGroup,
+  },
+  directives: {
+    GlTooltip,
+  },
+  props: {
+    schedule: {
+      type: Object,
+      required: true,
+    },
+  },
+  computed: {
+    canPlay() {
+      return this.schedule.userPermissions.playPipelineSchedule;
+    },
+    canTakeOwnership() {
+      return this.schedule.userPermissions.takeOwnershipPipelineSchedule;
+    },
+    canUpdate() {
+      return this.schedule.userPermissions.updatePipelineSchedule;
+    },
+    canRemove() {
+      return this.schedule.userPermissions.adminPipelineSchedule;
+    },
+  },
+};
+</script>
+
+<template>
+  <div class="gl-display-flex gl-justify-content-end">
+    <gl-button-group>
+      <gl-button v-if="canPlay" v-gl-tooltip :title="$options.i18n.playTooltip" icon="play" />
+      <gl-button
+        v-if="canTakeOwnership"
+        v-gl-tooltip
+        :title="$options.i18n.takeOwnershipTooltip"
+        icon="user"
+        data-testid="take-ownership-pipeline-schedule-btn"
+        @click="$emit('showTakeOwnershipModal', schedule.id)"
+      />
+      <gl-button v-if="canUpdate" v-gl-tooltip :title="$options.i18n.editTooltip" icon="pencil" />
+      <gl-button
+        v-if="canRemove"
+        v-gl-tooltip
+        :title="$options.i18n.deleteTooltip"
+        icon="remove"
+        variant="danger"
+        data-testid="delete-pipeline-schedule-btn"
+        @click="$emit('showDeleteModal', schedule.id)"
+      />
+    </gl-button-group>
+  </div>
+</template>