{{> header.html page_title="Allow list" header_widgets="" }}

<link rel="stylesheet" href="{{assets}}/css/design-v2-common.css" media="all" nonce="{{nonce}}">

<style>
  {{custom_css}}

  /* ============================================================
   * Allow-list page styles. Layered on top of generic .tv-*
   * threat-view component CSS. Page-specific classes are .al-*.
   * ============================================================ */

  /* Filename cell — bright filename, dim parent directory. */
  .al-path {
    font-family: var(--mono);
    color: var(--fg);
    font-weight: 500;
    word-break: break-all;
    letter-spacing: -0.005em;
  }
  .al-path .dir { color: var(--fg-dimmer); font-weight: 400; }

  /* Type pill — four canonical buckets, color encodes content origin. */
  .al-type-pill {
    display: inline-block;
    padding: 1px 7px;
    border-radius: var(--bf-r-sm);
    background: var(--bg-raised);
    border: 1px solid var(--border);
    color: var(--fg-dim);
    font-family: var(--mono); font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: lowercase;
  }
  .al-type-pill[data-type="core"]    { color: var(--blue);   border-color: var(--blue-border);   background: var(--blue-bg); }
  .al-type-pill[data-type="plugin"]  { color: var(--green);  border-color: var(--green-border);  background: var(--green-bg); }
  .al-type-pill[data-type="theme"]   { color: var(--violet); border-color: var(--violet-border); background: var(--violet-bg); }
  .al-type-pill[data-type="unknown"] { color: var(--amber);  border-color: var(--amber-border);  background: var(--amber-bg); }

  /* Meta cells (size, mtime) — mono, dim. */
  .al-meta {
    font-family: var(--mono);
    color: var(--fg-dim);
    white-space: nowrap;
    letter-spacing: 0.01em;
  }

  /* Row removing animation. */
  .tv-table tbody tr.is-removing { opacity: 0; transition: opacity .3s; }

  /* Info-variant of the standalone callout: blue accent, neutral panel
     background. Used here because the allow-list explainer is purely
     informational, not a warning. */
  .tv-callout.is-info {
    border-left-color: var(--blue);
    background: var(--bg-panel);
  }
  .tv-callout.is-info .tv-callout-head { color: var(--blue); }

  /* Footer summary strip beneath the table. */
  .al-foot {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 4px 0;
    font-family: var(--mono);
    color: var(--fg-dimmer);
    letter-spacing: 0.02em;
  }
  .al-foot .num { color: var(--fg-dim); font-weight: 500; }
  .al-foot .spacer { flex: 1; }
</style>


<script type="text/javascript" nonce="{{nonce}}">
  window.BITFIRE_NONCE = '{{api_code}}';
</script>


<div class="bf-man-content">

  <div class="tv-shell">

    <!-- ============== HERO ============== -->
    <section class="tv-hero">
      <h1>
        Allow list
        <span class="tv-count-pill" id="al-count"><span class="num">{{+ entry_count }}</span>&nbsp;entries</span>
      </h1>
<!--
      <p class="lede">
        File fingerprints you've approved as safe. Matching files are <em>skipped</em> by future malware scans.
      </p>
-->
  <div class="tv-callout is-info fs-body">
      <div class="tv-callout-head">
        <span>What is the allow list?</span>
      </div>
      <p>
These files were identified by the scanner as potential malware and the administrator marked them as safe. WordPress official plugins, custom modifications and 3rd party and commercial PRO plugins may be listed here. These files (if not modified) will not appear in the malware scan results.
      </p>
    </div>

    </section>

    <!-- Auto-removal notice (server-rendered when stale entries were pruned) -->
    {{ auto_removed_notice }}

    <!-- ============== WHAT IS THIS? CALLOUT ============== -->
    
    <!-- ============== APPROVED FILES SECTION ============== -->
    <section class="tv-section">
      <div class="tv-section-head">
        <div class="tv-section-head-text">
          <div class="tv-section-eyebrow">01 &middot; Trusted fingerprints</div>
          <h2>
            Approved files
            <span class="tv-count-pill"><span class="num" id="al-section-count">{{+ entry_count }}</span>&nbsp;total</span>
          </h2>
          <p class="tv-section-blurb fs-lg">
            Each row is one file/content fingerprint that will be skipped on the next malware scan.
            Remove an entry to have that file re-evaluated.
          </p>
        </div>
        <div class="tv-section-actions">
          <button id="al-remove-all"
                  class="tv-btn is-bad fs-md"
                  type="button"
                  onclick="removeAllEntries(this)"
                  title="Remove every entry from the allow list so all files are re-evaluated on the next scan">
            <span class="ic" aria-hidden="true">&times;</span>
            <span class="tv-btn-label">Remove all</span>
          </button>
          <span id="al-remove-all-status" class="tv-toggle-status fs-sm"></span>
        </div>
      </div>

      <!-- Empty state (toggled by JS when ENTRIES is empty) -->
      <div id="al-empty" class="tv-empty" style="display:none">
        <div class="tv-empty-icon" aria-hidden="true">&#10003;</div>
        <p class="tv-empty-title fs-body">Your allow list is empty.</p>
        <p class="tv-empty-sub">
          No file versions have been approved yet. When you mark a file as safe in the Malware Scanner,
          a fingerprint of its exact contents is recorded here.
        </p>
      </div>

      <!-- Table -->
      <div class="tv-table-wrap" id="al-table-wrap">
        <table class="tv-table" id="al-table">
          <thead>
            <tr>
              <th style="min-width:300px;" title="Path to the file on your server, relative to the WordPress root">File path</th>
              <th style="width:110px;"     title="Whether the file belongs to WordPress core, a plugin, a theme, or is unrecognised">Type</th>
              <th style="width:90px;"      title="Current file size on disk">Size</th>
              <th style="width:140px;"     title="Date the file was last modified on disk">Last modified</th>
              <th style="width:60px;"></th>
            </tr>
          </thead>
          <tbody id="al-tbody">
            <!-- rendered client-side from window.ENTRIES -->
          </tbody>
        </table>
      </div>

      <!-- Row template (used by JS) -->
      <script type="text/template" id="al-row-tpl">
        <tr id="al-row-__IDX__" data-idx="__IDX__">
          <td><div class="al-path fs-md">__PATH__</div></td>
          <td><span class="al-type-pill fs-sm" data-type="__BUCKET__">__TYPE_LABEL__</span></td>
          <td><span class="al-meta fs-sm">__SIZE__</span></td>
          <td><span class="al-meta fs-sm">__MTIME__</span></td>
          <td>
            <div class="tv-actions">
              <button class="tv-icon-btn is-bad al-remove"
                      type="button"
                      data-idx="__IDX__"
                      onclick="removeEntry(__IDX__, this)"
                      title="Remove from allow list and re-evaluate on next scan">
                <span class="glyph" aria-hidden="true">&times;</span>
              </button>
            </div>
          </td>
        </tr>
      </script>

      <!-- Footer -->
      <div class="al-foot fs-sm">
        <span class="num" id="al-foot-count">0</span>
        <span>approved &middot; trusted on next scan</span>
        <span class="spacer"></span>
        <span>fingerprint: sha-256</span>
      </div>

    </section>

  </div><!-- /tv-shell -->
</div><!-- /bf-man-content -->


<script type="text/javascript" nonce="{{nonce}}">
(function() {

  var ENTRIES = {{ entries }};

  /* ── helpers ────────────────────────────────────────────────── */

  function fmtBytes(b) {
    if (b === 0 || b == null) return '—';
    if (b < 1024) return b + ' B';
    if (b < 1048576) return (b / 1024).toFixed(1) + ' KB';
    return (b / 1048576).toFixed(1) + ' MB';
  }

  function fmtDate(ts) {
    if (!ts) return '—';
    var d = new Date(ts * 1000);
    var pad = function(n){ return n < 10 ? '0' + n : '' + n; };
    return d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate());
  }

  function escHtml(s) {
    return String(s)
      .replace(/&/g, '&amp;').replace(/</g, '&lt;')
      .replace(/>/g, '&gt;').replace(/"/g, '&quot;');
  }

  /* Split a path so the filename is bright and the parent dir dims out. */
  function fmtPath(p) {
    var s = String(p);
    var i = s.lastIndexOf('/');
    if (i < 0) return '<span>' + escHtml(s) + '</span>';
    return '<span class="dir">' + escHtml(s.substring(0, i + 1)) + '</span>'
         + '<span>' + escHtml(s.substring(i + 1)) + '</span>';
  }

  /* Normalise the server-supplied type into one of our canonical buckets. */
  function typeBucket(t) {
    var s = String(t || '').toLowerCase();
    if (s.indexOf('core') !== -1)   return 'core';
    if (s.indexOf('plugin') !== -1) return 'plugin';
    if (s.indexOf('theme') !== -1)  return 'theme';
    return 'unknown';
  }

  /* ── render ─────────────────────────────────────────────────── */

  function renderTable() {
    var tbody = document.getElementById('al-tbody');
    var count = document.getElementById('al-count');
    var sec   = document.getElementById('al-section-count');
    var foot  = document.getElementById('al-foot-count');
    var empty = document.getElementById('al-empty');
    var wrap  = document.getElementById('al-table-wrap');
    var tplEl = document.getElementById('al-row-tpl');
    var tpl   = tplEl ? tplEl.textContent : '';

    tbody.innerHTML = '';

    var n = ENTRIES.length;
    if (count) count.innerHTML = '<span class="num">' + n + '</span>&nbsp;'
                                + (n === 1 ? 'entry' : 'entries');
    if (sec)   sec.textContent  = n;
    if (foot)  foot.textContent = n;

    if (n === 0) {
      empty.style.display = 'block';
      wrap.style.display  = 'none';
      return;
    }
    empty.style.display = 'none';
    wrap.style.display  = '';

    var html = '';
    for (var i = 0; i < n; i++) {
      var e = ENTRIES[i];
      var bucket = typeBucket(e.type);
      html += tpl
        .replace(/__IDX__/g,        i)
        .replace(/__PATH__/g,       fmtPath(e.path))
        .replace(/__BUCKET__/g,     escHtml(bucket))
        .replace(/__TYPE_LABEL__/g, escHtml(e.type || bucket))
        .replace(/__SIZE__/g,       escHtml(fmtBytes(e.size)))
        .replace(/__MTIME__/g,      escHtml(fmtDate(e.mtime)));
    }
    tbody.innerHTML = html;
  }

  /* ── remove single ──────────────────────────────────────────── */

  window.removeEntry = function(idx, btn) {
    var entry = ENTRIES[idx];
    if (!entry) { return; }

    btn.disabled = true;
    btn.classList.add('is-busy');

    BitFire_api('disallow', { path: entry.path, unique: '' })
      .then(function(r) { return r.json(); })
      .then(function(response) {
        if (response && response.success) {
          var row = document.getElementById('al-row-' + idx);
          if (row) {
            row.classList.add('is-removing');
            setTimeout(function() {
              ENTRIES.splice(idx, 1);
              renderTable();
            }, 320);
          }
        } else {
          var msg = (response && response.note) ? response.note : 'Unknown error';
          btn.disabled = false;
          btn.classList.remove('is-busy');
          alert('Could not remove file: ' + msg);
        }
      })
      .catch(function(err) {
        btn.disabled = false;
        btn.classList.remove('is-busy');
        alert('Request failed: ' + err);
      });
  };

  /* ── remove all ─────────────────────────────────────────────── */

  window.removeAllEntries = function(btn) {
    if (ENTRIES.length === 0) { return; }
    if (!confirm('Remove all ' + ENTRIES.length + ' entries from the allow list?\n\n'
               + 'Every file will be re-evaluated on the next malware scan.')) {
      return;
    }

    var status = document.getElementById('al-remove-all-status');
    btn.disabled = true;
    if (status) status.textContent = 'Removing…';

    BitFire_api('disallow_all', {})
      .then(function(r) { return r.json(); })
      .then(function(response) {
        if (response && response.success) {
          ENTRIES = [];
          renderTable();
          if (status) status.textContent = 'Removed';
          btn.disabled = false;
        } else {
          var msg = (response && response.note) ? response.note : 'Unknown error';
          btn.disabled = false;
          if (status) status.textContent = '';
          alert('Could not remove entries: ' + msg);
        }
      })
      .catch(function(err) {
        btn.disabled = false;
        if (status) status.textContent = '';
        alert('Request failed: ' + err);
      });
  };

  /* ── init ───────────────────────────────────────────────────── */

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', renderTable);
  } else {
    renderTable();
  }

})();
</script>