diff options
author | Phil Hughes <me@iamphill.com> | 2018-08-14 07:45:44 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-08-14 07:45:44 +0000 |
commit | d94fb81497f770b6ebb2e1b7fe1c5413eba5d481 (patch) | |
tree | 1beeda1610ddd285249c183141e9d94acf6fd440 | |
parent | c118ee864032646fa648c9e15d272d03f87d1aaa (diff) | |
parent | c82d61d9bfabbc3829fec6640b6ba4485de73f36 (diff) | |
download | gitlab-ce-d94fb81497f770b6ebb2e1b7fe1c5413eba5d481.tar.gz |
Merge branch '50101-erased-block' into 'master'
Creates a Vue component for the erased block on the job view page
See merge request gitlab-org/gitlab-ce!21158
-rw-r--r-- | app/assets/javascripts/jobs/components/erased_block.vue | 48 | ||||
-rw-r--r-- | changelogs/unreleased/50101-erased-block.yml | 5 | ||||
-rw-r--r-- | locale/gitlab.pot | 6 | ||||
-rw-r--r-- | spec/javascripts/jobs/erased_block_spec.js | 56 |
4 files changed, 115 insertions, 0 deletions
diff --git a/app/assets/javascripts/jobs/components/erased_block.vue b/app/assets/javascripts/jobs/components/erased_block.vue new file mode 100644 index 00000000000..d688eebfa95 --- /dev/null +++ b/app/assets/javascripts/jobs/components/erased_block.vue @@ -0,0 +1,48 @@ +<script> +import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; + +export default { + components: { + TimeagoTooltip, + }, + props: { + erasedByUser: { + type: Boolean, + required: true, + }, + username: { + type: String, + required: false, + default: null, + }, + linkToUser: { + type: String, + required: false, + default: null, + }, + erasedAt: { + type: String, + required: true, + }, + }, +}; +</script> +<template> + <div class="prepend-top-default js-build-erased"> + <div class="erased alert alert-warning"> + <template v-if="erasedByUser"> + {{ s__("Job|Job has been erased by") }} + <a :href="linkToUser"> + {{ username }} + </a> + </template> + <template v-else> + {{ s__("Job|Job has been erased") }} + </template> + + <timeago-tooltip + :time="erasedAt" + /> + </div> + </div> +</template> diff --git a/changelogs/unreleased/50101-erased-block.yml b/changelogs/unreleased/50101-erased-block.yml new file mode 100644 index 00000000000..5a5c9bc0fc4 --- /dev/null +++ b/changelogs/unreleased/50101-erased-block.yml @@ -0,0 +1,5 @@ +--- +title: Creates vue component for erased block on job view +merge_request: +author: +type: other diff --git a/locale/gitlab.pot b/locale/gitlab.pot index e8bf7ae8f0e..cfaec6f430a 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -3133,6 +3133,12 @@ msgstr "" msgid "Jobs" msgstr "" +msgid "Job|Job has been erased" +msgstr "" + +msgid "Job|Job has been erased by" +msgstr "" + msgid "Jul" msgstr "" diff --git a/spec/javascripts/jobs/erased_block_spec.js b/spec/javascripts/jobs/erased_block_spec.js new file mode 100644 index 00000000000..7cf32e984a2 --- /dev/null +++ b/spec/javascripts/jobs/erased_block_spec.js @@ -0,0 +1,56 @@ +import Vue from 'vue'; +import { getTimeago } from '~/lib/utils/datetime_utility'; +import component from '~/jobs/components/erased_block.vue'; +import mountComponent from '../helpers/vue_mount_component_helper'; + +describe('Erased block', () => { + const Component = Vue.extend(component); + let vm; + + const erasedAt = '2016-11-07T11:11:16.525Z'; + const timeago = getTimeago(); + const formatedDate = timeago.format(erasedAt); + + afterEach(() => { + vm.$destroy(); + }); + + describe('with job erased by user', () => { + beforeEach(() => { + vm = mountComponent(Component, { + erasedByUser: true, + username: 'root', + linkToUser: 'gitlab.com/root', + erasedAt, + }); + }); + + it('renders username and link', () => { + expect(vm.$el.querySelector('a').getAttribute('href')).toEqual('gitlab.com/root'); + + expect(vm.$el.textContent).toContain('Job has been erased by'); + expect(vm.$el.textContent).toContain('root'); + }); + + it('renders erasedAt', () => { + expect(vm.$el.textContent).toContain(formatedDate); + }); + }); + + describe('with erased job', () => { + beforeEach(() => { + vm = mountComponent(Component, { + erasedByUser: false, + erasedAt, + }); + }); + + it('renders username and link', () => { + expect(vm.$el.textContent).toContain('Job has been erased'); + }); + + it('renders erasedAt', () => { + expect(vm.$el.textContent).toContain(formatedDate); + }); + }); +}); |