Commit 113a6c0e authored by Kushal Pandya's avatar Kushal Pandya

Merge branch...

Merge branch '235471-follow-up-from-improve-productivity-analytics-error-when-query-takes-too-long-to-calculate' into 'master'

Productivity Analytics: Replace bs-callout with GlAlert component

Closes #235471

See merge request gitlab-org/gitlab!39207
parents cf7efbd4 5073e727
<script>
import { isEmpty } from 'lodash';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon, GlAlert } from '@gitlab/ui';
import { s__ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
import httpStatusCodes from '~/lib/utils/http_status';
......@@ -11,6 +11,7 @@ export default {
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlLoadingIcon,
GlAlert,
Icon,
},
props: {
......@@ -88,9 +89,7 @@ export default {
<h5 v-if="title">{{ title }}</h5>
<gl-loading-icon v-if="isLoading" size="md" class="my-4 py-4" />
<template v-else>
<div v-if="infoMessage" data-testid="infoMessage" class="bs-callout bs-callout-info">
{{ infoMessage }}
</div>
<gl-alert v-if="infoMessage" :dismissible="false">{{ infoMessage }}</gl-alert>
<template v-else>
<gl-deprecated-dropdown
v-if="hasMetricTypes"
......
---
title: 'Productivity Analytics: Replace bs-callout with GlAlert component'
merge_request: 39207
author:
type: changed
......@@ -4,14 +4,17 @@ exports[`MetricChart component template when isLoading is false and chart data i
<div>
<!---->
<div
class="bs-callout bs-callout-info"
data-testid="infoMessage"
<gl-alert-stub
dismisslabel="Dismiss"
primarybuttonlink=""
primarybuttontext=""
secondarybuttonlink=""
secondarybuttontext=""
title=""
variant="info"
>
There is no data available. Please change your selection.
</div>
There is no data available. Please change your selection.
</gl-alert-stub>
</div>
`;
......
import { shallowMount } from '@vue/test-utils';
import MetricChart from 'ee/analytics/productivity_analytics/components/metric_chart.vue';
import { GlLoadingIcon, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { GlLoadingIcon, GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlAlert } from '@gitlab/ui';
import Icon from '~/vue_shared/components/icon.vue';
import httpStatusCodes from '~/lib/utils/http_status';
......@@ -38,7 +38,7 @@ describe('MetricChart component', () => {
});
const findLoadingIndicator = () => wrapper.find(GlLoadingIcon);
const findInfoMessage = () => wrapper.find('[data-testid="infoMessage"]');
const findInfoMessage = () => wrapper.find(GlAlert);
const findMetricDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findMetricDropdownItems = () => findMetricDropdown().findAll(GlDeprecatedDropdownItem);
const findChartSlot = () => wrapper.find({ ref: 'chart' });
......@@ -101,7 +101,7 @@ describe('MetricChart component', () => {
describe('and there is no error', () => {
it('shows a "no data" info text', () => {
expect(findInfoMessage().text()).toContain(
expect(findInfoMessage().text()).toBe(
'There is no data available. Please change your selection.',
);
});
......@@ -111,7 +111,7 @@ describe('MetricChart component', () => {
it('shows a "too much data" info text', () => {
factory({ isLoading, chartData: [], errorCode: httpStatusCodes.INTERNAL_SERVER_ERROR });
expect(findInfoMessage().text()).toContain(
expect(findInfoMessage().text()).toBe(
'There is too much data to calculate. Please change your selection.',
);
});
......
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