1 files changed, 10 insertions, 47 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment.vue b/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment.vue
index 34866cdfa6f..6f77d2fa779 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment.vue
@@ -1,18 +1,15 @@
 <script>
-import { __, s__ } from '~/locale';
+import DeploymentActions from './deployment_actions.vue';
 import DeploymentInfo from './deployment_info.vue';
-import DeploymentViewButton from './deployment_view_button.vue';
-import DeploymentStopButton from './deployment_stop_button.vue';
-import { MANUAL_DEPLOY, WILL_DEPLOY, CREATED, RUNNING, SUCCESS } from './constants';
+import { MANUAL_DEPLOY, WILL_DEPLOY, CREATED } from './constants';
 
 export default {
   // name: 'Deployment' is a false positive: https://gitlab.com/gitlab-org/frontend/eslint-plugin-i18n/issues/26#possible-false-positives
   // eslint-disable-next-line @gitlab/i18n/no-non-i18n-strings
   name: 'Deployment',
   components: {
+    DeploymentActions,
     DeploymentInfo,
-    DeploymentStopButton,
-    DeploymentViewButton,
   },
   props: {
     deployment: {
@@ -40,38 +37,14 @@ export default {
     },
   },
   computed: {
-    appButtonText() {
-      return {
-        text: this.isCurrent ? s__('Review App|View app') : s__('Review App|View latest app'),
-        tooltip: this.isCurrent
-          ? ''
-          : __('View the latest successful deployment to this environment'),
-      };
-    },
-    canBeManuallyDeployed() {
-      return this.computedDeploymentStatus === MANUAL_DEPLOY;
-    },
     computedDeploymentStatus() {
       if (this.deployment.status === CREATED) {
         return this.isManual ? MANUAL_DEPLOY : WILL_DEPLOY;
       }
       return this.deployment.status;
     },
-    hasExternalUrls() {
-      return Boolean(this.deployment.external_url && this.deployment.external_url_formatted);
-    },
-    isCurrent() {
-      return this.computedDeploymentStatus === SUCCESS;
-    },
     isManual() {
-      return Boolean(
-        this.deployment.details &&
-          this.deployment.details.playable_build &&
-          this.deployment.details.playable_build.play_path,
-      );
-    },
-    isDeployInProgress() {
-      return this.deployment.status === RUNNING;
+      return Boolean(this.deployment.details?.playable_build?.play_path);
     },
   },
 };
@@ -87,22 +60,12 @@ export default {
             :deployment="deployment"
             :show-metrics="showMetrics"
           />
-          <div>
-            <!-- show appropriate version of review app button  -->
-            <deployment-view-button
-              v-if="hasExternalUrls"
-              :app-button-text="appButtonText"
-              :deployment="deployment"
-              :show-visual-review-app="showVisualReviewApp"
-              :visual-review-app-metadata="visualReviewAppMeta"
-            />
-            <!-- if it is stoppable, show stop -->
-            <deployment-stop-button
-              v-if="deployment.stop_url"
-              :is-deploy-in-progress="isDeployInProgress"
-              :stop-url="deployment.stop_url"
-            />
-          </div>
+          <deployment-actions
+            :deployment="deployment"
+            :computed-deployment-status="computedDeploymentStatus"
+            :show-visual-review-app="showVisualReviewApp"
+            :visual-review-app-metadata="visualReviewAppMeta"
+          />
         </div>
       </div>
     </div>