{{define "content"}}
{{if not .HasCredentials}}
<p class="notice">No Kraken account connected yet — <a href="/settings">add your API key</a> to auto-import trades, or add purchases manually.</p>
{{end}}

<div class="chart-card">
  <div class="chart-controls" data-chart="portfolio">
    <button type="button" data-range="24h">24H</button>
    <button type="button" data-range="7d">7D</button>
    <button type="button" data-range="30d">30D</button>
    <button type="button" data-range="1y">1Y</button>
    <button type="button" data-range="all" class="active">All</button>
  </div>
  <svg class="chart" data-chart-target="portfolio" data-symbol="{{curSymbol}}" viewBox="0 0 600 220" aria-hidden="true"></svg>
  <p class="chart-empty" data-chart-empty="portfolio" hidden>Not enough history yet — check back after a few polling cycles.</p>
  <p class="chart-caption" data-chart-caption="portfolio"></p>
</div>

{{if .Rows}}
<div class="table-scroll">
<table class="ledger sortable" data-poll="{{.PollSeconds}}" data-sort-key="dashboard">
  <thead>
    <tr>
      <th class="star-cell"></th>
      <th data-sort="currency">Currency</th>
      <th data-sort="holdings">Holdings</th>
      <th data-sort="avgcost">Avg Cost</th>
      <th data-sort="price">Price</th>
      <th data-sort="value">Value</th>
      <th data-sort="4h">4H</th>
      <th data-sort="24h">24H</th>
      <th data-sort="7d">7D</th>
      <th data-sort="30d">30D</th>
      <th data-sort="all">All-time</th>
      <th data-sort="pl">P/L</th>
    </tr>
  </thead>
  <tbody id="rows">{{template "rows" .}}</tbody>
</table>
</div>
{{else}}
<p class="empty">No purchases tracked yet. <a href="/settings">Add one</a> or connect Kraken.</p>
{{end}}
{{end}}