{% load bootstrap4 %}
{% include 'tom_dataproducts/partials/js9_scripts.html' %}
<h4>Data</h4>
<table class="table table-striped">
  <thead><tr>
    <th></th>
    <th></th>
    <th>Filename</th>
    <th>Type</th>
    <th>Share</th>
    <th>Delete</th>
  </tr></thead>
  <tbody>
  {% for product in products %}
    <tr>
      {% if not product.featured %}
      <td><a href="{% url 'tom_dataproducts:feature' pk=product.id %}?target_id={{ target.id }}" title="Make Featured Image" class="btn btn-primary">Feature</a></td>
      {% else %}
      <td><span class="btn btn-secondary active featured">Featured</span></td>
      {% endif %}
      <td>
        {%  if 'fits' in product.get_file_name or product.data_product_type == 'fits_file' %}
          {% include 'tom_dataproducts/partials/js9_button.html' with url=product.data.url only %}
        {% endif %}
      </td>
      <td><a href="{{ product.data.url }}" target="_blank">{{ product.get_file_name }}</a></td>
      <td>
        {% if product.data_product_type %}
          {{ product.get_type_display }}
        {% endif %}
      </td>
      <td>
        {% if sharing_destinations %}
          <button type="button" class="btn btn-info" data-toggle="collapse" data-target="#share-{{ forloop.counter }}">Share</button>
        {% else %}
          <p>
            <a href="https://tom-toolkit.readthedocs.io/en/stable/managing_data/tom_direct_sharing.html"
               target="_blank">Not Configured</a>.
          </p>
        {% endif %}
      </td>
      <td><a href="{% url 'tom_dataproducts:delete' product.id %}" class="btn btn-danger">Delete</a></td>
    </tr>
    <tr id="share-{{ forloop.counter }}" class="collapse">
      <td colspan=100%>
        <form method="POST" action="{% url 'tom_dataproducts:share' dp_pk=product.id %}" enctype="multipart/form-data">
          {% csrf_token %}
          {% for hidden in data_product_share_form.hidden_fields %}
            {{ hidden }}
          {% endfor %}
          <div class="form-row">
            <div class="col-sm-12">
              {% bootstrap_field data_product_share_form.share_title %}
            </div>
          </div>
          <div class="form-row">
            <div class="col-sm-12">
              {% bootstrap_field data_product_share_form.share_message %}
            </div>
          </div>
          <div class="form-row">
            <div class="col-sm-4">
              {% bootstrap_field data_product_share_form.share_destination %}
            </div>
            <div class="col-sm-2 offset-sm-1">
              {% buttons %}
                <input type="submit" class="btn btn-primary" value="Submit" name="share_dataproduct_form" style="position:absolute; bottom:1rem">
              {% endbuttons %}
            </div>
          </div>
        </form>
      </td>
    </tr>
  {% endfor %}
</table>
