2018-03-20 10:12:48 -04:00
|
|
|
<script>
|
2020-03-18 11:09:45 -04:00
|
|
|
/* eslint-disable @gitlab/vue-require-i18n-strings */
|
2020-10-20 02:09:03 -04:00
|
|
|
import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
|
2021-02-14 13:09:20 -05:00
|
|
|
import { mapActions, mapState, mapGetters } from 'vuex';
|
2018-04-06 13:49:06 -04:00
|
|
|
import timeAgoMixin from '~/vue_shared/mixins/timeago';
|
2022-04-08 08:08:48 -04:00
|
|
|
import CiIcon from '~/vue_shared/components/ci_icon.vue';
|
|
|
|
import userAvatarImage from '~/vue_shared/components/user_avatar/user_avatar_image.vue';
|
2018-07-10 03:33:35 -04:00
|
|
|
import { rightSidebarViews } from '../constants';
|
2021-02-01 10:08:56 -05:00
|
|
|
import IdeStatusList from './ide_status_list.vue';
|
2021-02-14 13:09:20 -05:00
|
|
|
import IdeStatusMr from './ide_status_mr.vue';
|
2018-03-20 10:12:48 -04:00
|
|
|
|
2018-04-06 13:49:06 -04:00
|
|
|
export default {
|
|
|
|
components: {
|
2020-08-24 11:10:11 -04:00
|
|
|
GlIcon,
|
2018-05-07 13:42:56 -04:00
|
|
|
userAvatarImage,
|
2018-05-25 06:08:53 -04:00
|
|
|
CiIcon,
|
2019-06-12 11:58:48 -04:00
|
|
|
IdeStatusList,
|
2020-02-10 13:09:00 -05:00
|
|
|
IdeStatusMr,
|
2018-04-06 13:49:06 -04:00
|
|
|
},
|
|
|
|
directives: {
|
2020-10-20 02:09:03 -04:00
|
|
|
GlTooltip: GlTooltipDirective,
|
2018-04-06 13:49:06 -04:00
|
|
|
},
|
|
|
|
mixins: [timeAgoMixin],
|
2018-05-07 13:42:56 -04:00
|
|
|
data() {
|
|
|
|
return {
|
2019-12-12 04:07:48 -05:00
|
|
|
lastCommitFormattedAge: null,
|
2018-05-07 13:42:56 -04:00
|
|
|
};
|
|
|
|
},
|
|
|
|
computed: {
|
2018-05-25 06:08:53 -04:00
|
|
|
...mapState(['currentBranchId', 'currentProjectId']),
|
2020-02-10 13:09:00 -05:00
|
|
|
...mapGetters(['currentProject', 'lastCommit', 'currentMergeRequest']),
|
2018-05-25 09:13:59 -04:00
|
|
|
...mapState('pipelines', ['latestPipeline']),
|
2018-05-07 13:42:56 -04:00
|
|
|
},
|
2018-05-25 06:08:53 -04:00
|
|
|
watch: {
|
|
|
|
lastCommit() {
|
2018-06-04 07:11:00 -04:00
|
|
|
this.initPipelinePolling();
|
2018-05-25 06:08:53 -04:00
|
|
|
},
|
|
|
|
},
|
2018-05-07 13:42:56 -04:00
|
|
|
mounted() {
|
|
|
|
this.startTimer();
|
|
|
|
},
|
|
|
|
beforeDestroy() {
|
|
|
|
if (this.intervalId) {
|
|
|
|
clearInterval(this.intervalId);
|
|
|
|
}
|
2018-06-04 07:11:00 -04:00
|
|
|
|
|
|
|
this.stopPipelinePolling();
|
2018-05-07 13:42:56 -04:00
|
|
|
},
|
|
|
|
methods: {
|
2018-09-27 17:57:30 -04:00
|
|
|
...mapActions('rightPane', {
|
|
|
|
openRightPane: 'open',
|
|
|
|
}),
|
2018-05-25 09:13:59 -04:00
|
|
|
...mapActions('pipelines', ['fetchLatestPipeline', 'stopPipelinePolling']),
|
2018-05-07 13:42:56 -04:00
|
|
|
startTimer() {
|
|
|
|
this.intervalId = setInterval(() => {
|
|
|
|
this.commitAgeUpdate();
|
|
|
|
}, 1000);
|
|
|
|
},
|
2018-05-25 06:08:53 -04:00
|
|
|
initPipelinePolling() {
|
2018-06-04 07:11:00 -04:00
|
|
|
if (this.lastCommit) {
|
|
|
|
this.fetchLatestPipeline();
|
|
|
|
}
|
2018-05-25 06:08:53 -04:00
|
|
|
},
|
2018-05-07 13:42:56 -04:00
|
|
|
commitAgeUpdate() {
|
|
|
|
if (this.lastCommit) {
|
2019-12-12 04:07:48 -05:00
|
|
|
this.lastCommitFormattedAge = this.timeFormatted(this.lastCommit.committed_date);
|
2018-05-07 13:42:56 -04:00
|
|
|
}
|
|
|
|
},
|
|
|
|
getCommitPath(shortSha) {
|
|
|
|
return `${this.currentProject.web_url}/commit/${shortSha}`;
|
2018-03-20 10:12:48 -04:00
|
|
|
},
|
2018-04-06 13:49:06 -04:00
|
|
|
},
|
2018-07-10 03:33:35 -04:00
|
|
|
rightSidebarViews,
|
2018-04-06 13:49:06 -04:00
|
|
|
};
|
2018-03-20 10:12:48 -04:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2018-05-07 13:42:56 -04:00
|
|
|
<footer class="ide-status-bar">
|
2018-11-16 15:07:38 -05:00
|
|
|
<div v-if="lastCommit" class="ide-status-branch">
|
|
|
|
<span v-if="latestPipeline && latestPipeline.details" class="ide-status-pipeline">
|
2018-07-10 03:33:35 -04:00
|
|
|
<button
|
|
|
|
type="button"
|
2020-02-10 16:09:11 -05:00
|
|
|
class="p-0 border-0 bg-transparent"
|
2019-01-10 16:56:37 -05:00
|
|
|
@click="openRightPane($options.rightSidebarViews.pipelines)"
|
2018-07-10 03:33:35 -04:00
|
|
|
>
|
|
|
|
<ci-icon
|
2020-10-20 02:09:03 -04:00
|
|
|
v-gl-tooltip
|
2018-07-10 03:33:35 -04:00
|
|
|
:status="latestPipeline.details.status"
|
|
|
|
:title="latestPipeline.details.status.text"
|
|
|
|
/>
|
|
|
|
</button>
|
2018-05-25 06:08:53 -04:00
|
|
|
Pipeline
|
2018-11-16 15:07:38 -05:00
|
|
|
<a :href="latestPipeline.details.status.details_path" class="monospace"
|
|
|
|
>#{{ latestPipeline.id }}</a
|
|
|
|
>
|
|
|
|
{{ latestPipeline.details.status.text }} for
|
2018-05-25 06:08:53 -04:00
|
|
|
</span>
|
|
|
|
|
2020-08-24 11:10:11 -04:00
|
|
|
<gl-icon name="commit" />
|
2018-05-07 13:42:56 -04:00
|
|
|
<a
|
2020-10-20 02:09:03 -04:00
|
|
|
v-gl-tooltip
|
2018-05-07 13:42:56 -04:00
|
|
|
:title="lastCommit.message"
|
|
|
|
:href="getCommitPath(lastCommit.short_id)"
|
2018-06-11 05:49:47 -04:00
|
|
|
class="commit-sha"
|
2020-09-09 17:08:33 -04:00
|
|
|
data-qa-selector="commit_sha_content"
|
2018-11-16 15:07:38 -05:00
|
|
|
>{{ lastCommit.short_id }}</a
|
|
|
|
>
|
2019-01-31 03:22:29 -05:00
|
|
|
by
|
|
|
|
<user-avatar-image
|
|
|
|
css-classes="ide-status-avatar"
|
|
|
|
:size="18"
|
|
|
|
:img-src="latestPipeline && latestPipeline.commit.author_gravatar_url"
|
|
|
|
:img-alt="lastCommit.author_name"
|
|
|
|
:tooltip-text="lastCommit.author_name"
|
|
|
|
/>
|
|
|
|
{{ lastCommit.author_name }}
|
2018-05-07 13:42:56 -04:00
|
|
|
<time
|
2020-10-20 02:09:03 -04:00
|
|
|
v-gl-tooltip
|
2018-05-07 13:42:56 -04:00
|
|
|
:datetime="lastCommit.committed_date"
|
|
|
|
:title="tooltipTitle(lastCommit.committed_date)"
|
2018-06-11 05:49:47 -04:00
|
|
|
data-placement="top"
|
|
|
|
data-container="body"
|
2019-12-12 04:07:48 -05:00
|
|
|
>{{ lastCommitFormattedAge }}</time
|
2018-05-07 13:42:56 -04:00
|
|
|
>
|
2018-03-20 10:12:48 -04:00
|
|
|
</div>
|
2020-02-10 13:09:00 -05:00
|
|
|
<ide-status-mr
|
|
|
|
v-if="currentMergeRequest"
|
|
|
|
class="mx-3"
|
|
|
|
:url="currentMergeRequest.web_url"
|
|
|
|
:text="currentMergeRequest.references.short"
|
|
|
|
/>
|
2019-06-12 11:58:48 -04:00
|
|
|
<ide-status-list class="ml-auto" />
|
2018-05-07 13:42:56 -04:00
|
|
|
</footer>
|
2018-03-20 10:12:48 -04:00
|
|
|
</template>
|