From b1a1925360be43b3760e85a9301005ca16ca116d Mon Sep 17 00:00:00 2001
From: Lars <Lars@stommer.de>
Date: Fri, 20 Mar 2026 08:45:06 +0100
Subject: [PATCH] fix: move buttons to header and add legacy system warning

Button position fixed:
- Moved from fixed bottom bar to header (like TierLimitsPage)
- No longer covers bottom navigation menu
- Always visible when user selected
- "Abbrechen" only shown when changes exist

Legacy system warning added:
- Yellow warning box explaining old permission system
- Old system: ai_enabled, ai_limit_day, export_enabled in profiles table
- New system: feature_restrictions table with overrides
- Warning: both systems can conflict, new system has priority
- Recommendation: use only feature-overrides going forward

This addresses:
1. UI overlap issue (buttons covering navigation)
2. System architecture confusion (two permission systems)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../src/pages/AdminUserRestrictionsPage.jsx   | 76 ++++++++++++-------
 1 file changed, 48 insertions(+), 28 deletions(-)

diff --git a/frontend/src/pages/AdminUserRestrictionsPage.jsx b/frontend/src/pages/AdminUserRestrictionsPage.jsx
index 9364526..b6bd565 100644
--- a/frontend/src/pages/AdminUserRestrictionsPage.jsx
+++ b/frontend/src/pages/AdminUserRestrictionsPage.jsx
@@ -252,6 +252,24 @@ export default function AdminUserRestrictionsPage() {
         </div>
       </div>
 
+      {/* Legacy System Warning */}
+      <div style={{
+        padding: 12, background: '#FFF3CD', borderRadius: 8,
+        marginBottom: 16, fontSize: 12, color: '#856404',
+        display: 'flex', gap: 8, alignItems: 'flex-start',
+        border: '1px solid #FFE69C'
+      }}>
+        <AlertCircle size={16} style={{ marginTop: 2, flexShrink: 0 }} />
+        <div>
+          <strong>⚠️ Legacy-System aktiv:</strong> In der Benutzerverwaltung existiert noch das alte Berechtigungssystem
+          ("KI-Analysen erlaubt", "Max. KI-Calls/Tag", "Daten-Export erlaubt").
+          Diese Einstellungen können mit den neuen Feature-Overrides kollidieren.
+          <strong> Das neue Feature-Override-System hat Vorrang.</strong>
+          <br/><br/>
+          <strong>Empfehlung:</strong> Verwende nur noch Feature-Overrides. Das alte System wird in einer zukünftigen Version entfernt.
+        </div>
+      </div>
+
       {/* Messages */}
       {error && (
         <div style={{
@@ -293,6 +311,34 @@ export default function AdminUserRestrictionsPage() {
       {/* User Info + Features */}
       {selectedUser && (
         <>
+          {/* Action Buttons */}
+          <div style={{
+            display: 'flex', alignItems: 'center', justifyContent: 'space-between',
+            marginBottom: 16
+          }}>
+            <div style={{ fontSize: 16, fontWeight: 600 }}>
+              Feature-Overrides für {selectedUser.name}
+            </div>
+            <div style={{ display: 'flex', gap: 8 }}>
+              {hasChanges && (
+                <button
+                  className="btn btn-secondary"
+                  onClick={() => setChanges({})}
+                  disabled={saving}
+                >
+                  <X size={14} /> Abbrechen
+                </button>
+              )}
+              <button
+                className="btn btn-primary"
+                onClick={handleSave}
+                disabled={!hasChanges || saving}
+              >
+                {saving ? 'Speichern...' : hasChanges ? `${Object.keys(changes).length} Änderung(en) speichern` : 'Keine Änderungen'}
+              </button>
+            </div>
+          </div>
+
           {/* User Info Card */}
           <div className="card" style={{ padding: 16, marginBottom: 16 }}>
             <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
@@ -321,7 +367,7 @@ export default function AdminUserRestrictionsPage() {
           </div>
 
           {/* Features Table */}
-          <div className="card" style={{ padding: 0, overflow: 'auto', marginBottom: 80 }}>
+          <div className="card" style={{ padding: 0, overflow: 'auto', marginBottom: 16 }}>
             <table style={{ width: '100%', borderCollapse: 'collapse', fontSize: 13 }}>
               <thead>
                 <tr style={{ background: 'var(--surface2)' }}>
@@ -461,7 +507,7 @@ export default function AdminUserRestrictionsPage() {
           {/* Legend */}
           <div style={{
             marginTop: 16, padding: 12, background: 'var(--surface2)',
-            borderRadius: 8, fontSize: 12, color: 'var(--text3)', marginBottom: 100
+            borderRadius: 8, fontSize: 12, color: 'var(--text3)'
           }}>
             <strong>Eingabe:</strong>
             <div style={{ marginTop: 8, display: 'flex', gap: 24, flexWrap: 'wrap' }}>
@@ -474,32 +520,6 @@ export default function AdminUserRestrictionsPage() {
         </>
       )}
 
-      {/* Fixed Bottom Bar - Always visible when user selected */}
-      {selectedUser && (
-        <div style={{
-          position: 'fixed', bottom: 0, left: 0, right: 0,
-          background: 'var(--bg)', borderTop: '1px solid var(--border)',
-          padding: 16, display: 'flex', gap: 8, zIndex: 100,
-          boxShadow: '0 -2px 10px rgba(0,0,0,0.1)'
-        }}>
-          <button
-            className="btn btn-secondary"
-            onClick={() => setChanges({})}
-            disabled={!hasChanges || saving}
-            style={{ flex: 1 }}
-          >
-            <X size={14} /> Abbrechen
-          </button>
-          <button
-            className="btn btn-primary"
-            onClick={handleSave}
-            disabled={!hasChanges || saving}
-            style={{ flex: 2 }}
-          >
-            {saving ? 'Speichern...' : hasChanges ? `${Object.keys(changes).length} Änderung(en) speichern` : 'Keine Änderungen'}
-          </button>
-        </div>
-      )}
     </div>
   )
 }