Commit 9a44484f authored by Kushal Pandya's avatar Kushal Pandya

Merge branch '268373-test-payload-opsgenie-2' into 'master'

Resolve "Migrate Opsgenie integration to new Integrations UI"

See merge request gitlab-org/gitlab!47192
parents f8320e27 5c5c90cf
......@@ -11,6 +11,7 @@ import {
GlSprintf,
} from '@gitlab/ui';
import { s__, __ } from '~/locale';
import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
import Tracking from '~/tracking';
import { trackAlertIntegrationsViewsOptions, integrationToDeleteDefault } from '../constants';
import getCurrentIntegrationQuery from '../graphql/queries/get_current_integration.query.graphql';
......@@ -48,6 +49,7 @@ export default {
GlTooltip: GlTooltipDirective,
GlModal: GlModalDirective,
},
mixins: [glFeatureFlagsMixin()],
props: {
integrations: {
type: Array,
......@@ -96,7 +98,7 @@ export default {
tbodyTrClass(item) {
return {
[bodyTrClass]: this.integrations.length,
'gl-bg-blue-50': item?.id === this.currentIntegration?.id,
'gl-bg-blue-50': (item !== null && item.id) === this.currentIntegration?.id,
};
},
trackPageViews() {
......@@ -150,7 +152,7 @@ export default {
</template>
<template #cell(actions)="{ item }">
<gl-button-group>
<gl-button-group v-if="glFeatures.httpIntegrationsList">
<gl-button icon="pencil" @click="$emit('edit-integration', { id: item.id })" />
<gl-button
v-gl-modal.deleteIntegration
......
<script>
import { GlAlert, GlLink, GlSprintf } from '@gitlab/ui';
import { s__ } from '~/locale';
import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
import { fetchPolicies } from '~/lib/graphql';
......@@ -38,6 +39,10 @@ export default {
integrationRemoved: s__('AlertsIntegrations|The integration has been successfully removed.'),
},
components: {
// TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
GlAlert,
GlLink,
GlSprintf,
IntegrationsList,
SettingsFormOld,
SettingsFormNew,
......@@ -50,6 +55,10 @@ 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: '',
},
......@@ -274,7 +283,27 @@ 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="glFeatures.httpIntegrationsList ? integrations.list : integrationsOptionsOld"
:loading="loading"
@edit-integration="editIntegration"
......
......@@ -55,6 +55,7 @@ export const integrationTypesNew = [
export const typeSet = {
http: 'HTTP',
prometheus: 'PROMETHEUS',
opsgenie: 'OPSGENIE',
};
export const integrationToDeleteDefault = { id: null, name: '' };
......
......@@ -2508,6 +2508,9 @@ 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 ""
......@@ -2643,6 +2646,12 @@ msgstr ""
msgid "AlertSettings|Utilize the URL and authorization key below to authorize an external service to send Alerts to GitLab. Review your chosen services 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 exisiting Opsgenie instance. By selecting this option, you cannot recieve alerts from any other source in GitLab; it will effectivley be turing 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 ""
......
......@@ -33,6 +33,9 @@ describe('AlertIntegrationsList', () => {
integrations: mockIntegrations,
...props,
},
provide: {
glFeatures: { httpIntegrationsList: true },
},
stubs: {
GlIcon: true,
GlButton: true,
......
......@@ -27,6 +27,7 @@ describe('AlertsSettingsFormNew', () => {
propsData: {
loading: false,
canAddIntegration: true,
canManageOpsgenie: true,
...props,
},
provide: {
......
......@@ -2,7 +2,7 @@ import VueApollo from 'vue-apollo';
import { mount, createLocalVue } from '@vue/test-utils';
import createMockApollo from 'jest/helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import { GlLoadingIcon } from '@gitlab/ui';
import { GlLoadingIcon, GlAlert } from '@gitlab/ui';
import AlertsSettingsWrapper from '~/alerts_settings/components/alerts_settings_wrapper.vue';
import AlertsSettingsFormOld from '~/alerts_settings/components/alerts_settings_form_old.vue';
import AlertsSettingsFormNew from '~/alerts_settings/components/alerts_settings_form_new.vue';
......@@ -21,6 +21,7 @@ import {
RESET_INTEGRATION_TOKEN_ERROR,
UPDATE_INTEGRATION_ERROR,
INTEGRATION_PAYLOAD_TEST_ERROR,
DELETE_INTEGRATION_ERROR,
} from '~/alerts_settings/utils/error_messages';
import createFlash from '~/flash';
import { defaultAlertSettingsConfig } from './util';
......@@ -59,6 +60,12 @@ describe('AlertsSettingsWrapper', () => {
.vm.$emit('delete-integration', { id: integrationToDestroy.id });
}
async function awaitApolloDomMock() {
await wrapper.vm.$nextTick(); // kick off the DOM update
await jest.runOnlyPendingTimers(); // kick off the mocked GQL stuff (promises)
await wrapper.vm.$nextTick(); // kick off the DOM update for flash
}
const createComponent = ({ data = {}, provide = {}, loading = false } = {}) => {
wrapper = mount(AlertsSettingsWrapper, {
data() {
......@@ -372,12 +379,35 @@ describe('AlertsSettingsWrapper', () => {
});
await destroyHttpIntegration(wrapper);
await wrapper.vm.$nextTick(); // kick off the DOM update
await jest.runOnlyPendingTimers(); // kick off the mocked GQL stuff (promises)
await wrapper.vm.$nextTick(); // kick off the DOM update for flash
await awaitApolloDomMock();
expect(createFlash).toHaveBeenCalledWith({ message: 'Houston, we have a problem' });
});
it('displays flash if mutation had a non-recoverable error', async () => {
createComponentWithApollo({
destroyHandler: jest.fn().mockRejectedValue('Error'),
});
await destroyHttpIntegration(wrapper);
await awaitApolloDomMock();
expect(createFlash).toHaveBeenCalledWith({
message: DELETE_INTEGRATION_ERROR,
});
});
});
// 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: { glFeatures: { httpIntegrationsList: true }, opsgenie: { active } },
loading: false,
});
expect(wrapper.find(GlAlert).exists()).toBe(active);
});
});
});
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