From cdd041c172b86b593f8b43340864f7bd2892b606 Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Sat, 10 Jan 2026 10:21:12 +0000
Subject: [PATCH] feat: Group functions in edit modal

---
 index.php | 41 +++++++++++++++++++++++++++++------------
 1 file changed, 29 insertions(+), 12 deletions(-)

diff --git a/index.php b/index.php
index 2e36d3c..e14bf53 100644
--- a/index.php
+++ b/index.php
@@ -601,19 +601,36 @@ document.addEventListener('DOMContentLoaded', function () {
                     const functionsSelect = document.getElementById('editRoles');
                     functionsSelect.innerHTML = ''; // Clear existing options
 
-                    data.all_functions.forEach(func => {
-                        const option = document.createElement('option');
-                        option.value = func.id;
-                        let textContent = func.name;
-                        if (func.group_name) {
-                            textContent += ' (' + func.group_name + ')';
+                    const functionsSelect = document.getElementById('editRoles');
+                    functionsSelect.innerHTML = ''; // Clear existing options
+
+                    // Group functions by group name
+                    const groupedFunctions = data.all_functions.reduce((acc, func) => {
+                        const groupName = func.group_name || 'Other';
+                        if (!acc[groupName]) {
+                            acc[groupName] = [];
                         }
-                        option.textContent = textContent;
-                        if (data.person_functions.map(String).includes(String(func.id))) {
-                            option.selected = true;
-                        }
-                        functionsSelect.appendChild(option);
-                    });
+                        acc[groupName].push(func);
+                        return acc;
+                    }, {});
+
+                    // Populate the select with optgroups
+                    for (const groupName in groupedFunctions) {
+                        const optgroup = document.createElement('optgroup');
+                        optgroup.label = groupName;
+
+                        groupedFunctions[groupName].forEach(func => {
+                            const option = document.createElement('option');
+                            option.value = func.id;
+                            option.textContent = func.name;
+                            if (data.person_functions.map(String).includes(String(func.id))) {
+                                option.selected = true;
+                            }
+                            optgroup.appendChild(option);
+                        });
+
+                        functionsSelect.appendChild(optgroup);
+                    }
                 });
         });
     }