Commit 20980602 authored by David O'Regan's avatar David O'Regan Committed by Illya Klymov

Refactor(opsgenie): remove Opsgenie integration frontend code

Remove the frontend code for
Opegenie configuration within
Incident management
parent 5f003f9d
......@@ -6,21 +6,12 @@ import alertsHelpUrlQuery from '../graphql/queries/alert_help_url.query.graphql'
export default {
i18n: {
emptyState: {
opsgenie: {
title: s__('AlertManagement|Opsgenie is enabled'),
info: s__(
'AlertManagement|You have enabled the Opsgenie integration. Your alerts will be visible directly in Opsgenie.',
),
buttonText: s__('AlertManagement|View alerts in Opsgenie'),
},
gitlab: {
title: s__('AlertManagement|Surface alerts in GitLab'),
info: s__(
'AlertManagement|Display alerts from all your monitoring tools directly within GitLab. Streamline the investigation of your alerts and the escalation of alerts to incidents.',
),
buttonText: s__('AlertManagement|Authorize external service'),
},
},
moreInformation: s__('AlertManagement|More information'),
},
components: {
......@@ -33,46 +24,27 @@ export default {
query: alertsHelpUrlQuery,
},
},
inject: [
'enableAlertManagementPath',
'userCanEnableAlertManagement',
'emptyAlertSvgPath',
'opsgenieMvcEnabled',
'opsgenieMvcTargetUrl',
],
inject: ['enableAlertManagementPath', 'userCanEnableAlertManagement', 'emptyAlertSvgPath'],
data() {
return {
alertsHelpUrl: '',
};
},
computed: {
emptyState() {
return {
...(this.opsgenieMvcEnabled
? this.$options.i18n.emptyState.opsgenie
: this.$options.i18n.emptyState.gitlab),
link: this.opsgenieMvcEnabled ? this.opsgenieMvcTargetUrl : this.enableAlertManagementPath,
};
},
alertsCanBeEnabled() {
return this.userCanEnableAlertManagement || this.opsgenieMvcEnabled;
},
},
};
</script>
<template>
<div>
<gl-empty-state :title="emptyState.title" :svg-path="emptyAlertSvgPath">
<gl-empty-state :title="$options.i18n.emptyState.title" :svg-path="emptyAlertSvgPath">
<template #description>
<div class="gl-display-block">
<span>{{ emptyState.info }}</span>
<gl-link v-if="!opsgenieMvcEnabled" :href="alertsHelpUrl" target="_blank">
<span>{{ $options.i18n.emptyState.info }}</span>
<gl-link :href="alertsHelpUrl" target="_blank">
{{ $options.i18n.moreInformation }}
</gl-link>
</div>
<div v-if="alertsCanBeEnabled" class="gl-display-block center gl-pt-4">
<gl-button category="primary" variant="success" :href="emptyState.link">
{{ emptyState.buttonText }}
<div v-if="userCanEnableAlertManagement" class="gl-display-block center gl-pt-4">
<gl-button category="primary" variant="success" :href="enableAlertManagementPath">
{{ $options.i18n.emptyState.buttonText }}
</gl-button>
</div>
</template>
......
......@@ -17,12 +17,10 @@ export default () => {
emptyAlertSvgPath,
populatingAlertsHelpUrl,
alertsHelpUrl,
opsgenieMvcTargetUrl,
textQuery,
assigneeUsernameQuery,
alertManagementEnabled,
userCanEnableAlertManagement,
opsgenieMvcEnabled,
} = domEl.dataset;
const apolloProvider = new VueApollo({
......@@ -57,10 +55,8 @@ export default () => {
enableAlertManagementPath,
populatingAlertsHelpUrl,
emptyAlertSvgPath,
opsgenieMvcTargetUrl,
alertManagementEnabled: parseBoolean(alertManagementEnabled),
userCanEnableAlertManagement: parseBoolean(userCanEnableAlertManagement),
opsgenieMvcEnabled: parseBoolean(opsgenieMvcEnabled),
},
apolloProvider,
components: {
......
......@@ -18,14 +18,11 @@ import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
import MappingBuilder from './alert_mapping_builder.vue';
import AlertSettingsFormHelpBlock from './alert_settings_form_help_block.vue';
import getCurrentIntegrationQuery from '../graphql/queries/get_current_integration.query.graphql';
import service from '../services';
import {
integrationTypesNew,
integrationTypes,
JSON_VALIDATE_DELAY,
targetPrometheusUrlPlaceholder,
targetOpsgenieUrlPlaceholder,
typeSet,
sectionHash,
} from '../constants';
// Mocks will be removed when integrating with BE is ready
// data format is defined and will be the same as mocked (maybe with some minor changes)
......@@ -91,20 +88,13 @@ export const i18n = {
'AlertSettings|Resetting the authorization key for this project will require updating the authorization key in every alert source it is enabled in.',
),
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
opsgenie: {
label: s__('AlertSettings|2. Add link to your Opsgenie alert list'),
info: s__(
'AlertSettings|Utilizing this option will link the GitLab Alerts navigation item to your existing Opsgenie instance. By selecting this option, you cannot receive alerts from any other source in GitLab; it will effectively be turning Alerts within GitLab off as a feature.',
),
},
},
};
export default {
integrationTypes,
placeholders: {
prometheus: targetPrometheusUrlPlaceholder,
opsgenie: targetOpsgenieUrlPlaceholder,
},
JSON_VALIDATE_DELAY,
typeSet,
......@@ -134,10 +124,6 @@ export default {
prometheus: {
default: {},
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
opsgenie: {
default: {},
},
},
mixins: [glFeatureFlagsMixin()],
props: {
......@@ -149,12 +135,6 @@ export default {
type: Boolean,
required: true,
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
canManageOpsgenie: {
type: Boolean,
required: false,
default: false,
},
},
apollo: {
currentIntegration: {
......@@ -163,7 +143,7 @@ export default {
},
data() {
return {
selectedIntegration: integrationTypesNew[0].value,
selectedIntegration: integrationTypes[0].value,
active: false,
formVisible: false,
integrationTestPayload: {
......@@ -174,8 +154,6 @@ export default {
customMapping: null,
parsingPayload: false,
currentIntegration: null,
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
isManagingOpsgenie: false,
};
},
computed: {
......@@ -185,32 +163,12 @@ export default {
jsonIsValid() {
return this.integrationTestPayload.error === null;
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
disabledIntegrations() {
const options = [];
if (this.opsgenie.active) {
options.push(typeSet.http, typeSet.prometheus);
} else if (!this.canManageOpsgenie) {
options.push(typeSet.opsgenie);
}
return options;
},
options() {
return integrationTypesNew.map((el) => ({
...el,
disabled: this.disabledIntegrations.includes(el.value),
}));
},
selectedIntegrationType() {
switch (this.selectedIntegration) {
case typeSet.http:
return this.generic;
case typeSet.prometheus:
return this.prometheus;
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
case typeSet.opsgenie:
return this.opsgenie;
default:
return {};
}
......@@ -285,49 +243,17 @@ export default {
},
methods: {
integrationTypeSelect() {
if (this.selectedIntegration === integrationTypesNew[0].value) {
if (this.selectedIntegration === integrationTypes[0].value) {
this.formVisible = false;
} else {
this.formVisible = true;
}
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
if (this.canManageOpsgenie && this.selectedIntegration === typeSet.opsgenie) {
this.isManagingOpsgenie = true;
this.active = this.opsgenie.active;
this.integrationForm.apiUrl = this.opsgenie.opsgenieMvcTargetUrl;
} else {
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
this.isManagingOpsgenie = false;
}
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
submitWithOpsgenie() {
return service
.updateGenericActive({
endpoint: this.opsgenie.formPath,
params: {
service: {
opsgenie_mvc_target_url: this.integrationForm.apiUrl,
opsgenie_mvc_enabled: this.active,
},
},
})
.then(() => {
window.location.hash = sectionHash;
window.location.reload();
});
},
submitWithTestPayload() {
this.$emit('set-test-alert-payload', this.testAlertPayload);
this.submit();
},
submit() {
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
if (this.isManagingOpsgenie) {
return this.submitWithOpsgenie();
}
const { name, apiUrl } = this.integrationForm;
const variables =
this.selectedIntegration === typeSet.http
......@@ -343,7 +269,7 @@ export default {
return this.$emit('create-new-integration', integrationPayload);
},
reset() {
this.selectedIntegration = integrationTypesNew[0].value;
this.selectedIntegration = integrationTypes[0].value;
this.integrationTypeSelect();
if (this.currentIntegration) {
......@@ -360,9 +286,6 @@ export default {
error: null,
};
this.active = false;
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
this.isManagingOpsgenie = false;
},
resetAuthKey() {
if (!this.currentIntegration) {
......@@ -428,8 +351,8 @@ export default {
<gl-form-select
v-model="selectedIntegration"
:disabled="isSelectDisabled"
:class="{ 'gl-bg-gray-100!': isSelectDisabled }"
:options="options"
class="mw-100"
:options="$options.integrationTypes"
@change="integrationTypeSelect"
/>
......@@ -441,37 +364,7 @@ export default {
</div>
</gl-form-group>
<gl-collapse v-model="formVisible" class="gl-mt-3">
<!-- TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657 -->
<div v-if="isManagingOpsgenie">
<gl-form-group
id="integration-webhook"
:label="$options.i18n.integrationFormSteps.opsgenie.label"
label-for="integration-webhook"
>
<span class="gl-my-4">
{{ $options.i18n.integrationFormSteps.opsgenie.info }}
</span>
<gl-toggle
v-model="active"
:is-loading="loading"
:label="__('Active')"
class="gl-my-4 gl-font-weight-normal"
/>
<gl-form-input
id="opsgenie-opsgenieMvcTargetUrl"
v-model="integrationForm.apiUrl"
type="text"
:placeholder="$options.placeholders.opsgenie"
/>
<span class="gl-text-gray-400 gl-my-1">
{{ $options.i18n.integrationFormSteps.prometheusFormUrl.help }}
</span>
</gl-form-group>
</div>
<div v-else>
<div>
<gl-form-group
id="name-integration"
:label="$options.i18n.integrationFormSteps.step2.label"
......@@ -661,9 +554,7 @@ export default {
data-testid="integration-form-submit"
>{{ s__('AlertSettings|Save integration') }}
</gl-button>
<!-- TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657 -->
<gl-button
v-if="!isManagingOpsgenie"
data-testid="integration-test-and-submit"
:disabled="isSubmitTestPayloadDisabled"
category="secondary"
......@@ -672,12 +563,7 @@ export default {
@click="submitWithTestPayload"
>{{ s__('AlertSettings|Save and test payload') }}</gl-button
>
<gl-button
type="reset"
class="js-no-auto-disable"
:class="{ 'gl-ml-3': isManagingOpsgenie }"
>{{ __('Cancel') }}</gl-button
>
<gl-button type="reset" class="js-no-auto-disable">{{ __('Cancel') }}</gl-button>
</div>
</gl-collapse>
</gl-form>
......
<script>
import { GlAlert, GlLink, GlSprintf } from '@gitlab/ui';
import { s__ } from '~/locale';
import { fetchPolicies } from '~/lib/graphql';
import createFlash, { FLASH_TYPES } from '~/flash';
......@@ -41,10 +40,6 @@ export default {
),
},
components: {
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
GlAlert,
GlLink,
GlSprintf,
IntegrationsList,
AlertSettingsForm,
},
......@@ -55,10 +50,6 @@ export default {
prometheus: {
default: {},
},
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
opsgenie: {
default: {},
},
projectPath: {
default: '',
},
......@@ -105,13 +96,6 @@ export default {
canAddIntegration() {
return this.multiIntegrations || this.integrations?.list?.length < 2;
},
canManageOpsgenie() {
return (
this.opsgenie.active ||
this.integrations?.list?.every(({ active }) => active === false) ||
this.integrations?.list?.length === 0
);
},
},
methods: {
createNewIntegration({ type, variables }) {
......@@ -319,27 +303,7 @@ export default {
<template>
<div>
<!-- TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657 -->
<gl-alert v-if="opsgenie.active" :dismissible="false" variant="tip">
<gl-sprintf
:message="
s__(
'AlertSettings|We will soon be introducing the ability to create multiple unique HTTP endpoints. When this functionality is live, you will be able to configure an integration with Opsgenie to surface Opsgenie alerts in GitLab. This will replace the current Opsgenie integration which will be deprecated. %{linkStart}More Information%{linkEnd}',
)
"
>
<template #link="{ content }">
<gl-link
class="gl-display-inline-block"
href="https://gitlab.com/gitlab-org/gitlab/-/issues/273657"
target="_blank"
>{{ content }}</gl-link
>
</template>
</gl-sprintf>
</gl-alert>
<integrations-list
v-else
:integrations="integrations.list"
:loading="loading"
@edit-integration="editIntegration"
......@@ -348,7 +312,6 @@ export default {
<alert-settings-form
:loading="isUpdating"
:can-add-integration="canAddIntegration"
:can-manage-opsgenie="canManageOpsgenie"
@create-new-integration="createNewIntegration"
@update-integration="updateIntegration"
@reset-token="resetToken"
......
......@@ -40,22 +40,15 @@ export const i18n = {
integration: s__('AlertSettings|Integration'),
};
// TODO: Delete as part of old form removal in 13.6
export const integrationTypes = [
{ value: '', text: s__('AlertSettings|Select integration type') },
{ value: 'HTTP', text: s__('AlertSettings|HTTP Endpoint') },
{ value: 'PROMETHEUS', text: s__('AlertSettings|External Prometheus') },
{ value: 'OPSGENIE', text: s__('AlertSettings|Opsgenie') },
];
export const integrationTypesNew = [
{ value: '', text: s__('AlertSettings|Select integration type') },
...integrationTypes,
];
export const typeSet = {
http: 'HTTP',
prometheus: 'PROMETHEUS',
opsgenie: 'OPSGENIE',
};
export const integrationToDeleteDefault = { id: null, name: '' };
......@@ -63,7 +56,6 @@ export const integrationToDeleteDefault = { id: null, name: '' };
export const JSON_VALIDATE_DELAY = 250;
export const targetPrometheusUrlPlaceholder = 'http://prometheus.example.com/';
export const targetOpsgenieUrlPlaceholder = 'https://app.opsgenie.com/alert/list/';
export const sectionHash = 'js-alert-management-settings';
......
......@@ -29,10 +29,6 @@ export default (el) => {
formPath,
authorizationKey,
url,
opsgenieMvcAvailable,
opsgenieMvcFormPath,
opsgenieMvcEnabled,
opsgenieMvcTargetUrl,
projectPath,
multiIntegrations,
} = el.dataset;
......@@ -56,12 +52,6 @@ export default (el) => {
token: authorizationKey,
url,
},
opsgenie: {
formPath: opsgenieMvcFormPath,
active: parseBoolean(opsgenieMvcEnabled),
opsgenieMvcTargetUrl,
opsgenieMvcIsAvailable: parseBoolean(opsgenieMvcAvailable),
},
projectPath,
multiIntegrations: parseBoolean(multiIntegrations),
},
......
---
title: 'Refactor(opsgenie): remove Opsgenie integration frontend code from Incident
management'
merge_request: 50525
author:
type: deprecated
......@@ -168,7 +168,7 @@ If the existing alert is already `resolved`, GitLab creates a new alert instead.
![Alert Management List](img/alert_list_v13_1.png)
## Link to your Opsgenie Alerts
## Link to your Opsgenie Alerts (depreciated)
WARNING:
We are building deeper integration with Opsgenie and other alerting tools through
......@@ -176,6 +176,10 @@ We are building deeper integration with Opsgenie and other alerting tools throug
the GitLab interface. As a result, the previous direct link to Opsgenie Alerts from
the GitLab alerts list is scheduled for deprecation following the 13.7 release on December 22, 2020.
NOTE:
This feature has been deprecated in
[13.8](https://gitlab.com/gitlab-org/gitlab/-/issues/273657).
> [Introduced](https://gitlab.com/groups/gitlab-org/-/epics/3066) in [GitLab Premium](https://about.gitlab.com/pricing/) 13.2.
You can monitor alerts using a GitLab integration with [Opsgenie](https://www.atlassian.com/software/opsgenie).
......
......@@ -2502,9 +2502,6 @@ msgstr ""
msgid "AlertManagement|Open"
msgstr ""
msgid "AlertManagement|Opsgenie is enabled"
msgstr ""
msgid "AlertManagement|Please try again."
msgstr ""
......@@ -2568,15 +2565,9 @@ msgstr ""
msgid "AlertManagement|Value"
msgstr ""
msgid "AlertManagement|View alerts in Opsgenie"
msgstr ""
msgid "AlertManagement|View incident"
msgstr ""
msgid "AlertManagement|You have enabled the Opsgenie integration. Your alerts will be visible directly in Opsgenie."
msgstr ""
msgid "AlertMappingBuilder|Define fallback"
msgstr ""
......@@ -2604,9 +2595,6 @@ msgstr ""
msgid "AlertSettings|1. Select integration type"
msgstr ""
msgid "AlertSettings|2. Add link to your Opsgenie alert list"
msgstr ""
msgid "AlertSettings|2. Name integration"
msgstr ""
......@@ -2676,9 +2664,6 @@ msgstr ""
msgid "AlertSettings|Learn more about our our upcoming %{linkStart}integrations%{linkEnd}"
msgstr ""
msgid "AlertSettings|Opsgenie"
msgstr ""
msgid "AlertSettings|Proceed with editing"
msgstr ""
......@@ -2748,12 +2733,6 @@ msgstr ""
msgid "AlertSettings|Utilize the URL and authorization key below to authorize an external service to send alerts to GitLab. Review your external service's documentation to learn where to add these details, and the %{linkStart}GitLab documentation%{linkEnd} to learn more about configuring your endpoint."
msgstr ""
msgid "AlertSettings|Utilizing this option will link the GitLab Alerts navigation item to your existing Opsgenie instance. By selecting this option, you cannot receive alerts from any other source in GitLab; it will effectively be turning Alerts within GitLab off as a feature."
msgstr ""
msgid "AlertSettings|We will soon be introducing the ability to create multiple unique HTTP endpoints. When this functionality is live, you will be able to configure an integration with Opsgenie to surface Opsgenie alerts in GitLab. This will replace the current Opsgenie integration which will be deprecated. %{linkStart}More Information%{linkEnd}"
msgstr ""
msgid "AlertSettings|Webhook URL"
msgstr ""
......
......@@ -31,17 +31,5 @@ describe('AlertManagementEmptyState', () => {
it('shows empty state', () => {
expect(EmptyState().exists()).toBe(true);
});
it('show OpsGenie integration state when OpsGenie mcv is true', () => {
mountComponent({
provide: {
alertManagementEnabled: false,
userCanEnableAlertManagement: false,
opsgenieMvcEnabled: true,
opsgenieMvcTargetUrl: 'https://opsgenie-url.com',
},
});
expect(EmptyState().props('title')).toBe('Opsgenie is enabled');
});
});
});
......@@ -7,7 +7,5 @@
"populatingAlertsHelpUrl": "/link",
"emptyAlertSvgPath": "/link",
"alertManagementEnabled": false,
"userCanEnableAlertManagement": false,
"opsgenieMvcTargetUrl": "/link",
"opsgenieMvcEnabled": false
"userCanEnableAlertManagement": false
}
\ No newline at end of file
......@@ -4,11 +4,10 @@ exports[`AlertsSettingsFormNew with default values renders the initial template
"<form class=\\"gl-mt-6\\">
<h5 class=\\"gl-font-lg gl-my-5\\">Add new integrations</h5>
<div id=\\"integration-type\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"integration-type__BV_label_\\" for=\\"integration-type\\" class=\\"d-block col-form-label\\">1. Select integration type</label>
<div class=\\"bv-no-focus-ring\\"><select class=\\"gl-form-select custom-select\\" id=\\"__BVID__8\\">
<div class=\\"bv-no-focus-ring\\"><select class=\\"gl-form-select mw-100 custom-select\\" id=\\"__BVID__8\\">
<option value=\\"\\">Select integration type</option>
<option value=\\"HTTP\\">HTTP Endpoint</option>
<option value=\\"PROMETHEUS\\">External Prometheus</option>
<option value=\\"OPSGENIE\\">Opsgenie</option>
</select>
<!---->
<!---->
......
......@@ -28,7 +28,6 @@ describe('AlertsSettingsFormNew', () => {
propsData: {
loading: false,
canAddIntegration: true,
canManageOpsgenie: true,
...props,
},
provide: {
......
......@@ -4,7 +4,7 @@ import AxiosMockAdapter from 'axios-mock-adapter';
import createMockApollo from 'jest/helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import { useMockIntersectionObserver } from 'helpers/mock_dom_observer';
import { GlLoadingIcon, GlAlert } from '@gitlab/ui';
import { GlLoadingIcon } from '@gitlab/ui';
import axios from '~/lib/utils/axios_utils';
import AlertsSettingsWrapper from '~/alerts_settings/components/alerts_settings_wrapper.vue';
import AlertsSettingsForm from '~/alerts_settings/components/alerts_settings_form.vue';
......@@ -376,17 +376,4 @@ describe('AlertsSettingsWrapper', () => {
});
});
});
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
describe('Opsgenie integration', () => {
it.each([true, false])('it shows/hides the alert when opsgenie is %s', (active) => {
createComponent({
data: { integrations: { list: mockIntegrations }, currentIntegration: mockIntegrations[0] },
provide: { opsgenie: { active } },
loading: false,
});
expect(wrapper.find(GlAlert).exists()).toBe(active);
});
});
});
......@@ -19,12 +19,6 @@ export const defaultAlertSettingsConfig = {
url: PROMETHEUS_URL,
active: ACTIVE,
},
opsgenie: {
opsgenieMvcIsAvailable: true,
formPath: INVALID_URL,
active: ACTIVE,
opsgenieMvcTargetUrl: GENERIC_URL,
},
projectPath: '',
multiIntegrations: true,
};
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment