{# Workspace files panel. Includes:
   files       = user's bucket objects (newest first)
   shared_files= shared-media objects
   user_bucket = display name of the user's bucket
   prompt      = CTA text (what the paired editor is for) #}
{% macro human_size(b) %}
{%- if b >= 1073741824 %}{{ "%.1f GB"|format(b/1073741824) }}
{%- elif b >= 1048576 %}{{ "%.1f MB"|format(b/1048576) }}
{%- elif b >= 1024 %}{{ "%.0f KB"|format(b/1024) }}
{%- else %}{{ b }} B{% endif -%}
{% endmacro %}

<div class="workspace">
  <div class="workspace-head">
    <h2 class="section-title">Your files</h2>
    <span class="muted" style="font: var(--type-caption)">bucket: {{ user_bucket }}</span>
  </div>

  {% if files %}
  <ul class="file-list">
    {% for f in files %}
    <li>
      <span class="file-name" title="{{ f.key }}">{{ f.key }}</span>
      <span class="file-meta">{{ human_size(f.size) }}{% if f.last_modified %} · {{ f.last_modified.strftime("%Y-%m-%d %H:%M") }}{% endif %}</span>
    </li>
    {% endfor %}
  </ul>
  {% else %}
  <p class="faint" style="font: var(--type-body-sm)">No saved files yet. {{ prompt | default("Work saved into your bucket will appear here when you return.") }}</p>
  {% endif %}

  {% if shared_files %}
  <div class="workspace-head" style="margin-top: var(--space-xl)">
    <h3 class="section-title" style="font: var(--type-heading-2)">Shared media</h3>
  </div>
  <ul class="file-list">
    {% for f in shared_files %}
    <li>
      <span class="file-name" title="{{ f.key }}">{{ f.key }}</span>
      <span class="file-meta">{{ human_size(f.size) }}{% if f.last_modified %} · {{ f.last_modified.strftime("%Y-%m-%d") }}{% endif %}</span>
    </li>
    {% endfor %}
  </ul>
  {% endif %}
</div>