{# Bundle H: /settings — post-onboarding Advanced Settings panel. #}
{% extends "base.html" %}
{% block title %}Advanced Settings — lit-monitor{% endblock %}
{% block content %}
<section class="dashboard">
  <div class="page-header">
    <h1>Advanced Settings</h1>
    <p class="field-note">
      Changes are written atomically to <code>config/extraction.yaml</code>.
      Restart is not required for most settings.
    </p>
    <p class="field-note">
      Each Save replaces the entire section in <code>extraction.yaml</code>, so
      the form posts every field below (not just the one you changed). All
      current values are pre-filled.
    </p>
  </div>

  {# E3/B8: every input carries data-path so the inline JS rebuilds the EXACT
     nested shape the per-section pydantic model (extra="forbid") expects. The
     write replaces the whole section, so a complete valid body is posted. #}

  <!-- Section: Ranking weights & filters -->
  <details class="settings-section" open>
    <summary><h2>Ranking weights</h2></summary>
    <form class="setup-form"
          hx-post="/api/settings/ranking"
          hx-swap="none"
          hx-on="htmx:afterRequest: document.getElementById('ranking-result').textContent = (event.detail.successful ? 'Saved.' : 'Error — check logs.')">
      <h3 class="field-label">Signal weights</h3>
      <div class="field-group">
        <label class="field-label" for="ranking-domain-context">domain_context</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-domain-context"
               data-path="weights.domain_context"
               value="{{ ranking.get('weights', {}).get('domain_context', 0.0) }}">
        <span class="field-note">Additive weight for the domain_context paragraph signal.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-cluster-centroid">cluster_centroid</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-cluster-centroid"
               data-path="weights.cluster_centroid"
               value="{{ ranking.get('weights', {}).get('cluster_centroid', 0.0) }}">
        <span class="field-note">Max-cosine-to-nearest-cluster-centroid signal.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-graph-entity">graph_entity_overlap</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-graph-entity"
               data-path="weights.graph_entity_overlap"
               value="{{ ranking.get('weights', {}).get('graph_entity_overlap', 0.0) }}">
        <span class="field-note">Shared MENTIONS entities between candidate and library.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-graph-citation">graph_citation</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-graph-citation"
               data-path="weights.graph_citation"
               value="{{ ranking.get('weights', {}).get('graph_citation', 0.0) }}">
        <span class="field-note">Candidate cites / is cited by / EXTENDS library papers.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-graph-authors">graph_shared_authors</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-graph-authors"
               data-path="weights.graph_shared_authors"
               value="{{ ranking.get('weights', {}).get('graph_shared_authors', 0.0) }}">
        <span class="field-note">Shared author names (case-insensitive, deduped).</span>
      </div>

      <h3 class="field-label">Domain filter</h3>
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="domain_filter.enabled"
                 {% if ranking.get('domain_filter', {}).get('enabled', false) %}checked{% endif %}>
          Enable pre-rank semantic filter
        </label>
        <span class="field-note">Candidates below the threshold move to the off-domain pool.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-df-threshold">threshold</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-df-threshold"
               data-path="domain_filter.threshold"
               value="{{ ranking.get('domain_filter', {}).get('threshold', 0.35) }}">
        <span class="field-note">Cosine cutoff below which candidates are off-domain.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-df-floor">minimum_off_domain_slots_pct</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-df-floor"
               data-path="domain_filter.minimum_off_domain_slots_pct"
               value="{{ ranking.get('domain_filter', {}).get('minimum_off_domain_slots_pct', 0.05) }}">
        <span class="field-note">Fraction of digest slots always reserved for serendipity.</span>
      </div>

      <h3 class="field-label">Semantic Scholar supplement cap</h3>
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="s2_supplement_cap.enabled"
                 {% if ranking.get('s2_supplement_cap', {}).get('enabled', false) %}checked{% endif %}>
          Drop low-relevance S2 supplemented candidates
        </label>
      </div>
      <div class="field-group">
        <label class="field-label" for="ranking-s2-min">min_relevance</label>
        <input type="number" step="0.01" min="0" max="1" id="ranking-s2-min"
               data-path="s2_supplement_cap.min_relevance"
               value="{{ ranking.get('s2_supplement_cap', {}).get('min_relevance', 0.4) }}">
        <span class="field-note">S2 relevance_score floor; below this → dropped.</span>
      </div>

      <button type="submit" class="button">Save ranking settings</button>
      <span id="ranking-result" class="field-note" style="margin-left:1rem;"></span>
    </form>
  </details>

  <!-- Section: Clustering -->
  <details class="settings-section">
    <summary><h2>Clustering</h2></summary>
    <form class="setup-form"
          hx-post="/api/settings/clustering"
          hx-swap="none"
          hx-on="htmx:afterRequest: document.getElementById('clustering-result').textContent = (event.detail.successful ? 'Saved.' : 'Error — check logs.')">
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="enabled"
                 {% if clustering.get('enabled', true) %}checked{% endif %}>
          Enable clustering
        </label>
        <span class="field-note">Master switch. When off the whole feature is a no-op.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-min-papers">min_papers_threshold</label>
        <input type="number" step="1" min="1" id="cluster-min-papers"
               data-path="min_papers_threshold"
               value="{{ clustering.get('min_papers_threshold', 100) }}">
        <span class="field-note">Library must hold at least this many indexed papers.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-kmin">k_min</label>
        <input type="number" step="1" min="2" max="100" id="cluster-kmin"
               data-path="k_min"
               value="{{ clustering.get('k_min', 5) }}">
        <span class="field-note">Low end of the k-means K search range.</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-kmax">k_max</label>
        <input type="number" step="1" min="2" max="100" id="cluster-kmax"
               data-path="k_max"
               value="{{ clustering.get('k_max', 15) }}">
        <span class="field-note">High end of the K search range (silhouette picks best K).</span>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-recompute">recompute_frequency</label>
        <input type="text" id="cluster-recompute"
               data-path="recompute_frequency"
               value="{{ clustering.get('recompute_frequency', 'nightly') }}">
        <span class="field-note">How often clusters are recomputed (e.g. nightly).</span>
      </div>

      <h3 class="field-label">Collection priors (tier-3 opt-in)</h3>
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="use_existing_collections_as_priors.enabled"
                 {% if clustering.get('use_existing_collections_as_priors', {}).get('enabled', false) %}checked{% endif %}>
          Use existing Zotero collections as cluster seeds
        </label>
        <span class="field-note">
          Collection names are configured in <code>extraction.yaml</code> directly
          (list field, not editable here); current names are preserved on save.
        </span>
      </div>

      <h3 class="field-label">Write-back (opt-in)</h3>
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="write_back.tags.enabled"
                 {% if clustering.get('write_back', {}).get('tags', {}).get('enabled', false) %}checked{% endif %}>
          Write lm/&lt;theme&gt; tags back to Zotero
        </label>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-tag-ns">tag namespace</label>
        <input type="text" id="cluster-tag-ns"
               data-path="write_back.tags.namespace"
               value="{{ clustering.get('write_back', {}).get('tags', {}).get('namespace', 'lm') }}">
      </div>
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" data-path="write_back.collections.enabled"
                 {% if clustering.get('write_back', {}).get('collections', {}).get('enabled', false) %}checked{% endif %}>
          Create Zotero sub-collections per theme
        </label>
      </div>
      <div class="field-group">
        <label class="field-label" for="cluster-parent-col">parent collection</label>
        <input type="text" id="cluster-parent-col"
               data-path="write_back.collections.parent_collection"
               value="{{ clustering.get('write_back', {}).get('collections', {}).get('parent_collection', 'lit-monitor') }}">
      </div>

      {# The collection_names list is not editable via this panel; carry the
         current value through so the replace-whole-section write doesn't drop
         it. Rendered as a hidden JSON blob the serializer parses back to a list. #}
      <input type="hidden" id="cluster-prior-names"
             data-path="use_existing_collections_as_priors.collection_names"
             data-json="list"
             value="{{ clustering.get('use_existing_collections_as_priors', {}).get('collection_names', []) | tojson }}">

      <button type="submit" class="button">Save clustering settings</button>
      <span id="clustering-result" class="field-note" style="margin-left:1rem;"></span>
    </form>
  </details>

  <!-- Section: Feedback / UI -->
  <details class="settings-section">
    <summary><h2>Feedback &amp; UI</h2></summary>
    <form class="setup-form"
          hx-post="/api/settings/web_ui"
          hx-swap="none"
          hx-on="htmx:afterRequest: document.getElementById('webui-result').textContent = (event.detail.successful ? 'Saved.' : 'Error — check logs.')">
      <div class="field-group">
        <label class="checkbox-inline">
          <input type="checkbox" name="show_feedback_buttons" data-path="show_feedback_buttons"
                 {% if web_ui.get('show_feedback_buttons', false) %}checked{% endif %}>
          Show feedback buttons on paper cards
        </label>
        <span class="field-note">
          Enables Save / Dismiss / &#128077; / &#128078; / Rate buttons.
          Default: off. Feedback events are stored for future active-learning.
          See the <a href="/insights">Insights</a> page.
        </span>
      </div>
      <button type="submit" class="button">Save UI settings</button>
      <span id="webui-result" class="field-note" style="margin-left:1rem;"></span>
    </form>
  </details>
</section>

<script>
  /* Bundle H (E3/B8): serialize each settings form into the EXACT nested JSON
   * the per-section pydantic model expects.
   *
   * Each input declares its position in the section via a `data-path`
   * attribute using dotted notation, e.g. data-path="weights.domain_context"
   * or data-path="write_back.tags.enabled". This builder walks every input
   * with a data-path inside the form and assembles a nested object, so the
   * POST body matches the model's nesting (which uses extra="forbid").
   *
   * The settings API REPLACES the whole section on write, so every field is
   * rendered and posted (not just edited ones) to avoid clobbering siblings.
   *
   * Type coercion per input:
   *   - checkbox            -> boolean (.checked)
   *   - data-json="list"    -> JSON.parse (preserves a list we don't edit here)
   *   - <input type=number> -> Number()
   *   - everything else     -> raw string
   */
  // Keys that could pollute Object.prototype if assigned via a crafted
  // data-path (e.g. "__proto__.polluted"). Skip the whole path if any segment
  // is one of these — settings fields never legitimately use these names.
  var UNSAFE_KEYS = { '__proto__': true, 'constructor': true, 'prototype': true };

  function setNested(obj, dottedPath, value) {
    var parts = dottedPath.split('.');
    var cur = obj;
    for (var i = 0; i < parts.length - 1; i++) {
      var key = parts[i];
      // prototype-pollution guard: gate the EXACT assignment below. Checking
      // each key immediately before it is used as an assignment target (rather
      // than in a separate up-front scan) ensures __proto__/constructor/
      // prototype can never reach `cur[key] = ...`.
      if (Object.prototype.hasOwnProperty.call(UNSAFE_KEYS, key)) {
        return;
      }
      if (typeof cur[key] !== 'object' || cur[key] === null) {
        cur[key] = {};
      }
      cur = cur[key];
    }
    var last = parts[parts.length - 1];
    if (Object.prototype.hasOwnProperty.call(UNSAFE_KEYS, last)) {
      return;
    }
    cur[last] = value;
  }

  document.querySelectorAll('.settings-section form[hx-post]').forEach(function (form) {
    form.addEventListener('htmx:configRequest', function (evt) {
      var obj = {};
      form.querySelectorAll('[data-path]').forEach(function (el) {
        var path = el.getAttribute('data-path');
        var value;
        if (el.type === 'checkbox') {
          value = el.checked;
        } else if (el.getAttribute('data-json') === 'list') {
          try {
            value = JSON.parse(el.value);
          } catch (e) {
            value = [];
          }
        } else if (el.type === 'number') {
          var num = Number(el.value);
          value = isNaN(num) ? el.value : num;
        } else {
          value = el.value;
        }
        setNested(obj, path, value);
      });
      evt.detail.parameters = JSON.stringify(obj);
      evt.detail.headers['Content-Type'] = 'application/json';
    });
  });
</script>
{% endblock %}