{#- The upload itself is described, not written out here: the accept list, the
    destination, the payload and the wait all come from
    `crate::quasi::upload_field`, and `static/upload.js` runs the presign chain
    behind the one address it emits. What is left in this file is the audio
    that is already there and the swap between it and the picker. -#}
<div class="audio-upload" id="audio-upload">
    {% if let Some(s3_key) = audio_s3_key %}
    <div class="current-audio" id="current-audio">
        <div class="audio-info">
            <span class="audio-icon">&#9835;</span>
            <div class="audio-details">
                <span class="audio-filename">{{ s3_key.rsplit('/').next().unwrap_or(&s3_key) }}</span>
                {% if let Some(duration) = duration_seconds %}
                <span class="audio-duration">{{ duration / 60 }}:{{ format!("{:02}", duration % 60) }}</span>
                {% endif %}
            </div>
        </div>
        <button type="button" class="btn-secondary" id="replace-audio-btn">Replace Audio</button>
    </div>
    {% endif %}

    <div class="upload-area {% if audio_s3_key.is_some() %}hidden{% endif %}" id="upload-area"
         data-upload-goes="/dashboard/item/{{ item.id }}?tab=files">
        {{ crate::quasi::upload_field::audio(item.id.as_str())|safe }}
    </div>
</div>