{% extends "admin/base.html" %}

{% block title %}{{ user.nickname }} - User Details{% endblock %}

{% block admin_content %}
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2">User Details</h1>
    <div class="btn-toolbar mb-2 mb-md-0">
        <div class="btn-group mr-2">
            <a href="{{ url_for('admin.users') }}" class="btn btn-sm btn-outline-secondary">
                <i class="fas fa-arrow-left"></i> Back to Users
            </a>
        </div>
    </div>
</div>

<div class="row">
    <!-- User Information -->
    <div class="col-lg-4">
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">User Information</h6>
            </div>
            <div class="card-body">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td><strong>Nickname:</strong></td>
                        <td>{{ user.nickname }}</td>
                    </tr>
                    <tr>
                        <td><strong>Email:</strong></td>
                        <td>{{ user.email }}</td>
                    </tr>
                    <tr>
                        <td><strong>Role:</strong></td>
                        <td>
                            {% if user.is_admin %}
                                <span class="badge badge-danger">Admin</span>
                            {% else %}
                                <span class="badge badge-primary">User</span>
                            {% endif %}
                        </td>
                    </tr>
                    <tr>
                        <td><strong>Status:</strong></td>
                        <td>
                            {% if user.is_active %}
                                <span class="badge badge-success">Active</span>
                            {% else %}
                                <span class="badge badge-secondary">Inactive</span>
                            {% endif %}
                        </td>
                    </tr>
                    <tr>
                        <td><strong>Joined:</strong></td>
                        <td>{{ user.created_at.strftime('%Y-%m-%d %H:%M:%S') }}</td>
                    </tr>
                    <tr>
                        <td><strong>Last Updated:</strong></td>
                        <td>{{ user.updated_at.strftime('%Y-%m-%d %H:%M:%S') }}</td>
                    </tr>
                </table>
            </div>
        </div>

        <!-- User Statistics -->
        <div class="card shadow">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">Statistics</h6>
            </div>
            <div class="card-body">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td><strong>Total Posts:</strong></td>
                        <td>{{ user_posts|length }}</td>
                    </tr>
                    <tr>
                        <td><strong>Published Posts:</strong></td>
                        <td>{{ user_posts|selectattr('published')|list|length }}</td>
                    </tr>
                    <tr>
                        <td><strong>Pending Posts:</strong></td>
                        <td>{{ user_posts|rejectattr('published')|list|length }}</td>
                    </tr>
                    <tr>
                        <td><strong>Comments:</strong></td>
                        <td>{{ user_comments|length }}</td>
                    </tr>
                    <tr>
                        <td><strong>Likes Given:</strong></td>
                        <td>{{ user.likes.count() }}</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    <!-- User Content -->
    <div class="col-lg-8">
        <!-- User Posts -->
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">Posts ({{ user_posts|length }})</h6>
            </div>
            <div class="card-body">
                {% if user_posts %}
                    <div class="table-responsive">
                        <table class="table table-sm table-hover">
                            <thead>
                                <tr>
                                    <th>Title</th>
                                    <th>Status</th>
                                    <th>Created</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for post in user_posts %}
                                <tr>
                                    <td>
                                        <a href="{{ url_for('admin.post_detail', post_id=post.id) }}" class="text-decoration-none">
                                            {{ post.title[:50] }}{% if post.title|length > 50 %}...{% endif %}
                                        </a>
                                    </td>
                                    <td>
                                        {% if post.published %}
                                            <span class="badge badge-success">Published</span>
                                        {% else %}
                                            <span class="badge badge-warning">Pending</span>
                                        {% endif %}
                                    </td>
                                    <td>
                                        <small>{{ post.created_at.strftime('%Y-%m-%d') }}</small>
                                    </td>
                                    <td>
                                        <a href="{{ url_for('admin.post_detail', post_id=post.id) }}" 
                                           class="btn btn-sm btn-outline-info">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                {% else %}
                    <p class="text-muted">This user has not created any posts yet.</p>
                {% endif %}
            </div>
        </div>

        <!-- Recent Comments -->
        <div class="card shadow">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">Recent Comments ({{ user_comments|length }})</h6>
            </div>
            <div class="card-body">
                {% if user_comments %}
                    {% for comment in user_comments[:10] %}
                    <div class="border-bottom mb-3 pb-3">
                        <div class="d-flex justify-content-between align-items-start">
                            <div class="flex-grow-1">
                                <p class="mb-1">{{ comment.content[:200] }}{% if comment.content|length > 200 %}...{% endif %}</p>
                                <small class="text-muted">
                                    On post: 
                                    <a href="{{ url_for('admin.post_detail', post_id=comment.post.id) }}">
                                        {{ comment.post.title }}
                                    </a>
                                </small>
                            </div>
                            <small class="text-muted">{{ comment.created_at.strftime('%Y-%m-%d') }}</small>
                        </div>
                    </div>
                    {% endfor %}
                    {% if user_comments|length > 10 %}
                        <p class="text-muted text-center">... and {{ user_comments|length - 10 }} more comments</p>
                    {% endif %}
                {% else %}
                    <p class="text-muted">This user has not made any comments yet.</p>
                {% endif %}
            </div>
        </div>
    </div>
</div>
{% endblock %}