{% extends "settings_base.html" %}
{% import "_icons.html" as icons %}
{% block settings_content %}
<section class="settings-grid v05-grid">
  <article class="card registry-card">
    <div class="card-header">
      <div><h2>Route Registry</h2><p>Exact routes win first; prefix routes must end with <code>*</code>.</p></div>
      <a class="button primary" href="#route-editor">Add route</a>
    </div>
    <form class="filter-row" data-settings-filters>
      <label class="search-bar"><span>Search routes</span><input name="search" placeholder="Search routes…"></label>
      <label><span>Status</span><select name="status"><option value="all">All status</option><option value="active">Active</option><option value="inactive">Inactive</option></select></label>
      <label><span>Provider</span><select name="provider" data-provider-filter-options><option value="">All providers</option></select></label>
      <button class="button ghost" type="submit">Apply filters</button>
    </form>
    <div class="table-shell">
      <table class="data-table model-routes-table">
        <thead>
          <tr><th scope="col">Incoming model</th><th scope="col">Match</th><th scope="col">Upstream</th><th scope="col">Send as</th><th scope="col">Provider</th><th scope="col">Priority</th><th scope="col">Status</th><th scope="col">Actions</th></tr>
        </thead>
        <tbody data-settings-routes><tr><td colspan="8" class="empty">Loading routes…</td></tr></tbody>
      </table>
    </div>
    <div data-settings-pagination></div>
  </article>

  <article class="card diagnostics-card">
    <div class="card-header"><div><h2>Default Route Discovery</h2><p>Create routes from active provider pricing rows and aliases.</p></div></div>
    <form class="inline-tool-form" data-default-routes>
      <label class="form-field"><span>Provider</span><select name="provider_slug" data-provider-options><option value="">All providers</option>{% for provider in providers %}<option value="{{ provider.slug }}">{{ provider.name }}</option>{% endfor %}</select></label>
      <label class="form-field"><span>Mode</span><select name="mode"><option value="missing_only">Missing routes only</option><option value="refresh_seeded">Refresh seeded routes</option></select></label>
      <button class="button ghost" type="submit" data-default-route-action="preview">Preview</button>
      <button class="button primary" type="submit" data-default-route-action="apply">Apply</button>
    </form>
    <div class="result-panel" data-default-routes-result><p class="muted">Preview or apply generated routes.</p></div>
  </article>

  <form class="card form-card editor-card" id="route-editor" method="post" action="/admin/settings/model-routes" data-settings-action="route-save" data-route-editor>
    <div class="card-header"><div><h2>Selected Route</h2><p>Select an editable row or save a new route.</p></div></div>
    <input type="hidden" name="route_id" data-route-editor-field="route_id">
    <div class="form-grid two-col">
      <label class="form-field"><span>Incoming model</span><input name="model" required data-route-editor-field="model"></label>
      <label class="form-field"><span>Match type</span><select name="match_type" data-route-editor-field="match_type"><option value="exact">Exact match</option><option value="prefix">Prefix match</option></select></label>
      <label class="form-field wide"><span>Route upstream URL</span><input name="upstream_url" required data-route-editor-field="upstream_url"></label>
      <label class="form-field"><span>Send as model</span><input name="upstream_model" data-route-editor-field="upstream_model"></label>
      <label class="form-field"><span>Provider</span><select name="provider_slug" data-provider-options data-route-editor-field="provider_slug"><option value="">Auto by URL</option>{% for provider in providers %}<option value="{{ provider.slug }}">{{ provider.name }}</option>{% endfor %}</select></label>
      <label class="form-field"><span>API key env var</span><input name="api_key_env" data-route-editor-field="api_key_env"></label>
      <label class="form-field"><span>Priority</span><input name="priority" type="number" min="1" max="100" value="50" data-route-editor-field="priority"></label>
      <label class="form-field wide"><span>Compatibility fixes</span><textarea name="fixes" rows="3" data-route-editor-field="fixes"></textarea></label>
      <label class="check switch-line"><input type="hidden" name="override_fallback" value="no"><input type="checkbox" name="override_fallback" value="yes" data-route-editor-field="override_fallback"><span>Override fallback fixes</span></label>
      <label class="check switch-line"><input type="hidden" name="active" value="no"><input type="checkbox" name="active" value="yes" checked data-route-editor-field="active"><span>Enabled</span></label>
    </div>
    <div class="button-row"><button class="button primary" type="submit">Save route</button><button class="button ghost" type="button" data-clear-route-editor>Clear</button></div>
    <p class="form-message" data-form-message aria-live="polite"></p>
  </form>

  <form class="card form-card" method="post" action="/admin/settings/upstream-defaults" data-settings-action="upstream-defaults">
    <div class="card-header"><div><h2>Unknown-model Fallback</h2><p>Configure fallback after explicit routes.</p></div></div>
    <div class="form-grid two-col">
      <label class="form-field wide"><span>Pass-through upstream URL</span><input name="upstream_url" value="{{ upstream_url }}" required></label>
      <label class="form-field"><span>Fallback provider</span><select name="default_provider_slug" data-provider-options data-enhanced-select data-enhanced-select-label="Fallback provider"><option value="">No provider</option>{% for provider in providers %}<option value="{{ provider.slug }}" {% if provider.slug == default_provider_slug %}selected{% endif %}>{{ provider.name }}</option>{% endfor %}</select></label>
      <label class="form-field"><span>Fallback model</span><input name="default_model" value="{{ default_model }}"></label>
      <label class="check switch-line"><input type="hidden" name="fallback_enabled" value="no"><input type="checkbox" name="fallback_enabled" value="yes" {% if fallback_enabled %}checked{% endif %}><span>Enable fallback</span></label>
    </div>
    <input type="hidden" name="return_to" value="/admin/settings/routing">
    <p class="muted">If fallback is disabled or incomplete, unmatched models use the pass-through upstream unchanged.</p>
    <div class="button-row"><button class="button primary" type="submit">Save fallback behavior</button></div>
    <p class="form-message" data-form-message aria-live="polite"></p>
  </form>

  <article class="card diagnostics-card">
    <div class="card-header"><div><h2>Route Simulator</h2><p>Resolve a model without making an upstream call.</p></div></div>
    <form class="inline-tool-form" data-route-simulator>
      <label class="form-field"><span>Incoming model</span><input name="model" value="gpt-test" required></label>
      <button class="button primary" type="submit">Run simulation</button>
    </form>
    <div class="result-panel" data-route-simulator-result><p class="muted">Simulation results appear here.</p></div>
    <div class="result-panel" data-route-sample-result><p class="muted">A sample request appears here.</p></div>
  </article>

  <article class="card usage-card">
    <div class="card-header"><div><h2>Recent Route Usage</h2><p>Requests matched since local midnight.</p></div></div>
    <div class="table-shell"><table class="data-table"><thead><tr><th scope="col">Route</th><th scope="col">Requests today</th><th scope="col">Last matched</th></tr></thead><tbody data-settings-route-usage><tr><td colspan="3" class="empty">Loading usage…</td></tr></tbody></table></div>
  </article>
</section>
{% endblock %}