diff --git a/generic/templates/generic/cid_group_view_detail.html b/generic/templates/generic/cid_group_view_detail.html
index ad934e5c..3b274bfb 100755
--- a/generic/templates/generic/cid_group_view_detail.html
+++ b/generic/templates/generic/cid_group_view_detail.html
@@ -38,17 +38,17 @@
{% if group_type == 'cid' %}
-
+
+
+
+
{% endif %}
@@ -104,15 +104,15 @@
{% else %}
{% endif %}
@@ -205,5 +205,47 @@
.finally(()=>{ if(btn){ const s = btn.querySelector('.spinner-border'); if(s) s.remove(); btn.disabled = false; } });
});
});
+
+ // Visual indicators for HTMX add/remove actions
+ document.addEventListener('DOMContentLoaded', function(){
+ document.body.addEventListener('htmx:beforeRequest', function(evt){
+ try{
+ const elt = evt.detail.elt;
+ if(!elt) return;
+ const btn = elt.closest && elt.closest('.hx-action-btn') ? elt.closest('.hx-action-btn') : (elt.classList && elt.classList.contains('hx-action-btn') ? elt : null);
+ if(!btn) return;
+ // stash original HTML for restore
+ btn.dataset._origHtml = btn.innerHTML;
+ btn.disabled = true;
+ const spinner = document.createElement('span');
+ spinner.className = 'spinner-border spinner-border-sm ms-2';
+ spinner.setAttribute('role','status'); spinner.setAttribute('aria-hidden','true');
+ spinner.dataset._hx_spinner = '1';
+ btn.appendChild(spinner);
+ }catch(e){ console.error(e); }
+ });
+
+ document.body.addEventListener('htmx:afterRequest', function(evt){
+ try{
+ const elt = evt.detail.elt;
+ if(!elt) return;
+ const btn = elt.closest && elt.closest('.hx-action-btn') ? elt.closest('.hx-action-btn') : (elt.classList && elt.classList.contains('hx-action-btn') ? elt : null);
+ if(!btn) return;
+ // remove spinner(s)
+ const sp = btn.querySelectorAll('span[data-_hx_spinner]');
+ sp.forEach(s => s.remove());
+ // show transient status
+ const status = document.createElement('span');
+ status.className = 'badge bg-success ms-2 hx-action-status';
+ status.textContent = 'Done';
+ btn.appendChild(status);
+ // restore after short delay
+ setTimeout(function(){
+ if(btn.dataset._origHtml){ btn.innerHTML = btn.dataset._origHtml; delete btn.dataset._origHtml; }
+ btn.disabled = false;
+ }, 1500);
+ }catch(e){ console.error(e); }
+ });
+ });
{% endblock %}
\ No newline at end of file