UI: фильтр и inline-селект подразделений — та же иерархия optgroup

frontend/src/pages/UsersAdmin.jsx

@@ -354,7 +354,13 @@ const UsersAdmin = () => {
         />
         <select value={filterUnit} onChange={(e) => setFilterUnit(e.target.value)}>
           <option value="">Все подразделения</option>
-          {units.map((u) => <option key={u.id} value={u.id}>{u.name}</option>)}
+          {unitsTree.rcu.map((u) => <option key={u.id} value={u.id}>{u.name}</option>)}
+          {unitsTree.obl.map((u) => <option key={u.id} value={u.id}>{u.name}</option>)}
+          {unitsTree.groups.map((g) => (
+            <optgroup key={g.label} label={g.label}>
+              {g.items.map((u) => <option key={u.id} value={u.id}>{u.name}</option>)}
+            </optgroup>
+          ))}
         </select>
         <button className="us-reload" onClick={load}>↻</button>
       </div>
@@ -384,7 +390,13 @@ const UsersAdmin = () => {
                 <td>
                   <select value={u.unit_id || ''} onChange={(e) => changeUnit(u, e.target.value)} className="us-unit-select">
                     <option value="">—</option>
-                    {units.map((un) => <option key={un.id} value={un.id}>{un.name}</option>)}
+                    {unitsTree.rcu.map((un) => <option key={un.id} value={un.id}>{un.name}</option>)}
+                    {unitsTree.obl.map((un) => <option key={un.id} value={un.id}>{un.name}</option>)}
+                    {unitsTree.groups.map((g) => (
+                      <optgroup key={g.label} label={g.label}>
+                        {g.items.map((un) => <option key={un.id} value={un.id}>{un.name}</option>)}
+                      </optgroup>
+                    ))}
                   </select>
                 </td>
                 <td><span className={`us-status ${STATUS_CLASS[u.status] || ''}`}>{STATUS_LABEL[u.status] || u.status}</span></td>