<!DOCTYPE html>
<html>
<head>
    <title>Edit User</title>
    <style>
        body {
            background-color: white;
            color: black;
            font-family: monospace;
            margin: 20px;
        }
        input, select {
            font-family: monospace;
            border: 1px solid black;
            padding: 5px;
            width: 200px;
        }
        .form-group {
            margin: 15px 0;
        }
        .form-group label {
            display: inline-block;
            width: 150px;
            vertical-align: top;
        }
        .section {
            margin: 20px 0;
            padding: 15px;
            border: 1px solid #ccc;
            background-color: #f9f9f9;
        }
        .error {
            color: red;
            margin: 10px 0;
        }
        .nav-links {
            margin-bottom: 20px;
            padding-bottom: 10px;
            border-bottom: 1px solid #ccc;
        }
        .nav-links a {
            margin-right: 15px;
            text-decoration: none;
            color: #007bff;
        }
        .nav-links a:hover {
            text-decoration: underline;
        }
        .btn {
            padding: 8px 16px;
            margin-right: 10px;
            border: 1px solid #ccc;
            background-color: #f8f9fa;
            color: black;
            text-decoration: none;
            display: inline-block;
        }
        .btn:hover {
            background-color: #e9ecef;
        }
        .btn-primary {
            background-color: #007bff;
            color: white;
            border-color: #007bff;
        }
        .btn-primary:hover {
            background-color: #0056b3;
        }
        .help-text {
            font-size: 0.9em;
            color: #666;
            margin-left: 160px;
            margin-top: 5px;
        }
        .user-info {
            background-color: #e9ecef;
            padding: 10px;
            margin: 10px 0;
            border: 1px solid #ccc;
        }
    </style>
</head>
<body>
    <div class="nav-links">
        <a href="/admin/users">← Back to Users</a>
        <a href="/admin">Admin Panel</a>
        <a href="/logout">Logout</a>
        <div style="float: right; font-size: 12px; color: #666;">👤 {{ handler.get_display_username() }}</div>
    </div>
    
    <h2>Edit User</h2>
    
    {% if error %}
        <div class="error">{{ escape(error) }}</div>
    {% end %}
    
    <div class="section">
        <div class="user-info">
            <strong>User ID:</strong> {{ user['id'] }}<br>
            <strong>Created:</strong> {{ user['created_at'][:19] if user['created_at'] else 'N/A' }}<br>
            <strong>Last Login:</strong> {{ user['last_login'][:19] if user['last_login'] else 'Never' }}
        </div>
        
        <form method="POST">
            {% raw xsrf_form_html() %}
            
            <div class="form-group">
                <label for="username">Username:</label>
                <input type="text" id="username" name="username" required 
                       pattern="[a-zA-Z0-9_-]+" 
                       title="Username can only contain letters, numbers, underscores, and hyphens"
                       minlength="3" maxlength="50"
                       value="{{ escape(user['username']) }}">
                <div class="help-text">3-50 characters, letters, numbers, underscore, and hyphen only</div>
            </div>
            
            {% if not settings.get('ldap_server') %}
            <div class="form-group">
                <label for="password">New Password:</label>
                <input type="password" id="password" name="password" minlength="6">
                <div class="help-text">Leave blank to keep current password, minimum 6 characters if changing</div>
            </div>
            {% else %}
            <div class="form-group">
                <label>Password Management:</label>
                <div class="info">
                    <p><strong>LDAP User:</strong> Password changes are managed through the LDAP directory.</p>
                    <p>To change this user's password, use your organization's LDAP management tools.</p>
                </div>
            </div>
            {% end %}
            
            <div class="form-group">
                <label for="role">Role:</label>
                <select id="role" name="role">
                    <option value="user" {% if user['role'] == 'user' %}selected{% end %}>User</option>
                    <option value="admin" {% if user['role'] == 'admin' %}selected{% end %}>Admin</option>
                </select>
                <div class="help-text">Admin users can manage other users and system settings</div>
            </div>
            
            <div class="form-group">
                <label for="active">Status:</label>
                <input type="checkbox" id="active" name="active" {% if user['active'] %}checked{% end %} style="width: auto;">
                <label for="active" style="width: auto; margin-left: 5px;">Active</label>
                <div class="help-text">Inactive users cannot log in</div>
            </div>
            
            <div class="form-group">
                <label></label>
                <input type="submit" value="Update User" class="btn btn-primary">
                <a href="/admin/users" class="btn">Cancel</a>
            </div>
        </form>
    </div>
    
    <div class="section">
        <h3>User Roles Explained</h3>
        <ul>
            <li><strong>User:</strong> Can access files, upload, download, and use all file management features based on system settings</li>
            <li><strong>Admin:</strong> All user permissions plus ability to manage other users, modify system settings, and access admin panel</li>
        </ul>
        
        <h3>Status Options</h3>
        <ul>
            <li><strong>Active:</strong> User can log in and use the system normally</li>
            <li><strong>Inactive:</strong> User account exists but login is disabled (useful for temporary suspensions)</li>
        </ul>
    </div>
</body>
</html>