1 files changed, 38 insertions, 10 deletions

diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue
index ff2e0768a87..978881a4831 100644
--- a/app/assets/javascripts/clusters/components/applications.vue
+++ b/app/assets/javascripts/clusters/components/applications.vue
@@ -18,13 +18,24 @@
         required: false,
         default: '',
       },
+      ingressHelpPath: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      managePrometheusPath: {
+        type: String,
+        required: false,
+        default: '',
+      },
     },
     computed: {
       generalApplicationDescription() {
         return sprintf(
-          _.escape(s__(`ClusterIntegration|Install applications on your cluster.
-  Read more about %{helpLink}`)),
-          {
+          _.escape(s__(
+            `ClusterIntegration|Install applications on your Kubernetes cluster.
+            Read more about %{helpLink}`,
+          )), {
             helpLink: `<a href="${this.helpPath}">
               ${_.escape(s__('ClusterIntegration|installing applications'))}
             </a>`,
@@ -34,7 +45,7 @@
       },
       helmTillerDescription() {
         return _.escape(s__(
-          `ClusterIntegration|Helm streamlines installing and managing Kubernets applications.
+          `ClusterIntegration|Helm streamlines installing and managing Kubernetes applications.
           Tiller runs inside of your Kubernetes Cluster, and manages
           releases of your charts.`,
         ));
@@ -49,7 +60,7 @@
           _.escape(s__(
             `ClusterIntegration|%{boldNotice} This will add some extra resources
             like a load balancer, which may incur additional costs depending on
-            the hosting provider Kubernetes is installed on. If you are using GKE,
+            the hosting provider your Kubernetes cluster is installed on. If you are using GKE,
             you can %{pricingLink}.`,
           )), {
             boldNotice: `<strong>${_.escape(s__('ClusterIntegration|Note:'))}</strong>`,
@@ -59,13 +70,28 @@
           false,
         );
 
+        const externalIpParagraph = sprintf(
+          _.escape(s__(
+            `ClusterIntegration|After installing Ingress, you will need to point your wildcard DNS
+            at the generated external IP address in order to view your app after it is deployed. %{ingressHelpLink}`,
+          )), {
+            ingressHelpLink: `<a href="${this.ingressHelpPath}">
+              ${_.escape(s__('ClusterIntegration|More information'))}
+            </a>`,
+          },
+          false,
+        );
+
         return `
           <p>
             ${descriptionParagraph}
           </p>
-          <p class="append-bottom-0">
+          <p>
             ${extraCostParagraph}
           </p>
+          <p class="settings-message append-bottom-0">
+            ${externalIpParagraph}
+          </p>
         `;
       },
       gitlabRunnerDescription() {
@@ -76,11 +102,12 @@
       },
       prometheusDescription() {
         return sprintf(
-          _.escape(s__(`ClusterIntegration|Prometheus is an open-source monitoring system
-  with %{gitlabIntegrationLink} to monitor deployed applications.`)),
-          {
+          _.escape(s__(
+            `ClusterIntegration|Prometheus is an open-source monitoring system
+            with %{gitlabIntegrationLink} to monitor deployed applications.`,
+          )), {
             gitlabIntegrationLink: `<a href="https://docs.gitlab.com/ce/user/project/integrations/prometheus.html"
-target="_blank" rel="noopener noreferrer">
+              target="_blank" rel="noopener noreferrer">
               ${_.escape(s__('ClusterIntegration|GitLab Integration'))}</a>`,
           },
           false,
@@ -129,6 +156,7 @@ target="_blank" rel="noopener noreferrer">
           id="prometheus"
           :title="applications.prometheus.title"
           title-link="https://prometheus.io/docs/introduction/overview/"
+          :manage-link="managePrometheusPath"
           :description="prometheusDescription"
           :status="applications.prometheus.status"
           :status-reason="applications.prometheus.statusReason"