{% extends "base.html" %}
{% block title %}Import — alembic{% endblock %}
{% block content %}
<div class="page-header">
  <div>
    <h1>Manual import</h1>
    <p class="subtitle muted">Drop files into <span class="mono">import-me/</span> and run them through the pipeline.</p>
  </div>
</div>

{% if request.query_params.get('run_id') %}
<div class="notice success">Import job started (run id {{ request.query_params.get('run_id') }}). Check the Jobs page for progress.</div>
{% endif %}

<h2>Upload a file into import-me/</h2>
<div class="panel" style="max-width:560px;">
  <form method="post" action="/import/upload" enctype="multipart/form-data">
    <div class="field wide">
      <input type="file" name="file" required>
    </div>
    <button type="submit" class="btn">Upload</button>
  </form>
</div>

<h2>Contents of import-me/</h2>
{% if contents %}
<ul class="chip-list">
  {% for name in contents %}
  <li>{{ name }}</li>
  {% endfor %}
</ul>
{% else %}
<p class="muted">(empty)</p>
{% endif %}

<h2>Run import</h2>
<div class="panel" style="max-width:560px;">
  <form method="post" action="/import/run">
    <div class="field">
      <label for="source">File/subdir</label>
      <input type="text" id="source" name="source" list="import-contents">
      <span class="hint">Blank = import everything above.</span>
      <datalist id="import-contents">
        {% for name in contents %}
        <option value="{{ name }}">
        {% endfor %}
      </datalist>
    </div>

    <div class="field">
      <label for="playlist_name">Playlist tag (optional)</label>
      <select id="playlist_name" name="playlist_name">
        <option value="">(none)</option>
        {% for p in playlists %}
        <option value="{{ p.name }}">{{ p.name }}</option>
        {% endfor %}
      </select>
    </div>

    <button type="submit" class="btn btn-primary">Import</button>
  </form>
</div>
{% endblock %}