diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-29 21:09:56 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-29 21:09:56 +0300 |
commit | 6f2dc439265369de7b1e1b18b208c6d66cf260eb (patch) | |
tree | c961526575126eafdd022ae7b496830dcf252002 /app/assets/javascripts/clusters/components | |
parent | 647de7e6fd971d435396cc8730a2d162240e3d7c (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/clusters/components')
-rw-r--r-- | app/assets/javascripts/clusters/components/applications.vue | 14 | ||||
-rw-r--r-- | app/assets/javascripts/clusters/components/fluentd_output_settings.vue | 178 |
2 files changed, 142 insertions, 50 deletions
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue index f6fb05ff0ec..de019593a76 100644 --- a/app/assets/javascripts/clusters/components/applications.vue +++ b/app/assets/javascripts/clusters/components/applications.vue @@ -689,6 +689,8 @@ Crossplane runs inside your Kubernetes cluster and supports secure connectivity 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" @@ -701,12 +703,20 @@ Crossplane runs inside your Kubernetes cluster and supports secure connectivity <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. Export Web Application Firewall logs to your favorite SIEM.`, + `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 :fluentd="applications.fluentd" /> + <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" + /> </div> </application-row> </div> diff --git a/app/assets/javascripts/clusters/components/fluentd_output_settings.vue b/app/assets/javascripts/clusters/components/fluentd_output_settings.vue index 97b030927df..1884b501a20 100644 --- a/app/assets/javascripts/clusters/components/fluentd_output_settings.vue +++ b/app/assets/javascripts/clusters/components/fluentd_output_settings.vue @@ -1,8 +1,15 @@ <script> import { __ } from '~/locale'; import { APPLICATION_STATUS, FLUENTD } from '~/clusters/constants'; -import { GlAlert, GlDeprecatedButton, GlDropdown, GlDropdownItem } from '@gitlab/ui'; +import { + GlAlert, + GlDeprecatedButton, + GlDropdown, + GlDropdownItem, + GlFormCheckbox, +} from '@gitlab/ui'; import eventHub from '~/clusters/event_hub'; +import { mapValues } from 'lodash'; const { UPDATING, UNINSTALLING, INSTALLING, INSTALLED, UPDATED } = APPLICATION_STATUS; @@ -12,24 +19,62 @@ export default { GlDeprecatedButton, GlDropdown, GlDropdownItem, + GlFormCheckbox, }, props: { - fluentd: { - type: Object, - required: true, - }, 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: () => ({ + currentServerSideSettings: { + host: null, + port: null, + protocol: null, + wafLogEnabled: null, + ciliumLogEnabled: null, + }, + }), computed: { isSaving() { - return [UPDATING].includes(this.fluentd.status); + return [UPDATING].includes(this.status); }, saveButtonDisabled() { - return [UNINSTALLING, UPDATING, INSTALLING].includes(this.fluentd.status); + return [UNINSTALLING, UPDATING, INSTALLING].includes(this.status); }, saveButtonLabel() { return this.isSaving ? __('Saving') : __('Save changes'); @@ -41,32 +86,23 @@ export default { * neither getting installed nor updated. */ showButtons() { - return ( - this.isSaving || - (this.fluentd.isEditingSettings && [INSTALLED, UPDATED].includes(this.fluentd.status)) - ); + return this.isSaving || (this.changedByUser && [INSTALLED, UPDATED].includes(this.status)); }, protocolName() { - if (this.fluentd.protocol !== null && this.fluentd.protocol !== undefined) { - return this.fluentd.protocol.toUpperCase(); + if (this.protocol) { + return this.protocol.toUpperCase(); } return __('Protocol'); }, - fluentdPort: { - get() { - return this.fluentd.port; - }, - set(port) { - this.setFluentSettings({ port }); - }, - }, - fluentdHost: { - get() { - return this.fluentd.host; - }, - set(host) { - this.setFluentSettings({ host }); - }, + changedByUser() { + return Object.entries(this.currentServerSideSettings).some(([key, value]) => { + return value !== null && value !== this[key]; + }); + }, + }, + watch: { + status() { + this.resetCurrentServerSideSettings(); }, }, methods: { @@ -74,38 +110,64 @@ export default { eventHub.$emit('updateApplication', { id: FLUENTD, params: { - port: this.fluentd.port, - protocol: this.fluentd.protocol, - host: this.fluentd.host, + port: this.port, + protocol: this.protocol, + host: this.host, + waf_log_enabled: this.wafLogEnabled, + cilium_log_enabled: this.ciliumLogEnabled, }, }); - this.resetStatus(); + }, + resetCurrentServerSideSettings() { + this.currentServerSideSettings = mapValues(this.currentServerSideSettings, () => { + return null; + }); }, resetStatus() { - this.fluentd.isEditingSettings = false; + const newSettings = mapValues(this.currentServerSideSettings, (value, key) => { + return value === null ? this[key] : value; + }); + eventHub.$emit('setFluentdSettings', { + ...newSettings, + isEditingSettings: false, + }); }, - selectProtocol(protocol) { - this.setFluentSettings({ protocol }); + updateCurrentServerSideSettings(settings) { + Object.keys(settings).forEach(key => { + if (this.currentServerSideSettings[key] === null) { + this.currentServerSideSettings[key] = this[key]; + } + }); }, - setFluentSettings({ port, protocol, host }) { - this.fluentd.isEditingSettings = true; - const newPort = port !== undefined ? port : this.fluentd.port; - const newProtocol = protocol !== undefined ? protocol : this.fluentd.protocol; - const newHost = host !== undefined ? host : this.fluentd.host; + setFluentdSettings(settings) { + this.updateCurrentServerSideSettings(settings); eventHub.$emit('setFluentdSettings', { - id: FLUENTD, - port: newPort, - protocol: newProtocol, - host: newHost, + ...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="fluentd.updateFailed" class="mb-3" variant="danger" :dismissible="false"> + <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.', @@ -117,13 +179,25 @@ export default { <label for="fluentd-host"> <strong>{{ s__('ClusterIntegration|SIEM Hostname') }}</strong> </label> - <input id="fluentd-host" v-model="fluentdHost" type="text" class="form-control" /> + <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" v-model="fluentdPort" type="text" class="form-control" /> + <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"> @@ -133,12 +207,20 @@ export default { <gl-dropdown-item v-for="(value, index) in protocols" :key="index" - @click="selectProtocol(value)" + @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 ModSecurity Logs') }}</strong> + </gl-form-checkbox> + <gl-form-checkbox :checked="ciliumLogEnabled" @input="ciliumLogChanged"> + <strong>{{ s__('ClusterIntegration|Send Cilium Logs') }}</strong> + </gl-form-checkbox> + </div> <div v-if="showButtons" class="mt-3"> <gl-deprecated-button ref="saveBtn" |