{% comment %}
Pending media thumbnails - shown before a post is saved.
Context: pending_assets, workspace.
{% endcomment %}

{% for asset in pending_assets %}
<div class="media-thumb">
    {% if asset.is_video %}
    <video src="{{ asset.file.url }}#t=0.5" data-asset-id="{{ asset.id }}" class="w-full h-full object-cover" muted preload="metadata"></video>
    <div class="absolute inset-0 flex items-center justify-center pointer-events-none">
        <div class="w-5 h-5 rounded-full bg-black/50 flex items-center justify-center">
            <svg class="w-2.5 h-2.5 text-white ml-px" fill="currentColor" viewBox="0 0 20 20"><path d="M6.3 2.841A1.5 1.5 0 004 4.11V15.89a1.5 1.5 0 002.3 1.269l9.344-5.89a1.5 1.5 0 000-2.538L6.3 2.84z"/></svg>
        </div>
    </div>
    {% elif asset.file %}
    <img src="{{ asset.file.url }}" alt="{{ asset.filename }}">
    {% else %}
    <div class="w-full h-full bg-stone-100 flex items-center justify-center">
        <svg class="w-5 h-5 text-stone-300" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>
    </div>
    {% endif %}
    <button type="button" class="remove-btn"
            hx-post="{% url 'composer:remove_pending_media' workspace_id=workspace.id asset_id=asset.id %}"
            hx-target="#media-list"
            hx-swap="innerHTML">
        <svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M6 18L18 6M6 6l12 12"/></svg>
    </button>
    <input type="hidden" name="pending_media_ids" value="{{ asset.id }}">
</div>
{% endfor %}