Allow editing of actions (#77)

* Remove unused CSS files * Add fallback if referenced user isn't in database * Add basic functionality for editing an action * Match user tags based on ID, user- or display name This allows you to tag people in actions with e.g. <@greg Tyler> rather than needing to know their user ID
ministryofjustice · Apr 21, 2021 · 2cc9263 · 2cc9263
1 parent c5b43a1
commit 2cc9263
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 126 deletions.
diff --git a/nginx/webpack/src/action.js b/nginx/webpack/src/action.js
@@ -5,12 +5,16 @@ function Actions ($module) {
   this.$module = $module;
   this.incidentId = $module.getAttribute('data-incident-id');
   this.$actions = $module.querySelectorAll('input[type="checkbox"]');
+  this.$actionLabels = $module.querySelectorAll('label');
 }
 
 Actions.prototype.init = function init() {
   nodeListForEach(this.$actions, $action => {
     $action.addEventListener('change', this.handleCheck.bind(this));
   });
+  nodeListForEach(this.$actionLabels, $action => {
+    $action.addEventListener('click', this.handleClickLabel.bind(this));
+  });
 }
 
 Actions.prototype.handleCheck = function handleCheck(event) {
@@ -23,4 +27,25 @@ Actions.prototype.handleCheck = function handleCheck(event) {
   api('PATCH', `/incidents/${this.incidentId}/actions/${actionId}/`, form);
 }
 
+Actions.prototype.handleClickLabel = function handleClickLabel(event) {
+  if (event.target.tagName !== 'LABEL') return;
+
+  event.preventDefault();
+  event.stopPropagation();
+
+  const checkbox = document.getElementById(event.target.getAttribute('for'));
+  const actionId = checkbox.value;
+
+  const description = prompt('Enter a new action description\n\nTag a user with <@SlackIdOrName>', event.target.getAttribute('data-raw'));
+
+  if (description) {
+    const form = new FormData();
+    form.set('details', description);
+
+    api('PATCH', `/incidents/${this.incidentId}/actions/${actionId}/`, form).then(() => {
+      window.location.reload();
+    })
+  }
+}
+
 export default Actions;
diff --git a/opgincidentresponse/static/common.css b/opgincidentresponse/static/common.css
diff --git a/opgincidentresponse/static/incident_doc.css b/opgincidentresponse/static/incident_doc.css
diff --git a/opgincidentresponse/templates/incident.html b/opgincidentresponse/templates/incident.html
@@ -90,7 +90,7 @@ <h2 class="govuk-heading-l">Actions</h2>
                             {% for action in actions %}
                                 <div class="govuk-checkboxes__item">
                                     <input class="govuk-checkboxes__input" id="action-{{ action.id }}" name="action[{{action.id}}]" value="{{ action.id }}" type="checkbox" {% if action.done %}checked{% endif %}>
-                                    <label class="govuk-label govuk-checkboxes__label" for="action-{{ action.id }}">
+                                    <label class="govuk-label govuk-checkboxes__label" for="action-{{ action.id }}" data-raw="{{ action.details | safe | escape_quote | safe }}">
                                         {{ action.details | slack_format | unslackify | safe }}
                                     </label>
                                 </div>

diff --git a/opgincidentresponse/templatetags/opg_response.py b/opgincidentresponse/templatetags/opg_response.py
@@ -2,6 +2,7 @@
 
 from django import template
 from django.conf import settings
+from django.db.models import Q
 from response.core.models import ExternalUser
 
 register = template.Library()
@@ -13,10 +14,15 @@ def slack_format(value):
 
     value = value.replace('<', '&lt;').replace('>', '&gt;')
 
-    user_links = re.findall(r"&lt;@(U.+?)&gt;", value)
+    user_links = re.findall(r"&lt;@(.+?)&gt;", value)
 
     for user_id in user_links:
-        user = ExternalUser.objects.get(external_id=user_id)
+        try:
+            user = ExternalUser.objects.get(
+                Q(external_id=user_id) | Q(display_name__iexact=user_id) | Q(full_name__iexact=user_id)
+            )
+        except:
+            user = ExternalUser(external_id=user_id, full_name='@' + user_id)
 
         value = value.replace('&lt;@' + user_id + '&gt;', '<a class="govuk-link" href="slack://user?team=T02DYEB3A&amp;id=' + user.external_id + '">' + user.full_name + '</a>')
 
@@ -28,6 +34,10 @@ def slack_format(value):
 
     return value.replace('\n', '<br />')
 
+@register.filter
+def escape_quote(value):
+    return value.replace('"', '&quot;')
+
 @register.filter
 def slack_dm_link(id):
     return 'slack://user?team=' + settings.SLACK_TEAM_ID + '&id=' + id