<!doctype html>
<html lang="<%= lang %>">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><%= text.detailText.legacyMockBlock %> - <%= service.name %></title>
    <link rel="stylesheet" href="/css/admin.css">
  </head>
  <body>
    <main class="shell explorer-shell explorer-wide">
      <% const d = text.detailText; %>
      <header class="topbar explorer-topbar">
        <div><p class="eyebrow"><%= text.legacyReadOnly %></p><h1><%= d.legacyMockBlock %></h1></div>
        <div class="top-actions"><a class="nav-button subtle" href="https://aisfor.kr/chain-wallet?next=/wallet/evm">EVM Wallet</a><a class="nav-button subtle" href="<%= urlWithLang('/explorer') %>">Explorer</a><a class="nav-button subtle" href="<%= urlWithLang('/admin') %>"><%= text.admin %></a></div>
      </header>
      <% if (!block) { %>
        <section class="panel"><h2><%= d.blockNotFound %></h2><p class="empty"><%= d.blockNotFoundDesc %></p></section>
      <% } else { %>
        <section class="panel explorer-detail-hero">
          <div>
            <p class="eyebrow"><%= d.archivedHeight %></p>
            <h2><%= d.legacyBlock %> #<%= block.height %></h2>
            <code class="hash-block"><%= block.blockHash || '-' %></code>
          </div>
          <div class="detail-status-stack"><span class="badge <%= block.status === 'FINALIZED_MOCK' ? 'badge-ok' : 'badge-warn' %>"><%= block.status %></span></div>
        </section>
        <section class="grid metrics explorer-metrics">
          <article><strong><%= (block.proofIds || []).length %></strong><span><%= d.proofs %></span></article>
          <article><strong><%= (block.transactionIds || []).length %></strong><span><%= d.transactions %></span></article>
          <article><strong><%= (block.rewardIds || []).length %></strong><span><%= d.rewards %></span></article>
          <article><strong><%= block.validation?.approveVotes || 0 %>/<%= block.validation?.requiredVotes || 0 %></strong><span><%= d.votes %></span></article>
        </section>
        <section class="panel">
          <div class="panel-title"><h2><%= d.blockHashes %></h2><span><%= d.chainLink %></span></div>
          <div class="stat-list compact">
            <div class="stat-row"><span><%= text.transferText.hash %></span><code><%= block.blockHash || '-' %></code></div>
            <div class="stat-row"><span><%= d.previousHash %></span><code><%= block.previousHash || '-' %></code></div>
            <div class="stat-row"><span><%= d.merkleRoot %></span><code><%= block.merkleRoot || '-' %></code></div>
            <div class="stat-row"><span><%= d.created %></span><strong><%= block.createdAt || '-' %></strong></div>
            <div class="stat-row"><span><%= d.finalized %></span><strong><%= block.finalizedAt || '-' %></strong></div>
          </div>
        </section>
        <section class="grid explorer-grid">
          <article class="panel">
            <div class="panel-title"><h2><%= d.chainTransactions %></h2><span><%= chainTransactions.length %></span></div>
            <% if (chainTransactions.length === 0) { %><p class="empty"><%= d.noChainTx %></p><% } %>
            <% chainTransactions.forEach(function(tx) { %>
              <% const trace = (chainTransactionTraces || []).find(function(row) { return row.txId === tx.id; }) || {}; %>
              <div class="item explorer-item">
                <div>
                  <strong><%= tx.actionType || '-' %></strong>
                  <span><%= tx.sourceService || '-' %> · <%= tx.status || '-' %></span>
                  <% if (trace.reviewDecision) { %>
                    <span><%= d.review %> <%= trace.reviewDecision.decision %> · <%= d.reward %> <%= shortHash(trace.reviewDecision.rewardId || '-') %></span>
                    <a href="<%= urlWithLang('/explorer/reward-review/' + encodeURIComponent(trace.reviewDecision.id)) %>"><%= d.reviewDecisionTrace %></a>
                    <% if (trace.reward) { %><a href="<%= urlWithLang('/explorer/reward/' + encodeURIComponent(trace.reward.id)) %>"><%= d.reward %></a><% } %>
                    <% if (trace.audit) { %><a href="<%= urlWithLang('/explorer/reward-audit/' + encodeURIComponent(trace.audit.id)) %>"><%= d.rewardAudit %></a><% } %>
                  <% } %>
                </div>
                <a href="<%= urlWithLang('/explorer/tx/' + encodeURIComponent(tx.txHash || tx.id)) %>"><code><%= shortHash(tx.txHash || tx.id) %></code></a>
              </div>
            <% }) %>
          </article>
          <article class="panel">
            <div class="panel-title"><h2><%= d.proofs %></h2><span><%= proofs.length %></span></div>
            <% if (proofs.length === 0) { %><p class="empty"><%= d.noProofs %></p><% } %>
            <% proofs.forEach(function(proof) { %>
              <div class="item explorer-item"><div><strong><%= proof.proofType || '-' %></strong><span><%= proof.sourceService || '-' %> · <%= proof.status || '-' %></span></div><a href="<%= urlWithLang('/explorer/proof/' + encodeURIComponent(proof.id || proof.proofHash)) %>"><code><%= shortHash(proof.id || proof.proofHash) %></code></a></div>
            <% }) %>
          </article>
        </section>
        <section class="panel">
          <div class="panel-title"><h2><%= d.rewardLedger %></h2><span><%= rewards.length %></span></div>
          <% if (rewards.length === 0) { %><p class="empty"><%= d.noRewards %></p><% } %>
          <% rewards.forEach(function(reward) { %>
            <div class="item explorer-item">
              <div>
                <strong><%= reward.category %> / <%= reward.rewardAmount %> <%= reward.symbol %></strong>
                <span><%= reward.sourceService %> · <%= reward.actionType %> · <%= (reward.flags || []).length ? (d.flags + ' ' + reward.flags.length) : d.validationOk %></span>
              </div>
              <a href="<%= urlWithLang('/explorer/reward/' + encodeURIComponent(reward.id)) %>"><code><%= shortHash(reward.id) %></code></a>
            </div>
          <% }) %>
        </section>
      <% } %>
    </main>
  </body>
</html>
