1 files changed, 20 insertions, 33 deletions

diff --git a/app/assets/javascripts/environments/components/environment_item.vue b/app/assets/javascripts/environments/components/environment_item.vue
index 11e3b781e5a..ff50e75dbda 100644
--- a/app/assets/javascripts/environments/components/environment_item.vue
+++ b/app/assets/javascripts/environments/components/environment_item.vue
@@ -12,6 +12,7 @@ import TerminalButtonComponent from './environment_terminal_button.vue';
 import MonitoringButtonComponent from './environment_monitoring.vue';
 import CommitComponent from '../../vue_shared/components/commit.vue';
 import eventHub from '../event_hub';
+import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 
 /**
  * Envrionment Item Component
@@ -72,21 +73,6 @@ export default {
     },
 
     /**
-     * Verifies is the given environment has manual actions.
-     * Used to verify if we should render them or nor.
-     *
-     * @returns {Boolean|Undefined}
-     */
-    hasManualActions() {
-      return (
-        this.model &&
-        this.model.last_deployment &&
-        this.model.last_deployment.manual_actions &&
-        this.model.last_deployment.manual_actions.length > 0
-      );
-    },
-
-    /**
      * Checkes whether the environment is protected.
      * (`is_protected` currently only set in EE)
      *
@@ -152,23 +138,24 @@ export default {
       return '';
     },
 
-    /**
-     * Returns the manual actions with the name parsed.
-     *
-     * @returns {Array.<Object>|Undefined}
-     */
-    manualActions() {
-      if (this.hasManualActions) {
-        return this.model.last_deployment.manual_actions.map(action => {
-          const parsedAction = {
-            name: humanize(action.name),
-            play_path: action.play_path,
-            playable: action.playable,
-          };
-          return parsedAction;
-        });
+    actions() {
+      if (!this.model || !this.model.last_deployment) {
+        return [];
+      }
+
+      const { manualActions, scheduledActions } = convertObjectPropsToCamelCase(
+        this.model.last_deployment,
+        { deep: true },
+      );
+      let combinedActions = [];
+      if (this.canCreateDeployment) {
+        combinedActions = combinedActions.concat(manualActions || []);
       }
-      return [];
+      combinedActions = combinedActions.concat(scheduledActions || []);
+      return combinedActions.map(action => ({
+        ...action,
+        name: humanize(action.name),
+      }));
     },
 
     /**
@@ -624,8 +611,8 @@ export default {
         />
 
         <actions-component
-          v-if="hasManualActions && canCreateDeployment"
-          :actions="manualActions"
+          v-if="actions.length > 0"
+          :actions="actions"
         />
 
         <terminal-button-component