Add latest changes from gitlab-org/gitlab@master

3 files changed, 56 insertions, 3 deletions

diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js
index d990d2677a8..b764348eb3c 100644
--- a/app/assets/javascripts/clusters/clusters_bundle.js
+++ b/app/assets/javascripts/clusters/clusters_bundle.js
@@ -53,6 +53,7 @@ export default class Clusters {
       helpPath,
       ingressHelpPath,
       ingressDnsHelpPath,
+      ingressModSecurityHelpPath,
       environmentsHelpPath,
       clustersHelpPath,
       deployBoardsHelpPath,
@@ -69,6 +70,7 @@ export default class Clusters {
       helpPath,
       ingressHelpPath,
       ingressDnsHelpPath,
+      ingressModSecurityHelpPath,
       environmentsHelpPath,
       clustersHelpPath,
       deployBoardsHelpPath,
@@ -169,6 +171,7 @@ export default class Clusters {
             ingressHelpPath: this.state.ingressHelpPath,
             managePrometheusPath: this.state.managePrometheusPath,
             ingressDnsHelpPath: this.state.ingressDnsHelpPath,
+            ingressModSecurityHelpPath: this.state.ingressModSecurityHelpPath,
             cloudRunHelpPath: this.state.cloudRunHelpPath,
             providerType: this.state.providerType,
             preInstalledKnative: this.state.preInstalledKnative,
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue
index 99844a356c8..af50ca7361d 100644
--- a/app/assets/javascripts/clusters/components/applications.vue
+++ b/app/assets/javascripts/clusters/components/applications.vue
@@ -56,6 +56,11 @@ export default {
       required: false,
       default: '',
     },
+    ingressModSecurityHelpPath: {
+      type: String,
+      required: false,
+      default: '',
+    },
     cloudRunHelpPath: {
       type: String,
       required: false,
@@ -112,6 +117,9 @@ export default {
     ingressInstalled() {
       return this.applications.ingress.status === APPLICATION_STATUS.INSTALLED;
     },
+    ingressEnableModsecurity() {
+      return this.applications.ingress.modsecurity_enabled;
+    },
     ingressExternalEndpoint() {
       return this.applications.ingress.externalIp || this.applications.ingress.externalHostname;
     },
@@ -127,6 +135,18 @@ export default {
     enableClusterApplicationElasticStack() {
       return gon.features && gon.features.enableClusterApplicationElasticStack;
     },
+    ingressModSecurityDescription() {
+      const escapedUrl = _.escape(this.ingressModSecurityHelpPath);
+
+      return sprintf(
+        s__('ClusterIntegration|Learn more about %{startLink}ModSecurity%{endLink}'),
+        {
+          startLink: `<a href="${escapedUrl}" target="_blank" rel="noopener noreferrer">`,
+          endLink: '</a>',
+        },
+        false,
+      );
+    },
     ingressDescription() {
       return sprintf(
         _.escape(
@@ -135,9 +155,9 @@ export default {
           ),
         ),
         {
-          pricingLink: `<strong><a href="https://cloud.google.com/compute/pricing#lb"
+          pricingLink: `<a href="https://cloud.google.com/compute/pricing#lb"
               target="_blank" rel="noopener noreferrer">
-              ${_.escape(s__('ClusterIntegration|pricing'))}</a></strong>`,
+              ${_.escape(s__('ClusterIntegration|pricing'))}</a>`,
         },
         false,
       );
@@ -311,6 +331,9 @@ Crossplane runs inside your Kubernetes cluster and supports secure connectivity
         :request-reason="applications.ingress.requestReason"
         :installed="applications.ingress.installed"
         :install-failed="applications.ingress.installFailed"
+        :install-application-request-params="{
+          modsecurity_enabled: applications.ingress.modsecurity_enabled,
+        }"
         :uninstallable="applications.ingress.uninstallable"
         :uninstall-successful="applications.ingress.uninstallSuccessful"
         :uninstall-failed="applications.ingress.uninstallFailed"
@@ -326,6 +349,26 @@ Crossplane runs inside your Kubernetes cluster and supports secure connectivity
             }}
           </p>
 
+          <template>
+            <div class="form-group">
+              <div class="form-check form-check-inline">
+                <input
+                  v-model="applications.ingress.modsecurity_enabled"
+                  :disabled="ingressInstalled"
+                  type="checkbox"
+                  autocomplete="off"
+                  class="form-check-input"
+                />
+                <label class="form-check-label label-bold" for="ingress-enable-modsecurity">
+                  {{ s__('ClusterIntegration|Enable Web Application Firewall') }}
+                </label>
+              </div>
+              <p class="form-text text-muted">
+                <strong v-html="ingressModSecurityDescription"></strong>
+              </p>
+            </div>
+          </template>
+
           <template v-if="ingressInstalled">
             <div class="form-group">
               <label for="ingress-endpoint">{{ s__('ClusterIntegration|Ingress Endpoint') }}</label>
@@ -375,7 +418,9 @@ Crossplane runs inside your Kubernetes cluster and supports secure connectivity
             </p>
           </template>
           <template v-if="!ingressInstalled">
-            <div class="bs-callout bs-callout-info" v-html="ingressDescription"></div>
+            <div class="bs-callout bs-callout-info">
+              <strong v-html="ingressDescription"></strong>
+            </div>
           </template>
         </div>
       </application-row>
diff --git a/app/assets/javascripts/clusters/stores/clusters_store.js b/app/assets/javascripts/clusters/stores/clusters_store.js
index 35dbf951551..9c8563e8f77 100644
--- a/app/assets/javascripts/clusters/stores/clusters_store.js
+++ b/app/assets/javascripts/clusters/stores/clusters_store.js
@@ -52,6 +52,7 @@ export default class ClusterStore {
         ingress: {
           ...applicationInitialState,
           title: s__('ClusterIntegration|Ingress'),
+          modsecurity_enabled: false,
           externalIp: null,
           externalHostname: null,
         },
@@ -108,6 +109,7 @@ export default class ClusterStore {
     helpPath,
     ingressHelpPath,
     ingressDnsHelpPath,
+    ingressModSecurityHelpPath,
     environmentsHelpPath,
     clustersHelpPath,
     deployBoardsHelpPath,
@@ -116,6 +118,7 @@ export default class ClusterStore {
     this.state.helpPath = helpPath;
     this.state.ingressHelpPath = ingressHelpPath;
     this.state.ingressDnsHelpPath = ingressDnsHelpPath;
+    this.state.ingressModSecurityHelpPath = ingressModSecurityHelpPath;
     this.state.environmentsHelpPath = environmentsHelpPath;
     this.state.clustersHelpPath = clustersHelpPath;
     this.state.deployBoardsHelpPath = deployBoardsHelpPath;
@@ -207,6 +210,8 @@ export default class ClusterStore {
       if (appId === INGRESS) {
         this.state.applications.ingress.externalIp = serverAppEntry.external_ip;
         this.state.applications.ingress.externalHostname = serverAppEntry.external_hostname;
+        this.state.applications.ingress.modsecurity_enabled =
+          serverAppEntry.modsecurity_enabled || this.state.applications.ingress.modsecurity_enabled;
       } else if (appId === CERT_MANAGER) {
         this.state.applications.cert_manager.email =
           this.state.applications.cert_manager.email || serverAppEntry.email;