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

{% block body %}
    <h1><twig:Atoms:NameOrNpub :author="author" :npub="npub"></twig:Atoms:NameOrNpub></h1>
    {% if author.bot is defined %}
        <div class="tags">
            <span class="tag">bot</span>
        </div>
    {% endif %}

    {% if author.nip05 is defined %}
        {% if author.nip05 is iterable %}
            {% for nip05Value in author.nip05 %}
                <twig:Atoms:Nip05Badge
                    nip05="{{ nip05Value }}"
                    :npub="npub"
                />
            {% endfor %}
        {% else %}
            <twig:Atoms:Nip05Badge
                nip05="{{ author.nip05 }}"
                :npub="npub"
            />
        {% endif %}
    {% endif %}
    <div class="mt-2">
        {% if author.about is defined %}
            {{ author.about|markdown_to_html|mentionify|linkify  }}
        {% endif %}
    </div>

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

{#    {% if relays|length > 0 %}#}
{#        {% for rel in relays %}#}
{#            <p>{{ rel }}</p>#}
{#        {% endfor %}#}
{#    {% endif %}#}


{#    {% if app.user and app.user.userIdentifier is same as npub %}#}
{#    <div id="invoice-component" class="p-4 bg-gray-100 rounded-lg">#}
{#        <h3 class="text-xl font-semibold mb-4">Purchase Search Credits</h3>#}

{#        <div class="mb-4">#}
{#            <p>Amount: {{ amount ?? 0 }} sats</p>#}
{#            <p>Status: <span id="payment-status">Pending</span></p>#}
{#        </div>#}

{#        #}{# You can access the width and height via the matrix #}
{#        #}{# Replace the string with the invoice #}
{#        {% set qrCode = qr_code_result('My QR Code') %}#}
{#        <img src="{{ qrCode.dataUri }}" width="{{ qrCode.matrix.outerSize }}" alt="invoice-qr" />#}

{#        <br>#}
{#        <button id="check-payment" class="px-4 py-2 bg-blue-500 text-white rounded">Check Payment Status</button>#}

{#        <script>#}
{#            document.getElementById('check-payment').addEventListener('click', async () => {#}
{#                const response = await fetch('/payment-status/{{ payment_hash ?? '' }}');#}
{#                const data = await response.json();#}

{#                if (data.status === 'paid') {#}
{#                    document.getElementById('payment-status').innerText = 'Paid';#}
{#                } else {#}
{#                    document.getElementById('payment-status').innerText = 'Pending';#}
{#                }#}
{#            });#}
{#        </script>#}
{#    </div>#}
{#    {% endif %}#}

{#    {% if nzine %}#}
{#        <a href="{{ path('nzine_view', {npub: author.npub}) }}">View as N-Zine</a>#}

{#        <h2>List of indices</h2>#}
{#        {% for i in idx %}#}
{#            {{ i.title }}#}
{#        {% endfor %}#}
{#    {% endif %}#}

<div class="w-container">
    {% if articles|length > 0 %}
    <twig:Organisms:CardList :list="articles" class="article-list"></twig:Organisms:CardList>
    {% else %}
        <div class="no-media">
            <p>No articles found for this author.</p>
        </div>
    {% endif %}
</div>
{% endblock %}

{% block aside %}
{#    <twig:Organisms:ZineList :nzines="nzines" />#}
{% endblock %}