Commit 5a0cd0e9 authored by Phil Hughes's avatar Phil Hughes

Added jump tp next discussion button

parent c6d96fdf
(() => { (() => {
JumpToDiscussion = Vue.extend({ JumpToDiscussion = Vue.extend({
props: {
discussionId: String
},
data: function () { data: function () {
return { return {
discussions: CommentsStore.state, discussions: CommentsStore.state,
}; };
}, },
computed: {
allResolved: function () {
let allResolved = true;
for (const discussionId in this.discussions) {
const discussion = this.discussions[discussionId];
for (const noteId in discussion) {
const note = discussion[noteId];
if (!note.resolved) {
allResolved = false;
}
}
}
return allResolved;
},
isLast: function () {
const discussionKeys = Object.keys(this.discussions),
indexOfDiscussion = discussionKeys.indexOf(this.discussionId);
return discussionKeys.length - 1 === indexOfDiscussion;
}
},
methods: { methods: {
jumpToNextUnresolvedDiscussion: function () { jumpToNextUnresolvedDiscussion: function () {
let nextUnresolvedDiscussionId; let nextUnresolvedDiscussionId;
if (!this.discussionId) {
for (const discussionId in this.discussions) { for (const discussionId in this.discussions) {
const discussion = this.discussions[discussionId]; const discussion = this.discussions[discussionId];
...@@ -23,11 +51,22 @@ ...@@ -23,11 +51,22 @@
if (nextUnresolvedDiscussionId) break; if (nextUnresolvedDiscussionId) break;
} }
} else {
const discussionKeys = Object.keys(this.discussions),
indexOfDiscussion = discussionKeys.indexOf(this.discussionId),
nextDiscussionId = discussionKeys[indexOfDiscussion + 1];
if (nextDiscussionId) {
nextUnresolvedDiscussionId = nextDiscussionId;
}
}
if (nextUnresolvedDiscussionId) {
$.scrollTo(`.${nextUnresolvedDiscussionId}`, { $.scrollTo(`.${nextUnresolvedDiscussionId}`, {
offset: -($('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight()) offset: -($('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight())
}); });
}, }
}
} }
}); });
......
...@@ -300,8 +300,8 @@ ...@@ -300,8 +300,8 @@
discussionContainer.append(note_html); discussionContainer.append(note_html);
} }
if ($('resolve-btn, resolve-all-btn').length && (typeof DiffNotesApp !== "undefined" && DiffNotesApp !== null)) { if ($('resolve-btn, resolve-all-btn, jump-to-discussion').length && (typeof DiffNotesApp !== "undefined" && DiffNotesApp !== null)) {
$('resolve-btn, resolve-all-btn').each(function () { $('resolve-btn, resolve-all-btn, jump-to-discussion').each(function () {
DiffNotesApp.$compile($(this).get(0)) DiffNotesApp.$compile($(this).get(0))
}); });
} }
...@@ -439,8 +439,8 @@ ...@@ -439,8 +439,8 @@
$note_li.replaceWith($html); $note_li.replaceWith($html);
if ($('resolve-btn, resolve-all-btn').length && (typeof DiffNotesApp !== "undefined" && DiffNotesApp !== null)) { if ($('resolve-btn, resolve-all-btn, jump-to-discussion').length && (typeof DiffNotesApp !== "undefined" && DiffNotesApp !== null)) {
$('resolve-btn, resolve-all-btn').each(function () { $('resolve-btn, resolve-all-btn, jump-to-discussion').each(function () {
DiffNotesApp.$compile($(this).get(0)) DiffNotesApp.$compile($(this).get(0))
}); });
} }
......
...@@ -384,14 +384,38 @@ ul.notes { ...@@ -384,14 +384,38 @@ ul.notes {
} }
} }
.line-resolve-all-container {
.btn-group {
margin-top: -1px;
margin-left: -4px;
}
.discussion-next-btn {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
.line-resolve-all { .line-resolve-all {
display: inline-block;
margin-top: 10px; margin-top: 10px;
padding: 10px; padding: 5px 10px;
background-color: $background-color;
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: $border-radius-default; border-radius: $border-radius-default;
.btn { &.has-next-btn {
margin-right: 10px; border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.line-resolve-btn {
top: 1px;
margin-right: 5px;
.fa {
left: 2px;
}
} }
} }
...@@ -400,6 +424,7 @@ ul.notes { ...@@ -400,6 +424,7 @@ ul.notes {
} }
.line-resolve-btn { .line-resolve-btn {
display: inline-block;
position: relative; position: relative;
top: -1px; top: -1px;
width: 14px; width: 14px;
...@@ -417,18 +442,25 @@ ul.notes { ...@@ -417,18 +442,25 @@ ul.notes {
&:not(.is-disabled):hover, &:not(.is-disabled):hover,
&.is-active { &.is-active {
color: #fff; color: $gl-text-green;
background-color: $gl-text-green;
border-color: $gl-text-green; border-color: $gl-text-green;
.fa { .fa {
color: #fff; color: $gl-text-green;
} }
} }
.fa { .fa {
position: relative;
top: 2px; top: 2px;
font-size: 8px; font-size: 8px;
color: #c3c3c3;
vertical-align: top; vertical-align: top;
} }
} }
.discussion-next-btn {
path {
fill: #7E7E7E;
}
}
...@@ -6,7 +6,8 @@ ...@@ -6,7 +6,8 @@
.discussion-reply-holder .discussion-reply-holder
.discussion-with-resolve-btn{ role: "group" } .discussion-with-resolve-btn{ role: "group" }
.btn-group .btn-group{ role: "group" }
= link_to_reply_discussion(discussion) = link_to_reply_discussion(discussion)
.btn-group .btn-group{ role: "group" }
= render "discussions/resolve_all", discussion: discussion = render "discussions/resolve_all", discussion: discussion
= render "discussions/jump_to_next", discussion: discussion
- discussion = local_assigns.fetch(:discussion, false)
%jump-to-discussion{ "inline-template" => true, ":discussion-id" => "'#{discussion.try(:id)}'" }
.btn-group{ role: "group",
"v-show" => "!allResolved",
"v-if" => "!isLast" }
%button.btn.btn-default.discussion-next-btn.has-tooltip{ "@click" => "jumpToNextUnresolvedDiscussion",
title: "Jump to next unresolved discussion",
"aria-label" => "Jump to next unresolved discussion",
data: { container: "body" } }
= custom_icon("next_discussion")
...@@ -11,6 +11,7 @@ ...@@ -11,6 +11,7 @@
= link_to_reply_discussion(discussion_left, 'old') = link_to_reply_discussion(discussion_left, 'old')
.btn-group{ role: "group" } .btn-group{ role: "group" }
= render "discussions/resolve_all", discussion: discussion_left = render "discussions/resolve_all", discussion: discussion_left
= render "discussions/jump_to_next", discussion: discussion
- else - else
%td.notes_line.old= "" %td.notes_line.old= ""
%td.notes_content.parallel.old= "" %td.notes_content.parallel.old= ""
...@@ -27,6 +28,7 @@ ...@@ -27,6 +28,7 @@
= link_to_reply_discussion(discussion_right, 'new') = link_to_reply_discussion(discussion_right, 'new')
.btn-group{ role: "group" } .btn-group{ role: "group" }
= render "discussions/resolve_all", discussion: discussion_right = render "discussions/resolve_all", discussion: discussion_right
= render "discussions/jump_to_next", discussion: discussion
- else - else
%td.notes_line.new= "" %td.notes_line.new= ""
%td.notes_content.parallel.new= "" %td.notes_content.parallel.new= ""
...@@ -45,14 +45,16 @@ ...@@ -45,14 +45,16 @@
= link_to "command line", "#modal_merge_info", class: "how_to_merge_link vlink", title: "How To Merge", "data-toggle" => "modal" = link_to "command line", "#modal_merge_info", class: "how_to_merge_link vlink", title: "How To Merge", "data-toggle" => "modal"
- if current_user - if current_user
#resolve-count-app{ "v-cloak" => true } #resolve-count-app.line-resolve-all-container{ "v-cloak" => true }
%resolve-count{ "inline-template" => true } %resolve-count{ "inline-template" => true }
.line-resolve-all{ "v-show" => "discussionCount > 0" } .line-resolve-all{ "v-show" => "discussionCount > 0",
":class" => "{ 'has-next-btn': resolved !== discussionCount }" }
%span.line-resolve-btn.is-disabled{ type: "button",
":class" => "{ 'is-active': resolved === discussionCount }" }
= icon("check")
%span.line-resolve-text %span.line-resolve-text
{{ resolved }}/{{ discussionCount }} discussions resolved {{ resolved }}/{{ discussionCount }} discussions resolved
%jump-to-discussion{ "inline-template" => true } = render "discussions/jump_to_next"
%button.btn.btn-default.has-tooltip{ "@click" => "jumpToNextUnresolvedDiscussion", title: "Jump to next unresolved discussion", data: { container: "body" } }
= icon("caret-down")
- if @commits_count.nonzero? - if @commits_count.nonzero?
%ul.merge-request-tabs.nav-links.no-top.no-bottom %ul.merge-request-tabs.nav-links.no-top.no-bottom
......
<svg viewBox="0 0 20 19" ><path d="M15.21 7.783h-3.317c-.268 0-.472.218-.472.486v.953c0 .28.212.486.473.486h3.318v1.575c0 .36.233.452.52.23l3.06-2.37c.274-.213.286-.582 0-.804l-3.06-2.37c-.275-.213-.52-.12-.52.23v1.583zm.57-3.66c-1.558-1.22-3.783-1.98-6.254-1.98C4.816 2.143 1 4.91 1 8.333c0 1.964 1.256 3.715 3.216 4.846-.447 1.615-1.132 2.195-1.732 2.882-.142.174-.304.32-.256.56v.01c.047.213.218.368.41.368h.046c.37-.048.743-.116 1.085-.213 1.645-.425 3.13-1.22 4.377-2.34.447.048.913.077 1.38.077 2.092 0 4.01-.546 5.492-1.454-.416-.208-.798-.475-1.134-.792-1.227.63-2.743 1.008-4.36 1.008-.41 0-.828-.03-1.237-.078l-.543-.058-.41.368c-.78.696-1.655 1.248-2.616 1.654.248-.445.486-.977.667-1.664l.257-.928-.828-.484c-1.646-.948-2.598-2.32-2.598-3.763 0-2.69 3.35-4.952 7.308-4.952 1.893 0 3.647.518 4.962 1.353.393-.266.827-.473 1.29-.61z" /></svg>
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