Commit 30d292ef authored by Jiaan Louw's avatar Jiaan Louw Committed by Phil Hughes

Show the MR details for a merge request violation

parent 8fcd20a6
......@@ -3,8 +3,8 @@ import { GlAlert, GlLoadingIcon, GlTable } from '@gitlab/ui';
import * as Sentry from '@sentry/browser';
import { __ } from '~/locale';
import { thWidthClass } from '~/lib/utils/table_utility';
import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
import complianceViolationsQuery from '../graphql/compliance_violations.query.graphql';
import { mapResponse } from '../graphql/mappers';
import EmptyState from './empty_state.vue';
import MergeCommitsExportButton from './merge_requests/merge_commits_export_button.vue';
import ViolationReason from './violations/reason.vue';
......@@ -18,6 +18,7 @@ export default {
GlTable,
MergeCommitsExportButton,
ViolationReason,
TimeAgoTooltip,
},
props: {
emptyStateSvgPath: {
......@@ -45,7 +46,7 @@ export default {
};
},
update(data) {
return mapResponse(data?.group?.mergeRequestViolations?.nodes || []);
return data?.group?.mergeRequestViolations?.nodes;
},
error(e) {
Sentry.captureException(e);
......@@ -73,12 +74,12 @@ export default {
{
key: 'reason',
label: __('Violation'),
thClass: thWidthClass(25),
thClass: thWidthClass(15),
},
{
key: 'mergeRequest',
label: __('Merge request'),
thClass: thWidthClass(30),
thClass: thWidthClass(40),
},
{
key: 'mergedAt',
......@@ -128,6 +129,12 @@ export default {
<template #cell(reason)="{ item: { reason, violatingUser } }">
<violation-reason :reason="reason" :user="violatingUser" />
</template>
<template #cell(mergeRequest)="{ item: { mergeRequest } }">
{{ mergeRequest.title }}
</template>
<template #cell(mergedAt)="{ item: { mergeRequest } }">
<time-ago-tooltip :time="mergeRequest.mergedAt" />
</template>
</gl-table>
<empty-state v-else :image-path="emptyStateSvgPath" />
</section>
......
export const mapResponse = (response) => {
return response.map((item) => {
return {
...item,
mergedAt: item.mergeRequest.mergedAt,
};
});
};
import { mapResponse } from 'ee/compliance_dashboard/graphql/mappers';
describe('Mappers', () => {
describe('mapResponse', () => {
it('returns an empty array if it receives one', () => {
expect(mapResponse([])).toStrictEqual([]);
});
it('returns the correct array if it receives data', () => {
expect(mapResponse([{ mergeRequest: { mergedAt: '1970-01-01' } }])).toStrictEqual([
{ mergeRequest: { mergedAt: '1970-01-01' }, mergedAt: '1970-01-01' },
]);
});
});
});
......@@ -10,6 +10,7 @@ import ViolationReason from 'ee/compliance_dashboard/components/violations/reaso
import resolvers from 'ee/compliance_dashboard/graphql/resolvers';
import waitForPromises from 'helpers/wait_for_promises';
import createMockApollo from 'helpers/mock_apollo_helper';
import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
Vue.use(VueApollo);
......@@ -27,6 +28,7 @@ describe('ComplianceReport component', () => {
const findEmptyState = () => wrapper.findComponent(EmptyState);
const findMergeCommitsExportButton = () => wrapper.findComponent(MergeCommitsExportButton);
const findViolationReason = () => wrapper.findComponent(ViolationReason);
const findTimeAgoTooltip = () => wrapper.findComponent(TimeAgoTooltip);
const findTableHeaders = () => findViolationsTable().findAll('th');
const findTablesFirstRowData = () =>
......@@ -112,15 +114,14 @@ describe('ComplianceReport component', () => {
// Note: This should be refactored as each table component is created
// Severity: https://gitlab.com/gitlab-org/gitlab/-/issues/342900
// Merge request and date merged: https://gitlab.com/gitlab-org/gitlab/-/issues/342902
it('has the correct first row data', () => {
const headerTexts = findTablesFirstRowData().wrappers.map((d) => d.text());
expect(headerTexts).toEqual([
'1',
'Approved by committer',
expect.anything(),
'2021-11-25T11:56:52.215Z',
'Officiis architecto voluptas ut sit qui qui quisquam sequi consectetur porro.',
'in 1 year',
]);
});
......@@ -135,6 +136,14 @@ describe('ComplianceReport component', () => {
user,
});
});
it('renders the time ago tooltip', () => {
const {
mergeRequest: { mergedAt },
} = mockResolver().mergeRequestViolations.nodes[0];
expect(findTimeAgoTooltip().props('time')).toBe(mergedAt);
});
});
describe('when there are no violations', () => {
......
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