Skip to content

Commit 59112f1

Browse files
Raxel Gutierrezdaxtens
Raxel Gutierrez
authored and
daxtens
committed
patch-detail: add label and button for comment addressed status
Add new label to patch and cover comments to show the status of whether they are addressed or not and add an adjacent button to allow users to change the status of the comment. Only users that can edit the patch (i.e. patch author, delegate, project maintainers) as well as comment authors can change the status of a patch comment. For cover comments, there are no delegates, so only maintainers and cover/cover comment authors can edit the status of the cover comment. Before [1] and after [2] images for reference. Use new comment detail REST API endpoint to update the addressed field value when "Addressed" or "Unaddressed" buttons are clicked. After a successful request is made, the appearance of the comment status label and buttons are toggled appropriately. For unsuccessful requests (e.g. network errors prevents reaching the server), the error message is populated to the page. A future improvement on this behavior is to add a spinner to the button to provide a feedback that the request is in a pending state until it's handled. [1] https://imgur.com/3ZKzgjN [2] https://imgur.com/hWZrrnM Signed-off-by: Raxel Gutierrez <raxel@google.com> Signed-off-by: Daniel Axtens <dja@axtens.net>
1 parent 5b03443 commit 59112f1

File tree

4 files changed

+110
-12
lines changed

4 files changed

+110
-12
lines changed

‎htdocs/css/style.css‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
:root {
2+
--light-color:rgb(247, 247, 247);
23
--success-color:rgb(92, 184, 92);
34
--warning-color:rgb(240, 173, 78);
45
--danger-color:rgb(217, 83, 79);
@@ -27,6 +28,10 @@ pre {
2728
top: 17em;
2829
}
2930

31+
.hidden {
32+
visibility: hidden;
33+
}
34+
3035
/* Bootstrap overrides */
3136

3237
.navbar-inverse .navbar-brand > a {
@@ -315,6 +320,39 @@ table.patch-meta tr th, table.patch-meta tr td {
315320
font-family: "DejaVu Sans Mono", fixed;
316321
}
317322

323+
div[class^="comment-status-bar-"] {
324+
display: flex;
325+
flex-wrap: wrap;
326+
align-items: center;
327+
}
328+
329+
.comment-status-label {
330+
margin: 0px 8px;
331+
}
332+
333+
button[class^=comment-action] {
334+
background-color: var(--light-color);
335+
border-radius: 4px;
336+
}
337+
338+
.comment-action-addressed {
339+
border-color: var(--success-color);
340+
}
341+
342+
.comment-action-unaddressed {
343+
border-color: var(--warning-color);
344+
}
345+
346+
.comment-action-addressed:hover {
347+
background-color: var(--success-color);
348+
color: var(--light-color);
349+
}
350+
351+
.comment-action-unaddressed:hover {
352+
background-color: var(--warning-color);
353+
color: var(--light-color);
354+
}
355+
318356
.quote {
319357
color: #007f00;
320358
}

‎htdocs/js/submission.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1+
import { updateProperty } from "./rest.js";
2+
13
$( document ).ready(function() {
4+
const patchMeta = document.getElementById("patch-meta");
25
function toggleDiv(link_id, headers_id, label_show, label_hide) {
36
const link = document.getElementById(link_id)
47
const headers = document.getElementById(headers_id)
@@ -14,6 +17,23 @@ $( document ).ready(function() {
1417
}
1518
}
1619

20+
$("button[class^='comment-action']").click((event) => {
21+
const submissionType = patchMeta.dataset.submissionType;
22+
const submissionId = patchMeta.dataset.submissionId;
23+
const commentId = event.target.parentElement.dataset.commentId;
24+
const url = `/api/${submissionType}/${submissionId}/comments/${commentId}/`;
25+
const data = {'addressed': event.target.value} ;
26+
const updateMessage = {
27+
'error': "No comments updated",
28+
'success': "1 comment(s) updated",
29+
};
30+
updateProperty(url, data, updateMessage).then(isSuccess => {
31+
if (isSuccess) {
32+
$("div[class^='comment-status-bar-'][data-comment-id='"+commentId+"']").toggleClass("hidden");
33+
}
34+
})
35+
});
36+
1737
// Click listener to show/hide headers
1838
document.getElementById("toggle-patch-headers").addEventListener("click", function() {
1939
toggleDiv("toggle-patch-headers", "patch-headers");

‎patchwork/templates/patchwork/submission.html‎

Lines changed: 49 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
{% load person %}
66
{% load patch %}
77
{% load static %}
8+
{% load utils %}
89

910
{% block headers %}
1011
<script type="module" src="{% static "js/submission.js" %}"></script>
@@ -19,7 +20,12 @@
1920
<h1>{{ submission.name }}</h1>
2021
</div>
2122

22-
<table class="patch-meta">
23+
<table
24+
id="patch-meta"
25+
class="patch-meta"
26+
data-submission-type={{submission|verbose_name_plural|lower}}
27+
data-submission-id={{submission.id}}
28+
>
2329
<tr>
2430
<th>Message ID</th>
2531
{% if submission.list_archive_url %}
@@ -271,18 +277,50 @@ <h2>Message</h2>
271277
{% if forloop.first %}
272278
<h2>Comments</h2>
273279
{% endif %}
274-
280+
{% is_editable item user as comment_is_editable %}
275281
<a name="{{ item.id }}"></a>
276282
<div class="submission-message">
277-
<div class="meta">
278-
<span>{{ item.submitter|personify:project }}</span>
279-
<span class="message-date">{{ item.date }} UTC |
280-
<a href="{% url 'comment-redirect' comment_id=item.id %}">#{{ forloop.counter }}</a>
281-
</span>
282-
</div>
283-
<pre class="content">
284-
{{ item|commentsyntax }}
285-
</pre>
283+
<div class="meta">
284+
{{ item.submitter|personify:project }}
285+
<span class="message-date">{{ item.date }} UTC |
286+
<a href="{% url 'comment-redirect' comment_id=item.id %}">#{{ forloop.counter }}</a>
287+
</span>
288+
{% if item.addressed %}
289+
<div class="comment-status-bar-addressed" data-comment-id={{item.id}}>
290+
{% else %}
291+
<div class="comment-status-bar-addressed hidden" data-comment-id={{item.id}}>
292+
{% endif %}
293+
<div class="comment-status-label text-success mx-3">
294+
<span class="glyphicon glyphicon-ok-circle" aria-hidden="true"></span>
295+
Addressed
296+
</div>
297+
{% if editable or comment_is_editable %}
298+
<button class="comment-action-unaddressed text-warning" value="false">
299+
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
300+
Mark Unaddressed
301+
</button>
302+
{% endif %}
303+
</div>
304+
{% if item.addressed %}
305+
<div class="comment-status-bar-unaddressed hidden" data-comment-id={{item.id}}>
306+
{% else %}
307+
<div class="comment-status-bar-unaddressed" data-comment-id={{item.id}}>
308+
{% endif %}
309+
<div class="comment-status-label text-warning mx-3">
310+
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
311+
Unaddressed
312+
</div>
313+
{% if editable or comment_is_editable %}
314+
<button class="comment-action-addressed text-success" value="true">
315+
<span class="glyphicon glyphicon-ok-circle" aria-hidden="true"></span>
316+
Mark Addressed
317+
</button>
318+
{% endif %}
319+
</div>
320+
</div>
321+
<pre class="content">
322+
{{ item|commentsyntax }}
323+
</pre>
286324
</div>
287325
{% endfor %}
288326

‎patchwork/views/patch.py‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,8 @@ def patch_detail(request, project_id, msgid):
109109

110110
comments = patch.comments.all()
111111
comments = comments.select_related('submitter')
112-
comments = comments.only('submitter', 'date', 'id', 'content', 'patch')
112+
comments = comments.only('submitter', 'date', 'id', 'content', 'patch',
113+
'addressed')
113114

114115
if patch.related:
115116
related_same_project = patch.related.patches.only(
@@ -128,6 +129,7 @@ def patch_detail(request, project_id, msgid):
128129
patch.check_set.all().select_related('user'),
129130
)
130131
context['submission'] = patch
132+
context['editable'] = editable
131133
context['patchform'] = form
132134
context['createbundleform'] = createbundleform
133135
context['project'] = patch.project

0 commit comments

Comments
 (0)