{% if preview.type == 'naddr' %}
    <div class="card nostr-address-preview">
        {% for tag in preview.tags %}
            {% if tag[0] == 'title' %}
                <div class="card-header">
                    <h5 class="card-title">{{ tag[1] }}</h5>
                </div>
            {% endif %}
            {% if tag[0] == 'summary' %}
                <p class="card-text">{{ tag[1] }}</p>
            {% endif %}
        {% endfor %}
    </div>
{% elseif preview.type == 'nevent' %}
    {# If kind is 9802 - Highlight #}
    {% if preview.kind == 9802 %}
        <div class="card nostr-highlight-preview">
            <div class="card-header d-flex justify-content-between align-items-center">
                <div>
                    <twig:Molecules:UserFromNpub ident="{{ preview.pubkey }}" />
                </div>
                <span class="badge bg-warning">Highlight</span>
            </div>
            <div class="card-body">
                <p>{{ preview.content }}</p>
                {% if preview.tags is defined and preview.tags|length > 0 %}
                    <blockquote class="card-text">
                        {% for tag in preview.tags %}
                            {% if tag[0] == 'textquoteselector' %}
                                {% for i in 1..tag|length-1 %}
                                    <span class="quoted-text">{{ tag[i] }}</span>
                                    {% if not loop.last %}
                                        <br>
                                    {% endif %}
                                {% endfor %}
                            {% endif %}
                        {% endfor %}
                    </blockquote>
                {% endif %}
            </div>
        </div>
    {% else %}
        <div class="card nostr-event-preview">
            <div class="card-header d-flex justify-content-between align-items-center">
                <div>
                    <twig:Molecules:UserFromNpub ident="{{ preview.author }}" />
                </div>
                {% if preview.type == 'event' %}
                    <span class="badge bg-secondary">Article</span>
                {% else %}
                    <span class="badge bg-info">Note</span>
                {% endif %}
            </div>
            <div class="card-body">
                {% if preview.type == 'event' %}
                    <h5 class="card-title">{{ preview.title }}</h5>
                    <p class="card-text">
                        {% if preview.event.summary is defined %}
                            {{ preview.event.summary }}
                        {% else %}
                            {{ preview.event.content|length > 150 ? preview.event.content|slice(0, 150) ~ '...' : preview.event.content }}
                        {% endif %}
                    </p>
                {% else %}
                    <p class="card-text">{{ preview.content|length > 280 ? preview.content|slice(0, 280) ~ '...' : preview.content }}</p>
                {% endif %}
            </div>
            <div class="card-footer text-muted">
                <small>{{ preview.event.created_at is defined ? preview.event.created_at|date('F j Y') : '' }}</small>
            </div>
        </div>
    {% endif %}
{% elseif preview.type == 'nprofile' %}
    <div class="card nostr-profile-preview">
        <div class="card-body d-flex">
            <h5 class="card-title">{{ preview.display_name ?: preview.name }} </h5>
            <small class="text-muted">@{{ preview.npub|shortenNpub }}</small>
            {% if preview.about %}
                <p class="card-text">{{ preview.about|length > 150 ? preview.about|slice(0, 150) ~ '...' : preview.about }}</p>
            {% endif %}
        </div>
    </div>
{% endif %}