Document task pane

indigo_api/templatetags/indigo.py

@@ -3,6 +3,7 @@
 
 from django import template
 from django.conf import settings
+from django.db.models import Q
 
 from indigo.plugins import plugins
 from indigo_api.models import Task
@@ -98,3 +99,8 @@ def format_input_date(value):
 @register.simple_tag
 def amendment_date_tasks(amendment):
     return Task.objects.filter(work=amendment.amended_work, timeline_date=amendment.date, code='apply-amendment')
+
+
+@register.simple_tag
+def related_tasks(document):
+    return document.work.tasks.filter(Q(timeline_date=document.expression_date) | Q(document=document)).order_by('pk')

indigo_app/js/components/index.js

@@ -2,7 +2,7 @@ import DocumentTOCView from './DocumentTOCView.vue';
 import LinterPopup from './LinterPopup.vue';
 import TaxonomyTOC from './TaxonomyTOC.vue';
 import WorkChooser from './work_chooser';
-import WorkListCard from './work_list_card';
+import ListCard from './list_card';
 import { VSplitter, HSplitter } from './splitters';
 import { FacetGroup, RemoveFacetButton } from './facets';
 
@@ -14,7 +14,7 @@ export const vueComponents = {
 
 export const components = {
   WorkChooser,
-  WorkListCard,
+  ListCard,
   FacetGroup,
   RemoveFacetButton,
   HSplitter,

indigo_app/js/components/work_list_card.js → indigo_app/js/components/list_card.js

@@ -1,4 +1,4 @@
-export default class WorkListCard {
+export default class ListCard {
   constructor (element) {
     this.element = element;
     this.element.addEventListener('click', (e) => this.clicked(e));

indigo_app/static/stylesheets/_places.scss

@@ -10,7 +10,7 @@
   background: white;
 }
 
-.work-detail-toggle {
+.detail-toggle {
   &::after {
     content: "▼";
   }
@@ -19,11 +19,11 @@
   width: 1em;
 }
 
-.work-list-card-heading {
+.list-card-heading {
   cursor: pointer;
 
   &.collapsed {
-    .work-detail-toggle::after {
+    .detail-toggle::after {
       content: "▶";
     }
   }

indigo_app/static/stylesheets/_tasks.scss

@@ -78,11 +78,6 @@
   }
 }
 
-.task-list-card-heading {
-  text-decoration: underline;
-  color: black;
-}
-
 .task-border-open {
   border: 1px solid $primary;
 }

indigo_app/templates/comments/preview.html

@@ -0,0 +1,3 @@
+{% load i18n %}
+{# this file is used when the comment form is invalid, which usually means permission denied #}
+{% trans "You're not logged in, or something went wrong." %}

indigo_app/templates/indigo_api/_task_buttons.html

@@ -0,0 +1,44 @@
+{% load i18n %}
+
+{% if task.change_task_permission %}
+  {% if task.state == 'pending_review' %}
+    {% if task.unsubmit_task_permission %}
+      <button
+          class="btn btn-primary me-2" type="button"
+          hx-post="{% url 'unsubmit_task' place=place.place_code pk=task.pk %}"
+          hx-confirm="{% trans 'Are you sure you want to request changes to this task?' %}"
+      >{% trans "Request changes" %}</button>
+    {% endif %}
+    {% if task.customised.close_url %}
+      <a class="btn btn-primary me-2" href="{{ task.customised.close_url }}">{% trans 'Review changes' %}</a>
+    {% elif task.close_task_permission %}
+      <button
+          class="btn btn-success me-2" type="button"
+          hx-post="{% url 'close_task' place=place.place_code pk=task.pk %}"
+          hx-confirm="{% trans 'Are you sure you want to approve this task?' %}"
+      >{% trans "Approve" %}</button>
+    {% endif %}
+  {% elif task.state == 'cancelled' or task.state == 'done' %}
+    {% if task.reopen_task_permission %}
+      <button
+          class="btn btn-primary me-2" type="button"
+          hx-post="{% url 'reopen_task' place=place.place_code pk=task.pk %}"
+          hx-confirm="{% trans 'Are you sure you want to reopen this task?' %}"
+      >{% trans "Reopen" %}</button>
+    {% endif %}
+  {% elif task.code == 'convert-document' and task.state == 'open' and task.finish_task_permission %}
+    <button
+        class="btn btn-primary me-2" type="button"
+        hx-post="{% url 'finish_task' place=place.place_code pk=task.pk %}"
+        hx-disabled-elt="this"
+        hx-confirm="{% trans 'Are you sure you want to finish this task?' %}"
+        {% if not task.output_file %}disabled{% endif %}
+    >{% trans "Finish" %}</button>
+  {% elif task.state == 'open' and task.submit_task_permission %}
+    <button
+        class="btn btn-primary me-2" type="button"
+        hx-post="{% url 'submit_task' place=place.place_code pk=task.pk %}"
+        hx-confirm="{% trans 'Are you sure you want to submit this task for review?' %}"
+    >{% trans "Submit for review" %}</button>
+  {% endif %}
+{% endif %}

indigo_app/templates/indigo_api/_task_detail.html

@@ -1,6 +1,6 @@
 {% load activity_tags humanize indigo_app account comments i18n %}
 
-<div class="container mt-3 mb-5">
+<div class="container mt-3 mb-5" id="task-{{ task.pk }}">
     <div class="row">
       <div class="mb-3 col-9">
         {% if task.state == 'blocked' %}
@@ -101,134 +101,37 @@ <h5>
             </div>
           </div>
         {% endif %}
-
-        <ul class="activity-list open-top pt-3">
-          {% for entry in task_timeline %}
-            {% if entry.comment %}
-              <li class="activity-item card">
-                <div class="card-header">
-                  {% user_profile entry.user %} {% trans 'commented' %}
-                  <span class="time-ago" data-timestamp="{{ entry.submit_date|date:'c' }}">{{ entry.submit_date|date:"Y-m-d H:i" }}</span>:
-                </div>
-                <div class="card-body">
-                  {{ entry.comment|urlize|linebreaksbr }}
-                </div>
-              </li>
-            {% else %}
-              <li class="activity-item">
-                {% include 'indigo_app/actions/_action.html' with action=entry this_task=True ignore_place=True %}
-              </li>
-            {% endif %}
-          {% endfor %}
-
-          {% with task.resolve_anchor as anchor %}
-            {% if anchor %}
-              <li class="activity-item">
-                {% if anchor.element %}
-                  {% url 'document' doc_id=task.document.pk as doc_url %}
-                  {% with qid=anchor.toc_entry.qualified_id|default:'' anntn_id=task.annotation.id|slugify %}
-                    {% blocktrans trimmed with item_url=doc_url|add:"?toc="|add:qid|add:"&anntn="|add:anntn_id title=anchor.toc_entry.title|default:anchor.anchor_id %}
-                      Here is <a href="{{ item_url }}">{{ title }}</a> as it appears currently
-                    {% endblocktrans %}
-                  {% endwith %}
-
-                  {% if not anchor.exact_match %}
-                    {% blocktrans with a=anchor.anchor_id %}(<b>{{ a }}</b> may have been moved or removed){% endblocktrans %}
-                  {% endif %}
-                  <div class="sheet-outer"
-                       {% if anchor.selectors or not anchor.is_toc_element %}data-highlight="{{ anchor.target|jsonify|escape }}"{% endif %}>
-                    <div class="sheet-inner is-fragment">
-                      <la-akoma-ntoso frbr-expression-uri="{{ anchor.document.expression_frbr_uri }}">{{ anchor.toc_element_html|default:anchor.element_html|safe }}</la-akoma-ntoso>
-                    </div>
-                  </div>
-                {% else %}
-                  {% blocktrans trimmed with a=anchor.toc_entry.title|default:anchor.anchor_id %}
-                    The content at <b>{{ a }}</b> is not available and may have been moved or removed.
+        <div id="task-timeline-{{ task.pk }}">
+          {% url 'task_detail_detail' place=task.place.place_code pk=task.pk as next_url %}
+          {% include 'indigo_api/_task_timeline.html' with next_url=next_url %}
+        </div>
+        {% with task.resolve_anchor as anchor %}
+          {% if anchor %}
+            <div class="activity-item">
+              {% if anchor.element %}
+                {% url 'document' doc_id=task.document.pk as doc_url %}
+                {% with qid=anchor.toc_entry.qualified_id|default:'' anntn_id=task.annotation.id|slugify %}
+                  {% blocktrans trimmed with item_url=doc_url|add:"?toc="|add:qid|add:"&anntn="|add:anntn_id title=anchor.toc_entry.title|default:anchor.anchor_id %}
+                    Here is <a href="{{ item_url }}">{{ title }}</a> as it appears currently
                   {% endblocktrans %}
+                {% endwith %}
+                {% if not anchor.exact_match %}
+                  {% blocktrans with a=anchor.anchor_id %}(<b>{{ a }}</b> may have been moved or removed){% endblocktrans %}
                 {% endif %}
-              </li>
-            {% endif %}
-          {% endwith %}
-        </ul>
-
-        <hr>
-
-        {% if user.is_authenticated %}
-          {% get_comment_form for task as form %}
-          <form action="{% comment_form_target %}" method="post" id="task-comment-form">
-            {% csrf_token %}
-            {{ form.honeypot.as_hidden }}
-            {{ form.content_type }}
-            {{ form.object_pk }}
-            {{ form.timestamp }}
-            {{ form.security_hash }}
-            <input type="hidden" name="next" value="{% url 'task_detail' place=place.place_code pk=task.pk %}"/>
-
-            <div class="card">
-              <div class="card-body">
-                <textarea id="id_comment" name="comment" class="form-control mb-3" maxlength="3000" rows="3"
-                          cols="80" placeholder="Add a comment"></textarea>
-
-                <div class="text-end">
-                  <input class="btn btn-primary" type="submit" value="{% trans 'Add comment' %}" id="id_submit" disabled>
-
-                  {% if task.state == 'pending_review' %}
-                    {% if task.unsubmit_task_permission %}
-                      <input
-                        class="btn btn-primary me-2 float-start"
-                        type="submit"
-                        data-confirm="{% trans 'Are you sure you want to request changes to this task?' %}"
-                        formaction="{% url 'unsubmit_task' place=place.place_code pk=task.pk %}"
-                        id="btn_request_changes"
-                        value="{% trans 'Request changes' %}">
-                    {% endif %}
-
-                    {% if task.customised.close_url %}
-                      <a class="btn btn-primary me-2 float-start" href="{{ task.customised.close_url }}">{% trans 'Review changes' %}</a>
-                    {% elif task.close_task_permission %}
-                      <input
-                        class="btn btn-success me-2 float-start"
-                        type="submit"
-                        data-confirm="{% trans 'Are you sure you want to approve this task?' %}"
-                        formaction="{% url 'close_task' place=place.place_code pk=task.pk %}"
-                        id="btn_approve"
-                        value="{% trans 'Approve' %}">
-                    {% endif %}
-
-                  {% elif task.state == 'cancelled' or task.state == 'done' %}
-                    {% if task.reopen_task_permission %}
-                      <input class="btn btn-primary float-start me-2" type="submit"
-                             data-confirm="{% trans 'Are you sure you want to reopen this task?' %}"
-                             formaction="{% url 'reopen_task' place=place.place_code pk=task.pk %}"
-                             id="btn_reopen"
-                             value="{% trans 'Reopen' %}">
-                    {% endif %}
-
-                  {% elif task.code == 'convert-document' and task.state == 'open' and task.finish_task_permission %}
-                    <input class="btn btn-primary float-start me-2" type="submit"
-                           {% if not task.output_file %}disabled{% endif %}
-                           data-confirm="{% trans 'Are you sure you want to finish this task?' %}"
-                           data-disable-with="{% trans 'Finishing' %}"
-                           formaction="{% url 'finish_task' place=place.place_code pk=task.pk %}"
-                           id="btn_finish"
-                           value="{% trans 'Finish' %}">
-
-                  {% elif task.state == 'open' and task.submit_task_permission %}
-                    <input class="btn btn-primary float-start me-2" type="submit"
-                           data-confirm="{% trans task.submission_message %}"
-                           formaction="{% url 'submit_task' place=place.place_code pk=task.pk %}"
-                           id="btn_submit_for_review"
-                           value="{% trans 'Submit for review' %}">
-                  {% endif %}
+                <div class="sheet-outer"
+                     {% if anchor.selectors or not anchor.is_toc_element %}data-highlight="{{ anchor.target|jsonify|escape }}"{% endif %}>
+                  <div class="sheet-inner is-fragment">
+                    <la-akoma-ntoso frbr-expression-uri="{{ anchor.document.expression_frbr_uri }}">{{ anchor.toc_element_html|default:anchor.element_html|safe }}</la-akoma-ntoso>
+                  </div>
                 </div>
-              </div>
+              {% else %}
+                {% blocktrans trimmed with a=anchor.toc_entry.title|default:anchor.anchor_id %}
+                  The content at <b>{{ a }}</b> is not available and may have been moved or removed.
+                {% endblocktrans %}
+              {% endif %}
             </div>
-
-          </form>
-        {% else %}
-          <p>{% blocktrans %}Please <a href="{{ login_url }}">log in</a> to leave a comment.{% endblocktrans %}</p>
-        {% endif %}
-
+          {% endif %}
+        {% endwith %}
       </div>
 
       <div class="col-3">

indigo_app/templates/indigo_api/_task_timeline.html

@@ -0,0 +1,50 @@
+{% load i18n indigo_app comments %}
+
+<ul class="activity-list open-top pt-3">
+  {% for entry in task_timeline %}
+    {% if entry.comment %}
+      <li class="activity-item card">
+        <div class="card-header">
+          {% user_profile entry.user %} {% trans 'commented' %}
+          <span class="time-ago" data-timestamp="{{ entry.submit_date|date:'c' }}">{{ entry.submit_date|date:"Y-m-d H:i" }}</span>:
+        </div>
+        <div class="card-body">
+          {{ entry.comment|urlize|linebreaksbr }}
+        </div>
+      </li>
+    {% else %}
+      <li class="activity-item">
+        {% include 'indigo_app/actions/_action.html' with action=entry this_task=True ignore_place=True %}
+      </li>
+    {% endif %}
+  {% endfor %}
+  <li class="activity-item card">
+    {% if user.is_authenticated %}
+      {% get_comment_form for task as comment_form %}
+      <form hx-target="#task-{{ task.pk }}" hx-post="{% comment_form_target %}">
+        <div class="card-body">
+          {% csrf_token %}
+          {{ comment_form.honeypot.as_hidden }}
+          {{ comment_form.content_type }}
+          {{ comment_form.object_pk }}
+          {{ comment_form.timestamp }}
+          {{ comment_form.security_hash }}
+          <input type="hidden" name="next" value="{{ next_url }}">
+          <textarea name="comment" class="form-control" maxlength="3000" rows="3"
+                    cols="80" placeholder="{% trans "Add a comment" %}" required></textarea>
+        </div>
+        <div class="card-footer d-flex">
+          {% include 'indigo_api/_task_buttons.html' %}
+          <button
+              class="btn btn-primary ms-auto" type="submit"
+              hx-target="#task-timeline-{{ task.pk }}"
+              name="next"
+              value="{% url 'task_timeline' place=task.place.place_code pk=task.pk %}?next_url={{ next_url }}"
+          >{% trans "Comment" %}</button>
+        </div>
+      </form>
+    {% else %}
+      <p>{% blocktrans %}Please <a href="{{ login_url }}">log in</a> to leave a comment.{% endblocktrans %}</p>
+    {% endif %}
+  </li>
+</ul>

indigo_app/templates/indigo_api/document/_secondary_pane.html

@@ -8,11 +8,12 @@
       <button class="nav-link" data-bs-toggle="tab" data-bs-target="#xml-pane">Akoma Ntoso</button>
     </li>
   {% endif %}
+  <button class="nav-link" data-bs-toggle="tab" data-bs-target="#tasks-pane">{% trans "Tasks" %}</button>
   <li class="ms-auto">
     <button class="btn btn-sm btn-close mt-2 me-2 document-secondary-pane-toggle"></button>
   </li>
 </ul>
-<div class="tab-content flex-grow-1">
+<div class="tab-content flex-grow-1 overflow-y-hidden">
   <div class="tab-pane show active h-100" id="source-attachment-pane">
     {% include "indigo_api/document/_source_att.html" %}
   </div>
@@ -23,4 +24,7 @@
       </div>
     </div>
   {% endif %}
+  <div class="tab-pane h-100" id="tasks-pane">
+    {% include "indigo_api/document/_task_list.html" %}
+  </div>
 </div>

indigo_app/templates/indigo_api/document/_task_detail.html

@@ -0,0 +1,11 @@
+{% load i18n %}
+
+<div class="card">
+  <div class="card-body">
+    {{ task.description|urlize|linebreaks }}
+  </div>
+</div>
+<div id="task-timeline-{{ task.pk }}">
+  {% url 'document_task_overview' place=task.place.place_code pk=task.pk as next_url%}
+  {% include 'indigo_api/_task_timeline.html' with next_url=next_url %}
+</div>