diff options
Diffstat (limited to 'app/assets/javascripts/diffs/components')
8 files changed, 186 insertions, 40 deletions
diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue index bfb992340bc..fc41ee4b777 100644 --- a/app/assets/javascripts/diffs/components/app.vue +++ b/app/assets/javascripts/diffs/components/app.vue @@ -9,6 +9,7 @@ import ChangedFiles from './changed_files.vue'; import DiffFile from './diff_file.vue'; import NoChanges from './no_changes.vue'; import HiddenFilesWarning from './hidden_files_warning.vue'; +import CommitWidget from './commit_widget.vue'; export default { name: 'DiffsApp', @@ -19,6 +20,7 @@ export default { DiffFile, NoChanges, HiddenFilesWarning, + CommitWidget, }, props: { endpoint: { @@ -208,6 +210,11 @@ export default { </div> </div> + <commit-widget + v-if="commit" + :commit="commit" + /> + <changed-files :diff-files="diffFiles" /> diff --git a/app/assets/javascripts/diffs/components/commit_item.vue b/app/assets/javascripts/diffs/components/commit_item.vue new file mode 100644 index 00000000000..5758588e82e --- /dev/null +++ b/app/assets/javascripts/diffs/components/commit_item.vue @@ -0,0 +1,119 @@ +<script> +import tooltip from '~/vue_shared/directives/tooltip'; +import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue'; +import Icon from '~/vue_shared/components/icon.vue'; +import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; +import CIIcon from '~/vue_shared/components/ci_icon.vue'; +import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; + +/** + * CommitItem + * + * ----------------------------------------------------------------- + * WARNING: Please keep changes up-to-date with the following files: + * - `views/projects/commits/_commit.html.haml` + * ----------------------------------------------------------------- + * + * This Component was cloned from a HAML view. For the time being they + * coexist, but there is an issue to remove the duplication. + * https://gitlab.com/gitlab-org/gitlab-ce/issues/51613 + * + */ +export default { + directives: { + tooltip, + }, + components: { + UserAvatarLink, + Icon, + ClipboardButton, + CIIcon, + TimeAgoTooltip, + }, + props: { + commit: { + type: Object, + required: true, + }, + }, + computed: { + authorName() { + return (this.commit.author && this.commit.author.name) || this.commit.authorName; + }, + authorUrl() { + return (this.commit.author && this.commit.author.webUrl) || `mailto:${this.commit.authorEmail}`; + }, + authorAvatar() { + return (this.commit.author && this.commit.author.avatarUrl) || this.commit.authorGravatarUrl; + }, + }, +}; +</script> + +<template> + <li class="commit flex-row js-toggle-container"> + <user-avatar-link + :link-href="authorUrl" + :img-src="authorAvatar" + :img-alt="authorName" + :img-size="36" + class="avatar-cell d-none d-sm-block" + /> + <div class="commit-detail flex-list"> + <div class="commit-content qa-commit-content"> + <a + :href="commit.commitUrl" + class="commit-row-message item-title" + v-html="commit.titleHtml" + ></a> + + <span class="commit-row-message d-block d-sm-none"> + · + {{ commit.shortId }} + </span> + + <button + v-if="commit.descriptionHtml" + class="text-expander js-toggle-button" + type="button" + :aria-label="__('Toggle commit description')" + > + <icon + :size="12" + name="ellipsis_h" + /> + </button> + + <div class="commiter"> + <a + :href="authorUrl" + v-text="authorName" + ></a> + {{ s__('CommitWidget|authored') }} + <time-ago-tooltip + :time="commit.authoredDate" + /> + </div> + + <pre + v-if="commit.descriptionHtml" + class="commit-row-description js-toggle-content append-bottom-8" + v-html="commit.descriptionHtml" + ></pre> + </div> + <div class="commit-actions flex-row d-none d-sm-flex"> + <div class="commit-sha-group"> + <div + class="label label-monospace" + v-text="commit.shortId" + ></div> + <clipboard-button + :text="commit.id" + :title="__('Copy commit SHA to clipboard')" + class="btn btn-default" + /> + </div> + </div> + </div> + </li> +</template> diff --git a/app/assets/javascripts/diffs/components/commit_widget.vue b/app/assets/javascripts/diffs/components/commit_widget.vue new file mode 100644 index 00000000000..cc8e72eb1c8 --- /dev/null +++ b/app/assets/javascripts/diffs/components/commit_widget.vue @@ -0,0 +1,40 @@ +<script> +import CommitItem from './commit_item.vue'; + +/** + * CommitWidget + * + * ----------------------------------------------------------------- + * WARNING: Please keep changes up-to-date with the following files: + * - `views/projects/merge_requests/diffs/_commit_widget.html.haml` + * ----------------------------------------------------------------- + * + * This Component was cloned from a HAML view. For the time being, + * they coexist, but there is an issue to remove the duplication. + * https://gitlab.com/gitlab-org/gitlab-ce/issues/51613 + * + */ +export default { + components: { + CommitItem, + }, + props: { + commit: { + type: Object, + required: true, + }, + }, +}; +</script> + +<template> + <div class="info-well prepend-top-default"> + <div class="well-segment"> + <ul class="blob-commit-info"> + <commit-item + :commit="commit" + /> + </ul> + </div> + </div> +</template> diff --git a/app/assets/javascripts/diffs/components/diff_file_header.vue b/app/assets/javascripts/diffs/components/diff_file_header.vue index d3ffbe0415a..517fbf400e8 100644 --- a/app/assets/javascripts/diffs/components/diff_file_header.vue +++ b/app/assets/javascripts/diffs/components/diff_file_header.vue @@ -181,8 +181,8 @@ export default { </span> <strong - v-tooltip v-else + v-tooltip :title="filePath" class="file-title-name" data-container="body" @@ -255,8 +255,8 @@ export default { </a> <a - v-tooltip v-if="diffFile.externalUrl" + v-tooltip :href="diffFile.externalUrl" :title="`View on ${diffFile.formattedExternalUrl}`" target="_blank" diff --git a/app/assets/javascripts/diffs/components/diff_gutter_avatars.vue b/app/assets/javascripts/diffs/components/diff_gutter_avatars.vue index a02c41f39ab..1b59777f901 100644 --- a/app/assets/javascripts/diffs/components/diff_gutter_avatars.vue +++ b/app/assets/javascripts/diffs/components/diff_gutter_avatars.vue @@ -87,8 +87,8 @@ export default { @click.native="toggleDiscussions" /> <span - v-gl-tooltip v-if="moreText" + v-gl-tooltip :title="moreText" class="diff-comments-more-count js-diff-comment-avatar js-diff-comment-plus" data-container="body" diff --git a/app/assets/javascripts/diffs/components/diff_line_note_form.vue b/app/assets/javascripts/diffs/components/diff_line_note_form.vue index 0fa14615532..bb9bb821de3 100644 --- a/app/assets/javascripts/diffs/components/diff_line_note_form.vue +++ b/app/assets/javascripts/diffs/components/diff_line_note_form.vue @@ -1,12 +1,9 @@ <script> import { mapState, mapGetters, mapActions } from 'vuex'; -import createFlash from '~/flash'; import { s__ } from '~/locale'; import noteForm from '../../notes/components/note_form.vue'; -import { getNoteFormData } from '../store/utils'; import autosave from '../../notes/mixins/autosave'; import { DIFF_NOTE_TYPE } from '../constants'; -import { reduceDiscussionsToLineCodes } from '../../notes/stores/utils'; export default { components: { @@ -39,6 +36,16 @@ export default { }), ...mapGetters('diffs', ['getDiffFileByHash']), ...mapGetters(['isLoggedIn', 'noteableType', 'getNoteableData', 'getNotesDataByProp']), + formData() { + return { + noteableData: this.noteableData, + noteableType: this.noteableType, + noteTargetLine: this.noteTargetLine, + diffViewType: this.diffViewType, + diffFile: this.getDiffFileByHash(this.diffFileHash), + linePosition: this.linePosition, + }; + }, }, mounted() { if (this.isLoggedIn) { @@ -53,8 +60,7 @@ export default { } }, methods: { - ...mapActions('diffs', ['cancelCommentForm', 'assignDiscussionsToDiff']), - ...mapActions(['saveNote', 'refetchDiscussionById']), + ...mapActions('diffs', ['cancelCommentForm', 'assignDiscussionsToDiff', 'saveDiffDiscussion']), handleCancelCommentForm(shouldConfirm, isDirty) { if (shouldConfirm && isDirty) { const msg = s__('Notes|Are you sure you want to cancel creating this comment?'); @@ -73,35 +79,9 @@ export default { }); }, handleSaveNote(note) { - const selectedDiffFile = this.getDiffFileByHash(this.diffFileHash); - const postData = getNoteFormData({ - note, - noteableData: this.noteableData, - noteableType: this.noteableType, - noteTargetLine: this.noteTargetLine, - diffViewType: this.diffViewType, - diffFile: selectedDiffFile, - linePosition: this.linePosition, - }); - - this.saveNote(postData) - .then(result => { - const endpoint = this.getNotesDataByProp('discussionsPath'); - - this.refetchDiscussionById({ path: endpoint, discussionId: result.discussion_id }) - .then(selectedDiscussion => { - const lineCodeDiscussions = reduceDiscussionsToLineCodes([selectedDiscussion]); - this.assignDiscussionsToDiff(lineCodeDiscussions); - - this.handleCancelCommentForm(); - }) - .catch(() => { - createFlash(s__('MergeRequests|Updating discussions failed')); - }); - }) - .catch(() => { - createFlash(s__('MergeRequests|Saving the comment failed')); - }); + return this.saveDiffDiscussion({ note, formData: this.formData }).then(() => + this.handleCancelCommentForm(), + ); }, }, }; diff --git a/app/assets/javascripts/diffs/components/inline_diff_view.vue b/app/assets/javascripts/diffs/components/inline_diff_view.vue index 947e7c98fae..fbf9e77ac07 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_view.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_view.vue @@ -43,18 +43,18 @@ export default { v-for="(line, index) in diffLines" > <inline-diff-table-row + :key="line.lineCode" :file-hash="diffFile.fileHash" :context-lines-path="diffFile.contextLinesPath" :line="line" :is-bottom="index + 1 === diffLinesLength" - :key="line.lineCode" /> <inline-diff-comment-row v-if="shouldRenderInlineCommentRow(line)" + :key="index" :diff-file-hash="diffFile.fileHash" :line="line" :line-index="index" - :key="index" /> </template> </tbody> diff --git a/app/assets/javascripts/diffs/components/parallel_diff_view.vue b/app/assets/javascripts/diffs/components/parallel_diff_view.vue index 501bd4450d8..3452f0d2b00 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_view.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_view.vue @@ -45,11 +45,11 @@ export default { v-for="(line, index) in diffLines" > <parallel-diff-table-row + :key="index" :file-hash="diffFile.fileHash" :context-lines-path="diffFile.contextLinesPath" :line="line" :is-bottom="index + 1 === diffLinesLength" - :key="index" /> <parallel-diff-comment-row v-if="shouldRenderParallelCommentRow(line)" |