{% extends "base.html" %}
{% block title %}{{ user.username }} — NanoDex{% endblock %}
{% block body %}

<div class="card pad-lg" style="display:flex;gap:20px;align-items:center;flex-wrap:wrap">
  {% if user.picture %}
  <img src="{{ user.picture }}" alt="" style="width:72px;height:72px;border-radius:50%;
       border:1px solid var(--line-2);object-fit:cover">
  {% else %}
  <div style="width:72px;height:72px;border-radius:50%;background:var(--panel-2);
       border:1px solid var(--line-2)"></div>
  {% endif %}
  <div style="flex:1;min-width:200px">
    <h1 style="font-size:24px">{{ user.name or user.username }}</h1>
    <p class="sub" style="margin-top:3px">
      <a href="https://huggingface.co/{{ user.username }}" target="_blank" rel="noopener"
         class="mono" style="color:var(--fg-2)">@{{ user.username }}</a>
      · signed in with Hugging Face
    </p>
  </div>
  <div style="display:flex;gap:8px;flex-wrap:wrap">
    <a class="btn" href="/u/{{ user.username }}">Public profile</a>
    <a class="btn" href="/models">My models</a>
    <a class="btn ghost" href="/logout">Sign out</a>
  </div>
</div>

<div class="grid g4" style="margin-top:16px">
  <div class="stat"><span>Runs</span><b>{{ summary.total }}</b>
    <small>{{ summary.done }} finished · {{ summary.active }} in flight</small></div>
  <div class="stat"><span>Tokens trained</span>
    <b>{{ "%.0fM"|format(summary.tokens / 1000000) if summary.tokens < 1000000000 else "%.2fB"|format(summary.tokens / 1000000000) }}</b>
    <small>of fineweb-edu</small></div>
  <div class="stat"><span>Parameters created</span>
    <b>{{ "{:,}".format(summary.params) }}</b><small>across finished models</small></div>
  <div class="stat"><span>Best loss</span>
    <b>{{ "%.4f"|format(summary.best) if summary.best else "—" }}</b>
    <small>{{ summary.published }} published to the Hub</small></div>
</div>

<section style="margin-top:34px">
  <div class="sect-h">
    <h2>Recent activity</h2>
    <a class="btn ghost sm" href="/models">All models →</a>
  </div>
  <div id="runs" class="runs"></div>
</section>

<section style="margin-top:34px">
  <div class="card">
    <h2 style="font-size:16px;margin-bottom:6px">Permissions</h2>
    <p class="sub">NanoDex uses your Hugging Face sign-in for two things: to know
      which runs are yours, and — only when you press Publish — to upload a
      finished model to your namespace. Nothing is written to your account
      otherwise, and the session expires after 8 hours.</p>
    <p class="sub" style="margin-top:12px">Your finished models are visible to
      everyone who can open NanoDex, on your
      <a href="/u/{{ user.username }}" style="color:var(--accent)">public
      profile</a> and in <a href="/explore" style="color:var(--accent)">Explore</a>,
      and anyone signed in can generate text from them. Cancelling a run and
      publishing to the Hub stay yours alone.</p>
  </div>
</section>

{% endblock %}
{% block scripts %}
<script>
const JOBS = {{ jobs | tojson }};
document.getElementById('runs').innerHTML = JOBS.length
  ? JOBS.slice(0,10).map(NX.runRow).join('')
  : `<div class="empty">No runs yet.
      <a href="/train" style="color:var(--accent)">Train your first model →</a></div>`;
</script>
{% endblock %}