diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-10-29 00:08:36 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-10-29 00:08:36 +0000 |
commit | 1063cd719c0e25df43bf5d2c0ea8e22f112ed225 (patch) | |
tree | 0bdd8d0582bb9cd0d2ca5a6d3ea8ca593465a964 /app/assets/javascripts/alerts_settings | |
parent | 669f67690a43e9ec7b6d148c6ec1391b379fa16e (diff) | |
download | gitlab-ce-1063cd719c0e25df43bf5d2c0ea8e22f112ed225.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/alerts_settings')
-rw-r--r-- | app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue | 4 | ||||
-rw-r--r-- | app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue | 119 | ||||
-rw-r--r-- | app/assets/javascripts/alerts_settings/components/alerts_settings_form_old.vue (renamed from app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue) | 320 | ||||
-rw-r--r-- | app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue | 48 | ||||
-rw-r--r-- | app/assets/javascripts/alerts_settings/constants.js | 12 | ||||
-rw-r--r-- | app/assets/javascripts/alerts_settings/index.js | 19 |
6 files changed, 329 insertions, 193 deletions
diff --git a/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue b/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue index 217442e6131..d377f0f2654 100644 --- a/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue +++ b/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue @@ -2,7 +2,7 @@ import { GlTable, GlIcon, GlTooltipDirective } from '@gitlab/ui'; import { s__, __ } from '~/locale'; import Tracking from '~/tracking'; -import { trackAlertIntergrationsViewsOptions } from '../constants'; +import { trackAlertIntegrationsViewsOptions } from '../constants'; export const i18n = { title: s__('AlertsIntegrations|Current integrations'), @@ -64,7 +64,7 @@ export default { }, methods: { trackPageViews() { - const { category, action } = trackAlertIntergrationsViewsOptions; + const { category, action } = trackAlertIntegrationsViewsOptions; Tracking.event(category, action); }, }, diff --git a/app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue b/app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue new file mode 100644 index 00000000000..3fd158e1d8e --- /dev/null +++ b/app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue @@ -0,0 +1,119 @@ +<script> +import { + GlButton, + GlCollapse, + GlForm, + GlFormGroup, + GlFormSelect, + GlFormInput, + GlLink, + GlSprintf, +} from '@gitlab/ui'; +import { s__ } from '~/locale'; +import { integrationTypes } from '../constants'; + +export default { + i18n: { + integrationsInfo: s__( + 'AlertSettings|Learn more about our upcoming %{linkStart}integrations%{linkEnd}', + ), + integrationFormSteps: { + step1: s__('AlertSettings|1. Select integration type'), + step2: s__('AlertSettings|2. Name integration'), + }, + }, + components: { + GlButton, + GlCollapse, + GlForm, + GlFormGroup, + GlFormInput, + GlFormSelect, + GlLink, + GlSprintf, + }, + data() { + return { + selectedIntegration: integrationTypes[0].value, + options: integrationTypes, + formVisible: false, + form: { + name: '', + }, + }; + }, + methods: { + onIntegrationTypeSelect() { + if (this.selectedIntegration === integrationTypes[0].value) { + this.formVisible = false; + } else { + this.formVisible = true; + } + }, + onSubmit() { + // TODO Add GraphQL method + }, + onReset() { + this.form.name = ''; + }, + }, +}; +</script> + +<template> + <gl-form class="gl-mt-6" @submit.prevent="onSubmit" @reset.prevent="onReset"> + <h5 class="gl-font-lg gl-my-5">{{ s__('AlertSettings|Add new integrations') }}</h5> + + <gl-form-group + id="integration-type" + :label="$options.i18n.integrationFormSteps.step1" + label-for="integration-type" + > + <gl-form-select + id="integration-type" + v-model="selectedIntegration" + :options="options" + @change="onIntegrationTypeSelect" + /> + <span class="gl-text-gray-500"> + <gl-sprintf :message="$options.i18n.integrationsInfo"> + <template #link="{ content }"> + <gl-link + class="gl-display-inline-block" + href="https://gitlab.com/groups/gitlab-org/-/epics/4390" + target="_blank" + >{{ content }}</gl-link + > + </template> + </gl-sprintf> + </span> + </gl-form-group> + <gl-collapse v-model="formVisible" class="gl-mt-3"> + <gl-form-group + id="name-integration" + :label="$options.i18n.integrationFormSteps.step2" + label-for="name-integration" + > + <gl-form-input + id="name-integration" + v-model="form.name" + type="text" + :placeholder="s__('AlertSettings|Enter integration name')" + /> + </gl-form-group> + <div class="gl-display-flex gl-justify-content-end"> + <gl-button type="reset" class="gl-mr-3 js-no-auto-disable">{{ __('Cancel') }}</gl-button> + <gl-button + type="submit" + category="secondary" + variant="success" + class="gl-mr-1 js-no-auto-disable" + >{{ __('Save and test payload') }}</gl-button + > + <gl-button type="submit" variant="success" class="js-no-auto-disable">{{ + s__('AlertSettings|Save integration') + }}</gl-button> + </div> + </gl-collapse> + </gl-form> +</template> diff --git a/app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue b/app/assets/javascripts/alerts_settings/components/alerts_settings_form_old.vue index f885afae378..ab6d5526154 100644 --- a/app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue +++ b/app/assets/javascripts/alerts_settings/components/alerts_settings_form_old.vue @@ -14,16 +14,14 @@ import { GlFormSelect, } from '@gitlab/ui'; import { debounce } from 'lodash'; -import { s__ } from '~/locale'; import { doesHashExistInUrl } from '~/lib/utils/url_utility'; import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; import ToggleButton from '~/vue_shared/components/toggle_button.vue'; -import IntegrationsList from './alerts_integrations_list.vue'; import csrf from '~/lib/utils/csrf'; import service from '../services'; import { i18n, - serviceOptions, + integrationTypes, JSON_VALIDATE_DELAY, targetPrometheusUrlPlaceholder, targetOpsgenieUrlPlaceholder, @@ -50,7 +48,6 @@ export default { GlSprintf, ClipboardButton, ToggleButton, - IntegrationsList, }, directives: { 'gl-modal': GlModalDirective, @@ -59,8 +56,8 @@ export default { data() { return { loading: false, - selectedEndpoint: serviceOptions[0].value, - options: serviceOptions, + selectedIntegration: integrationTypes[1].value, + options: integrationTypes, active: false, authKey: '', targetUrl: '', @@ -91,13 +88,13 @@ export default { ]; }, isPrometheus() { - return this.selectedEndpoint === 'prometheus'; + return this.selectedIntegration === 'prometheus'; }, isOpsgenie() { - return this.selectedEndpoint === 'opsgenie'; + return this.selectedIntegration === 'opsgenie'; }, - selectedService() { - switch (this.selectedEndpoint) { + selectedIntegrationType() { + switch (this.selectedIntegration) { case 'generic': { return { url: this.generic.url, @@ -152,27 +149,13 @@ export default { ? this.$options.targetOpsgenieUrlPlaceholder : this.$options.targetPrometheusUrlPlaceholder; }, - integrations() { - return [ - { - name: s__('AlertSettings|HTTP endpoint'), - type: s__('AlertsIntegrations|HTTP endpoint'), - activated: this.generic.activated, - }, - { - name: s__('AlertSettings|External Prometheus'), - type: s__('AlertsIntegrations|Prometheus'), - activated: this.prometheus.activated, - }, - ]; - }, }, watch: { 'testAlert.json': debounce(function debouncedJsonValidate() { this.validateJson(); }, JSON_VALIDATE_DELAY), targetUrl(oldVal, newVal) { - if (newVal && oldVal !== this.selectedService.targetUrl) { + if (newVal && oldVal !== this.selectedIntegrationType.targetUrl) { this.canSaveForm = true; } }, @@ -187,8 +170,8 @@ export default { } else if (this.opsgenie.activated) { this.setOpsgenieAsDefault(); } - this.active = this.selectedService.activated; - this.authKey = this.selectedService.authKey ?? ''; + this.active = this.selectedIntegrationType.activated; + this.authKey = this.selectedIntegrationType.authKey ?? ''; }, methods: { createUserErrorMessage(errors = {}) { @@ -205,9 +188,9 @@ export default { } return { ...el, disabled: false }; }); - this.selectedEndpoint = this.options.find(({ value }) => value === 'opsgenie').value; + this.selectedIntegration = this.options.find(({ value }) => value === 'opsgenie').value; if (this.targetUrl === null) { - this.targetUrl = this.selectedService.targetUrl; + this.targetUrl = this.selectedIntegrationType.targetUrl; } }, removeOpsGenieOption() { @@ -220,8 +203,8 @@ export default { }, resetFormValues() { this.testAlert.json = null; - this.targetUrl = this.selectedService.targetUrl; - this.active = this.selectedService.activated; + this.targetUrl = this.selectedIntegrationType.targetUrl; + this.active = this.selectedIntegrationType.activated; }, dismissFeedback() { this.serverError = null; @@ -261,7 +244,7 @@ export default { this.loading = true; return service .updateGenericActive({ - endpoint: this[this.selectedEndpoint].formPath, + endpoint: this[this.selectedIntegration].formPath, params: this.isOpsgenie ? { service: { opsgenie_mvc_target_url: this.targetUrl, opsgenie_mvc_enabled: value } } : { service: { active: value } }, @@ -331,9 +314,9 @@ export default { this.validateJson(); return service .updateTestAlert({ - endpoint: this.selectedService.url, + endpoint: this.selectedIntegrationType.url, data: this.testAlert.json, - authKey: this.selectedService.authKey, + authKey: this.selectedIntegrationType.authKey, }) .then(() => { this.setFeedback({ @@ -358,11 +341,11 @@ export default { onReset() { this.testAlert.json = null; this.dismissFeedback(); - this.targetUrl = this.selectedService.targetUrl; + this.targetUrl = this.selectedIntegrationType.targetUrl; if (this.canSaveForm) { this.canSaveForm = false; - this.active = this.selectedService.activated; + this.active = this.selectedIntegrationType.activated; } }, }, @@ -370,153 +353,144 @@ export default { </script> <template> - <div> - <integrations-list :integrations="integrations" /> - - <gl-form @submit.prevent="onSubmit" @reset.prevent="onReset"> - <h5 class="gl-font-lg gl-my-5">{{ $options.i18n.integrationsLabel }}</h5> + <gl-form @submit.prevent="onSubmit" @reset.prevent="onReset"> + <h5 class="gl-font-lg gl-my-5">{{ $options.i18n.integrationsLabel }}</h5> - <gl-alert v-if="showFeedbackMsg" :variant="feedback.variant" @dismiss="dismissFeedback"> - {{ feedback.feedbackMessage }} - <br /> - <i v-if="serverError">{{ __('Error message:') }} {{ serverError }}</i> - <gl-button - v-if="showAlertSave" - variant="danger" - category="primary" - class="gl-display-block gl-mt-3" - @click="toggle(active)" - > - {{ __('Save anyway') }} - </gl-button> - </gl-alert> + <gl-alert v-if="showFeedbackMsg" :variant="feedback.variant" @dismiss="dismissFeedback"> + {{ feedback.feedbackMessage }} + <br /> + <i v-if="serverError">{{ __('Error message:') }} {{ serverError }}</i> + <gl-button + v-if="showAlertSave" + variant="danger" + category="primary" + class="gl-display-block gl-mt-3" + @click="toggle(active)" + > + {{ __('Save anyway') }} + </gl-button> + </gl-alert> - <div data-testid="alert-settings-description"> - <p v-for="section in sections" :key="section.text"> - <gl-sprintf :message="section.text"> - <template #link="{ content }"> - <gl-link :href="section.url" target="_blank">{{ content }}</gl-link> - </template> - </gl-sprintf> - </p> - </div> + <div data-testid="alert-settings-description"> + <p v-for="section in sections" :key="section.text"> + <gl-sprintf :message="section.text"> + <template #link="{ content }"> + <gl-link :href="section.url" target="_blank">{{ content }}</gl-link> + </template> + </gl-sprintf> + </p> + </div> - <gl-form-group label-for="integration-type" :label="$options.i18n.integration"> - <gl-form-select - id="integration-type" - v-model="selectedEndpoint" - :options="options" - data-testid="alert-settings-select" - @change="resetFormValues" - /> + <gl-form-group label-for="integration-type" :label="$options.i18n.integration"> + <gl-form-select + id="integration-type" + v-model="selectedIntegration" + :options="options" + data-testid="alert-settings-select" + @change="resetFormValues" + /> + <span class="gl-text-gray-500"> + <gl-sprintf :message="$options.i18n.integrationsInfo"> + <template #link="{ content }"> + <gl-link + class="gl-display-inline-block" + href="https://gitlab.com/groups/gitlab-org/-/epics/4390" + target="_blank" + >{{ content }}</gl-link + > + </template> + </gl-sprintf> + </span> + </gl-form-group> + <gl-form-group :label="$options.i18n.activeLabel" label-for="activated"> + <toggle-button + id="activated" + :disabled-input="loading" + :is-loading="loading" + :value="active" + @change="toggleService" + /> + </gl-form-group> + <gl-form-group + v-if="isOpsgenie || isPrometheus" + :label="$options.i18n.apiBaseUrlLabel" + label-for="api-url" + > + <gl-form-input + id="api-url" + v-model="targetUrl" + type="url" + :placeholder="baseUrlPlaceholder" + :disabled="!active" + /> + <span class="gl-text-gray-500"> + {{ $options.i18n.apiBaseUrlHelpText }} + </span> + </gl-form-group> + <template v-if="!isOpsgenie"> + <gl-form-group :label="$options.i18n.urlLabel" label-for="url"> + <gl-form-input-group id="url" readonly :value="selectedIntegrationType.url"> + <template #append> + <clipboard-button + :text="selectedIntegrationType.url" + :title="$options.i18n.copyToClipboard" + class="gl-m-0!" + /> + </template> + </gl-form-input-group> <span class="gl-text-gray-500"> - <gl-sprintf :message="$options.i18n.integrationsInfo"> - <template #link="{ content }"> - <gl-link - class="gl-display-inline-block" - href="https://gitlab.com/groups/gitlab-org/-/epics/4390" - target="_blank" - >{{ content }}</gl-link - > - </template> - </gl-sprintf> + {{ prometheusInfo }} </span> </gl-form-group> - <gl-form-group :label="$options.i18n.activeLabel" label-for="activated"> - <toggle-button - id="activated" - :disabled-input="loading" - :is-loading="loading" - :value="active" - @change="toggleService" - /> + <gl-form-group :label="$options.i18n.authKeyLabel" label-for="authorization-key"> + <gl-form-input-group id="authorization-key" class="gl-mb-2" readonly :value="authKey"> + <template #append> + <clipboard-button + :text="authKey" + :title="$options.i18n.copyToClipboard" + class="gl-m-0!" + /> + </template> + </gl-form-input-group> + <gl-button v-gl-modal.authKeyModal :disabled="!active" class="gl-mt-3">{{ + $options.i18n.resetKey + }}</gl-button> + <gl-modal + modal-id="authKeyModal" + :title="$options.i18n.resetKey" + :ok-title="$options.i18n.resetKey" + ok-variant="danger" + @ok="selectedIntegrationType.resetKey" + > + {{ $options.i18n.restKeyInfo }} + </gl-modal> </gl-form-group> <gl-form-group - v-if="isOpsgenie || isPrometheus" - :label="$options.i18n.apiBaseUrlLabel" - label-for="api-url" + :label="$options.i18n.alertJson" + label-for="alert-json" + :invalid-feedback="testAlert.error" > - <gl-form-input - id="api-url" - v-model="targetUrl" - type="url" - :placeholder="baseUrlPlaceholder" + <gl-form-textarea + id="alert-json" + v-model.trim="testAlert.json" :disabled="!active" + :state="jsonIsValid" + :placeholder="$options.i18n.alertJsonPlaceholder" + rows="6" + max-rows="10" /> - <span class="gl-text-gray-500"> - {{ $options.i18n.apiBaseUrlHelpText }} - </span> </gl-form-group> - <template v-if="!isOpsgenie"> - <gl-form-group :label="$options.i18n.urlLabel" label-for="url"> - <gl-form-input-group id="url" readonly :value="selectedService.url"> - <template #append> - <clipboard-button - :text="selectedService.url" - :title="$options.i18n.copyToClipboard" - class="gl-m-0!" - /> - </template> - </gl-form-input-group> - <span class="gl-text-gray-500"> - {{ prometheusInfo }} - </span> - </gl-form-group> - <gl-form-group :label="$options.i18n.authKeyLabel" label-for="authorization-key"> - <gl-form-input-group id="authorization-key" class="gl-mb-2" readonly :value="authKey"> - <template #append> - <clipboard-button - :text="authKey" - :title="$options.i18n.copyToClipboard" - class="gl-m-0!" - /> - </template> - </gl-form-input-group> - <gl-button v-gl-modal.authKeyModal :disabled="!active" class="gl-mt-3">{{ - $options.i18n.resetKey - }}</gl-button> - <gl-modal - modal-id="authKeyModal" - :title="$options.i18n.resetKey" - :ok-title="$options.i18n.resetKey" - ok-variant="danger" - @ok="selectedService.resetKey" - > - {{ $options.i18n.restKeyInfo }} - </gl-modal> - </gl-form-group> - <gl-form-group - :label="$options.i18n.alertJson" - label-for="alert-json" - :invalid-feedback="testAlert.error" - > - <gl-form-textarea - id="alert-json" - v-model.trim="testAlert.json" - :disabled="!active" - :state="jsonIsValid" - :placeholder="$options.i18n.alertJsonPlaceholder" - rows="6" - max-rows="10" - /> - </gl-form-group> - <gl-button :disabled="!canTestAlert" @click="validateTestAlert">{{ - $options.i18n.testAlertInfo - }}</gl-button> - </template> - <div class="footer-block row-content-block gl-display-flex gl-justify-content-space-between"> - <gl-button - variant="success" - category="primary" - :disabled="!canSaveConfig" - @click="onSubmit" - > - {{ __('Save changes') }} - </gl-button> - <gl-button category="primary" :disabled="!canSaveConfig" @click="onReset"> - {{ __('Cancel') }} - </gl-button> - </div> - </gl-form> - </div> + <gl-button :disabled="!canTestAlert" @click="validateTestAlert">{{ + $options.i18n.testAlertInfo + }}</gl-button> + </template> + <div class="footer-block row-content-block gl-display-flex gl-justify-content-space-between"> + <gl-button variant="success" category="primary" :disabled="!canSaveConfig" @click="onSubmit"> + {{ __('Save changes') }} + </gl-button> + <gl-button category="primary" :disabled="!canSaveConfig" @click="onReset"> + {{ __('Cancel') }} + </gl-button> + </div> + </gl-form> </template> diff --git a/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue b/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue new file mode 100644 index 00000000000..1edb8f1c921 --- /dev/null +++ b/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue @@ -0,0 +1,48 @@ +<script> +import { s__ } from '~/locale'; +import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; +import IntegrationsList from './alerts_integrations_list.vue'; +import SettingsFormOld from './alerts_settings_form_old.vue'; +import SettingsFormNew from './alerts_settings_form_new.vue'; + +export default { + components: { + IntegrationsList, + SettingsFormOld, + SettingsFormNew, + }, + mixins: [glFeatureFlagsMixin()], + inject: { + generic: { + default: {}, + }, + prometheus: { + default: {}, + }, + }, + computed: { + integrations() { + return [ + { + name: s__('AlertSettings|HTTP endpoint'), + type: s__('AlertsIntegrations|HTTP endpoint'), + activated: this.generic.activated, + }, + { + name: s__('AlertSettings|External Prometheus'), + type: s__('AlertsIntegrations|Prometheus'), + activated: this.prometheus.activated, + }, + ]; + }, + }, +}; +</script> + +<template> + <div> + <integrations-list :integrations="integrations" /> + <settings-form-new v-if="glFeatures.httpIntegrationsList" /> + <settings-form-old v-else /> + </div> +</template> diff --git a/app/assets/javascripts/alerts_settings/constants.js b/app/assets/javascripts/alerts_settings/constants.js index 4220dbde0c7..74e39534eb5 100644 --- a/app/assets/javascripts/alerts_settings/constants.js +++ b/app/assets/javascripts/alerts_settings/constants.js @@ -17,11 +17,10 @@ export const i18n = { changesSaved: s__('AlertSettings|Your integration was successfully updated.'), prometheusInfo: s__('AlertSettings|Add URL and auth key to your Prometheus config file'), integrationsInfo: s__( - 'AlertSettings|Learn more about our improvements for %{linkStart}integrations%{linkEnd}', + 'AlertSettings|Learn more about our our upcoming %{linkStart}integrations%{linkEnd}', ), resetKey: s__('AlertSettings|Reset key'), copyToClipboard: s__('AlertSettings|Copy'), - integrationsLabel: s__('AlertSettings|Add new integrations'), apiBaseUrlLabel: s__('AlertSettings|API URL'), authKeyLabel: s__('AlertSettings|Authorization key'), urlLabel: s__('AlertSettings|Webhook URL'), @@ -40,7 +39,8 @@ export const i18n = { integration: s__('AlertSettings|Integration'), }; -export const serviceOptions = [ +export const integrationTypes = [ + { value: '', text: s__('AlertSettings|Select integration type') }, { value: 'generic', text: s__('AlertSettings|HTTP Endpoint') }, { value: 'prometheus', text: s__('AlertSettings|External Prometheus') }, { value: 'opsgenie', text: s__('AlertSettings|Opsgenie') }, @@ -56,9 +56,9 @@ export const sectionHash = 'js-alert-management-settings'; /* eslint-disable @gitlab/require-i18n-strings */ /** - * Tracks snowplow event when user views alerts intergration list + * Tracks snowplow event when user views alerts integration list */ -export const trackAlertIntergrationsViewsOptions = { - category: 'Alert Intergrations', +export const trackAlertIntegrationsViewsOptions = { + category: 'Alert Integrations', action: 'view_alert_integrations_list', }; diff --git a/app/assets/javascripts/alerts_settings/index.js b/app/assets/javascripts/alerts_settings/index.js index 8d1d342d229..80f06a094b7 100644 --- a/app/assets/javascripts/alerts_settings/index.js +++ b/app/assets/javascripts/alerts_settings/index.js @@ -1,6 +1,6 @@ import Vue from 'vue'; import { parseBoolean } from '~/lib/utils/common_utils'; -import AlertSettingsForm from './components/alerts_settings_form.vue'; +import AlertSettingsWrapper from './components/alerts_settings_wrapper.vue'; export default el => { if (!el) { @@ -26,16 +26,11 @@ export default el => { opsgenieMvcTargetUrl, } = el.dataset; - const genericActivated = parseBoolean(activatedStr); - const prometheusIsActivated = parseBoolean(prometheusActivated); - const opsgenieMvcActivated = parseBoolean(opsgenieMvcEnabled); - const opsgenieMvcIsAvailable = parseBoolean(opsgenieMvcAvailable); - return new Vue({ el, provide: { prometheus: { - activated: prometheusIsActivated, + activated: parseBoolean(prometheusActivated), prometheusUrl, authorizationKey: prometheusAuthorizationKey, prometheusFormPath, @@ -45,23 +40,23 @@ export default el => { generic: { alertsSetupUrl, alertsUsageUrl, - activated: genericActivated, + activated: parseBoolean(activatedStr), formPath, authorizationKey, url, }, opsgenie: { formPath: opsgenieMvcFormPath, - activated: opsgenieMvcActivated, + activated: parseBoolean(opsgenieMvcEnabled), opsgenieMvcTargetUrl, - opsgenieMvcIsAvailable, + opsgenieMvcIsAvailable: parseBoolean(opsgenieMvcAvailable), }, }, components: { - AlertSettingsForm, + AlertSettingsWrapper, }, render(createElement) { - return createElement('alert-settings-form'); + return createElement('alert-settings-wrapper'); }, }); }; |