<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Dewey Console</title>
    <link rel="icon" href="/static/favicon.svg" type="image/svg+xml" />
    <link rel="stylesheet" href="/static/console.css" />
  </head>
  <body>
    {% if deployment.name and not deployment.is_production %}
    <div class="deployment-banner" style="background: {{ deployment.color }};">{{ deployment.name|upper }}</div>
    {% endif %}
    <div class="shell">
      <header class="topbar">
        <div class="brandline">
          <div class="eyebrow">Dewey Console</div>
          <h1 class="title">Artifact Control Room</h1>
          <div class="subtitle">{{ profile.email }}</div>
        </div>
        <div class="navlinks">
          <a class="navlink" href="/literature">Literature Search</a>
          <a class="navlink" href="/search">Unified Search</a>
          <a class="navlink" href="/ui/anomalies">Anomalies</a>
          <a class="navlink" href="/ui/observability">Observability</a>
          {% if is_admin %}
          <a class="navlink" href="/admin">Admin</a>
          {% endif %}
          <form class="logout-form" method="post" action="/logout">
            <button type="submit">Logout</button>
          </form>
        </div>
      </header>

      <main class="page">
        <section class="hero">
          <div class="hero-copy">
            <div class="eyebrow">Operational Summary</div>
            <h2>Canonical file operations with registry discipline.</h2>
            <p>
              Monitor artifact registration, imported storage state, and issued shares without
              leaving the Dewey surface.
            </p>
          </div>
          <span class="pill pill-active">Authenticated User View</span>
        </section>

        <section class="metrics">
          <article class="metric-card">
            <div class="metric-label">Artifacts</div>
            <div class="metric-value">{{ metrics.artifact_count }}</div>
            <div class="metric-caption">Known artifact records</div>
          </article>
          <article class="metric-card">
            <div class="metric-label">Active Shares</div>
            <div class="metric-value">{{ metrics.active_share_count }}</div>
            <div class="metric-caption">Currently issued access links</div>
          </article>
          <article class="metric-card">
            <div class="metric-label">Recent Imports</div>
            <div class="metric-value">{{ metrics.recent_import_count }}</div>
            <div class="metric-caption">Copy, reference, or upload flows</div>
          </article>
          <article class="metric-card">
            <div class="metric-label">Verification Flags</div>
            <div class="metric-value">{{ metrics.verification_failures }}</div>
            <div class="metric-caption">Artifacts needing storage attention</div>
          </article>
        </section>

        <section class="panel">
          <div class="panel-header">
            <div>
              <h3>Supported Browser Interactions</h3>
              <div class="panel-copy">
                Use this GUI for browse-and-save workflows. Artifact upload/register-S3 stays in the API/CLI surface.
              </div>
            </div>
          </div>
          <div class="stack">
            <span class="pill pill-active">Literature search and save</span>
            <span class="pill pill-active">Unified search and export</span>
            <span class="pill pill-active">Anomaly browsing</span>
            <span class="pill pill-active">Observability views</span>
            <span class="pill pill-active">Admin stub</span>
            <span class="pill">Register/upload/import via API or CLI only</span>
          </div>
        </section>

        <section class="content-grid">
          <section class="panel">
            <div class="panel-header">
              <div>
                <h3>Recent Artifacts</h3>
                <div class="panel-copy">Latest canonical artifact registrations and imports.</div>
              </div>
              <div class="form-actions" style="margin-top: 0;">
                <a class="button" href="/literature">Open Literature</a>
                <a class="button" href="/search">Open Search</a>
                <a class="button" href="/ui/anomalies">Open Anomalies</a>
                <a class="button" href="/ui/observability">Open Observability</a>
              </div>
            </div>
            <div class="table-wrap">
              <table>
                <thead>
                  <tr>
                    <th>Artifact</th>
                    <th>Type</th>
                    <th>Mode</th>
                    <th>Storage</th>
                    <th>Status</th>
                  </tr>
                </thead>
                <tbody>
                  {% for item in artifacts %}
                  <tr>
                    <td>
                      <div class="mono">{{ item.artifact_euid }}</div>
                      <div>{{ item.original_filename or item.key }}</div>
                    </td>
                    <td>{{ item.artifact_type }}</td>
                    <td>{{ item.import_mode or "register" }}</td>
                    <td class="mono">{{ item.storage_uri }}</td>
                    <td>
                      {% if item.storage_status == "verified" %}
                      <span class="pill pill-active">Verified</span>
                      {% elif item.storage_status in ["missing", "error"] %}
                      <span class="pill pill-alert">{{ item.storage_status }}</span>
                      {% else %}
                      <span class="pill">{{ item.storage_status or "registered" }}</span>
                      {% endif %}
                    </td>
                  </tr>
                  {% endfor %}
                  {% if not artifacts %}
                  <tr>
                    <td colspan="5">
                      <div class="empty-state">No artifacts registered yet.</div>
                    </td>
                  </tr>
                  {% endif %}
                </tbody>
              </table>
            </div>
          </section>

          <section class="stack">
            <section class="panel">
              <div class="panel-header">
                <div>
                  <h3>Issued Shares</h3>
                  <div class="panel-copy">Most recent artifact access records.</div>
                </div>
              </div>
              {% if share_references %}
              <div class="stack">
                {% for item in share_references %}
                <article class="panel" style="padding: 0.85rem 0.95rem; background: rgba(11, 17, 32, 0.78);">
                  <div class="eyebrow">{{ item.transport or "share" }}</div>
                  <div class="mono">{{ item.share_reference_euid }}</div>
                  <div class="note">Target: {{ item.target_euid }}</div>
                  <div class="results-meta" style="margin-top: 0.55rem;">
                    {% if item.status == "active" %}
                    <span class="pill pill-active">Active</span>
                    {% elif item.status == "error" %}
                    <span class="pill pill-alert">Error</span>
                    {% else %}
                    <span class="pill">{{ item.status or "pending" }}</span>
                    {% endif %}
                    <span class="pill">{{ item.expires_at or "No expiry" }}</span>
                  </div>
                </article>
                {% endfor %}
              </div>
              {% else %}
              <div class="empty-state">No share references issued yet.</div>
              {% endif %}
            </section>

            <section class="panel">
              <div class="panel-header">
                <div>
                  <h3>User Notes</h3>
                  <div class="panel-copy">
                    File parity is now centered on artifact registration, storage lifecycle,
                    sharing, and search. File sets stay incidental.
                  </div>
                </div>
              </div>
              <div class="stack">
                <span class="pill">External links remain first-class</span>
                <span class="pill">Write operations stay idempotent</span>
                <span class="pill">Search/export lives under Unified Search</span>
              </div>
              <div class="note" style="margin-top: 0.85rem;">
                Register/upload/import via API or CLI only. The current Dewey GUI supports literature,
                search, observability, and anomaly review for artifact operations.
              </div>
            </section>
          </section>
        </section>
      </main>
    </div>
  </body>
</html>
