Commit 15f1952e authored by Phil Hughes's avatar Phil Hughes

Merge branch '53535-sticky-archived' into 'master'

Renders a warning block for archived job

Closes #53535

See merge request gitlab-org/gitlab-ce!22811
parents 3301876b 26e88b10
......@@ -3,9 +3,11 @@ import _ from 'underscore';
import { mapGetters, mapState, mapActions } from 'vuex';
import { GlLoadingIcon } from '@gitlab-org/gitlab-ui';
import { isScrolledToBottom } from '~/lib/utils/scroll_utils';
import { polyfillSticky } from '~/lib/utils/sticky';
import bp from '~/breakpoints';
import CiHeader from '~/vue_shared/components/header_ci_component.vue';
import Callout from '~/vue_shared/components/callout.vue';
import Icon from '~/vue_shared/components/icon.vue';
import createStore from '../store';
import EmptyState from './empty_state.vue';
import EnvironmentsBlock from './environments_block.vue';
......@@ -25,6 +27,7 @@ export default {
EnvironmentsBlock,
ErasedBlock,
GlLoadingIcon,
Icon,
Log,
LogTopBar,
StuckBlock,
......@@ -97,6 +100,14 @@ export default {
if (_.isEmpty(oldVal) && !_.isEmpty(newVal.pipeline)) {
this.fetchStages();
}
if (newVal.archived) {
this.$nextTick(() => {
if (this.$refs.sticky) {
polyfillSticky(this.$refs.sticky);
}
});
}
},
},
created() {
......@@ -114,16 +125,13 @@ export default {
window.addEventListener('resize', this.onResize);
window.addEventListener('scroll', this.updateScroll);
},
mounted() {
this.updateSidebar();
},
destroyed() {
window.removeEventListener('resize', this.onResize);
window.removeEventListener('scroll', this.updateScroll);
},
methods: {
...mapActions([
'setJobEndpoint',
......@@ -218,14 +226,28 @@ export default {
:erased-at="job.erased_at"
/>
<div
v-if="job.archived"
ref="sticky"
class="js-archived-job prepend-top-default archived-sticky sticky-top"
>
<icon
name="lock"
class="align-text-bottom"
/>
{{ __('This job is archived. Only the complete pipeline can be retried.') }}
</div>
<!--job log -->
<div
v-if="hasTrace"
class="build-trace-container prepend-top-default">
class="build-trace-container"
>
<log-top-bar
:class="{
'sidebar-expanded': isSidebarOpen,
'sidebar-collapsed': !isSidebarOpen
'sidebar-collapsed': !isSidebarOpen,
'has-archived-block': job.archived
}"
:erase-path="job.erase_path"
:size="traceSize"
......
......@@ -69,7 +69,7 @@ export default {
};
</script>
<template>
<div class="top-bar affix">
<div class="top-bar">
<!-- truncate information -->
<div class="js-truncated-info truncated-info d-none d-sm-block float-left">
<template v-if="isTraceSizeVisible">
......
......@@ -55,9 +55,29 @@
@include build-trace();
}
.archived-sticky {
top: $header-height;
border-radius: 2px 2px 0 0;
color: $orange-600;
background-color: $orange-100;
border: 1px solid $border-gray-normal;
border-bottom: 0;
padding: 3px 12px;
margin: auto;
align-items: center;
.with-performance-bar & {
top: $header-height + $performance-bar-height;
}
}
.top-bar {
@include build-trace-top-bar(35px);
&.has-archived-block {
top: $header-height + $performance-bar-height + 28px;
}
&.affix {
top: $header-height;
......
---
title: Renders warning info when job is archieved
merge_request:
author:
type: added
......@@ -6230,6 +6230,9 @@ msgstr ""
msgid "This job is an out-of-date deployment to %{environmentLink}. View the most recent deployment %{deploymentLink}."
msgstr ""
msgid "This job is archived. Only the complete pipeline can be retried."
msgstr ""
msgid "This job is creating a deployment to %{environmentLink} and will overwrite the %{deploymentLink}."
msgstr ""
......
......@@ -423,6 +423,40 @@ describe('Job App ', () => {
});
});
describe('archived job', () => {
beforeEach(() => {
mock.onGet(props.endpoint).reply(200, Object.assign({}, job, { archived: true }), {});
vm = mountComponentWithStore(Component, {
props,
store,
});
});
it('renders warning about job being archived', done => {
setTimeout(() => {
expect(vm.$el.querySelector('.js-archived-job ')).not.toBeNull();
done();
}, 0);
});
});
describe('non-archived job', () => {
beforeEach(() => {
mock.onGet(props.endpoint).reply(200, job, {});
vm = mountComponentWithStore(Component, {
props,
store,
});
});
it('does not warning about job being archived', done => {
setTimeout(() => {
expect(vm.$el.querySelector('.js-archived-job ')).toBeNull();
done();
}, 0);
});
});
describe('trace output', () => {
beforeEach(() => {
mock.onGet(props.endpoint).reply(200, job, {});
......
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