{% extends 'base.html' %}

{% block title %}nbsp.space - Benutzerliste{% endblock %}

{% block content %}
<div class="container py-4">
    <h1 class="mb-4">Benutzerliste</h1>
    
    <div class="card">
        <div class="card-header bg-primary text-white">
            <h5 class="card-title mb-0">Alle Benutzer</h5>
        </div>
        <div class="card-body">
            <!-- Desktop view (md and up) -->
            <div class="d-none d-md-block">
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Name</th>
                                <th>E-Mail</th>
                                <th>Gruppen</th>
                                <th>Icebox</th>
                                <th>Provider</th>
                                <th>Presence</th>
                                <th>Einstellungen</th>
                                <th>UI</th>
                                <th>Aktionen</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for user in users %}
                            <tr>
                                <td>{{ user.id }}</td>
                                <td>{{ user.name }}</td>
                                <td>{{ user.email or '-' }}</td>
                                <td>
                                    {% for group in user.groups %}
                                    <span class="badge bg-secondary">{{ group }}</span>
                                    {% endfor %}
                                </td>
                                <td>{{ user.icebox_account or '-' }}</td>
                                <td>{{ user.provider or '-' }}</td>
                                <td>
                                    {% if user.setpresence %}
                                    <span class="badge bg-success"><i class="fas fa-check-circle me-1"></i>Aktiviert</span>
                                    {% else %}
                                    <span class="badge bg-secondary"><i class="fas fa-times-circle me-1"></i>Deaktiviert</span>
                                    {% endif %}
                                </td>
                                <td>
                                    {% if user.removeunavailable %}
                                    <span class="badge bg-warning">Hide Unavailable</span>
                                    {% endif %}
                                </td>
                                <td>
                                    {% if user.theme %}
                                    <span class="badge bg-secondary">{{ user.theme }}</span>
                                    {% endif %}
                                    {% if user.desktop_layout %}
                                    <span class="badge bg-info">{{ user.desktop_layout }}</span>
                                    {% endif %}
                                </td>
                                <td>
                                    <a href="{{ url_for('users.user_detail', user_id=user.id) }}" class="btn btn-sm btn-outline-primary">
                                        <i class="fas fa-eye"></i> Details
                                    </a>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
            
            <!-- Mobile view (sm and down) -->
            <div class="d-md-none">
                {% for user in users %}
                <div class="card mb-3">
                    <div class="card-body">
                        <h5 class="card-title">{{ user.name }}</h5>
                        <p class="card-text small text-muted">ID: {{ user.id }}</p>
                        
                        <div class="mb-2">
                            <strong>E-Mail:</strong> {{ user.email or '-' }}
                        </div>
                        
                        <div class="mb-2">
                            <strong>Gruppen:</strong><br>
                            {% for group in user.groups %}
                            <span class="badge bg-secondary">{{ group }}</span>
                            {% endfor %}
                        </div>
                        
                        <div class="mb-2">
                            <strong>Icebox:</strong> {{ user.icebox_account or '-' }}
                        </div>
                        
                        <div class="mb-2">
                            <strong>Provider:</strong> {{ user.provider or '-' }}
                        </div>
                        
                        <div class="mb-2">
                            <strong>Presence Tracking:</strong>
                            {% if user.setpresence %}
                            <span class="badge bg-success"><i class="fas fa-check-circle me-1"></i>Aktiviert</span>
                            {% else %}
                            <span class="badge bg-secondary"><i class="fas fa-times-circle me-1"></i>Deaktiviert</span>
                            {% endif %}
                        </div>
                        
                        <div class="mb-3">
                            <strong>Einstellungen:</strong><br>
                            {% if user.removeunavailable %}
                            <span class="badge bg-warning me-1">Hide Unavailable</span>
                            {% endif %}
                        </div>
                        
                        <div class="mb-3">
                            <strong>UI:</strong><br>
                            {% if user.theme %}
                            <span class="badge bg-secondary me-1">{{ user.theme }}</span>
                            {% endif %}
                            {% if user.desktop_layout %}
                            <span class="badge bg-info me-1">{{ user.desktop_layout }}</span>
                            {% endif %}
                        </div>
                        
                        <div class="d-flex justify-content-end">
                            <a href="{{ url_for('users.user_detail', user_id=user.id) }}" class="btn btn-outline-primary">
                                <i class="fas fa-eye"></i> Details
                            </a>
                        </div>
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
    </div>
</div>
{% endblock %}