{# Reusable featured-image components.

  featured_image_block(entity_type, entity_id, image_path, name)
    Top-of-detail-page block. Click the image to replace it via file picker
    (auto-submits on file selection). When no image exists, shows a dashed
    placeholder tile with the same click-to-upload behavior.

  featured_image_thumb(image_path, alt='', size='')
    Tiny inline thumbnail for cards/tiles in list views. Renders nothing if
    image_path is empty so cards without images don't get a blank space.

  Keep entity_path map in sync with FEATURED_IMAGE_ENTITIES in main.py.
#}
{%- set _entity_paths = {
    'area':     'areas',
    'planting': 'plantings',
    'plant':    'plants',
    'station':  'stations',
    'species':  'species',
    'variety':  'varieties',
    'supply':   'supplies',
    'year':     'years',
} -%}

{% macro featured_image_block(entity_type, entity_id, image_path, name='') %}
{%- set path = _entity_paths[entity_type] -%}
<div class="featured-image-block">
  {% if image_path %}
  <form class="featured-image-current"
        method="post"
        enctype="multipart/form-data"
        action="/{{ path }}/{{ entity_id }}/featured-image">
    <label class="featured-image-current-label" title="Click to replace image">
      <img src="/notes/{{ image_path }}" alt="{{ name }}">
      <span class="featured-image-overlay">Click to replace</span>
      <input type="file" name="featured_image" accept="image/*"
             onchange="if (this.files.length) { this.form.querySelector('.featured-image-overlay').textContent = 'Uploading…'; this.form.submit(); }">
    </label>
  </form>
  {% else %}
  <form class="featured-image-add"
        method="post"
        enctype="multipart/form-data"
        action="/{{ path }}/{{ entity_id }}/featured-image">
    <label class="featured-image-add-label" tabindex="0">
      <span class="featured-image-add-icon" aria-hidden="true">+</span>
      <span class="featured-image-add-text">Add featured image</span>
      <input type="file" name="featured_image" accept="image/*"
             onchange="if (this.files.length) this.form.submit();">
    </label>
  </form>
  {% endif %}
</div>
{% endmacro %}

{% macro featured_image_thumb(image_path, alt='', extra_class='') %}
{% if image_path %}
<img class="card-thumb {{ extra_class }}" src="/notes/{{ image_path }}" alt="{{ alt }}" loading="lazy">
{% endif %}
{% endmacro %}