debian-mirror-gitlab/app/assets/javascripts/notes/components/diff_discussion_header.vue

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

135 lines
4 KiB
Vue
Raw Normal View History

2019-12-26 22:10:19 +05:30
<script>
2022-08-27 11:52:29 +05:30
import { GlSafeHtmlDirective as SafeHtml, GlAvatar, GlAvatarLink } from '@gitlab/ui';
2021-03-11 19:13:27 +05:30
import { escape } from 'lodash';
import { mapActions } from 'vuex';
2019-12-26 22:10:19 +05:30
import { truncateSha } from '~/lib/utils/text_utility';
2021-03-11 19:13:27 +05:30
import { s__, __, sprintf } from '~/locale';
2022-10-11 01:57:18 +05:30
import NoteEditedText from './note_edited_text.vue';
import NoteHeader from './note_header.vue';
2019-12-26 22:10:19 +05:30
export default {
name: 'DiffDiscussionHeader',
components: {
2022-08-27 11:52:29 +05:30
GlAvatar,
GlAvatarLink,
2022-10-11 01:57:18 +05:30
NoteEditedText,
NoteHeader,
2019-12-26 22:10:19 +05:30
},
2021-01-03 14:25:43 +05:30
directives: {
SafeHtml,
},
2019-12-26 22:10:19 +05:30
props: {
discussion: {
type: Object,
required: true,
},
},
computed: {
notes() {
return this.discussion.notes;
},
firstNote() {
return this.notes[0];
},
lastNote() {
return this.notes[this.notes.length - 1];
},
author() {
return this.firstNote.author;
},
resolvedText() {
return this.discussion.resolved_by_push ? __('Automatically resolved') : __('Resolved');
},
lastUpdatedBy() {
return this.notes.length > 1 ? this.lastNote.author : null;
},
lastUpdatedAt() {
return this.notes.length > 1 ? this.lastNote.created_at : null;
},
headerText() {
2020-03-13 15:44:24 +05:30
const linkStart = `<a href="${escape(this.discussion.discussion_path)}">`;
2019-12-26 22:10:19 +05:30
const linkEnd = '</a>';
const { commit_id: commitId } = this.discussion;
let commitDisplay = commitId;
if (commitId) {
commitDisplay = `<span class="commit-sha">${truncateSha(commitId)}</span>`;
}
const {
for_commit: isForCommit,
diff_discussion: isDiffDiscussion,
active: isActive,
} = this.discussion;
let text = s__('MergeRequests|started a thread');
if (isForCommit) {
text = s__(
'MergeRequests|started a thread on commit %{linkStart}%{commitDisplay}%{linkEnd}',
);
} else if (isDiffDiscussion && commitId) {
text = isActive
? s__('MergeRequests|started a thread on commit %{linkStart}%{commitDisplay}%{linkEnd}')
: s__(
'MergeRequests|started a thread on an outdated change in commit %{linkStart}%{commitDisplay}%{linkEnd}',
);
} else if (isDiffDiscussion) {
text = isActive
? s__('MergeRequests|started a thread on %{linkStart}the diff%{linkEnd}')
: s__(
'MergeRequests|started a thread on %{linkStart}an old version of the diff%{linkEnd}',
);
}
return sprintf(text, { commitDisplay, linkStart, linkEnd }, false);
},
2022-11-25 23:54:43 +05:30
toggleClass() {
return this.discussion.expanded ? 'expanded' : 'collapsed';
2022-08-27 11:52:29 +05:30
},
2019-12-26 22:10:19 +05:30
},
methods: {
...mapActions(['toggleDiscussion']),
toggleDiscussionHandler() {
this.toggleDiscussion({ discussionId: this.discussion.id });
},
},
};
</script>
<template>
2022-11-25 23:54:43 +05:30
<div class="discussion-header gl-display-flex gl-align-items-center">
<div v-once class="timeline-avatar gl-align-self-start gl-flex-shrink-0 gl-flex-shrink">
2022-08-27 11:52:29 +05:30
<gl-avatar-link v-if="author" :href="author.path">
2022-11-25 23:54:43 +05:30
<gl-avatar :src="author.avatar_url" :alt="author.name" :size="32" />
2022-08-27 11:52:29 +05:30
</gl-avatar-link>
2019-12-26 22:10:19 +05:30
</div>
2022-11-25 23:54:43 +05:30
<div class="timeline-content w-100 gl-ml-3" :class="toggleClass">
2019-12-26 22:10:19 +05:30
<note-header
:author="author"
:created-at="firstNote.created_at"
:note-id="firstNote.id"
:include-toggle="true"
:expanded="discussion.expanded"
@toggleHandler="toggleDiscussionHandler"
>
2021-01-03 14:25:43 +05:30
<span v-safe-html="headerText"></span>
2019-12-26 22:10:19 +05:30
</note-header>
<note-edited-text
v-if="discussion.resolved"
:edited-at="discussion.resolved_at"
:edited-by="discussion.resolved_by"
:action-text="resolvedText"
2022-11-25 23:54:43 +05:30
class-name="discussion-headline-light js-discussion-headline gl-pl-3"
2019-12-26 22:10:19 +05:30
/>
<note-edited-text
v-else-if="lastUpdatedAt"
:edited-at="lastUpdatedAt"
:edited-by="lastUpdatedBy"
:action-text="__('Last updated')"
2022-11-25 23:54:43 +05:30
class-name="discussion-headline-light js-discussion-headline gl-pl-3"
2019-12-26 22:10:19 +05:30
/>
</div>
</div>
</template>