fix: make buttons always visible in AdminUserRestrictionsPage
Bottom bar changes: - Always visible when user selected (not hidden) - Buttons disabled when no changes (clearer state) - Moved outside inner block to prevent hiding Action column changes: - "↺ Zurück" button always visible per feature - Disabled when no override exists (grayed out) - Consistent button presence improves UX This fixes the issue where buttons were not shown because they were conditionally rendered. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
5ef6a80a1f
commit
ac56974e83
|
|
@ -434,15 +434,19 @@ export default function AdminUserRestrictionsPage() {
|
||||||
|
|
||||||
{/* Action */}
|
{/* Action */}
|
||||||
<td style={{ padding: '12px 16px', textAlign: 'right' }}>
|
<td style={{ padding: '12px 16px', textAlign: 'right' }}>
|
||||||
{override && (
|
<button
|
||||||
<button
|
className="btn btn-secondary"
|
||||||
className="btn btn-secondary"
|
onClick={() => handleChange(feature.id, '')}
|
||||||
onClick={() => handleChange(feature.id, '')}
|
disabled={!override}
|
||||||
style={{ padding: '4px 8px', fontSize: 11 }}
|
style={{
|
||||||
>
|
padding: '4px 8px',
|
||||||
↺ Zurück zu Standard
|
fontSize: 11,
|
||||||
</button>
|
opacity: override ? 1 : 0.4,
|
||||||
)}
|
cursor: override ? 'pointer' : 'not-allowed'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
↺ Zurück
|
||||||
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
|
|
@ -453,30 +457,6 @@ export default function AdminUserRestrictionsPage() {
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Fixed Bottom Bar */}
|
|
||||||
<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>
|
|
||||||
|
|
||||||
{/* Legend */}
|
{/* Legend */}
|
||||||
<div style={{
|
<div style={{
|
||||||
|
|
@ -493,6 +473,33 @@ export default function AdminUserRestrictionsPage() {
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* 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>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user