From b32f4ab243fb289b89a6b3dc5e2bb9be5905bba6 Mon Sep 17 00:00:00 2001
From: Aaron Kable <aaronkable@gmail.com>
Date: Sun, 21 Dec 2025 15:21:27 +0800
Subject: [PATCH 1/5] Async Join/Leave, and Datatables

---
 .../templates/groupmanagement/index.html      | 177 +++++++++++++++++-
 1 file changed, 167 insertions(+), 10 deletions(-)

diff --git a/allianceauth/groupmanagement/templates/groupmanagement/index.html b/allianceauth/groupmanagement/templates/groupmanagement/index.html
index 3171b055..0e748f90 100644
--- a/allianceauth/groupmanagement/templates/groupmanagement/index.html
+++ b/allianceauth/groupmanagement/templates/groupmanagement/index.html
@@ -30,7 +30,7 @@
                 {% translate "Leave Requests" %}
 
                 {% if leaverequests %}
-                    <span class="badge text-bg-secondary">{{ leaverequests|length }}</span>
+                    <span class="badge bg-secondary">{{ leaverequests|length }}</span>
                 {% endif %}
             </a>
         </li>
@@ -48,14 +48,15 @@
     <div class="tab-content">
         <div id="add" class="tab-pane active">
             {% if acceptrequests %}
-                <div class="table-responsive">
-                    <table class="table">
+                <div>
+                    <table id="table-add" class="table table-responsive">
                         <thead>
                             <tr>
                                 <th>{% translate "Character" %}</th>
                                 <th>{% translate "Organization" %}</th>
                                 <th>{% translate "Group" %}</th>
                                 <th></th>
+                                <th>{% translate "Corporation" %}</th>
                             </tr>
                         </thead>
 
@@ -89,13 +90,24 @@
                                     <td>{{ acceptrequest.group.name }}</td>
 
                                     <td class="text-end">
-                                        <a href="{% url 'groupmanagement:accept_request' acceptrequest.id %}" class="btn btn-success">
+                                        <div class="spinner-border spinner-border-sm mt-2 btns-join-{{acceptrequest.id}} d-none" role="status">
+                                            <span class="sr-only">Loading...</span>
+                                        </div>
+                                        <a id="{{acceptrequest.id}}" class="btn btn-success join-accept btns-join-{{acceptrequest.id}}">
                                             {% translate "Accept" %}
                                         </a>
-                                        <a href="{% url 'groupmanagement:reject_request' acceptrequest.id %}" class="btn btn-danger">
+                                        <a id="{{acceptrequest.id}}" class="btn btn-danger join-reject btns-join-{{acceptrequest.id}}">
                                             {% translate "Reject" %}
                                         </a>
                                     </td>
+                                    <td>
+                                        {% if acceptrequest.main_char %}
+                                            {{ acceptrequest.main_char.corporation_name }}
+                                        {% else %}
+                                            {% translate "(unknown)" %}
+                                        {% endif %}
+                                    </td>
+
                                 </tr>
                             {% endfor %}
                         </tbody>
@@ -111,14 +123,15 @@
         {% if not show_leave_tab %}
             <div id="leave" class="tab-pane">
                 {% if leaverequests %}
-                    <div class="table-responsive">
-                        <table class="table">
+                    <div class="">
+                        <table id="table-rem" class="table table-responsive">
                             <thead>
                                 <tr>
                                     <th>{% translate "Character" %}</th>
                                     <th>{% translate "Organization" %}</th>
                                     <th>{% translate "Group" %}</th>
                                     <th></th>
+                                    <th>{% translate "Corporation" %}</th>
                                 </tr>
                             </thead>
 
@@ -152,14 +165,23 @@
                                         <td>{{ leaverequest.group.name }}</td>
 
                                         <td class="text-end">
-                                            <a href="{% url 'groupmanagement:leave_accept_request' leaverequest.id %}" class="btn btn-success">
+                                            <div class="spinner-border spinner-border-sm mt-2 btns-leave-{{leaverequest.id}} d-none" role="status">
+                                                <span class="sr-only">Loading...</span>
+                                            </div>
+                                            <a id="{{leaverequest.id}}" class="btn btn-success accept leave-accept btns-leave-{{leaverequest.id}}">
                                                 {% translate "Accept" %}
                                             </a>
-
-                                            <a href="{% url 'groupmanagement:leave_reject_request' leaverequest.id %}" class="btn btn-danger">
+                                            <a id="{{leaverequest.id}}" class="btn btn-danger reject leave-reject btns-leave-{{leaverequest.id}}">
                                                 {% translate "Reject" %}
                                             </a>
                                         </td>
+                                        <td>
+                                            {% if leaverequest.main_char %}
+                                                {{ leaverequest.main_char.corporation_name }}
+                                            {% else %}
+                                                {% translate "(unknown)" %}
+                                            {% endif %}
+                                        </td>
                                     </tr>
                                 {% endfor %}
                             </tbody>
@@ -172,3 +194,138 @@
         {% endif %}
     </div>
 {% endblock content %}
+{% block extra_javascript %}
+    {% include 'bundles/datatables-js-bs5.html' %}
+    {% include "bundles/filterdropdown-js.html" %}
+    <script>
+        $(document).ready(function () {
+            let tableAdd = $("#table-add").DataTable({
+                filterDropDown: {
+                    columns: [
+                        {
+                            idx: 4,
+                        },
+                        {
+                            idx: 2,
+                        }
+                    ],
+                    bootstrap: true,
+                    bootstrap_version: 5
+                },
+                columnDefs: [
+                    {
+                        target: 4,
+                        visible: false,
+                    },
+                ],
+                paging: false,
+                responsive: true,
+                pageLength: -1
+            });
+            let tableRem = $("#table-rem").DataTable({
+                filterDropDown: {
+                    columns: [
+                        {
+                            idx: 4,
+                        },
+                        {
+                            idx: 2,
+                        }
+                    ],
+                    bootstrap: true,
+                    bootstrap_version: 5
+                },
+                columnDefs: [
+                    {
+                        target: 4,
+                        visible: false,
+                    },
+                ],
+                paging: false,
+                responsive: true,
+                pageLength: -1
+            });
+
+            // URL's for fetch requests
+            let acceptJoinURL = "{% url 'groupmanagement:accept_request' 0 %}";
+            acceptJoinURL = acceptJoinURL.substring(0, acceptJoinURL.length-2);
+            let rejectJoinURL = "{% url 'groupmanagement:reject_request' 0 %}";
+            rejectJoinURL = rejectJoinURL.substring(0, rejectJoinURL.length-2);
+            let acceptLeaveURL = "{% url 'groupmanagement:leave_accept_request' 0 %}";
+            acceptLeaveURL = acceptLeaveURL.substring(0, acceptLeaveURL.length-2);
+            let rejectLeaveURL = "{% url 'groupmanagement:leave_reject_request' 0 %}";
+            rejectLeaveURL = rejectLeaveURL.substring(0, rejectLeaveURL.length-2);
+
+            function removeRow(table, classLookup){
+                let btn = $(classLookup);
+                table.row($(btn[0]).parents('tr')).remove().draw();
+            }
+
+            function toggleButtons(classLookup){
+                let elems = document.querySelectorAll(classLookup);
+                elems.forEach(
+                    function(e) {
+                        e.classList.toggle('d-none');
+                    }
+                );
+            }
+
+            function hitAuth(classLookup, table, URL){
+                toggleButtons(classLookup);
+                fetch(URL)
+                    .then(response => {
+                        if (!response.ok) {
+                            toggleButtons(classLookup);
+                            return
+                        }
+                        removeRow(table, classLookup)
+                    })
+                    .catch(error => {
+                        toggleButtons(classLookup);
+                        return;
+                    });
+                toggleButtons(classLookup);
+            }
+
+            let acceptJoinButtons = document.querySelectorAll(".join-accept");
+            acceptJoinButtons.forEach(function(elem) {
+                elem.addEventListener("click", function(event) {
+                    url = `${acceptJoinURL}${event.target.id}/`
+                    let elemClass = `.btns-join-${event.target.id}`
+                    hitAuth(elemClass, tableAdd, url)
+                });
+            });
+
+            let rejectJoinButtons = document.querySelectorAll(".join-reject");
+            rejectJoinButtons.forEach(function(elem) {
+                elem.addEventListener("click", function(event) {
+                    url = `${rejectJoinURL}${event.target.id}/`
+                    let elemClass = `.btns-join-${event.target.id}`
+                    hitAuth(elemClass, tableAdd, url)
+                });
+            });
+
+            let acceptLeaveButtons = document.querySelectorAll(".leave-accept");
+            acceptLeaveButtons.forEach(function(elem) {
+                elem.addEventListener("click", function(event) {
+                    url = `${acceptLeaveURL}${event.target.id}/`
+                    let elemClass = `.btns-leave-${event.target.id}`
+                    hitAuth(elemClass, tableRem, url)
+                });
+            });
+
+            let rejectLeaveButtons = document.querySelectorAll(".leave-reject");
+            rejectLeaveButtons.forEach(function(elem) {
+                elem.addEventListener("click", function(event) {
+                    url = `${rejectLeaveURL}${event.target.id}/`
+                    let elemClass = `.btns-leave-${event.target.id}`
+                    hitAuth(elemClass, tableRem, url)
+                });
+            });
+
+        });
+    </script>
+{% endblock extra_javascript %}
+{% block extra_css %}
+    {% include 'bundles/datatables-css-bs5.html' %}
+{% endblock %}

From 0c0f2fd5ba4b10d8f35406fb9d9664a76a7c3348 Mon Sep 17 00:00:00 2001
From: Aaron Kable <aaronkable@gmail.com>
Date: Sun, 21 Dec 2025 15:30:26 +0800
Subject: [PATCH 2/5] minor fixes

---
 .../groupmanagement/templates/groupmanagement/index.html     | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/allianceauth/groupmanagement/templates/groupmanagement/index.html b/allianceauth/groupmanagement/templates/groupmanagement/index.html
index 0e748f90..ebe7b725 100644
--- a/allianceauth/groupmanagement/templates/groupmanagement/index.html
+++ b/allianceauth/groupmanagement/templates/groupmanagement/index.html
@@ -30,7 +30,7 @@
                 {% translate "Leave Requests" %}
 
                 {% if leaverequests %}
-                    <span class="badge bg-secondary">{{ leaverequests|length }}</span>
+                    <span class="badge text-bg-secondary">{{ leaverequests|length }}</span>
                 {% endif %}
             </a>
         </li>
@@ -43,7 +43,6 @@
     </li>
 {% endblock header_nav_collapse_left %}
 
-
 {% block content %}
     <div class="tab-content">
         <div id="add" class="tab-pane active">
@@ -123,7 +122,7 @@
         {% if not show_leave_tab %}
             <div id="leave" class="tab-pane">
                 {% if leaverequests %}
-                    <div class="">
+                    <div>
                         <table id="table-rem" class="table table-responsive">
                             <thead>
                                 <tr>

From 70caf7606c778d7a5ba80c32c5b93eef305d5de9 Mon Sep 17 00:00:00 2001
From: Aaron Kable <aaronkable@gmail.com>
Date: Fri, 9 Jan 2026 11:33:16 +0800
Subject: [PATCH 3/5] Add the id's for counters

---
 .../templates/groupmanagement/index.html       | 18 ++++++++++++++----
 allianceauth/static/allianceauth/js/sidebar.js |  2 +-
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/allianceauth/groupmanagement/templates/groupmanagement/index.html b/allianceauth/groupmanagement/templates/groupmanagement/index.html
index ebe7b725..084b72a2 100644
--- a/allianceauth/groupmanagement/templates/groupmanagement/index.html
+++ b/allianceauth/groupmanagement/templates/groupmanagement/index.html
@@ -19,7 +19,7 @@
             {% translate "Join Requests" %}
 
             {% if acceptrequests %}
-                <span class="badge text-bg-secondary">{{ acceptrequests|length }}</span>
+                <span id="acceptRequestsCounter" class="badge text-bg-secondary">{{ acceptrequests|length }}</span>
             {% endif %}
         </a>
     </li>
@@ -30,7 +30,7 @@
                 {% translate "Leave Requests" %}
 
                 {% if leaverequests %}
-                    <span class="badge text-bg-secondary">{{ leaverequests|length }}</span>
+                    <span id="leaveRequestsCounter" class="badge text-bg-secondary">{{ leaverequests|length }}</span>
                 {% endif %}
             </a>
         </li>
@@ -48,7 +48,7 @@
         <div id="add" class="tab-pane active">
             {% if acceptrequests %}
                 <div>
-                    <table id="table-add" class="table table-responsive">
+                    <table id="table-add" class="table table-responsive w-100">
                         <thead>
                             <tr>
                                 <th>{% translate "Character" %}</th>
@@ -123,7 +123,7 @@
             <div id="leave" class="tab-pane">
                 {% if leaverequests %}
                     <div>
-                        <table id="table-rem" class="table table-responsive">
+                        <table id="table-rem" class="table table-responsive w-100">
                             <thead>
                                 <tr>
                                     <th>{% translate "Character" %}</th>
@@ -322,6 +322,16 @@
                 });
             });
 
+            // Filter Dropdown sets widths so lets remove them when we tab change so they actually show.
+            $('a[data-bs-toggle="tab"]').on('shown.bs.tab', function (e) {
+                let elems = document.querySelectorAll(".form-select");
+                elems.forEach(
+                    function(e) {
+                        e.style.maxWidth = "";
+                    }
+                );
+            });
+
         });
     </script>
 {% endblock extra_javascript %}
diff --git a/allianceauth/static/allianceauth/js/sidebar.js b/allianceauth/static/allianceauth/js/sidebar.js
index 6d9303a3..8da8e647 100644
--- a/allianceauth/static/allianceauth/js/sidebar.js
+++ b/allianceauth/static/allianceauth/js/sidebar.js
@@ -20,7 +20,7 @@ $(document).ready(() => {
 
         if (badges.length > 0 && notificationCount > 0) {
             const notificationBadge = document.createElement('span');
-
+            notificationBadge.id = "globalNotificationCount";
             notificationBadge.classList.add(
                 'badge',
                 'text-bg-danger',

From 648733d5379ad02fdae7af7f98f126b2ae177e90 Mon Sep 17 00:00:00 2001
From: Aaron Kable <aaronkable@gmail.com>
Date: Fri, 9 Jan 2026 11:47:44 +0800
Subject: [PATCH 4/5] reset counters

---
 .../templates/groupmanagement/index.html      | 39 +++++++++++++++----
 1 file changed, 32 insertions(+), 7 deletions(-)

diff --git a/allianceauth/groupmanagement/templates/groupmanagement/index.html b/allianceauth/groupmanagement/templates/groupmanagement/index.html
index 084b72a2..c35874a1 100644
--- a/allianceauth/groupmanagement/templates/groupmanagement/index.html
+++ b/allianceauth/groupmanagement/templates/groupmanagement/index.html
@@ -271,19 +271,32 @@
 
             function hitAuth(classLookup, table, URL){
                 toggleButtons(classLookup);
-                fetch(URL)
+                let output = fetch(URL)
                     .then(response => {
                         if (!response.ok) {
                             toggleButtons(classLookup);
-                            return
+                            return true;
                         }
                         removeRow(table, classLookup)
                     })
                     .catch(error => {
                         toggleButtons(classLookup);
-                        return;
+                        return false;
                     });
                 toggleButtons(classLookup);
+                return output;
+            }
+
+            function decreaseCounter(id){
+                elem = document.getElementById(id);
+                console.log(elem);
+                count = Number(elem.innerText);
+                count -= 1;
+                if (!count){
+                    elem.classList.add("d-none");
+                } else {
+                    elem.innerText = count;
+                }
             }
 
             let acceptJoinButtons = document.querySelectorAll(".join-accept");
@@ -291,7 +304,10 @@
                 elem.addEventListener("click", function(event) {
                     url = `${acceptJoinURL}${event.target.id}/`
                     let elemClass = `.btns-join-${event.target.id}`
-                    hitAuth(elemClass, tableAdd, url)
+                    if (hitAuth(elemClass, tableAdd, url)){
+                        decreaseCounter("acceptRequestsCounter")
+                        decreaseCounter("globalNotificationCount")
+                    }
                 });
             });
 
@@ -300,7 +316,10 @@
                 elem.addEventListener("click", function(event) {
                     url = `${rejectJoinURL}${event.target.id}/`
                     let elemClass = `.btns-join-${event.target.id}`
-                    hitAuth(elemClass, tableAdd, url)
+                    if (hitAuth(elemClass, tableAdd, url)){
+                        decreaseCounter("acceptRequestsCounter")
+                        decreaseCounter("globalNotificationCount")
+                    }
                 });
             });
 
@@ -309,7 +328,10 @@
                 elem.addEventListener("click", function(event) {
                     url = `${acceptLeaveURL}${event.target.id}/`
                     let elemClass = `.btns-leave-${event.target.id}`
-                    hitAuth(elemClass, tableRem, url)
+                    if (hitAuth(elemClass, tableRem, url)){
+                        decreaseCounter("leaveRequestsCounter")
+                        decreaseCounter("globalNotificationCount")
+                    }
                 });
             });
 
@@ -318,7 +340,10 @@
                 elem.addEventListener("click", function(event) {
                     url = `${rejectLeaveURL}${event.target.id}/`
                     let elemClass = `.btns-leave-${event.target.id}`
-                    hitAuth(elemClass, tableRem, url)
+                    if (hitAuth(elemClass, tableRem, url)){
+                        decreaseCounter("leaveRequestsCounter")
+                        decreaseCounter("globalNotificationCount")
+                    }
                 });
             });
 

From 2a3d775a9b7270e944a6065601182d7ae6fd96dd Mon Sep 17 00:00:00 2001
From: Aaron Kable <aaronkable@gmail.com>
Date: Fri, 9 Jan 2026 12:23:04 +0800
Subject: [PATCH 5/5] add icon remoaval

---
 .../templates/groupmanagement/index.html      | 30 ++++++++++++++-----
 1 file changed, 23 insertions(+), 7 deletions(-)

diff --git a/allianceauth/groupmanagement/templates/groupmanagement/index.html b/allianceauth/groupmanagement/templates/groupmanagement/index.html
index c35874a1..ada6b93d 100644
--- a/allianceauth/groupmanagement/templates/groupmanagement/index.html
+++ b/allianceauth/groupmanagement/templates/groupmanagement/index.html
@@ -287,9 +287,7 @@
                 return output;
             }
 
-            function decreaseCounter(id){
-                elem = document.getElementById(id);
-                console.log(elem);
+            function decreaseCounterElement(elem){
                 count = Number(elem.innerText);
                 count -= 1;
                 if (!count){
@@ -299,6 +297,24 @@
                 }
             }
 
+            function decreaseCounter(id){
+                elem = document.getElementById(id);
+                if (elem){decreaseCounterElement(elem)}
+            }
+
+            function decreaseMenuCounter(){
+                decreaseCounter("globalNotificationCount");
+                let elem = document.querySelector("a[href='{% url "groupmanagement:management" %}']");
+                if (elem) {
+                    let badge = elem.parentElement.querySelector("span");
+                    if (badge){decreaseCounterElement(badge)}
+                    if (elem.parentElement.parentElement.parentElement.tagName === "LI"){
+                        let folderBadge = elem.parentElement.parentElement.parentElement.querySelector("span");
+                        if (folderBadge){decreaseCounterElement(folderBadge)}
+                    }
+                }
+            }
+
             let acceptJoinButtons = document.querySelectorAll(".join-accept");
             acceptJoinButtons.forEach(function(elem) {
                 elem.addEventListener("click", function(event) {
@@ -306,7 +322,7 @@
                     let elemClass = `.btns-join-${event.target.id}`
                     if (hitAuth(elemClass, tableAdd, url)){
                         decreaseCounter("acceptRequestsCounter")
-                        decreaseCounter("globalNotificationCount")
+                        decreaseMenuCounter()
                     }
                 });
             });
@@ -318,7 +334,7 @@
                     let elemClass = `.btns-join-${event.target.id}`
                     if (hitAuth(elemClass, tableAdd, url)){
                         decreaseCounter("acceptRequestsCounter")
-                        decreaseCounter("globalNotificationCount")
+                        decreaseMenuCounter()
                     }
                 });
             });
@@ -330,7 +346,7 @@
                     let elemClass = `.btns-leave-${event.target.id}`
                     if (hitAuth(elemClass, tableRem, url)){
                         decreaseCounter("leaveRequestsCounter")
-                        decreaseCounter("globalNotificationCount")
+                        decreaseMenuCounter()
                     }
                 });
             });
@@ -342,7 +358,7 @@
                     let elemClass = `.btns-leave-${event.target.id}`
                     if (hitAuth(elemClass, tableRem, url)){
                         decreaseCounter("leaveRequestsCounter")
-                        decreaseCounter("globalNotificationCount")
+                        decreaseMenuCounter()
                     }
                 });
             });