Continue implementing WhatsApp

core/templates/partials/compose-workspace-contacts-widget.html

@@ -61,11 +61,6 @@
                     margin: 0;
                     white-space: nowrap;
                   ">
-                  <span
-                    class="tag is-dark"
-                    style="min-width: 2.5rem; justify-content: center;">
-                    <i class="{{ row.service_icon_class|default:manual_icon_class }}" aria-hidden="true"></i>
-                  </span>
                   <span
                     class="tag is-white"
                     style="
@@ -76,8 +71,7 @@
                       gap: 0.75rem;
                       padding-left: 0.7rem;
                       padding-right: 0.7rem;
-                      border-top: 1px solid rgba(0, 0, 0, 0.2);
-                      border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+                      border: 1px solid rgba(0, 0, 0, 0.2);
                       min-width: 0;
                     ">
                     <span

core/templates/partials/nav-contacts-dropdown.html

@@ -1,8 +1,7 @@
 {% if items %}
   {% for item in items %}
     <a class="navbar-item" href="{{ item.compose_url }}">
-      <span class="icon is-small"><i class="{{ item.service_icon_class|default:manual_icon_class }}"></i></span>
-      <span style="margin-left: 0.35rem;">
+      <span>
         {{ item.person_name }} · {{ item.service|title }}
         {% if not item.linked_person %}
           <small class="has-text-grey"> · unlinked</small>

core/templates/partials/signal-accounts.html

@@ -1,6 +1,5 @@
-{% load cache %}
 {% include 'mixins/partials/notify.html' %}
-{% cache 600 objects_signal_accounts request.user.id object_list type service %}
+<div id="{{ context_object_name|slugify }}-panel">
   {% if service_warning %}
     <article class="notification is-warning is-light" style="margin-bottom: 0.55rem;">
       {{ service_warning }}
@@ -8,10 +7,10 @@
   {% endif %}
   <table
     class="table is-fullwidth is-hoverable"
-    hx-target="#{{ context_object_name }}-table"
-    id="{{ context_object_name }}-table"
+    hx-target="#{{ context_object_name|slugify }}-panel"
+    id="{{ context_object_name|slugify }}-table"
     hx-swap="outerHTML"
-    hx-trigger="{{ context_object_name_singular }}Event from:body"
+    hx-trigger="{{ context_object_name_singular|slugify }}-event from:body"
     hx-get="{{ list_url }}">
     <thead>
       <th>{{ service_label|default:"Service" }} account</th>
@@ -24,12 +23,17 @@
           <div class="buttons">
             <button
               hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
-              hx-delete="{# url 'account_delete' type=type pk=item.id #}"
-              hx-trigger="click"
-              hx-target="#modals-here"
-              hx-swap="innerHTML"
-              hx-confirm="Are you sure you wish to unlink {{ item }}?"
-              class="button">
+              {% if account_unlink_url_name %}
+                hx-delete="{% url account_unlink_url_name type=type account=item %}"
+                hx-trigger="click"
+                hx-target="#{{ context_object_name|slugify }}-panel"
+                hx-swap="outerHTML"
+              {% endif %}
+              {% if account_unlink_url_name %}
+                hx-confirm="Are you sure you wish to unlink {{ item }}?"
+              {% endif %}
+              class="button"
+              {% if not account_unlink_url_name %}disabled{% endif %}>
               <span class="icon-text">
                 <span class="icon">
                   <i class="fa-solid fa-xmark"></i>
@@ -94,8 +98,8 @@
   <form
     hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
     hx-post="{% url account_add_url_name type=type %}"
-    hx-target="#widgets-here"
-    hx-swap="innerHTML">
+    hx-target="{% if account_add_target %}{{ account_add_target }}{% else %}#widgets-here{% endif %}"
+    hx-swap="{% if account_add_swap %}{{ account_add_swap }}{% else %}innerHTML{% endif %}">
     {% csrf_token %}
     <div class="field has-addons">
       <div id="device" class="control is-expanded has-icons-left">
@@ -122,4 +126,4 @@
       </div>
     </div>
   </form>
-{% endcache %}
+</div>

core/templates/partials/whatsapp-account-add.html

@@ -1,6 +1,15 @@
 <div class="whatsapp-account-add-fragment">
   {% if object.ok %}
-    <img src="data:image/png;base64, {{ object.image_b64 }}" alt="WhatsApp QR code" />
+    <img
+      src="data:image/png;base64, {{ object.image_b64 }}"
+      alt="WhatsApp QR code"
+      style="
+        display: block;
+        width: 100%;
+        max-width: 420px;
+        height: auto;
+        margin: 0 auto;
+      " />
     {% if object.warning %}
       <p class="is-size-7" style="margin-top: 0.6rem;">{{ object.warning }}</p>
     {% endif %}
@@ -27,8 +36,15 @@
         </form>
       {% endif %}
       {% if object.debug_lines %}
-        <details style="margin-top: 0.6rem;">
+        <details open style="margin-top: 0.6rem;">
           <summary><strong>Runtime Debug</strong></summary>
+          <button
+            type="button"
+            class="button is-small is-light"
+            style="margin-top: 0.45rem; margin-bottom: 0.35rem;"
+            onclick="navigator.clipboard.writeText(this.nextElementSibling.innerText); return false;">
+            Copy debug
+          </button>
           <article class="notification is-light" style="margin-top: 0.5rem; margin-bottom: 0;">
             <pre class="is-size-7" style="white-space: pre-wrap; margin: 0;">{% for line in object.debug_lines %}{{ line }}
 {% endfor %}</pre>