diff options
Diffstat (limited to 'app/assets/javascripts/clusters/components')
4 files changed, 2 insertions, 581 deletions
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue index 8ef3169dc65..ddee1711975 100644 --- a/app/assets/javascripts/clusters/components/applications.vue +++ b/app/assets/javascripts/clusters/components/applications.vue @@ -3,7 +3,6 @@ import { GlLoadingIcon, GlSprintf, GlLink, GlAlert } from '@gitlab/ui'; import certManagerLogo from 'images/cluster_app_logos/cert_manager.png'; import crossplaneLogo from 'images/cluster_app_logos/crossplane.png'; import elasticStackLogo from 'images/cluster_app_logos/elastic_stack.png'; -import fluentdLogo from 'images/cluster_app_logos/fluentd.png'; import gitlabLogo from 'images/cluster_app_logos/gitlab.png'; import helmLogo from 'images/cluster_app_logos/helm.png'; import jupyterhubLogo from 'images/cluster_app_logos/jupyterhub.png'; @@ -15,8 +14,6 @@ import clipboardButton from '../../vue_shared/components/clipboard_button.vue'; import { CLUSTER_TYPE, PROVIDER_TYPE, APPLICATION_STATUS, INGRESS } from '../constants'; import applicationRow from './application_row.vue'; import CrossplaneProviderStack from './crossplane_provider_stack.vue'; -import FluentdOutputSettings from './fluentd_output_settings.vue'; -import IngressModsecuritySettings from './ingress_modsecurity_settings.vue'; import KnativeDomainEditor from './knative_domain_editor.vue'; export default { @@ -28,8 +25,6 @@ export default { GlLink, KnativeDomainEditor, CrossplaneProviderStack, - IngressModsecuritySettings, - FluentdOutputSettings, GlAlert, }, props: { @@ -63,11 +58,7 @@ export default { required: false, default: '', }, - ingressModSecurityHelpPath: { - type: String, - required: false, - default: '', - }, + cloudRunHelpPath: { type: String, required: false, @@ -165,7 +156,6 @@ export default { knativeLogo, prometheusLogo, elasticStackLogo, - fluentdLogo, }, }; </script> @@ -219,10 +209,6 @@ export default { :request-reason="applications.ingress.requestReason" :installed="applications.ingress.installed" :install-failed="applications.ingress.installFailed" - :install-application-request-params="{ - modsecurity_enabled: applications.ingress.modsecurity_enabled, - modsecurity_mode: applications.ingress.modsecurity_mode, - }" :uninstallable="applications.ingress.uninstallable" :uninstall-successful="applications.ingress.uninstallSuccessful" :uninstall-failed="applications.ingress.uninstallFailed" @@ -238,11 +224,6 @@ export default { }} </p> - <ingress-modsecurity-settings - :ingress="ingress" - :ingress-mod-security-help-path="ingressModSecurityHelpPath" - /> - <template v-if="ingressInstalled"> <div class="form-group"> <label for="ingress-endpoint">{{ s__('ClusterIntegration|Ingress Endpoint') }}</label> @@ -644,50 +625,6 @@ export default { </template> </application-row> - <application-row - id="fluentd" - :logo-url="$options.logos.fluentdLogo" - :title="applications.fluentd.title" - :status="applications.fluentd.status" - :status-reason="applications.fluentd.statusReason" - :request-status="applications.fluentd.requestStatus" - :request-reason="applications.fluentd.requestReason" - :installed="applications.fluentd.installed" - :install-failed="applications.fluentd.installFailed" - :install-application-request-params="{ - host: applications.fluentd.host, - port: applications.fluentd.port, - protocol: applications.fluentd.protocol, - waf_log_enabled: applications.fluentd.wafLogEnabled, - cilium_log_enabled: applications.fluentd.ciliumLogEnabled, - }" - :uninstallable="applications.fluentd.uninstallable" - :uninstall-successful="applications.fluentd.uninstallSuccessful" - :uninstall-failed="applications.fluentd.uninstallFailed" - :updateable="false" - title-link="https://github.com/helm/charts/tree/master/stable/fluentd" - > - <template #description> - <p> - {{ - s__( - `ClusterIntegration|Fluentd is an open source data collector, which lets you unify the data collection and consumption for a better use and understanding of data. It requires at least one of the following logs to be successfully installed.`, - ) - }} - </p> - - <fluentd-output-settings - :port="applications.fluentd.port" - :protocol="applications.fluentd.protocol" - :host="applications.fluentd.host" - :waf-log-enabled="applications.fluentd.wafLogEnabled" - :cilium-log-enabled="applications.fluentd.ciliumLogEnabled" - :status="applications.fluentd.status" - :update-failed="applications.fluentd.updateFailed" - /> - </template> - </application-row> - <div class="gl-mt-7 gl-border-1 gl-border-t-solid gl-border-gray-100"> <!-- This empty div serves as a separator. The applications below can be externally installed using a cluster-management project. --> </div> diff --git a/app/assets/javascripts/clusters/components/fluentd_output_settings.vue b/app/assets/javascripts/clusters/components/fluentd_output_settings.vue deleted file mode 100644 index aaad0009ef3..00000000000 --- a/app/assets/javascripts/clusters/components/fluentd_output_settings.vue +++ /dev/null @@ -1,238 +0,0 @@ -<script> -import { GlAlert, GlButton, GlDropdown, GlDropdownItem, GlFormCheckbox } from '@gitlab/ui'; -import { mapValues } from 'lodash'; -import { APPLICATION_STATUS, FLUENTD } from '~/clusters/constants'; -import eventHub from '~/clusters/event_hub'; -import { __ } from '~/locale'; - -const { UPDATING, UNINSTALLING, INSTALLING, INSTALLED, UPDATED } = APPLICATION_STATUS; - -export default { - components: { - GlAlert, - GlButton, - GlDropdown, - GlDropdownItem, - GlFormCheckbox, - }, - props: { - protocols: { - type: Array, - required: false, - default: () => ['TCP', 'UDP'], - }, - status: { - type: String, - required: false, - default: '', - }, - updateFailed: { - type: Boolean, - required: false, - }, - protocol: { - type: String, - required: false, - default: () => __('Protocol'), - }, - port: { - type: Number, - required: false, - default: 514, - }, - host: { - type: String, - required: false, - default: '', - }, - wafLogEnabled: { - type: Boolean, - required: false, - }, - ciliumLogEnabled: { - type: Boolean, - required: false, - }, - }, - data() { - return { - currentServerSideSettings: { - host: null, - port: null, - protocol: null, - wafLogEnabled: null, - ciliumLogEnabled: null, - }, - }; - }, - computed: { - isSaving() { - return [UPDATING].includes(this.status); - }, - saveButtonDisabled() { - return [UNINSTALLING, UPDATING, INSTALLING].includes(this.status); - }, - saveButtonLabel() { - return this.isSaving ? __('Saving') : __('Save changes'); - }, - /** - * Returns true either when: - * - The application is getting updated. - * - The user has changed some of the settings for an application which is - * neither getting installed nor updated. - */ - showButtons() { - return this.isSaving || (this.changedByUser && [INSTALLED, UPDATED].includes(this.status)); - }, - protocolName() { - if (this.protocol) { - return this.protocol.toUpperCase(); - } - return __('Protocol'); - }, - changedByUser() { - return Object.entries(this.currentServerSideSettings).some(([key, value]) => { - return value !== null && value !== this[key]; - }); - }, - }, - watch: { - status() { - this.resetCurrentServerSideSettings(); - }, - }, - methods: { - updateApplication() { - eventHub.$emit('updateApplication', { - id: FLUENTD, - params: { - port: this.port, - protocol: this.protocol, - host: this.host, - waf_log_enabled: this.wafLogEnabled, - cilium_log_enabled: this.ciliumLogEnabled, - }, - }); - }, - resetCurrentServerSideSettings() { - this.currentServerSideSettings = mapValues(this.currentServerSideSettings, () => { - return null; - }); - }, - resetStatus() { - const newSettings = mapValues(this.currentServerSideSettings, (value, key) => { - return value === null ? this[key] : value; - }); - eventHub.$emit('setFluentdSettings', { - ...newSettings, - isEditingSettings: false, - }); - }, - updateCurrentServerSideSettings(settings) { - Object.keys(settings).forEach((key) => { - if (this.currentServerSideSettings[key] === null) { - this.currentServerSideSettings[key] = this[key]; - } - }); - }, - setFluentdSettings(settings) { - this.updateCurrentServerSideSettings(settings); - eventHub.$emit('setFluentdSettings', { - ...settings, - isEditingSettings: true, - }); - }, - selectProtocol(protocol) { - this.setFluentdSettings({ protocol }); - }, - hostChanged(host) { - this.setFluentdSettings({ host }); - }, - portChanged(port) { - this.setFluentdSettings({ port: Number(port) }); - }, - wafLogChanged(wafLogEnabled) { - this.setFluentdSettings({ wafLogEnabled }); - }, - ciliumLogChanged(ciliumLogEnabled) { - this.setFluentdSettings({ ciliumLogEnabled }); - }, - }, -}; -</script> - -<template> - <div> - <gl-alert v-if="updateFailed" class="mb-3" variant="danger" :dismissible="false"> - {{ - s__( - 'ClusterIntegration|Something went wrong while trying to save your settings. Please try again.', - ) - }} - </gl-alert> - <div class="form-horizontal"> - <div class="form-group"> - <label for="fluentd-host"> - <strong>{{ s__('ClusterIntegration|SIEM Hostname') }}</strong> - </label> - <input - id="fluentd-host" - :value="host" - type="text" - class="form-control" - @input="hostChanged($event.target.value)" - /> - </div> - <div class="form-group"> - <label for="fluentd-port"> - <strong>{{ s__('ClusterIntegration|SIEM Port') }}</strong> - </label> - <input - id="fluentd-port" - :value="port" - type="number" - class="form-control" - @input="portChanged($event.target.value)" - /> - </div> - <div class="form-group"> - <label for="fluentd-protocol"> - <strong>{{ s__('ClusterIntegration|SIEM Protocol') }}</strong> - </label> - <gl-dropdown :text="protocolName" class="w-100"> - <gl-dropdown-item - v-for="(value, index) in protocols" - :key="index" - @click="selectProtocol(value.toLowerCase())" - > - {{ value }} - </gl-dropdown-item> - </gl-dropdown> - </div> - <div class="form-group flex flex-wrap"> - <gl-form-checkbox :checked="wafLogEnabled" @input="wafLogChanged"> - <strong>{{ s__('ClusterIntegration|Send Web Application Firewall Logs') }}</strong> - </gl-form-checkbox> - <gl-form-checkbox :checked="ciliumLogEnabled" @input="ciliumLogChanged"> - <strong>{{ s__('ClusterIntegration|Send Container Network Policies Logs') }}</strong> - </gl-form-checkbox> - </div> - <div v-if="showButtons" class="gl-mt-5 gl-display-flex"> - <gl-button - ref="saveBtn" - class="gl-mr-3" - variant="success" - category="primary" - :loading="isSaving" - :disabled="saveButtonDisabled" - @click="updateApplication" - > - {{ saveButtonLabel }} - </gl-button> - <gl-button ref="cancelBtn" :disabled="saveButtonDisabled" @click="resetStatus"> - {{ __('Cancel') }} - </gl-button> - </div> - </div> - </div> -</template> diff --git a/app/assets/javascripts/clusters/components/ingress_modsecurity_settings.vue b/app/assets/javascripts/clusters/components/ingress_modsecurity_settings.vue deleted file mode 100644 index 1ba28660e5c..00000000000 --- a/app/assets/javascripts/clusters/components/ingress_modsecurity_settings.vue +++ /dev/null @@ -1,266 +0,0 @@ -<script> -import { - GlAlert, - GlSprintf, - GlLink, - GlToggle, - GlButton, - GlDropdown, - GlDropdownItem, - GlIcon, -} from '@gitlab/ui'; -import { escape } from 'lodash'; -import modSecurityLogo from 'images/cluster_app_logos/gitlab.png'; -import { APPLICATION_STATUS, INGRESS, LOGGING_MODE, BLOCKING_MODE } from '~/clusters/constants'; -import eventHub from '~/clusters/event_hub'; -import { s__, __ } from '../../locale'; - -const { UPDATING, UNINSTALLING, INSTALLING, INSTALLED, UPDATED } = APPLICATION_STATUS; - -export default { - i18n: { - modSecurityEnabled: s__('ClusterIntegration|ModSecurity enabled'), - }, - title: __('Web Application Firewall'), - modsecurityUrl: 'https://modsecurity.org/about.html', - components: { - GlAlert, - GlSprintf, - GlLink, - GlToggle, - GlButton, - GlDropdown, - GlDropdownItem, - GlIcon, - }, - props: { - ingress: { - type: Object, - required: true, - }, - ingressModSecurityHelpPath: { - type: String, - required: false, - default: '', - }, - modes: { - type: Object, - required: false, - default: () => ({ - [LOGGING_MODE]: { - name: s__('ClusterIntegration|Logging mode'), - }, - [BLOCKING_MODE]: { - name: s__('ClusterIntegration|Blocking mode'), - }, - }), - }, - }, - data() { - return { - modSecurityLogo, - initialValue: null, - initialMode: null, - }; - }, - computed: { - modSecurityEnabled: { - get() { - return this.ingress.modsecurity_enabled; - }, - set(isEnabled) { - if (this.initialValue === null) { - this.initialValue = this.ingress.modsecurity_enabled; - } - eventHub.$emit('setIngressModSecurityEnabled', { - id: INGRESS, - modSecurityEnabled: isEnabled, - }); - }, - }, - hasValueChanged() { - return this.modSecurityEnabledChanged || this.modSecurityModeChanged; - }, - modSecurityEnabledChanged() { - return this.initialValue !== null && this.initialValue !== this.ingress.modsecurity_enabled; - }, - modSecurityModeChanged() { - return ( - this.ingress.modsecurity_enabled && - this.initialMode !== null && - this.initialMode !== this.ingress.modsecurity_mode - ); - }, - ingressModSecurityDescription() { - return escape(this.ingressModSecurityHelpPath); - }, - saving() { - return [UPDATING].includes(this.ingress.status); - }, - saveButtonDisabled() { - return ( - [UNINSTALLING, UPDATING, INSTALLING].includes(this.ingress.status) || - this.ingress.updateAvailable - ); - }, - saveButtonLabel() { - return this.saving ? __('Saving') : __('Save changes'); - }, - /** - * Returns true either when: - * - The application is getting updated. - * - The user has changed some of the settings for an application which is - * neither getting installed nor updated. - */ - showButtons() { - return this.saving || this.valuesChangedByUser; - }, - modSecurityModeName() { - return this.modes[this.ingress.modsecurity_mode].name; - }, - valuesChangedByUser() { - return this.hasValueChanged && [INSTALLED, UPDATED].includes(this.ingress.status); - }, - }, - methods: { - updateApplication() { - eventHub.$emit('updateApplication', { - id: INGRESS, - params: { - modsecurity_enabled: this.ingress.modsecurity_enabled, - modsecurity_mode: this.ingress.modsecurity_mode, - }, - }); - this.resetStatus(); - }, - resetStatus() { - if (this.initialMode !== null) { - // eslint-disable-next-line vue/no-mutating-props - this.ingress.modsecurity_mode = this.initialMode; - } - if (this.initialValue !== null) { - // eslint-disable-next-line vue/no-mutating-props - this.ingress.modsecurity_enabled = this.initialValue; - } - this.initialValue = null; - this.initialMode = null; - eventHub.$emit('resetIngressModSecurityChanges', INGRESS); - }, - selectMode(modeKey) { - if (this.initialMode === null) { - this.initialMode = this.ingress.modsecurity_mode; - } - eventHub.$emit('setIngressModSecurityMode', { - id: INGRESS, - modSecurityMode: modeKey, - }); - }, - }, -}; -</script> - -<template> - <div> - <gl-alert - v-if="ingress.updateFailed" - class="mb-3" - variant="danger" - :dismissible="false" - @dismiss="alert = null" - > - {{ - s__( - 'ClusterIntegration|Something went wrong while trying to save your settings. Please try again.', - ) - }} - </gl-alert> - <div class="gl-responsive-table-row-layout" role="row"> - <div class="table-section gl-mr-3 section-align-top" role="gridcell"> - <img - :src="modSecurityLogo" - :alt="`${$options.title} logo`" - class="cluster-application-logo avatar s40" - /> - </div> - <div class="table-section section-wrap" role="gridcell"> - <strong> - <gl-link :href="$options.modsecurityUrl" target="_blank">{{ $options.title }} </gl-link> - </strong> - <div class="form-group"> - <p class="form-text text-muted"> - <strong> - <gl-sprintf - :message=" - s__( - 'ClusterIntegration|Real-time web application monitoring, logging and access control. %{linkStart}More information%{linkEnd}', - ) - " - > - <template #link="{ content }"> - <gl-link :href="ingressModSecurityDescription" target="_blank" - >{{ content }} - </gl-link> - </template> - </gl-sprintf> - </strong> - </p> - <div class="form-check form-check-inline mt-3"> - <gl-toggle - v-model="modSecurityEnabled" - :disabled="saveButtonDisabled" - :label="$options.i18n.modSecurityEnabled" - label-position="hidden" - /> - </div> - <div - v-if="ingress.modsecurity_enabled" - class="gl-responsive-table-row-layout mt-3" - role="row" - > - <div class="table-section section-wrap" role="gridcell"> - <strong> - {{ s__('ClusterIntegration|Global default') }} - <gl-icon name="earth" class="align-text-bottom" /> - </strong> - <div class="form-group"> - <p class="form-text text-muted"> - <strong> - {{ - s__( - 'ClusterIntegration|Set the global mode for the WAF in this cluster. This can be overridden at the environmental level.', - ) - }} - </strong> - </p> - </div> - <gl-dropdown :text="modSecurityModeName" :disabled="saveButtonDisabled"> - <gl-dropdown-item v-for="(mode, key) in modes" :key="key" @click="selectMode(key)"> - {{ mode.name }} - </gl-dropdown-item> - </gl-dropdown> - </div> - </div> - <div v-if="showButtons" class="gl-mt-5 gl-display-flex"> - <gl-button - variant="success" - category="primary" - data-qa-selector="save_ingress_modsecurity_settings" - :loading="saving" - :disabled="saveButtonDisabled" - @click="updateApplication" - > - {{ saveButtonLabel }} - </gl-button> - <gl-button - data-qa-selector="cancel_ingress_modsecurity_settings" - :disabled="saveButtonDisabled" - @click="resetStatus" - > - {{ __('Cancel') }} - </gl-button> - </div> - </div> - </div> - </div> - </div> -</template> diff --git a/app/assets/javascripts/clusters/components/remove_cluster_confirmation.vue b/app/assets/javascripts/clusters/components/remove_cluster_confirmation.vue index 5cd9baf2c2b..b9c55409330 100644 --- a/app/assets/javascripts/clusters/components/remove_cluster_confirmation.vue +++ b/app/assets/javascripts/clusters/components/remove_cluster_confirmation.vue @@ -1,6 +1,6 @@ <script> /* eslint-disable vue/no-v-html */ -import { GlModal, GlButton, GlFormInput, GlSprintf } from '@gitlab/ui'; +import { GlModal, GlButton, GlFormInput } from '@gitlab/ui'; import { escape } from 'lodash'; import csrf from '~/lib/utils/csrf'; import { s__, sprintf } from '~/locale'; @@ -30,7 +30,6 @@ export default { GlModal, GlButton, GlFormInput, - GlSprintf, }, props: { clusterPath: { @@ -135,17 +134,6 @@ export default { <div v-if="confirmCleanup"> {{ s__('ClusterIntegration|This will permanently delete the following resources:') }} <ul> - <li> - {{ s__('ClusterIntegration|All installed applications and related resources') }} - </li> - <li> - <gl-sprintf :message="s__('ClusterIntegration|The %{gitlabNamespace} namespace')"> - <template #gitlabNamespace> - <!-- eslint-disable-next-line @gitlab/vue-require-i18n-strings --> - <code>{{ 'gitlab-managed-apps' }}</code> - </template> - </gl-sprintf> - </li> <li>{{ s__('ClusterIntegration|Any project namespaces') }}</li> <!-- eslint-disable @gitlab/vue-require-i18n-strings --> <li><code>clusterroles</code></li> |