debian-mirror-gitlab/app/assets/javascripts/repository/components/last_commit.vue

194 lines
5.4 KiB
Vue
Raw Normal View History

2019-09-30 21:07:59 +05:30
<script>
import { GlTooltipDirective, GlLink, GlButton, GlLoadingIcon } from '@gitlab/ui';
2019-12-26 22:10:19 +05:30
import defaultAvatarUrl from 'images/no_avatar.png';
2019-09-30 21:07:59 +05:30
import { sprintf, s__ } from '~/locale';
import Icon from '../../vue_shared/components/icon.vue';
import UserAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
import TimeagoTooltip from '../../vue_shared/components/time_ago_tooltip.vue';
import CiIcon from '../../vue_shared/components/ci_icon.vue';
import ClipboardButton from '../../vue_shared/components/clipboard_button.vue';
import getRefMixin from '../mixins/get_ref';
import getProjectPath from '../queries/getProjectPath.query.graphql';
import pathLastCommit from '../queries/pathLastCommit.query.graphql';
export default {
components: {
Icon,
UserAvatarLink,
TimeagoTooltip,
ClipboardButton,
CiIcon,
GlLink,
GlButton,
GlLoadingIcon,
},
directives: {
GlTooltip: GlTooltipDirective,
},
mixins: [getRefMixin],
apollo: {
projectPath: {
query: getProjectPath,
},
commit: {
query: pathLastCommit,
variables() {
return {
projectPath: this.projectPath,
ref: this.ref,
path: this.currentPath.replace(/^\//, ''),
};
},
2019-12-26 22:10:19 +05:30
update: data => {
2020-03-13 15:44:24 +05:30
const pipelines = data.project?.repository?.tree?.lastCommit?.pipelines?.edges;
2019-12-26 22:10:19 +05:30
return {
2020-03-13 15:44:24 +05:30
...data.project?.repository?.tree?.lastCommit,
pipeline: pipelines?.length && pipelines[0].node,
2019-12-26 22:10:19 +05:30
};
},
2019-09-30 21:07:59 +05:30
context: {
isSingleRequest: true,
},
2020-03-13 15:44:24 +05:30
error(error) {
throw error;
},
2019-09-30 21:07:59 +05:30
},
},
props: {
currentPath: {
type: String,
required: false,
default: '',
},
},
data() {
return {
projectPath: '',
2020-03-13 15:44:24 +05:30
commit: null,
2019-09-30 21:07:59 +05:30
showDescription: false,
};
},
computed: {
statusTitle() {
return sprintf(s__('Commits|Commit: %{commitText}'), {
2019-12-26 22:10:19 +05:30
commitText: this.commit.pipeline.detailedStatus.text,
2019-09-30 21:07:59 +05:30
});
},
isLoading() {
return this.$apollo.queries.commit.loading;
},
showCommitId() {
2020-03-13 15:44:24 +05:30
return this.commit?.sha?.substr(0, 8);
},
},
watch: {
currentPath() {
this.commit = null;
2019-09-30 21:07:59 +05:30
},
},
methods: {
toggleShowDescription() {
this.showDescription = !this.showDescription;
},
},
2019-12-26 22:10:19 +05:30
defaultAvatarUrl,
2019-09-30 21:07:59 +05:30
};
</script>
<template>
<div class="info-well d-none d-sm-flex project-last-commit commit p-3">
2020-03-13 15:44:24 +05:30
<gl-loading-icon v-if="isLoading" size="md" color="dark" class="m-auto" />
<template v-else-if="commit">
2019-09-30 21:07:59 +05:30
<user-avatar-link
v-if="commit.author"
:link-href="commit.author.webUrl"
:img-src="commit.author.avatarUrl"
:img-size="40"
class="avatar-cell"
/>
2019-12-26 22:10:19 +05:30
<span v-else class="avatar-cell user-avatar-link">
2020-03-13 15:44:24 +05:30
<img
:src="commit.authorGravatar || $options.defaultAvatarUrl"
width="40"
height="40"
class="avatar s40"
/>
2019-12-26 22:10:19 +05:30
</span>
2019-09-30 21:07:59 +05:30
<div class="commit-detail flex-list">
<div class="commit-content qa-commit-content">
2020-03-13 15:44:24 +05:30
<gl-link
:href="commit.webUrl"
:class="{ 'font-italic': !commit.message }"
class="commit-row-message item-title"
>
2019-09-30 21:07:59 +05:30
{{ commit.title }}
</gl-link>
<gl-button
v-if="commit.description"
:class="{ open: showDescription }"
:aria-label="__('Show commit description')"
class="text-expander"
@click="toggleShowDescription"
>
2019-12-26 22:10:19 +05:30
<icon name="ellipsis_h" :size="10" />
2019-09-30 21:07:59 +05:30
</gl-button>
<div class="committer">
<gl-link
v-if="commit.author"
:href="commit.author.webUrl"
class="commit-author-link js-user-link"
>
{{ commit.author.name }}
</gl-link>
2019-12-26 22:10:19 +05:30
<template v-else>
{{ commit.authorName }}
</template>
2019-12-21 20:55:43 +05:30
{{ s__('LastCommit|authored') }}
2019-09-30 21:07:59 +05:30
<timeago-tooltip :time="commit.authoredDate" tooltip-placement="bottom" />
</div>
<pre
v-if="commit.description"
2019-12-26 22:10:19 +05:30
:class="{ 'd-block': showDescription }"
2019-09-30 21:07:59 +05:30
class="commit-row-description append-bottom-8"
2020-03-13 15:44:24 +05:30
>{{ commit.description }}</pre
2019-09-30 21:07:59 +05:30
>
</div>
<div class="commit-actions flex-row">
2019-12-21 20:55:43 +05:30
<div v-if="commit.signatureHtml" v-html="commit.signatureHtml"></div>
2019-12-26 22:10:19 +05:30
<div v-if="commit.pipeline" class="ci-status-link">
<gl-link
v-gl-tooltip.left
:href="commit.pipeline.detailedStatus.detailsPath"
:title="statusTitle"
class="js-commit-pipeline"
>
<ci-icon
:status="commit.pipeline.detailedStatus"
:size="24"
:aria-label="statusTitle"
/>
</gl-link>
</div>
2019-09-30 21:07:59 +05:30
<div class="commit-sha-group d-flex">
<div class="label label-monospace monospace">
{{ showCommitId }}
</div>
<clipboard-button
:text="commit.sha"
2019-12-21 20:55:43 +05:30
:title="__('Copy commit SHA')"
2019-09-30 21:07:59 +05:30
tooltip-placement="bottom"
/>
</div>
</div>
</div>
</template>
</div>
</template>
2019-12-26 22:10:19 +05:30
<style scoped>
.commit {
min-height: 4.75rem;
}
</style>