Implement comment-deleting

issues/templates/issues/history.html

@@ -64,7 +64,17 @@
                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="w-4 h-4 inline">
   <path fill-rule="evenodd" d="M11.013 2.513a1.75 1.75 0 0 1 2.475 2.474L6.226 12.25a2.751 2.751 0 0 1-.892.596l-2.047.848a.75.75 0 0 1-.98-.98l.848-2.047a2.75 2.75 0 0 1 .596-.892l7.262-7.261Z" clip-rule="evenodd" />
 </svg>
+
                     </span>
+                    {% if turningpoint.kind == 100 %}
+                    <span class="text-slate-500 pl-1" onclick="deleteComment('{% url "history_comment_delete" issue_pk=issue.id comment_pk=turningpoint.pk %}')">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="w-4 h-4 inline">
+  <path fill-rule="evenodd" d="M5 3.25V4H2.75a.75.75 0 0 0 0 1.5h.3l.815 8.15A1.5 1.5 0 0 0 5.357 15h5.285a1.5 1.5 0 0 0 1.493-1.35l.815-8.15h.3a.75.75 0 0 0 0-1.5H11v-.75A2.25 2.25 0 0 0 8.75 1h-1.5A2.25 2.25 0 0 0 5 3.25Zm2.25-.75a.75.75 0 0 0-.75.75V4h3v-.75a.75.75 0 0 0-.75-.75h-1.5ZM6.05 6a.75.75 0 0 1 .787.713l.275 5.5a.75.75 0 0 1-1.498.075l-.275-5.5A.75.75 0 0 1 6.05 6Zm3.9 0a.75.75 0 0 1 .712.787l-.275 5.5a.75.75 0 0 1-1.498-.075l.275-5.5a.75.75 0 0 1 .786-.711Z" clip-rule="evenodd" />
+</svg>
+                    
+
+                    </span>
+                    {% endif %}
                     {% endif %}
 
                 </div>
@@ -155,4 +165,7 @@
 
 {% block extra_js %}
     <script src="{% static 'js/issue_history.js' %}"></script>
+    <script>
+        var csrftoken = '{{ csrf_token }}';
+    </script>
 {% endblock %}

issues/urls.py

@@ -2,7 +2,8 @@ from django.urls import path
 
 from .views import (
     issue_list, issue_event_stacktrace, issue_event_details, issue_last_event, issue_event_list, issue_history,
-    issue_grouping, issue_event_breadcrumbs, event_by_internal_id, history_comment_new, history_comment_edit)
+    issue_grouping, issue_event_breadcrumbs, event_by_internal_id, history_comment_new, history_comment_edit,
+    history_comment_delete)
 
 urlpatterns = [
     path('<int:project_pk>/', issue_list, {"state_filter": "open"}, name="issue_list_open"),
@@ -29,4 +30,6 @@ urlpatterns = [
     path('event/<uuid:event_pk>/', event_by_internal_id, name="event_by_internal_id"),
     path('issue/<uuid:issue_pk>/history/comment/', history_comment_new, name="history_comment_new"),
     path('issue/<uuid:issue_pk>/history/comment/<int:comment_pk>/', history_comment_edit, name="history_comment_edit"),
+    path('issue/<uuid:issue_pk>/history/comment/<int:comment_pk>/delete/', history_comment_delete,
+         name="history_comment_delete"),
 ]

issues/views.py

@@ -445,4 +445,20 @@ def history_comment_edit(request, issue, comment_pk):
         form.save()
         return redirect(reverse(issue_history, kwargs={'issue_pk': issue.pk}) + f"#comment-{ comment_pk }")
 
+
+@issue_membership_required
+def history_comment_delete(request, issue, comment_pk):
+    comment = get_object_or_404(TurningPoint, pk=comment_pk, issue_id=issue.pk)
+
+    if comment.user_id != request.user.id:
+        raise PermissionDenied("You can only delete your own comments")
+
+    if comment.kind != TurningPointKind.MANUAL_ANNOTATION:
+        # I'm taking the 'allow almost nothing' path first
+        raise PermissionDenied("You can only delete manual annotations")
+
+    if request.method == "POST":
+        comment.delete()
+        return redirect(reverse(issue_history, kwargs={'issue_pk': issue.pk}))
+
     return HttpResponseNotAllowed(["POST"])

static/js/issue_history.js

@@ -5,3 +5,18 @@ function toggleCommentEditable(element) {
     balloon.querySelector(".js-comment-editable").classList.toggle("hidden");
     balloon.querySelector(".js-comment-plain").classList.toggle("hidden");
 }
+
+function deleteComment(deleteUrl) {
+    if (window.confirm("Are you sure you want to delete this comment?")) {
+        fetch(deleteUrl, {
+            method: 'POST',
+            headers: { "X-CSRFToken": csrftoken },
+        }).then((response) => {
+            // yes this is super-indirect, but it "works for now" and we might revisit this whole bit anyway (e.g. use HTMX)
+            // if we revisit this and figure out we want to do what we do here, but more directly (i.e. just post a form) read this one:
+            // https://stackoverflow.com/questions/133925/javascript-post-request-like-a-form-submit
+            // in other words, in that case the simplest way forward is probably just to create that form and post it instead of using the fetch API
+            window.location.reload();
+        })
+    }
+}

theme/static/css/dist/styles.css

@@ -886,6 +886,10 @@ select {
   margin-top: 1.5rem;
 }
 
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
 .block {
   display: block;
 }