Commit 23a272fb authored by Emily Ring's avatar Emily Ring

Refactor mr_widget_terraform_plan to use GitLab UI

Uses GlLink and removed a tag
Only uses GlIcon
parent bf241b1d
<script> <script>
import { __ } from '~/locale'; import { __ } from '~/locale';
import { GlIcon, GlLoadingIcon, GlSprintf } from '@gitlab/ui'; import { GlIcon, GlLink, GlLoadingIcon, GlSprintf } from '@gitlab/ui';
import axios from '~/lib/utils/axios_utils'; import axios from '~/lib/utils/axios_utils';
import CiIcon from '../../vue_shared/components/ci_icon.vue';
import flash from '~/flash'; import flash from '~/flash';
import Poll from '~/lib/utils/poll'; import Poll from '~/lib/utils/poll';
export default { export default {
name: 'MRWidgetTerraformPlan', name: 'MRWidgetTerraformPlan',
components: { components: {
CiIcon,
GlIcon, GlIcon,
GlLink,
GlLoadingIcon, GlLoadingIcon,
GlSprintf, GlSprintf,
}, },
...@@ -36,12 +35,6 @@ export default { ...@@ -36,12 +35,6 @@ export default {
deleteNum() { deleteNum() {
return Number(this.plan.delete); return Number(this.plan.delete);
}, },
iconStatusObj() {
return {
group: 'warning',
icon: 'status_warning',
};
},
logUrl() { logUrl() {
return this.plan.job_path; return this.plan.job_path;
}, },
...@@ -90,7 +83,7 @@ export default { ...@@ -90,7 +83,7 @@ export default {
<section class="mr-widget-section"> <section class="mr-widget-section">
<div class="mr-widget-body media d-flex flex-row"> <div class="mr-widget-body media d-flex flex-row">
<span class="append-right-default align-self-start align-self-lg-center"> <span class="append-right-default align-self-start align-self-lg-center">
<ci-icon :status="iconStatusObj" :size="24" /> <gl-icon name="status_warning" :size="24" />
</span> </span>
<div class="d-flex flex-fill flex-column flex-md-row"> <div class="d-flex flex-fill flex-column flex-md-row">
...@@ -125,7 +118,7 @@ export default { ...@@ -125,7 +118,7 @@ export default {
</div> </div>
<div class="terraform-mr-plan-actions"> <div class="terraform-mr-plan-actions">
<a <gl-link
v-if="logUrl" v-if="logUrl"
:href="logUrl" :href="logUrl"
target="_blank" target="_blank"
...@@ -137,7 +130,7 @@ export default { ...@@ -137,7 +130,7 @@ export default {
> >
{{ __('View full log') }} {{ __('View full log') }}
<gl-icon name="external-link" /> <gl-icon name="external-link" />
</a> </gl-link>
</div> </div>
</div> </div>
</div> </div>
......
import { GlLoadingIcon, GlSprintf } from '@gitlab/ui'; import { GlLink, GlLoadingIcon, GlSprintf } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import axios from '~/lib/utils/axios_utils'; import axios from '~/lib/utils/axios_utils';
import MockAdapter from 'axios-mock-adapter'; import MockAdapter from 'axios-mock-adapter';
...@@ -80,7 +80,7 @@ describe('MrWidgetTerraformPlan', () => { ...@@ -80,7 +80,7 @@ describe('MrWidgetTerraformPlan', () => {
}); });
it('renders button when url is found', () => { it('renders button when url is found', () => {
expect(wrapper.find('a').text()).toContain('View full log'); expect(wrapper.find(GlLink).exists()).toBe(true);
}); });
it('does not make additional requests after poll is successful', () => { it('does not make additional requests after poll is successful', () => {
...@@ -101,7 +101,7 @@ describe('MrWidgetTerraformPlan', () => { ...@@ -101,7 +101,7 @@ describe('MrWidgetTerraformPlan', () => {
); );
expect(wrapper.find('.js-terraform-report-link').exists()).toBe(false); expect(wrapper.find('.js-terraform-report-link').exists()).toBe(false);
expect(wrapper.text()).not.toContain('View full log'); expect(wrapper.find(GlLink).exists()).toBe(false);
}); });
}); });
}); });
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