From 7d1e2ee4e7d50e7e09db231ea80d25158fa59a58 Mon Sep 17 00:00:00 2001
From: Charles <ce.marguerite@sudalys.fr>
Date: Wed, 11 Feb 2026 11:07:33 +0100
Subject: [PATCH] Dynamic display of activation status

---
 assets/controllers/user_controller.js | 88 ++++++++++-----------------
 templates/user/show.html.twig         | 24 +++-----
 2 files changed, 42 insertions(+), 70 deletions(-)

diff --git a/assets/controllers/user_controller.js b/assets/controllers/user_controller.js
index 52fe83b..4b11b53 100644
--- a/assets/controllers/user_controller.js
+++ b/assets/controllers/user_controller.js
@@ -18,7 +18,7 @@ export default class extends Controller {
         orgId: Number
     }
 
-    static targets = ["select"];
+    static targets = ["select", "statusButton"];
 
     connect() {
         this.roleSelect();
@@ -875,71 +875,47 @@ export default class extends Controller {
         });
     };
 
-    async deactivateUser(event) {
+    async toggleStatus(event) {
         event.preventDefault();
-        const userId = this.idValue;
 
-        if (!userId) {
-            console.error(`User ID not found!`);
-            return;
-        }
+        const button = this.statusButtonTarget;
+        const isActive = button.dataset.active === "true";
+        const newStatus = isActive ? 'deactivate' : 'activate';
+        const confirmMsg = isActive ? "Désactiver cet utilisateur ?" : "Réactiver cet utilisateur ?";
 
-        if (confirm(`Voulez-vous vraiment désactiver cet utilisateur ?`)) {
-            try {
-                const formData = new FormData();
-                formData.append('status', 'deactivate');
+        if (!confirm(confirmMsg)) return;
 
-                const response = await fetch(`/user/activeStatus/${userId}`, {
-                    method: 'POST',
-                    body: formData,
-                    headers: {'X-Requested-With': 'XMLHttpRequest'}
-                });
+        try {
+            const formData = new FormData();
+            formData.append('status', newStatus);
 
-                if (response.ok) {
-                    alert('Utilisateur désactivé avec succès');
-                    // If you need to refresh the UI, do it here
-                    // e.g., window.location.reload();
-                } else {
-                    const text = await response.text();
-                    alert('Erreur: ' + text);
-                }
-            } catch (err) {
-                alert('Erreur lors de la communication avec le serveur');
+            const response = await fetch(`/user/activeStatus/${this.idValue}`, {
+                method: 'POST',
+                body: formData,
+                headers: {'X-Requested-With': 'XMLHttpRequest'}
+            });
+
+            if (response.ok) {
+                this.updateButtonUI(!isActive);
+            } else {
+                alert('Erreur lors de la mise à jour');
             }
+        } catch (err) {
+            alert('Erreur de connexion');
         }
     }
 
-    async activateUser(event) {
-        event.preventDefault();
-        const userId = this.idValue;
+    updateButtonUI(nowActive) {
+        const btn = this.statusButtonTarget;
 
-        if (!userId) {
-            console.error(`User ID not found!`);
-            return;
-        }
-
-        if (confirm(`Voulez-vous vraiment activer cet utilisateur ?`)) {
-            try {
-                const formData = new FormData();
-                formData.append('status', 'activate');
-
-                const response = await fetch(`/user/activeStatus/${userId}`, {
-                    method: 'POST',
-                    body: formData,
-                    headers: {'X-Requested-With': 'XMLHttpRequest'}
-                });
-
-                if (response.ok) {
-                    alert('Utilisateur activé avec succès');
-                    // If you need to refresh the UI, do it here
-                    // e.g., window.location.reload();
-                } else {
-                    const text = await response.text();
-                    alert('Erreur: ' + text);
-                }
-            } catch (err) {
-                alert('Erreur lors de la communication avec le serveur');
-            }
+        if (nowActive) {
+            btn.textContent = "Désactiver";
+            btn.classList.replace("btn-success", "btn-secondary");
+            btn.dataset.active = "true";
+        } else {
+            btn.textContent = "Réactiver";
+            btn.classList.replace("btn-secondary", "btn-success");
+            btn.dataset.active = "false";
         }
     }
 }
\ No newline at end of file
diff --git a/templates/user/show.html.twig b/templates/user/show.html.twig
index 935c6f7..924a9bd 100644
--- a/templates/user/show.html.twig
+++ b/templates/user/show.html.twig
@@ -12,22 +12,18 @@
                 {% endfor %}
             {% endfor %}
                 <div class="card-header border-0 d-flex justify-content-between align-items-center ">
-                    <div class="card-title">
-                        <h1>Gestion Utilisateur</h1>
-                    </div>
+                    <div class="card-title"><h1>Gestion Utilisateur</h1></div>
                     <div class="d-flex gap-2">
                         {% if is_granted("ROLE_ADMIN") %}
-                            {% if user.active %}
-                                <button class="btn btn-secondary" data-action="click->user#deactivateUser">Désactiver</button>
-{#                                <a href="{{ path('user_active_status', {'id': user.id, 'status':'deactivate'}) }}"#}
-{#                                   class="btn btn-secondary">Désactiver</a>#}
-                            {% else %}
-                                <button class="btn btn-success" data-action="click->user#activateUser">Réactiver</button>
-{#                                <a href="{{ path('user_active_status', {'id': user.id, 'status':'activate'}) }}"#}
-{#                                   class="btn btn-success">Réactiver</a>#}
-                            {% endif %}
-                            <a href="{{ path('user_delete', {'id': user.id}) }}"
-                               class="btn btn-warning">Supprimer</a>
+                            <button
+                                    class="btn {{ user.active ? 'btn-secondary' : 'btn-success' }}"
+                                    data-user-target="statusButton"
+                                    data-action="click->user#toggleStatus"
+                                    data-active="{{ user.active ? 'true' : 'false' }}">
+                                {{ user.active ? 'Désactiver' : 'Réactiver' }}
+                            </button>
+
+                            <a href="{{ path('user_delete', {'id': user.id}) }}" class="btn btn-warning">Supprimer</a>
                         {% endif %}
                     </div>
                 </div>