1 files changed, 38 insertions, 13 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline_container.vue b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline_container.vue
index 5f5fe67b3c1..677a5f5ca27 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline_container.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline_container.vue
@@ -30,9 +30,6 @@ export default {
     },
   },
   computed: {
-    pipeline() {
-      return this.isPostMerge ? this.mr.mergePipeline : this.mr.pipeline;
-    },
     branch() {
       return this.isPostMerge ? this.mr.targetBranch : this.mr.sourceBranch;
     },
@@ -40,7 +37,18 @@ export default {
       return this.isPostMerge ? this.mr.targetBranch : this.mr.sourceBranchLink;
     },
     deployments() {
-      return this.isPostMerge ? this.mr.postMergeDeployments : this.mr.deployments;
+      return [
+        {
+          id: 56789,
+          name: 'What a cool mocked deployment',
+          url: 'https://sarahghp.gitlab.io/review-app-tester/',
+          external_url: 'https://sarahghp.gitlab.io/review-app-tester/',
+          deployed_at_formatted: '',
+          metrics_url: '',
+          metrics_monitoring_url: '',
+        },
+      ];
+      // return this.isPostMerge ? this.mr.postMergeDeployments : this.mr.deployments;
     },
     deploymentClass() {
       return this.isPostMerge ? 'js-post-deployment' : 'js-pre-deployment';
@@ -48,6 +56,19 @@ export default {
     hasDeploymentMetrics() {
       return this.isPostMerge;
     },
+    issueIds() {
+      return {
+        appUrl: this.mr.appUrl,
+        issueId: this.mr.iid,
+        sourceProjectId: this.mr.sourceProjectId,
+      };
+    },
+    pipeline() {
+      return this.isPostMerge ? this.mr.mergePipeline : this.mr.pipeline;
+    },
+    showVisualReviewAppLink() {
+      return !!this.mr.visualReviewAppAvailable;
+    },
   },
 };
 </script>
@@ -61,14 +82,18 @@ export default {
       :source-branch-link="branchLink"
       :troubleshooting-docs-path="mr.troubleshootingDocsPath"
     />
-    <div v-if="deployments.length" slot="footer" class="mr-widget-extension">
-      <deployment
-        v-for="deployment in deployments"
-        :key="deployment.id"
-        :class="deploymentClass"
-        :deployment="deployment"
-        :show-metrics="hasDeploymentMetrics"
-      />
-    </div>
+    <template v-slot:footer>
+      <div class="mr-widget-extension">
+        <deployment
+          v-for="deployment in deployments"
+          :key="deployment.id"
+          :class="deploymentClass"
+          :deployment="deployment"
+          :show-metrics="hasDeploymentMetrics"
+          :show-visual-review-app="showVisualReviewAppLink"
+          :issue-ids="issueIds"
+        />
+      </div>
+    </template>
   </mr-widget-container>
 </template>