5 files changed, 35 insertions, 0 deletions
diff --git a/app/assets/images/cluster_app_logos/cert_manager.png b/app/assets/images/cluster_app_logos/cert_manager.png
new file mode 100644
index 00000000000..bbc867858da
--- /dev/null
+++ b/app/assets/images/cluster_app_logos/cert_manager.png
diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js
index 71fc2ac7d80..cf70a48f076 100644
--- a/app/assets/javascripts/clusters/clusters_bundle.js
+++ b/app/assets/javascripts/clusters/clusters_bundle.js
@@ -26,6 +26,7 @@ export default class Clusters {
       statusPath,
       installHelmPath,
       installIngressPath,
+      installCertManagerPath,
       installRunnerPath,
       installJupyterPath,
       installKnativePath,
@@ -48,6 +49,7 @@ export default class Clusters {
       endpoint: statusPath,
       installHelmEndpoint: installHelmPath,
       installIngressEndpoint: installIngressPath,
+      installCertManagerEndpoint: installCertManagerPath,
       installRunnerEndpoint: installRunnerPath,
       installPrometheusEndpoint: installPrometheusPath,
       installJupyterEndpoint: installJupyterPath,
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue
index c1026d1273a..eb200113f4f 100644
--- a/app/assets/javascripts/clusters/components/applications.vue
+++ b/app/assets/javascripts/clusters/components/applications.vue
@@ -7,6 +7,7 @@ import helmLogo from 'images/cluster_app_logos/helm.png';
 import jeagerLogo from 'images/cluster_app_logos/jeager.png';
 import jupyterhubLogo from 'images/cluster_app_logos/jupyterhub.png';
 import kubernetesLogo from 'images/cluster_app_logos/kubernetes.png';
+import certManagerLogo from 'images/cluster_app_logos/cert_manager.png';
 import knativeLogo from 'images/cluster_app_logos/knative.png';
 import meltanoLogo from 'images/cluster_app_logos/meltano.png';
 import prometheusLogo from 'images/cluster_app_logos/prometheus.png';
@@ -59,6 +60,7 @@ export default {
     jeagerLogo,
     jupyterhubLogo,
     kubernetesLogo,
+    certManagerLogo,
     knativeLogo,
     meltanoLogo,
     prometheusLogo,
@@ -289,6 +291,28 @@ export default {
         </div>
       </application-row>
       <application-row
+        id="cert_manager"
+        :logo-url="certManagerLogo"
+        :title="applications.cert_manager.title"
+        :status="applications.cert_manager.status"
+        :status-reason="applications.cert_manager.statusReason"
+        :request-status="applications.cert_manager.requestStatus"
+        :request-reason="applications.cert_manager.requestReason"
+        :disabled="!helmInstalled"
+        class="hide-bottom-border rounded-bottom"
+        title-link="https://cert-manager.readthedocs.io/en/latest/#"
+      >
+        <div slot="description">
+          <p>
+            {{ s__(`ClusterIntegration|Cert-Manager is a native Kubernetes 
+              certificate management controller. It will ensure certificates 
+              are valid and up to date, and attempt to renew certificates at 
+              a configured time before expiry. We use Lets Encrypt as a Certificate 
+              Authority with Cert-Manager.`) }}
+          </p>
+        </div>
+      </application-row>
+      <application-row
         v-if="isProjectCluster"
         id="prometheus"
         :logo-url="prometheusLogo"
diff --git a/app/assets/javascripts/clusters/services/clusters_service.js b/app/assets/javascripts/clusters/services/clusters_service.js
index da562b09ee5..89dda4b7902 100644
--- a/app/assets/javascripts/clusters/services/clusters_service.js
+++ b/app/assets/javascripts/clusters/services/clusters_service.js
@@ -6,6 +6,7 @@ export default class ClusterService {
     this.appInstallEndpointMap = {
       helm: this.options.installHelmEndpoint,
       ingress: this.options.installIngressEndpoint,
+      cert_manager: this.options.installCertManagerEndpoint,
       runner: this.options.installRunnerEndpoint,
       prometheus: this.options.installPrometheusEndpoint,
       jupyter: this.options.installJupyterEndpoint,
diff --git a/app/assets/javascripts/clusters/stores/clusters_store.js b/app/assets/javascripts/clusters/stores/clusters_store.js
index e45da967392..07f85880d06 100644
--- a/app/assets/javascripts/clusters/stores/clusters_store.js
+++ b/app/assets/javascripts/clusters/stores/clusters_store.js
@@ -24,6 +24,14 @@ export default class ClusterStore {
           requestReason: null,
           externalIp: null,
         },
+        cert_manager: {
+          title: s__('ClusterIntegration|Cert-Manager'),
+          status: null,
+          statusReason: null,
+          requestStatus: null,
+          requestReason: null,
+          externalIp: null,
+        },
         runner: {
           title: s__('ClusterIntegration|GitLab Runner'),
           status: null,