{% extends "base.html" %}
{% block title_suffix %} — Settings{% endblock %}
{% block container_style %} style="max-width: 880px;"{% endblock %}
{% block content %}

  <section class="hero">
    <div class="hero-left">
      <div class="eyebrow"><span class="bar"></span>Preferences</div>
      <h1>Your <span class="ember">settings</span>.</h1>
      <p class="lede">Mirrors <code>gitstow config show</code>. All values persist to <code>{{ settings.config_path }}</code>.</p>
    </div>
  </section>

  <form onsubmit="event.preventDefault(); alert('Settings save lands later');">

    <section>
      <h4>Defaults</h4>
      <dl class="settings-grid">
        <dt>Default host</dt>
        <dd>
          <select style="max-width: 320px;">
            <option value="github.com"{% if settings.default_host == "github.com" %} selected{% endif %}>github.com</option>
            <option value="gitlab.com"{% if settings.default_host == "gitlab.com" %} selected{% endif %}>gitlab.com</option>
            <option value="bitbucket.org"{% if settings.default_host == "bitbucket.org" %} selected{% endif %}>bitbucket.org</option>
          </select>
          <span class="form-hint">Used when you provide <code>owner/repo</code> shorthand without a full URL.</span>
        </dd>

        <dt>SSH preference</dt>
        <dd>
          <label style="display: inline-flex; align-items: center; margin: 0.55rem 0 0; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--text-soft); font-size: 0.9rem;">
            <input type="checkbox"{% if settings.prefer_ssh %} checked{% endif %}>
            Convert https:// URLs to SSH on clone
          </label>
          <span class="form-hint">Applies when cloning via the add-repo form. Direct git URLs are never rewritten.</span>
        </dd>
      </dl>
    </section>

    <section class="section">
      <h4>Paths</h4>
      <dl class="settings-grid">
        <dt>Config file</dt>
        <dd><span class="path-display">{{ settings.config_path }}</span></dd>
        <dt>Registry</dt>
        <dd><span class="path-display">{{ settings.repos_path }}</span></dd>
      </dl>
      <small style="display: block; margin-top: 1rem; color: var(--muted); font-size: 0.84rem;">
        Read-only here — edit YAML directly, or run <code>gitstow config path</code> to locate the files.
      </small>
    </section>

    <section class="section">
      <h4>Collection</h4>
      <dl class="settings-grid">
        <dt>Export</dt>
        <dd>
          <div style="display: flex; gap: 0.5rem; flex-wrap: wrap;">
            <a href="/collection/export?fmt=yaml" class="btn btn-outline btn-sm">↓ YAML</a>
            <a href="/collection/export?fmt=json" class="btn btn-outline btn-sm">↓ JSON</a>
            <a href="/collection/export?fmt=urls" class="btn btn-outline btn-sm">↓ URLs</a>
          </div>
          <span class="form-hint">Download your collection. YAML is the canonical format — fully round-trippable via Import.</span>
        </dd>
        <dt>Import</dt>
        <dd>
          <form method="POST" action="/collection/import" enctype="multipart/form-data" style="display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap;">
            <input type="file" name="file" accept=".yaml,.yml,.json,.txt" required style="flex: 1; min-width: 200px; padding: 0.4rem;">
            <button type="submit" class="btn btn-primary btn-sm">Upload & clone</button>
          </form>
          <span class="form-hint">Upload YAML / JSON / plain URLs. New repos clone into the first workspace; already-tracked repos are skipped.</span>
        </dd>
      </dl>
    </section>

    <section class="section">
      <h4>Integrations</h4>
      <dl class="settings-grid">
        <dt>Claude Code skill</dt>
        <dd>
          <span class="path-display">{{ settings.skill_path }}</span>
          <span class="form-hint">Auto-updates on every CLI invocation when the package version changes.</span>
        </dd>
        <dt>MCP server</dt>
        <dd>
          <code>gitstow-mcp</code> <span style="color: var(--muted);">— install with</span> <code>pip install gitstow[mcp]</code>
          <span class="form-hint">Optional. For non-Claude-Code AI tools like Claude Desktop, Cursor, Windsurf.</span>
        </dd>
      </dl>
    </section>

    <article class="version-card">
      <strong>gitstow v{{ version }}</strong><br>
      <small style="color: var(--muted); font-size: 0.82rem;">Run <code>gitstow doctor</code> from the CLI for a full environment report.</small>
    </article>

    <div style="display: flex; gap: 0.5rem; margin-top: 2rem;">
      <button type="submit" class="btn btn-primary">Save preferences</button>
      <a href="/" class="btn btn-ghost">Cancel</a>
    </div>
  </form>

{% endblock %}