{% extends 'layout.html.twig' %}

{% block body %}

    {% include 'partial/_author-section.html.twig' with {author: author, npub: npub} %}

    <section>
        <div class="profile-tabs">
            <a href="{{ path('author-profile', {'npub': npub}) }}" class="tab-link">Articles</a>
            <a href="{{ path('author-media', {'npub': npub}) }}" class="tab-link">Media</a>
            <a href="{{ path('author-about', {'npub': npub}) }}" class="tab-link active">About</a>
        </div>

        <div class="w-container mt-4">
            <div class="profile-details">
                <h2>Profile Information</h2>

                {% if author.about is defined %}
                    <div class="profile-field">
                        <h3>About</h3>
                        <div class="profile-value">
                            {{ author.about|markdown_to_html|mentionify|linkify }}
                        </div>
                    </div>
                {% endif %}

                {% if author.banner is defined %}
                    <div class="profile-field">
                        <h3>Banner</h3>
                        <div class="profile-value">
                            <img src="{{ author.banner }}" alt="Profile banner" style="max-width: 100%; height: auto;" onerror="this.style.display = 'none'" />
                        </div>
                    </div>
                {% endif %}

                {% if author.website is defined %}
                    <div class="profile-field">
                        <h3>Website</h3>
                        <div class="profile-value">
                            <a href="{{ author.website }}" target="_blank" rel="noopener noreferrer">{{ author.website }}</a>
                        </div>
                    </div>
                {% endif %}

                {% if author.lud16 is defined %}
                    <div class="profile-field">
                        <h3>Lightning Address{{ author.lud16 is iterable and author.lud16|length > 1 ? 'es' : '' }}</h3>
                        <div class="profile-value">
                            {% if author.lud16 is iterable %}
                                {% for address in author.lud16 %}
                                    <div class="mb-1">
                                        <code>{{ address }}</code>
                                    </div>
                                {% endfor %}
                            {% else %}
                                <code>{{ author.lud16 }}</code>
                            {% endif %}
                        </div>
                    </div>
                {% endif %}

                {% if author.lud06 is defined %}
                    <div class="profile-field">
                        <h3>LNURL{{ author.lud06 is iterable and author.lud06|length > 1 ? 's' : '' }}</h3>
                        <div class="profile-value">
                            {% if author.lud06 is iterable %}
                                {% for lnurl in author.lud06 %}
                                    <div class="mb-1">
                                        <code style="word-break: break-all;">{{ lnurl }}</code>
                                    </div>
                                {% endfor %}
                            {% else %}
                                <code style="word-break: break-all;">{{ author.lud06 }}</code>
                            {% endif %}
                        </div>
                    </div>
                {% endif %}

                <div class="profile-field">
                    <h3>Public Key (hex)</h3>
                    <div class="profile-value">
                        <code style="word-break: break-all;">{{ pubkey }}</code>
                    </div>
                </div>

                <div class="profile-field">
                    <h3>Public Key (npub)</h3>
                    <div class="profile-value">
                        <code style="word-break: break-all;">{{ npub }}</code>
                    </div>
                </div>

                {# Display any additional fields that might be present #}
                {% set standardFields = ['name', 'display_name', 'about', 'picture', 'banner', 'nip05', 'website', 'lud16', 'lud06', 'image'] %}
                {% for key, value in author %}
                    {% if key not in standardFields and value is not empty %}
                        <div class="profile-field">
                            <h3>{{ key|title }}</h3>
                            <div class="profile-value">
                                {% if value starts with 'http://' or value starts with 'https://' %}
                                    <a href="{{ value }}" target="_blank" rel="noopener noreferrer">{{ value }}</a>
                                {% else %}
                                    {{ value }}
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                {% endfor %}
            </div>

            {# Raw Event Debug Section #}
            <div class="mt-6 p-4 bg-gray-100 rounded">
                <details>
                    <summary class="cursor-pointer font-semibold text-lg mb-2">Raw Profile Event (Debug)</summary>
                    <div class="mt-2">
                        <h4 class="font-semibold">Event ID:</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto"><code>{{ rawEvent.id ?? 'N/A' }}</code></pre>

                        <h4 class="font-semibold mt-3">Created At:</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto"><code>{{ rawEvent.created_at ?? 'N/A' }} ({{ rawEvent.created_at is defined ? rawEvent.created_at|date('Y-m-d H:i:s') : 'N/A' }})</code></pre>

                        <h4 class="font-semibold mt-3">Tags:</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto"><code>{{ rawEvent.tags is defined ? rawEvent.tags|json_encode(constant('JSON_PRETTY_PRINT')) : '[]' }}</code></pre>

                        <h4 class="font-semibold mt-3">Content (JSON):</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto"><code>{{ rawEvent.content ?? '{}' }}</code></pre>

                        <h4 class="font-semibold mt-3">Signature:</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto text-xs"><code>{{ rawEvent.sig ?? 'N/A' }}</code></pre>

                        <h4 class="font-semibold mt-3">Full Event Object:</h4>
                        <pre class="bg-white p-2 rounded overflow-x-auto text-xs"><code>{{ rawEvent|json_encode(constant('JSON_PRETTY_PRINT')) }}</code></pre>
                    </div>
                </details>
            </div>
        </div>
    </section>


    <style>
        .profile-details {
            max-width: 800px;
        }
        .profile-field {
            margin-bottom: 1.5rem;
            padding-bottom: 1rem;
            border-bottom: 1px solid #e5e7eb;
        }
        .profile-field:last-child {
            border-bottom: none;
        }
        .profile-field h3 {
            font-size: 0.875rem;
            font-weight: 600;
            color: #6b7280;
            margin-bottom: 0.5rem;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }
        .profile-value {
            color: #1f2937;
            word-wrap: break-word;
        }
        .profile-value code {
            background-color: #f3f4f6;
            padding: 0.25rem 0.5rem;
            border-radius: 0.25rem;
            font-size: 0.875rem;
        }
        details summary {
            user-select: none;
        }
        details[open] summary {
            margin-bottom: 1rem;
        }
        pre {
            white-space: pre-wrap;
            word-wrap: break-word;
        }
    </style>
{% endblock %}