{% extends "base.html" %}

{% block content %}
  <section class="intro">
    <h2>Select photos for your Mastodon post</h2>
    <p>Choose between 1 and {{ max_photos }} recent Immich photos. We'll pull in cached alt text where possible.</p>
    <p>Need to tidy up descriptions first? Visit the <a href="{{ url_for('main.alt_helper') }}">alt text helper</a>.</p>
  </section>

  {% if error_message %}
    <div class="error">{{ error_message }}</div>
  {% endif %}

  {% if assets %}
    <form method="post" class="selection-form">
      <div class="actions top-actions">
        <button type="submit">Use selected photos</button>
      </div>
      <div class="select-grid">
        {% for asset in assets %}
          <label class="select-card {% if asset.posted %}used{% endif %}">
            <input type="checkbox" name="asset_ids" value="{{ asset.id }}" {% if selected_ids and asset.id in selected_ids %}checked{% endif %}>
            <div class="thumbnail">
              <img src="{{ url_for('main.asset_proxy', asset_id=asset.id, variant='thumbnail') }}" alt="{{ asset.file_name }}">
            </div>
            <div class="meta">
              <div class="file-name">{{ asset.file_name }}</div>
              {% if asset.captured_display %}
                <div class="date">{{ asset.captured_display }}</div>
              {% endif %}
              {% if asset.alt_text %}
                <div class="alt-text-sample">{{ asset.alt_text }}</div>
              {% endif %}
              {% if asset.posted %}
                <div class="usage">Posted{% if asset.last_posted_display %} {{ asset.last_posted_display }}{% endif %}</div>
              {% endif %}
            </div>
          </label>
        {% endfor %}
      </div>
      <div class="actions">
        <button type="submit">Use selected photos</button>
      </div>
    </form>
  {% else %}
    <p>No assets available right now.</p>
  {% endif %}
{% endblock %}