{% extends "base.html" %}
{% block title %}Factcat — Setup{% endblock %}
{% block extra_head %}
    <script src="/static/save.js"></script>
{% endblock %}
{% block extra_css %}
    .setup-page {
      flex: 1;
      min-height: 0;
      width: 100%;
      box-sizing: border-box;
      padding: 1.5rem 1.75rem 2rem;
      display: flex;
      flex-direction: column;
      gap: 1.25rem;
    }
    .setup-cols {
      flex: 1;
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(22rem, 28rem) minmax(0, 1fr);
      grid-template-rows: minmax(0, 1fr);
      gap: 1.25rem;
    }
    .setup-form {
      background: var(--fc-snow);
      border: 1px solid var(--fc-line);
      border-radius: 0.75rem;
      padding: 1.4rem 1.5rem 1.6rem;
      min-height: 0;
      overflow-y: auto;
    }
    .setup-docs {
      background: var(--fc-snow);
      border: 1px solid var(--fc-line);
      border-radius: 0.75rem;
      padding: 1.25rem 1.45rem 1.6rem;
      min-height: 0;
      overflow: auto;
      font-size: 0.88rem;
      color: var(--fc-ink-soft);
    }
    .setup-docs h1 { font-size: 1.05rem; margin: 0 0 0.65rem; }
    .setup-docs h2 { margin-top: 1.15rem; }
    .setup-docs p, .setup-docs ul { margin: 0 0 0.65rem; }
    .setup-docs ul { padding-left: 1.2rem; }
    .setup-docs code {
      font-size: 0.8em;
      background: var(--fc-paper);
      padding: 0.05rem 0.3rem;
      border-radius: 0.25rem;
    }
    .setup-docs pre {
      background: var(--fc-paper);
      padding: 0.75rem 0.9rem;
      border-radius: 0.4rem;
      overflow: auto;
      font-size: 0.8rem;
    }
    #extra-card {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.65rem 1rem;
      margin: 0;
      padding: 0.85rem 1.1rem;
      border: 1px solid var(--fc-ochre);
      border-radius: 0.75rem;
      background: var(--fc-ochre-wash);
    }
    #extra-card[hidden] { display: none !important; }
    #extra-lede { flex: 1 1 14rem; font-size: 0.88rem; margin: 0; color: var(--fc-ink); }
    #extra-command {
      flex: 1 1 18rem;
      margin: 0;
      padding: 0.45rem 0.6rem;
      font-size: 0.78rem;
      overflow: auto;
      background: var(--fc-snow);
    }
    #extra-install { margin: 0; }
    #extra-status { flex: 1 1 100%; font-size: 0.85rem; color: var(--fc-ink-soft); min-height: 0; margin: 0; }
    #extra-status:empty { display: none; }
    .setup-form select:disabled {
      opacity: 1;
      background: var(--fc-paper);
      color: var(--fc-ink);
      cursor: not-allowed;
    }
    label .catalog-refresh { margin-left: 0.5rem; }
    .hint.ok { color: var(--fc-ok); }
    .hint.ok .tick { font-weight: 700; margin-right: 0.35rem; }
    #event-time-layout .callout,
    #event-column-layout .callout,
    #entity-layout .callout,
    #table-cluster-layout .callout { margin: 0.45rem 0 0.65rem; }
    #event-time-layout .callout p,
    #event-column-layout .callout p,
    #entity-layout .callout p,
    #table-cluster-layout .callout p { margin: 0; }
    .layout-checking {
      margin-left: 0.5rem;
      font-size: inherit;
      font-weight: 400;
      color: var(--fc-ochre-deep);
    }
    /* Managed tables. #managed-wrap owns the section; .mt owns
       the list geometry; .mt-acts owns action spacing. */
    #managed-wrap[hidden] { display: none !important; }
    #managed-knobs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.5rem; }
    #managed-knobs > div { min-width: 0; }
    #managed-knobs input[type=number] { width: 5rem; display: inline-block; }
    .mt-unit { font-size: 0.8rem; color: var(--fc-slate); margin-left: 0.35rem; }
    /* The Setup column is ~24rem: one stacked row per table, never a wide
       table (the first render overflowed the column). .mt owns the list,
       .mt-row the row rhythm, .mt-acts the action spacing (there is no
       td.acts any more). Failures are ochre callouts (#66 grammar), never
       red text; while the registry is unreadable the actions are disabled. */
    .mt { margin-top: 0.5rem; font-size: 0.82rem; border-top: 1px solid var(--fc-line); }
    .mt-row { padding: 0.55rem 0; border-bottom: 1px solid var(--fc-line); }
    .mt-head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.25rem 0.75rem; flex-wrap: wrap; }
    .mt-head code { font-size: 0.8rem; }
    .mt-meta { color: var(--fc-slate); font-size: 0.75rem; white-space: nowrap; }
    .mt-serves { margin-top: 0.15rem; }
    .mt .sub { color: var(--fc-slate); font-size: 0.75rem; display: block; }
    .mt-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 0.15rem 0.75rem; margin-top: 0.3rem; min-height: 1.15rem; }
    .mt-acts .linkish { margin: 0; padding: 0; }
    .mt-acts .loading { margin-left: 0; }
    .mt-acts .layout-checking { margin-left: 0.25rem; }
    .mt .callout { margin: 0.35rem 0 0.1rem; }
    .mt-empty { padding: 0.55rem 0; border-bottom: 1px solid var(--fc-line); }
    #managed-status { font-size: 0.75rem; color: var(--fc-slate); margin: 0.4rem 0 0; }
    #managed-status:empty { display: none; }
    #managed-status.callout { font-size: 0.85rem; color: var(--fc-ink); margin: 0.6rem 0 0; }
    @media (max-width: 56rem) {
      .setup-page { overflow-y: auto; }
      .setup-cols {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        grid-auto-rows: auto;
        flex: 0 0 auto;
        min-height: auto;
      }
      .setup-form, .setup-docs { overflow: visible; min-height: auto; }
    }
{% endblock %}
{% block body %}
<div class="setup-page">
  <div id="extra-card" hidden>
    <p id="extra-lede"></p>
    <pre id="extra-command"></pre>
    <button type="button" id="extra-install">Install</button>
    <p id="extra-status"></p>
  </div>
<div class="setup-cols">
<form id="f" class="setup-form">
  <h1>Project setup</h1>

  <h2>Warehouse</h2>
  <label for="kind">Warehouse</label>
  <select id="kind" name="kind">
    <option value="bigquery" {% if (config.kind or "bigquery") != "snowflake" %}selected{% endif %}>BigQuery</option>
    <option value="snowflake" {% if config.kind == "snowflake" %}selected{% endif %}>Snowflake</option>
  </select>

  <div id="bq-conn">
    <label for="project">GCP project that runs the query (billing)</label>
    <input id="project" name="project" autocomplete="off" value="{{ config.project }}">
    <span class="hint">Pre-filled from ADC, <code>GOOGLE_CLOUD_PROJECT</code>, or <code>gcloud config get-value project</code> when we can read them. Dataset and table are not part of that.</span>
    <label for="data_project">Project that holds the table (blank = same as billing)</label>
    <input id="data_project" name="data_project" autocomplete="off" value="{{ config.data_project }}">
    <input type="hidden" name="location" id="location" value="{{ config.location }}">
  </div>
  <div id="sf-conn" hidden>
    <label for="account">Account identifier</label>
    <input id="account" name="account" autocomplete="off" value="{{ config.account }}" placeholder="xy12345">
    <span class="hint">The account locator from your Snowflake URL, for example <code>xy12345</code> or <code>xy12345.us-east-1</code>.</span>
    <label for="user">User</label>
    <input id="user" name="user" autocomplete="off" value="{{ config.user }}">
    <label for="snowflake_auth">Sign-in</label>
    <select id="snowflake_auth" name="snowflake_auth">
      <option value="key_pair" {% if config.snowflake_auth != "externalbrowser" %}selected{% endif %}>Key-pair file</option>
      <option value="externalbrowser" {% if config.snowflake_auth == "externalbrowser" %}selected{% endif %}>Browser SSO</option>
    </select>
    <span class="hint" id="sf-auth-hint">Key-pair JWT. Encrypted keys use env <code>SNOWFLAKE_PRIVATE_KEY_PASSPHRASE</code>. The passphrase is not saved in <code>.factcat.json</code>.</span>
    <div id="sf-key-wrap">
      <label for="private_key_path">Private key file</label>
      <input id="private_key_path" name="private_key_path" autocomplete="off" value="{{ config.private_key_path }}" placeholder="rsa_key.p8">
    </div>
    <label for="role">Role (optional) <span id="role-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="role" hidden>Refresh</button></label>
    <select id="role" name="role" disabled>
      <option value=""></option>
      {% if config.role %}<option value="{{ config.role }}" selected>{{ config.role }}</option>{% endif %}
    </select>
    <label for="warehouse">Compute warehouse <span id="warehouse-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="warehouse" hidden>Refresh</button></label>
    <select id="warehouse" name="warehouse" disabled>
      <option value=""></option>
      {% if config.warehouse %}<option value="{{ config.warehouse }}" selected>{{ config.warehouse }}</option>{% endif %}
    </select>
  </div>
  <input type="hidden" name="table" id="table" value="{{ config.table }}">

  <h2>Table</h2>
  <div id="bq-table">
    <label for="dataset">Dataset <span id="dataset-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="dataset" hidden>Refresh</button></label>
    <select id="dataset" name="dataset" disabled>
      <option value=""></option>
      {% if config.dataset %}<option value="{{ config.dataset }}" selected>{{ config.dataset }}</option>{% endif %}
    </select>
  </div>
  <div id="sf-table" hidden>
    <label for="database">Database <span id="database-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="database" hidden>Refresh</button></label>
    <select id="database" name="database" disabled>
      <option value=""></option>
      {% if config.database %}<option value="{{ config.database }}" selected>{{ config.database }}</option>{% endif %}
    </select>
    <label for="schema">Schema <span id="schema-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="schema" hidden>Refresh</button></label>
    <select id="schema" name="schema" disabled>
      <option value=""></option>
      {% if config.schema %}<option value="{{ config.schema }}" selected>{{ config.schema }}</option>{% endif %}
    </select>
  </div>
  <label for="table_name">Table <span id="table_name-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="table_name" hidden>Refresh</button></label>
  <select id="table_name" name="table_name" disabled>
    <option value=""></option>
    {% if config.table_name %}<option value="{{ config.table_name }}" selected>{{ config.table_name }}</option>{% endif %}
  </select>
  <span class="hint" id="table-layout-hint"></span>
  <div id="table-cluster-layout"></div>

  <h2>Grain</h2>
  <label for="entity">Entity id <span id="entity-loading" class="loading" hidden aria-label="Loading"></span> <span id="entity-checking" class="layout-checking" hidden>Checking whether entity filters prune…</span> <button type="button" class="linkish catalog-refresh" data-catalog="_columns" hidden>Refresh</button></label>
  <select id="entity" name="entity" required disabled>
    <option value=""></option>
    {% if config.entity %}<option value="{{ config.entity }}" selected>{{ config.entity }}</option>{% endif %}
  </select>
  <span class="hint">Stable id for this grain. Null means the event is not about that grain (dropped from uniques). Integer preferred; string is fine. Not unique on the events table.</span>
  <div id="entity-layout"></div>
  <label for="entity_label_choice">Entity name</label>
  <select id="entity_label_choice">
    <option value="User">User</option>
    <option value="Customer">Customer</option>
    <option value="Account">Account</option>
    <option value="Subscription">Subscription</option>
    <option value="__other__">Other</option>
  </select>
  <span class="hint">Display only (Unique Users, Average per User). Does not choose the id column.</span>
  <div id="entity_label_other_wrap" hidden>
    <label for="entity_label_other">Singular (e.g. order)</label>
    <input id="entity_label_other" autocomplete="off">
    <label for="entity_label_plural">Plural (e.g. orders)</label>
    <input id="entity_label_plural" name="entity_label_plural" autocomplete="off" value="{{ config.entity_label_plural or 'Users' }}">
  </div>
  <input type="hidden" name="entity_label" id="entity_label" value="{{ config.entity_label or 'User' }}">
  <label for="event_time">Timestamp <span id="event_time-loading" class="loading" hidden aria-label="Loading"></span> <span id="event-time-checking" class="layout-checking" hidden>Checking whether date filters prune…</span> <button type="button" class="linkish" id="event-time-check" hidden>Check whether date filters prune</button></label>
  <select id="event_time" name="event_time" required disabled>
    <option value=""></option>
    {% if config.event_time %}<option value="{{ config.event_time }}" selected>{{ config.event_time }}</option>{% endif %}
  </select>
  <span class="hint" id="event-time-hint">TIMESTAMP (UTC instant), DATETIME (civil time), or an integer Unix epoch. Not DATE.</span>
  <div id="event-time-layout"></div>
  <input type="hidden" name="event_time_epoch" id="event_time_epoch" value="{{ config.event_time_epoch or '' }}">
  <div id="event-time-tz-wrap" hidden>
    <label for="event_time_storage_tz">Timezone of these values</label>
    <select id="event_time_storage_tz">
      {% for tz in reporting_timezones %}
      <option value="{{ tz }}">{{ tz }}</option>
      {% endfor %}
    </select>
    <input type="hidden" name="event_time_tz" id="event_time_tz" value="{{ config.event_time_tz or 'utc' }}">
    <!-- syncEventTimeKind() rewrites this on every kind change, so the server
         copy renders the SAME two branches. Edit both, or the edit is dead source. -->
    <span class="hint" id="event-time-tz-hint">{% if config.kind == "snowflake" %}TIMESTAMP_NTZ / DATETIME have no zone on the column. TIMESTAMP_TZ and TIMESTAMP_LTZ are instants and do not need this.{% else %}DATETIME has no zone on the column. TIMESTAMP is a UTC instant and does not need this.{% endif %}</span>
  </div>
  <label for="event_column">Event name column (optional) <span id="event_column-loading" class="loading" hidden aria-label="Loading"></span> <span id="event-column-checking" class="layout-checking" hidden>Checking whether event-name filters prune…</span></label>
  <select id="event_column" name="event_column" disabled>
    <option value=""></option>
    {% if config.event_column %}<option value="{{ config.event_column }}" selected>{{ config.event_column }}</option>{% endif %}
  </select>
  <span class="hint">String column of event names. Events <strong>Refresh list</strong> loads names from the lookback below.</span>
  <div id="event-column-layout"></div>
  <!-- Week start and reporting timezone live on Preferences now (no pointer
       here - Setup does not narrate every page a setting isn't on). Read by
       dateFingerprint() and sent with /api/layout: the date-prune cache
       depends on them, and layout.py fingerprints them server-side too. They
       carry no `name`, so the Setup autosave cannot write them back into the
       project file - which is the whole point of the move. -->
  <input type="hidden" id="week_start" value="{{ prefs.week_start or 'monday' }}">
  <input type="hidden" id="reporting_timezone" value="{{ prefs.reporting_timezone or 'UTC' }}">
  <h2>Limits</h2>
  <div id="scan-cap-wrap">
    <label for="bytes_cap_gb">Job scan cap (GB)</label>
    <input id="bytes_cap_gb" name="bytes_cap_gb" type="number" min="0" step="1" value="{{ config.bytes_cap_gb if config.bytes_cap_gb is not none else 10 }}">
    <span class="hint">Factcat sets this on the BigQuery job (<code>maximum_bytes_billed</code>). 0 is unlimited. A report can override it for one run.</span>
  </div>
  <label for="query_row_limit">Result row limit</label>
  <input id="query_row_limit" name="query_row_limit" type="number" min="1" step="1" value="{{ config.query_row_limit or 1000000 }}">
  <span class="hint">Crash fuse in SQL after aggregation (most recent rows). A normal chart never hits this; grouping by a high-cardinality property might. It does not reduce bytes scanned. A report can raise it if results are truncated.</span>
  <div id="catalog-lookback-wrap">
  <label for="catalog_lookback_days">Look back for event names</label>
  <input id="catalog_lookback_days" name="catalog_lookback_days" type="number" min="0" step="1" value="{{ config.catalog_lookback_days if config.catalog_lookback_days is not none else 90 }}">
  <span class="hint">How far back to scan the events table to fill the event picker. 0 is all time. This job does not use the scan cap.</span>
  </div>

  <h2>Factcat-managed tables (recommended)</h2>
  <div id="write-bq-wrap">
    <span class="hint">Allow Factcat to create and maintain tables in this project and dataset for better performance.</span>
    <span class="hint" id="write-access-hint-bq"></span>
    <label for="write_project">Project</label>
    <input id="write_project" name="write_project" autocomplete="off" value="{{ config.write_project }}" placeholder="GCP project id">
    <label for="write_dataset">Dataset <span id="write_dataset-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="write_dataset" hidden>Refresh</button></label>
    <select id="write_dataset" name="write_dataset" disabled>
      <option value=""></option>
      {% if config.write_dataset %}<option value="{{ config.write_dataset }}" selected>{{ config.write_dataset }}</option>{% endif %}
    </select>
  </div>
  <div id="write-sf-wrap" hidden>
    <span class="hint">Allow Factcat to create and maintain tables in this database and schema for better performance.</span>
    <span class="hint" id="write-access-hint-sf"></span>
    <label for="write_database">Database <span id="write_database-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="write_database" hidden>Refresh</button></label>
    <select id="write_database" name="write_database" disabled>
      <option value=""></option>
      {% if config.write_database %}<option value="{{ config.write_database }}" selected>{{ config.write_database }}</option>{% endif %}
    </select>
    <label for="write_schema">Schema <span id="write_schema-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish catalog-refresh" data-catalog="write_schema" hidden>Refresh</button></label>
    <select id="write_schema" name="write_schema" disabled>
      <option value=""></option>
      {% if config.write_schema %}<option value="{{ config.write_schema }}" selected>{{ config.write_schema }}</option>{% endif %}
    </select>
  </div>

  <div id="managed-wrap" hidden>
    <div id="managed-knobs">
      <div>
        <label for="managed_mode">Mode</label>
        <select id="managed_mode" name="managed_mode">
          <option value="auto"{% if (config.managed_mode or 'auto') == 'auto' %} selected{% endif %}>Automatic</option>
          <option value="off"{% if config.managed_mode == 'off' %} selected{% endif %}>Off</option>
        </select>
        <span class="hint">Automatic indexes a sparse column the first time an expensive breakdown mode uses it, refreshes it when stale, and drops it when unused. Off stops using them: charts read the full history and scan more. Nothing is deleted while it is off, but the time still counts toward Drop unused after.</span>
      </div>
      <div>
        <label for="managed_drop_days">Drop unused after</label>
        <input id="managed_drop_days" name="managed_drop_days" type="number" min="1" step="1" value="{{ config.managed_drop_days if config.managed_drop_days is not none else 60 }}"><span class="mt-unit">days</span>
        <span class="hint">A column no chart has used for this long is dropped during a chart run, at most once a day. Nothing runs in the background, and a column the current chart uses is never dropped.</span>
      </div>
      <div>
        <label for="managed_refresh_days">Refresh when older than</label>
        <input id="managed_refresh_days" name="managed_refresh_days" type="number" min="0" step="1" value="{{ config.managed_refresh_days if config.managed_refresh_days is not none else 7 }}"><span class="mt-unit">days</span>
        <span class="hint">Runs always read the table plus everything newer, so results stay exact; this only decides when the newer rows get folded in.</span>
      </div>
      <div>
        <label for="managed_lookback_days">Late-arrival lookback</label>
        <input id="managed_lookback_days" name="managed_lookback_days" type="number" min="0" step="1" value="{{ config.managed_lookback_days if config.managed_lookback_days is not none else 3 }}"><span class="mt-unit">days</span>
        <span class="hint">How late a row can arrive after its event time. A refresh re-reads this much before each bookmark.</span>
      </div>
    </div>
    <label>Tables Factcat keeps here <span id="managed-list-loading" class="loading" hidden aria-label="Loading"></span> <button type="button" class="linkish" id="managed-refresh-list">Refresh list</button></label>
    <div class="mt" id="managed-list" role="list" aria-label="Factcat-managed tables"></div>
    <div id="managed-status" role="status"></div>
  </div>

  <p id="error"></p>
  <div id="status" class="save-toast" role="status" aria-live="polite" hidden></div>

  <details id="bq-advanced">
    <summary>Advanced: service-account JSON instead of ADC</summary>
    <label for="credentials">Path to key file (leave blank to keep ADC)</label>
    <input id="credentials" name="credentials" autocomplete="off" value="{{ config.credentials }}">
  </details>
</form>
<aside class="setup-docs" aria-label="Setup guide" id="setup-docs-pane">
  {{ setup_docs | safe }}
</aside>
</div>
</div>
<script>
const saved = {
  kind: {{ (config.kind or "bigquery")|tojson }},
  dataset: {{ config.dataset|tojson }},
  database: {{ config.database|tojson }},
  schema: {{ config.schema|tojson }},
  table_name: {{ config.table_name|tojson }},
  entity: {{ config.entity|tojson }},
  event_time: {{ config.event_time|tojson }},
  event_column: {{ config.event_column|tojson }},
  event_names: {{ (config.event_names or [])|tojson }},
  role: {{ config.role|tojson }},
  warehouse: {{ config.warehouse|tojson }},
  write_project: {{ config.write_project|tojson }},
  managed_tables: {{ (config.managed_tables or {})|tojson }},
  write_dataset: {{ config.write_dataset|tojson }},
  write_database: {{ config.write_database|tojson }},
  write_schema: {{ config.write_schema|tojson }},
  columns: {{ (config.columns or [])|tojson }},
  catalog_lists: {{ (config.catalog_lists or {})|tojson }},
  layout_cache: {{ (config.layout_cache or {})|tojson }},
};
const form = document.getElementById("f");
const kindEl = document.getElementById("kind");
const projectEl = document.getElementById("project");
const dataProjectEl = document.getElementById("data_project");
const datasetEl = document.getElementById("dataset");
const databaseEl = document.getElementById("database");
const schemaEl = document.getElementById("schema");
const tableNameEl = document.getElementById("table_name");
const tableEl = document.getElementById("table");
const locationEl = document.getElementById("location");
const entityEl = document.getElementById("entity");
const eventTimeEl = document.getElementById("event_time");
const eventColumnEl = document.getElementById("event_column");
const credentialsEl = document.getElementById("credentials");
const warehouseEl = document.getElementById("warehouse");
const roleEl = document.getElementById("role");
const TYPE_SETS = {{ type_sets|tojson }};
const SETUP_DOCS = {{ setup_docs_by_kind|tojson }};
const EXTRAS = {{ extras|tojson }};
const EXTRA_COMMANDS = {{ extra_commands|tojson }};
const CATALOG = {{ catalog_steps_by_kind|tojson }};
const CAPABILITIES_BY_KIND = {{ capabilities_by_kind|tojson }};
function currentKind() {
  return CATALOG[kindEl.value] ? kindEl.value : Object.keys(CATALOG)[0];
}
function hasCap(name) {
  const list = CAPABILITIES_BY_KIND[currentKind()] || [];
  return list.indexOf(name) >= 0;
}
function typeSet(role) {
  const pack = TYPE_SETS[currentKind()] || TYPE_SETS.bigquery;
  return new Set(pack[role] || []);
}
const fetched = {};
const gens = {};
const loading = {};
const failed = {};
const catalogLists = (saved.catalog_lists && typeof saved.catalog_lists === "object")
  ? Object.assign({}, saved.catalog_lists)
  : {};
let catalogArmed = false;
let suppressChange = false;

function setError(text) {
  document.getElementById("error").textContent = text || "";
  if (text) showToast(text, "fail");
}
function setStatus(text, saving) {
  if (saving) showToast(text || "Saving…", "saving");
  else showToast(text || "Saved", "saved");
}
function setExtraStatus(text) {
  document.getElementById("extra-status").textContent = text || "";
}
function noteMissingExtra(data) {
  if (!data || !data.missing_extra) return;
  EXTRAS[data.missing_extra] = false;
  if (data.command) EXTRA_COMMANDS[data.missing_extra] = data.command;
  syncExtraCard();
}
function syncExtraCard() {
  const kind = kindEl.value;
  const card = document.getElementById("extra-card");
  const missing = EXTRAS[kind] === false;
  card.hidden = !missing;
  if (!missing) {
    setExtraStatus("");
    return;
  }
  document.getElementById("extra-lede").textContent =
    "This warehouse extra is not installed. Install factcat[" + kind + "] into this environment.";
  document.getElementById("extra-command").textContent = EXTRA_COMMANDS[kind] || "";
}
function setLoading(sel, on) {
  const hint = document.getElementById(sel.id + "-loading");
  if (!hint) return;
  if (!on && (loading._date || loading._cluster) && (sel.id === "event_time" || sel.id === "event_column" || sel.id === "entity")) {
    hint.hidden = false;
    return;
  }
  hint.hidden = !on;
}
function hideSelect(sel) {
  setLoading(sel, false);
  seedSelect(sel, "");
}
function typedOptions(cols, allowed) {
  return (cols || [])
    .filter((c) => allowed.has(String(c.type || "").toUpperCase()))
    .map((c) => ({
      value: c.name,
      label: c.type ? c.name + " (" + c.type + ")" : c.name,
      type: String(c.type || "").toUpperCase(),
    }));
}
function fillSelect(sel, items, selected) {
  suppressChange = true;
  const cur = selected || sel.value;
  sel.innerHTML = "";
  const blank = document.createElement("option");
  blank.value = "";
  sel.appendChild(blank);
  const ranked = [...items].sort((a, b) => {
    const ka = String(typeof a === "string" ? a : a.value).toLowerCase();
    const kb = String(typeof b === "string" ? b : b.value).toLowerCase();
    if (ka < kb) return -1;
    if (ka > kb) return 1;
    return 0;
  });
  for (const item of ranked) {
    const opt = document.createElement("option");
    if (typeof item === "string") {
      opt.value = item;
      opt.textContent = item;
    } else {
      opt.value = item.value;
      opt.textContent = item.label;
      if (item.type) opt.dataset.type = item.type;
      if (item.kind) opt.dataset.kind = item.kind;
    }
    sel.appendChild(opt);
  }
  if (cur && [...sel.options].some((o) => o.value === cur)) sel.value = cur;
  suppressChange = false;
  syncCatalogEnabled();
}
function seedSelect(sel, value, sync) {
  suppressChange = true;
  sel.innerHTML = "";
  const blank = document.createElement("option");
  blank.value = "";
  sel.appendChild(blank);
  if (value) {
    const opt = document.createElement("option");
    opt.value = value;
    opt.textContent = value;
    sel.appendChild(opt);
    sel.value = value;
  }
  suppressChange = false;
  if (sync !== false) syncCatalogEnabled();
}
function extraReady() {
  return EXTRAS[kindEl.value] !== false;
}
function writeDestReady() {
  if (currentKind() === "snowflake") {
    return !!(
      document.getElementById("write_database").value.trim() &&
      document.getElementById("write_schema").value.trim()
    );
  }
  return !!(
    document.getElementById("write_project").value.trim() &&
    document.getElementById("write_dataset").value.trim()
  );
}
function syncManagedChrome() {
  const wrap = document.getElementById("catalog-lookback-wrap");
  if (wrap) wrap.hidden = writeDestReady();
}
function kindSteps() {
  return CATALOG[currentKind()] || [];
}
function stepTargets(step) {
  if (step.fill) return step.fill.map((f) => f.id);
  return step.id ? [step.id] : [];
}
function needMet(need) {
  if (need === "extra") return extraReady();
  if (need === "signed_in") return snowflakeSignedIn();
  if (need === "project") return !!catalogProject();
  const el = document.getElementById(need);
  return !!(el && String(el.value || "").trim());
}
function stepReady(step) {
  return (step.needs || []).every(needMet);
}
function stepScope(step) {
  const snow = currentKind() === "snowflake";
  if (step.id === "role" || step.id === "warehouse") {
    return [
      document.getElementById("account").value.trim(),
      document.getElementById("user").value.trim(),
    ].join("\0");
  }
  if (step.id === "database" || step.id === "write_database") {
    return warehouseEl.value.trim();
  }
  if (step.id === "schema") return databaseEl.value.trim();
  if (step.id === "write_schema") {
    return document.getElementById("write_database").value.trim();
  }
  if (step.id === "dataset") return catalogProject();
  if (step.id === "write_dataset") {
    return document.getElementById("write_project").value.trim();
  }
  if (step.id === "table_name") {
    return snow
      ? databaseEl.value.trim() + "." + schemaEl.value.trim()
      : catalogProject() + "." + datasetEl.value.trim();
  }
  if (step.id === "_columns") return combinedTable();
  return "";
}
function persistCatalogLists() {
  post("/api/save", { catalog_lists: catalogLists });
}
function storeCatalogList(step, items) {
  catalogLists[step.id] = { scope: stepScope(step), items: items || [] };
  persistCatalogLists();
}
function cachedCatalogList(step) {
  const cached = catalogLists[step.id];
  if (!cached || cached.scope !== stepScope(step)) return null;
  if (!Array.isArray(cached.items) || !cached.items.length) return null;
  return cached.items;
}
function paintStep(step) {
  const items = cachedCatalogList(step);
  if (items) {
    if (step.fill) {
      for (const spec of step.fill) {
        const el = document.getElementById(spec.id);
        if (el) fillSelect(el, typedOptions(items, typeSet(spec.filter)), saved[spec.id] || el.value);
      }
    } else {
      const el = document.getElementById(step.id);
      if (el) {
        const rows = step.id === "table_name" ? items.map(tableOption) : items;
        fillSelect(el, rows, saved[step.id] || el.value);
      }
    }
    fetched[step.id] = true;
    return;
  }
  if (step.fill) {
    for (const spec of step.fill) {
      const el = document.getElementById(spec.id);
      if (el) seedSelect(el, saved[spec.id] || "", false);
    }
  } else {
    const el = document.getElementById(step.id);
    if (el) seedSelect(el, saved[step.id] || "", false);
  }
}
function syncRefreshButtons() {
  document.querySelectorAll(".catalog-refresh").forEach((btn) => {
    const step = kindSteps().find((s) => s.id === btn.getAttribute("data-catalog"));
    btn.hidden = !step || !stepReady(step) || !!loading[step.id];
  });
}
function syncCatalogEnabled() {
  for (const step of kindSteps()) {
    const ready = stepReady(step);
    const busy = !!loading[step.id];
    for (const id of stepTargets(step)) {
      const el = document.getElementById(id);
      if (el) el.disabled = !ready || busy;
    }
    if (catalogArmed && ready && !fetched[step.id] && !failed[step.id] && !busy) {
      requestStep(step);
    }
  }
  syncRefreshButtons();
}
function invalidateStep(id) {
  fetched[id] = false;
  failed[id] = false;
  loading[id] = false;
  gens[id] = (gens[id] || 0) + 1;
}
function resetFetched() {
  for (const step of kindSteps()) invalidateStep(step.id);
}
function resetFollowing(changedId) {
  const steps = kindSteps();
  const idx = steps.findIndex(
    (s) => s.id === changedId || (s.fill && s.fill.some((f) => f.id === changedId))
  );
  if (idx < 0) return;
  for (const step of steps.slice(idx + 1)) {
    if (step.optional) continue;
    invalidateStep(step.id);
    delete catalogLists[step.id];
    for (const id of stepTargets(step)) {
      const el = document.getElementById(id);
      if (el) seedSelect(el, "", false);
    }
  }
  tableEl.value = combinedTable();
  persistCatalogLists();
  syncCatalogEnabled();
}
function catalogProject() {
  return dataProjectEl.value.trim() || projectEl.value.trim();
}
function authBody() {
  const kind = currentKind();
  if (kind === "snowflake") {
    return {
      kind,
      account: document.getElementById("account").value.trim(),
      user: document.getElementById("user").value.trim(),
      warehouse: warehouseEl.value.trim(),
      role: roleEl.value.trim(),
      private_key_path: document.getElementById("private_key_path").value.trim(),
      snowflake_auth: document.getElementById("snowflake_auth").value,
      database: databaseEl.value.trim(),
      schema: schemaEl.value.trim(),
    };
  }
  return {
    kind,
    project: projectEl.value.trim(),
    data_project: dataProjectEl.value.trim(),
    credentials: credentialsEl.value.trim(),
  };
}
function combinedTable() {
  const tableName = tableNameEl.value.trim();
  if (currentKind() === "snowflake") {
    const database = databaseEl.value.trim();
    const schema = schemaEl.value.trim();
    if (!database || !schema || !tableName) return "";
    return database + "." + schema + "." + tableName;
  }
  const billing = projectEl.value.trim();
  const data = dataProjectEl.value.trim() || billing;
  const dataset = datasetEl.value.trim();
  if (!dataset || !tableName) return "";
  if (data && data !== billing) return data + "." + dataset + "." + tableName;
  return dataset + "." + tableName;
}
function clearColumns() {
  hideSelect(entityEl);
  hideSelect(eventTimeEl);
  hideSelect(eventColumnEl);
  tableEl.value = "";
}
function syncKindUi(clearIdentity) {
  const snow = currentKind() === "snowflake";
  document.getElementById("bq-conn").hidden = snow;
  document.getElementById("sf-conn").hidden = !snow;
  document.getElementById("bq-table").hidden = snow;
  document.getElementById("sf-table").hidden = !snow;
  document.getElementById("bq-advanced").hidden = snow;
  document.getElementById("scan-cap-wrap").hidden = snow;
  document.getElementById("write-bq-wrap").hidden = snow;
  document.getElementById("write-sf-wrap").hidden = !snow;
  document.getElementById("event-time-hint").textContent = snow
    ? "TIMESTAMP_TZ and TIMESTAMP_LTZ are instants. TIMESTAMP_NTZ / DATETIME are wall-clock (no zone). Integers are Unix epoch. Not DATE or TIME."
    : "TIMESTAMP (UTC instant), DATETIME (civil time), or an integer Unix epoch. Not DATE.";
  syncSnowflakeAuthUi();
  syncEventTimeKind();
  const pane = document.getElementById("setup-docs-pane");
  if (pane && SETUP_DOCS[currentKind()]) pane.innerHTML = SETUP_DOCS[currentKind()];
  if (clearIdentity) {
    if (snow) {
      projectEl.value = "";
      dataProjectEl.value = "";
      locationEl.value = "";
      credentialsEl.value = "";
      seedSelect(datasetEl, "");
    } else {
      ["account", "user", "private_key_path"].forEach((id) => {
        document.getElementById(id).value = "";
      });
      seedSelect(roleEl, "");
      seedSelect(warehouseEl, "");
      seedSelect(databaseEl, "");
      seedSelect(schemaEl, "");
    }
    seedSelect(tableNameEl, "");
    clearColumns();
    resetFetched();
  }
  syncExtraCard();
  syncCatalogEnabled();
  syncManagedChrome();
}
function snowflakeSignedIn() {
  const account = document.getElementById("account").value.trim();
  const user = document.getElementById("user").value.trim();
  if (!account || !user) return false;
  if (document.getElementById("snowflake_auth").value === "externalbrowser") return true;
  return document.getElementById("private_key_path").value.trim() !== "";
}
async function loadStep(step) {
  if (!step || !step.endpoint || !stepReady(step)) return;
  const gen = (gens[step.id] = (gens[step.id] || 0) + 1);
  const targets = stepTargets(step).map((id) => document.getElementById(id)).filter(Boolean);
  loading[step.id] = true;
  fetched[step.id] = true;
  failed[step.id] = false;
  targets.forEach((el) => setLoading(el, true));
  syncCatalogEnabled();
  setError("");
  const payload = {
    ...authBody(),
    dataset: datasetEl.value.trim(),
    table_name: tableNameEl.value.trim(),
    database: databaseEl.value.trim(),
    schema: schemaEl.value.trim(),
  };
  if (step.id === "write_dataset") {
    payload.data_project = (document.getElementById("write_project").value || "").trim();
  }
  if (step.id === "write_schema") {
    payload.database = (document.getElementById("write_database").value || "").trim();
  }
  try {
    const data = await post("/api/" + step.endpoint, payload);
    if (gen !== gens[step.id]) return;
    if (!data.ok) {
      noteMissingExtra(data);
      setError(data.error || "Could not load catalog");
      fetched[step.id] = false;
      failed[step.id] = true;
      return;
    }
    if (data.location) locationEl.value = data.location;
    if (step.fill) {
      const cols = data.columns || [];
      storeCatalogList(step, cols);
      for (const spec of step.fill) {
        const el = document.getElementById(spec.id);
        if (!el) continue;
        fillSelect(el, typedOptions(cols, typeSet(spec.filter)), el.value);
      }
      tableEl.value = combinedTable();
      requestLayout();
      return;
    }
    const el = document.getElementById(step.id);
    if (!el) return;
    let items = data[step.values] || [];
    if (step.item) {
      items = items.map((row) => (typeof row === "string" ? row : row[step.item]));
    }
    if (step.id === "table_name") items = items.map(tableOption);
    storeCatalogList(step, items);
    const pick = el.value || (step.default_key && data[step.default_key]) || "";
    fillSelect(el, items, pick);
  } finally {
    if (gen !== gens[step.id]) return;
    loading[step.id] = false;
    targets.forEach((el) => setLoading(el, false));
    syncCatalogEnabled();
  }
}
function requestStep(step, force) {
  if (!step || !step.endpoint || loading[step.id]) return;
  if (!force && fetched[step.id]) return;
  if (!stepReady(step)) return;
  loadStep(step);
}
function stepForControl(id) {
  return kindSteps().find((s) => stepTargets(s).includes(id));
}
function bindCatalog() {
  const seen = new Set();
  for (const steps of Object.values(CATALOG)) {
    for (const step of steps) {
      for (const id of stepTargets(step)) {
        if (seen.has(id)) continue;
        seen.add(id);
        const el = document.getElementById(id);
        if (!el) continue;
        el.addEventListener("mousedown", (e) => {
          const step = stepForControl(id);
          if (!step) return;
          if (loading[step.id] || !fetched[step.id]) {
            e.preventDefault();
            failed[step.id] = false;
            requestStep(step, true);
          }
        });
        el.addEventListener("change", () => {
          if (suppressChange) return;
          if (id === "table_name" || id === "dataset" || id === "database" || id === "schema") {
            tableEl.value = combinedTable();
          }
          if (id === "event_time") {
            const epochEl = document.getElementById("event_time_epoch");
            if (epochEl) epochEl.value = "";
            syncEventTimeKind();
            requestLayout();
          }
          if (id === "table_name") requestLayout();
          if (id === "event_column" || id === "entity") requestLayout();
          if (id === "write_dataset" || id === "write_schema" || id === "write_database") {
            syncManagedChrome();
            requestWriteAccess();
          }
          resetFollowing(id);
        });
      }
    }
  }
}
function syncSnowflakeAuthUi() {
  const browser = document.getElementById("snowflake_auth").value === "externalbrowser";
  document.getElementById("sf-key-wrap").hidden = browser;
  document.getElementById("sf-auth-hint").innerHTML = browser
    ? "Opens a browser on first connect. The connector caches the SSO token in the OS keyring (about four hours if the account allows it). Nothing is stored in <code>.factcat.json</code>."
    : "Key-pair JWT. Encrypted keys use env <code>SNOWFLAKE_PRIVATE_KEY_PASSPHRASE</code>. The passphrase is not saved in <code>.factcat.json</code>.";
}
function tableOption(row) {
  if (typeof row === "string") return row;
  const id = row.id || row.value || "";
  const kind = row.kind || "table";
  let label = id;
  if (kind === "view") label += " (view)";
  if (kind === "materialized_view") label += " (materialized view)";
  return { value: id, label, kind };
}
function fcSql(name) {
  const el = document.createElement("code");
  el.textContent = name;
  return el;
}
function grainParen(grain) {
  const g = String(grain || "").toUpperCase();
  if (g === "DAY") return "partitioned by date";
  if (g === "HOUR") return "partitioned by hour";
  if (g === "MONTH") return "partitioned by month";
  if (g === "YEAR") return "partitioned by year";
  return "";
}
function fmtBytes(n) {
  if (n == null || n === "") return "";
  const gb = n / (1024 ** 3);
  if (gb >= 1) return (Math.round(gb * 10) / 10) + " GB";
  const mb = n / (1024 ** 2);
  if (mb >= 1) return Math.round(mb) + " MB";
  return Math.round(n / 1024) + " KB";
}
let layoutPayload = null;
let layoutCache = (saved.layout_cache && typeof saved.layout_cache === "object")
  ? saved.layout_cache
  : {};
let layoutGen = 0;
let writeAccessGen = 0;
function relationHint(rel) {
  if (!rel) return "";
  const name = rel.name || tableNameEl.value;
  const kind = rel.kind || "table";
  const bases = rel.bases || [];
  if (kind === "view" || kind === "materialized_view") {
    const label = kind === "materialized_view" ? "materialized view" : "view";
    if (bases.length >= 3) return name + " is a " + label + " over " + bases.length + " tables.";
    if (bases.length === 1 || bases.length === 2) {
      const names = bases.map((b) => b.name).filter(Boolean);
      return name + " is a " + label + " over " + names.join(" and ") + ".";
    }
    return name + " is a " + label + ".";
  }
  const bits = [];
  const part = rel.partition;
  if (part && part.ingestion) bits.push("Partitioned by ingestion time.");
  else if (part && part.field) bits.push("Partitioned by " + part.field + ".");
  const lead = (rel.clustering && rel.clustering[0]) || "";
  if (lead && lead.indexOf("(") < 0) bits.push("Clustered on " + lead + ".");
  return bits.join(" ");
}
function paintTableHint() {
  const el = document.getElementById("table-layout-hint");
  if (!el) return;
  const rel = layoutPayload && layoutPayload.relation;
  el.textContent = relationHint(rel) || "";
}
function tickTitle(payload) {
  return "Date filters on this column skip partitions outside the range (or the same through a view). A week still scans the whole month when partitions are monthly. Clustering is a second skip, inside each partition, when you filter a clustered column such as event name — this check does not measure that. BigQuery wants partitions around 10 GB so metadata stays cheap; month on a large events table is often the right size.";
}
function syncLayoutChecking() {
  const dateBusy = !!loading._date;
  const clusterBusy = !!loading._cluster;
  const cols = !!loading._columns;
  const hasTime = !!eventTimeEl.value;
  const hasEvent = !!eventColumnEl.value;
  const hasEntity = !!entityEl.value;
  const timeSpin = document.getElementById("event_time-loading");
  const timeCheck = document.getElementById("event-time-checking");
  if (timeCheck) timeCheck.hidden = !(dateBusy && hasTime);
  if (timeSpin) timeSpin.hidden = !(cols || (dateBusy && hasTime));
  const evSpin = document.getElementById("event_column-loading");
  const evCheck = document.getElementById("event-column-checking");
  const entSpin = document.getElementById("entity-loading");
  const entCheck = document.getElementById("entity-checking");
  if (evCheck) evCheck.hidden = !(clusterBusy && hasEvent);
  if (entCheck) entCheck.hidden = !(clusterBusy && hasEntity);
  if (evSpin) evSpin.hidden = !(cols || (clusterBusy && hasEvent));
  if (entSpin) entSpin.hidden = !(cols || (clusterBusy && hasEntity));
}
function paintEventTimeLayout() {
  const box = document.getElementById("event-time-layout");
  const check = document.getElementById("event-time-check");
  syncLayoutChecking();
  if (!box) return;
  const canProbe = hasCap("dry_run");
  const payload = layoutPayload;
  const probe = payload && payload.probe;
  const dateBusy = !!loading._date;
  if (check) {
    const meta = payload && payload.metadata_verdict;
    const settled = meta === "match" || meta === "mismatch" || meta === "ingestion" || meta === "none";
    check.hidden = dateBusy || !canProbe || !eventTimeEl.value || settled;
  }
  if (dateBusy) {
    box.innerHTML = "";
    return;
  }
  box.innerHTML = "";
  if (!eventTimeEl.value || !payload) return;
  const verdict = (probe && probe.verdict) || payload.metadata_verdict;
  const grain = grainParen(payload.grain);
  if (verdict === "prunes" || verdict === "require_filter") {
    const p = document.createElement("span");
    p.className = "hint ok";
    p.title = tickTitle(payload);
    const mark = document.createElement("span");
    mark.className = "tick";
    mark.textContent = "✓";
    p.appendChild(mark);
    p.appendChild(document.createTextNode(
      "Pruning is effective on this timestamp" + (grain ? " (" + grain + ")." : ".")
    ));
    box.appendChild(p);
    const avg = payload.partition_avg_bytes;
    if (avg != null) {
      const gb = avg / (1024 ** 3);
      if (gb < 1) {
        const call = document.createElement("div");
        call.className = "callout";
        const t = document.createElement("p");
        t.textContent = "Day partitions look small (avg " + fmtBytes(avg) + "). BigQuery wants ~10 GB each so metadata stays cheap — month, or clustering only, is the usual fix.";
        call.appendChild(t);
        box.appendChild(call);
      } else if (gb < 10) {
        const note = document.createElement("span");
        note.className = "hint";
        note.textContent = "Average partition is " + fmtBytes(avg) + " (BigQuery’s rule of thumb is ~10 GB).";
        box.appendChild(note);
      }
    }
  } else if (verdict === "mismatch" || verdict === "ingestion" || verdict === "none" || verdict === "no_prune") {
    const call = document.createElement("div");
    call.className = "callout";
    const t = document.createElement("p");
    const part = payload.relation && payload.relation.partition;
    const mapped = eventTimeEl.value;
    if (verdict === "mismatch" && part && part.field) {
      t.appendChild(document.createTextNode("Partitioned by "));
      t.appendChild(fcSql(part.field));
      t.appendChild(document.createTextNode(", not "));
      t.appendChild(fcSql(mapped));
      t.appendChild(document.createTextNode(". Confirm this is the event-time column — date filters won't prune."));
    } else if (verdict === "ingestion") {
      t.appendChild(document.createTextNode("Partitioned by ingestion time, not "));
      t.appendChild(fcSql(mapped));
      t.appendChild(document.createTextNode(". Date filters won't prune."));
    } else if (verdict === "no_prune") {
      t.textContent = "Date filters didn't reduce the scan. Queries still run.";
    } else {
      t.textContent = "Not partitioned. Queries still run; date filters won't prune.";
    }
    call.appendChild(t);
    box.appendChild(call);
  }
}
function clusterBoxes() {
  return {
    table: document.getElementById("table-cluster-layout"),
    event: document.getElementById("event-column-layout"),
    entity: document.getElementById("entity-layout"),
  };
}
function clearClusterBoxes() {
  const boxes = clusterBoxes();
  Object.keys(boxes).forEach((key) => {
    if (boxes[key]) boxes[key].innerHTML = "";
  });
}
function mappedIsView() {
  const rel = layoutPayload && layoutPayload.relation;
  if (rel && (rel.kind === "view" || rel.kind === "materialized_view")) return true;
  const opt = tableNameEl.selectedOptions && tableNameEl.selectedOptions[0];
  const label = opt ? String(opt.textContent || opt.label || "") : "";
  return /\(\s*materialized view\s*\)|\(\s*view\s*\)/i.test(label);
}
function paintEntityCluster(cluster, box) {
  if (!box || currentKind() !== "bigquery") return;
  const entityCol = entityEl.value;
  if (!entityCol || !cluster) return;
  const pos = cluster.entity_pos;
  if (pos === 0) {
    appendAdvice(box, (t) => {
      t.appendChild(document.createTextNode("Not clustered on "));
      t.appendChild(fcSql(entityCol));
      t.appendChild(document.createTextNode(". Queries still run; entity filters won't prune."));
    });
    return;
  }
  if (pos === 2) {
    appendPruneTick(
      box,
      "Pruning is effective on entity filters (clustered after "
        + (eventColumnEl.value || "event_name") + ").",
      "Entity filters skip clustered blocks only with the keys before this column (leftmost prefix)."
    );
    return;
  }
  if (pos > 2) {
    appendAdvice(box, (t) => {
      t.appendChild(fcSql(entityCol));
      t.appendChild(document.createTextNode(" is cluster key " + pos + ". Queries still run; entity filters won't prune without the keys before it."));
    });
  }
}
function appendAdvice(box, build) {
  if (!box) return;
  const call = document.createElement("div");
  call.className = "callout";
  const t = document.createElement("p");
  build(t);
  call.appendChild(t);
  box.appendChild(call);
}
function appendPruneTick(box, text, title) {
  if (!box) return;
  const p = document.createElement("span");
  p.className = "hint ok";
  if (title) p.title = title;
  const mark = document.createElement("span");
  mark.className = "tick";
  mark.textContent = "✓";
  p.appendChild(mark);
  p.appendChild(document.createTextNode(text));
  box.appendChild(p);
}
function clusterOkText(cluster) {
  const lead = cluster.leading || (cluster.fields && cluster.fields[0]) || "";
  const rest = (cluster.fields || []).slice(1).filter((c) => String(c).indexOf("(") < 0);
  let mech = "clustered on " + lead;
  if (rest[0]) mech += ", then " + rest[0];
  if (cluster.on && (layoutPayload.relation && layoutPayload.relation.kind !== "table")) {
    mech = cluster.on + " " + mech;
  }
  return "Pruning is effective on event-name filters (" + mech + ").";
}
function paintClusterNote(cluster) {
  const boxes = clusterBoxes();
  clearClusterBoxes();
  if (!cluster) return;
  const eventCol = eventColumnEl.value;
  const eventBox = boxes.event;
  const entityBox = boxes.entity;
  const tableBox = boxes.table;
  if (cluster.status === "prunes") {
    if (eventBox && eventCol) {
      appendPruneTick(
        eventBox,
        "Pruning is effective on event-name filters.",
        "A named event-name filter reduced the dry-run scan. That can be clustering, or a view dropping unused event tables. BigQuery often only applies cluster prune when the query runs, so a later estimate may still look large."
      );
    }
    paintEntityCluster(cluster, entityBox);
    return;
  }
  if (cluster.status === "no_prune") {
    if (eventBox) {
      const p = document.createElement("span");
      p.className = "hint";
      p.textContent = "Estimate didn't drop for an event-name filter. Clustering often only applies when the query runs.";
      eventBox.appendChild(p);
    }
    paintEntityCluster(cluster, entityBox);
    return;
  }
  if (cluster.status === "ok" && cluster.fields && cluster.fields.length) {
    if (eventBox && eventCol) {
      appendPruneTick(
        eventBox,
        clusterOkText(cluster),
        "Event-name filters skip clustered blocks inside each scanned partition when this column is the leading key. A view may also drop unused event tables."
      );
    }
    paintEntityCluster(cluster, entityBox);
    return;
  }
  if (cluster.status === "not_leading" || cluster.status === "missing") {
    if (eventBox) {
      const call = document.createElement("div");
      call.className = "callout";
      const t = document.createElement("p");
      if (cluster.status === "not_leading" && cluster.leading) {
        t.appendChild(document.createTextNode("Not clustered on "));
        t.appendChild(fcSql(eventCol || "event_name"));
        t.appendChild(document.createTextNode(" (leading key is "));
        t.appendChild(fcSql(cluster.leading));
        t.appendChild(document.createTextNode("). Queries still run; event-name filters won't prune."));
      } else if (eventCol) {
        t.appendChild(document.createTextNode("Not clustered on "));
        t.appendChild(fcSql(eventCol));
        t.appendChild(document.createTextNode(". Queries still run; event-name filters won't prune."));
      } else {
        paintEntityCluster(cluster, entityBox);
        return;
      }
      call.appendChild(t);
      eventBox.appendChild(call);
    }
    paintEntityCluster(cluster, entityBox);
    return;
  }
  if (cluster.status === "spokes") {
    if (eventBox) {
      const p = document.createElement("span");
      p.className = "hint";
      p.textContent = "View over " + cluster.n + " tables. Event-name filters may prune by selecting a spoke; we do not expect event_name clustering on the view.";
      eventBox.appendChild(p);
      if (tableBox) {
        const copy = document.createElement("span");
        copy.className = "hint";
        copy.textContent = p.textContent;
        tableBox.appendChild(copy);
      }
    }
    if (entityBox && entityEl.value && cluster.entity_pos > 0 && cluster.on) {
      const ent = document.createElement("span");
      ent.className = "hint";
      ent.appendChild(document.createTextNode(cluster.on + " is clustered on "));
      ent.appendChild(fcSql(entityEl.value));
      ent.appendChild(document.createTextNode("."));
      entityBox.appendChild(ent);
    } else {
      paintEntityCluster(cluster, entityBox);
    }
    return;
  }
  if (cluster.status === "no_key" && eventBox) {
    const p = document.createElement("span");
    p.className = "hint";
    p.textContent = cluster.automatic_clustering
      ? "Clustering key is set; automatic maintenance is off."
      : "No clustering key. Date filters often still prune if rows are loaded in time order. Event-name filters usually will not.";
    eventBox.appendChild(p);
    if (tableBox && mappedIsView()) {
      const copy = document.createElement("span");
      copy.className = "hint";
      copy.textContent = p.textContent;
      tableBox.appendChild(copy);
    }
    return;
  }
  if (cluster.status === "unknown" && tableBox && mappedIsView()) {
    const p = document.createElement("span");
    p.className = "hint";
    p.textContent = "Could not read clustering on the tables this view reads.";
    tableBox.appendChild(p);
  }
}
function relationFingerprint() {
  return {
    kind: currentKind(),
    table: combinedTable(),
    location: locationEl.value.trim(),
  };
}
function dateFingerprint() {
  return Object.assign(relationFingerprint(), {
    event_time: eventTimeEl.value.trim(),
    event_time_tz: document.getElementById("event_time_tz").value,
    event_time_epoch: document.getElementById("event_time_epoch").value,
    reporting_timezone: document.getElementById("reporting_timezone").value,
    week_start: document.getElementById("week_start").value,
  });
}
function clusterFingerprint() {
  return Object.assign(relationFingerprint(), {
    event_column: eventColumnEl.value.trim(),
    entity: entityEl.value.trim(),
  });
}
function fingerprintsEqual(a, b) {
  if (!a || !b) return false;
  const keys = Object.keys(a);
  if (keys.length !== Object.keys(b).length) return false;
  return keys.every((k) => String(a[k] || "") === String(b[k] || ""));
}
function rememberLayoutCache(payload) {
  if (!payload) return;
  const copy = Object.assign({}, payload);
  delete copy.ok;
  layoutCache = {
    relation: { fingerprint: relationFingerprint(), payload: { relation: copy.relation } },
    date: {
      fingerprint: dateFingerprint(),
      payload: {
        probe: copy.probe,
        metadata_verdict: copy.metadata_verdict,
        grain: copy.grain,
        partition_avg_bytes: copy.partition_avg_bytes,
      },
    },
    cluster: { fingerprint: clusterFingerprint(), payload: copy.cluster },
    payload: copy,
  };
}
function applyLayoutCache() {
  if (!fingerprintsEqual((layoutCache.relation || {}).fingerprint, relationFingerprint())) return false;
  if (!fingerprintsEqual((layoutCache.date || {}).fingerprint, dateFingerprint())) return false;
  if (!fingerprintsEqual((layoutCache.cluster || {}).fingerprint, clusterFingerprint())) return false;
  if (!layoutCache.payload) return false;
  layoutPayload = layoutCache.payload;
  paintLayoutChrome();
  return true;
}
function layoutBody(extra) {
  return Object.assign({
    ...authBody(),
    dataset: datasetEl.value.trim(),
    table_name: tableNameEl.value.trim(),
    table: combinedTable(),
    database: databaseEl.value.trim(),
    schema: schemaEl.value.trim(),
    event_time: eventTimeEl.value.trim(),
    event_column: eventColumnEl.value.trim(),
    event_names: Array.isArray(saved.event_names) ? saved.event_names : [],
    entity: entityEl.value.trim(),
    event_time_tz: document.getElementById("event_time_tz").value,
    event_time_epoch: document.getElementById("event_time_epoch").value,
    reporting_timezone: document.getElementById("reporting_timezone").value,
    week_start: document.getElementById("week_start").value,
    location: locationEl.value.trim(),
  }, extra || {});
}
function paintLayoutChrome() {
  paintTableHint();
  paintEventTimeLayout();
  paintClusterNote(layoutPayload && layoutPayload.cluster);
}
let avgGen = 0;
async function requestPartitionAvg() {
  if (!hasCap("dry_run")) return;
  const payload = layoutPayload;
  if (!payload || payload.partition_avg_bytes != null) return;
  const verdict = (payload.probe && payload.probe.verdict) || payload.metadata_verdict;
  if (verdict !== "prunes" && verdict !== "require_filter" && verdict !== "match") return;
  const gen = ++avgGen;
  try {
    const data = await post("/api/layout", layoutBody({ include_partition_avg: true }));
    if (gen !== avgGen) return;
    if (!data.ok || !layoutPayload) return;
    layoutPayload.partition_avg_bytes = data.partition_avg_bytes;
    rememberLayoutCache(layoutPayload);
    paintEventTimeLayout();
  } catch (err) {}
}
async function requestLayout(force) {
  if (!tableNameEl.value) {
    layoutPayload = null;
    clearClusterBoxes();
    paintTableHint();
    paintEventTimeLayout();
    return;
  }
  if (currentKind() !== "bigquery" && currentKind() !== "snowflake") return;
  const relMiss = !fingerprintsEqual((layoutCache.relation || {}).fingerprint, relationFingerprint());
  const dateMiss = !fingerprintsEqual((layoutCache.date || {}).fingerprint, dateFingerprint());
  const clusterMiss = !fingerprintsEqual((layoutCache.cluster || {}).fingerprint, clusterFingerprint());
  if (!force && applyLayoutCache()) {
    requestPartitionAvg();
    return;
  }
  const gen = ++layoutGen;
  avgGen += 1;
  loading._date = !!(force || relMiss || dateMiss);
  loading._cluster = !!(force || relMiss || clusterMiss);
  if (loading._cluster) clearClusterBoxes();
  paintEventTimeLayout();
  if (!loading._cluster) paintClusterNote(layoutPayload && layoutPayload.cluster);
  try {
    const data = await post("/api/layout", layoutBody(force ? { force: true } : {}));
    if (gen !== layoutGen) return;
    if (!data.ok) {
      layoutPayload = layoutPayload || null;
      return;
    }
    layoutPayload = data;
    rememberLayoutCache(data);
  } catch (err) {
    if (gen !== layoutGen) return;
  } finally {
    if (gen !== layoutGen) return;
    loading._date = false;
    loading._cluster = false;
    paintLayoutChrome();
    requestPartitionAvg();
  }
}
function writeHintEls() {
  return [
    document.getElementById("write-access-hint-bq"),
    document.getElementById("write-access-hint-sf"),
  ].filter(Boolean);
}
async function requestWriteAccess() {
  const destReady = writeDestReady();
  writeHintEls().forEach((el) => { el.textContent = ""; el.className = "hint"; });
  if (!destReady) return;
  const gen = ++writeAccessGen;
  try {
    const data = await post("/api/write_access", {
      ...authBody(),
      write_project: document.getElementById("write_project").value.trim(),
      write_dataset: document.getElementById("write_dataset").value.trim(),
      write_database: document.getElementById("write_database").value.trim(),
      write_schema: document.getElementById("write_schema").value.trim(),
    });
    if (gen !== writeAccessGen) return;
    const el = currentKind() === "snowflake"
      ? document.getElementById("write-access-hint-sf")
      : document.getElementById("write-access-hint-bq");
    if (!el) return;
    if (!data.ok) {
      el.textContent = data.error || "Could not check write permissions.";
      return;
    }
    if (data.status === "ok") {
      el.className = "hint ok";
      el.textContent = "Can create tables and materialized views in " + (data.dest || "this destination") + ".";
    } else if (data.status === "denied") {
      el.className = "callout";
      el.textContent = "This role cannot create tables in " + (data.dest || "this destination") + ". Mapping still saves.";
    }
  } catch (err) {
    if (gen !== writeAccessGen) return;
  }
}
function syncEventTimeStored() {
  const storage = document.getElementById("event_time_storage_tz");
  const hidden = document.getElementById("event_time_tz");
  const wrap = document.getElementById("event-time-tz-wrap");
  if (!hidden) return;
  if (wrap && wrap.hidden) return;
  const picked = (storage && storage.value) || "UTC";
  hidden.value = picked === "UTC" ? "utc" : picked;
}
function seedEventTimeStored() {
  const storage = document.getElementById("event_time_storage_tz");
  const hidden = document.getElementById("event_time_tz");
  const reporting = document.getElementById("reporting_timezone");
  const raw = (hidden && hidden.value) || "utc";
  if (!storage) return;
  if (raw === "utc" || raw === "UTC") storage.value = "UTC";
  else if (raw === "reporting") storage.value = (reporting && reporting.value) || "UTC";
  else if (raw !== "instant") storage.value = raw;
  syncEventTimeStored();
}
let epochGen = 0;
async function inferUnixEpoch() {
  const epochEl = document.getElementById("event_time_epoch");
  const typ = ((eventTimeEl.selectedOptions[0] && eventTimeEl.selectedOptions[0].dataset.type) || "").toUpperCase();
  if (!typeSet("event_time_unix").has(typ) || !eventTimeEl.value || !tableNameEl.value) return;
  if (epochEl && epochEl.value) return;
  const gen = ++epochGen;
  try {
    const data = await post("/api/infer_epoch", {
      ...authBody(),
      dataset: datasetEl.value.trim(),
      table_name: tableNameEl.value.trim(),
      table: combinedTable(),
      database: databaseEl.value.trim(),
      schema: schemaEl.value.trim(),
      event_time: eventTimeEl.value.trim(),
      location: locationEl.value.trim(),
      columns: saved.columns || [],
    });
    if (gen !== epochGen) return;
    if (data.ok && data.event_time_epoch && epochEl) {
      epochEl.value = data.event_time_epoch;
      scheduleSave();
    }
  } catch (err) {
    if (gen !== epochGen) return;
  }
}
function syncEventTimeKind() {
  const typ = ((eventTimeEl.selectedOptions[0] && eventTimeEl.selectedOptions[0].dataset.type) || "").toUpperCase();
  const tzEl = document.getElementById("event_time_tz");
  const wrap = document.getElementById("event-time-tz-wrap");
  const hint = document.getElementById("event-time-tz-hint");
  const epochEl = document.getElementById("event_time_epoch");
  const instant = typeSet("event_time_instant").has(typ);
  const unix = typeSet("event_time_unix").has(typ);
  if (unix) {
    wrap.hidden = true;
    tzEl.value = "utc";
    inferUnixEpoch();
    return;
  }
  if (epochEl) epochEl.value = "";
  if (instant) {
    tzEl.value = "instant";
    wrap.hidden = true;
    return;
  }
  wrap.hidden = false;
  seedEventTimeStored();
  hint.textContent = currentKind() === "snowflake"
    ? "TIMESTAMP_NTZ / DATETIME have no zone on the column. TIMESTAMP_TZ and TIMESTAMP_LTZ are instants and do not need this."
    : "DATETIME has no zone on the column. TIMESTAMP is a UTC instant and does not need this.";
}
document.getElementById("snowflake_auth").addEventListener("change", () => {
  syncSnowflakeAuthUi();
  resetFetched();
  syncCatalogEnabled();
});
[projectEl, dataProjectEl, credentialsEl,
  document.getElementById("account"),
  document.getElementById("user"),
  document.getElementById("private_key_path"),
].forEach((el) => {
  el.addEventListener("input", () => {
    resetFetched();
    syncCatalogEnabled();
  });
});
kindEl.addEventListener("change", () => syncKindUi(true));
bindCatalog();
document.querySelectorAll(".catalog-refresh").forEach((btn) => {
  btn.addEventListener("click", () => {
    const step = kindSteps().find((s) => s.id === btn.getAttribute("data-catalog"));
    if (!step) return;
    invalidateStep(step.id);
    requestStep(step, true);
  });
});
document.getElementById("write_project").addEventListener("input", () => {
  invalidateStep("write_dataset");
  delete catalogLists.write_dataset;
  seedSelect(document.getElementById("write_dataset"), "");
  syncManagedChrome();
  requestWriteAccess();
});
const storageEl = document.getElementById("event_time_storage_tz");
if (storageEl) {
  storageEl.addEventListener("change", () => {
    syncEventTimeStored();
    scheduleSave();
    requestLayout();
  });
}
const checkBtn = document.getElementById("event-time-check");
if (checkBtn) {
  checkBtn.addEventListener("click", () => requestLayout(true));
}
document.getElementById("write_database").addEventListener("change", () => {
  invalidateStep("write_schema");
  delete catalogLists.write_schema;
  seedSelect(document.getElementById("write_schema"), "");
});
document.getElementById("extra-install").addEventListener("click", async () => {
  const btn = document.getElementById("extra-install");
  const kind = kindEl.value;
  btn.disabled = true;
  setError("");
  setExtraStatus("Installing…");
  try {
    const data = await post("/api/install_extra", {kind});
    if (data.ok) {
      EXTRAS[kind] = true;
      setExtraStatus("");
      syncExtraCard();
      resetFetched();
      syncCatalogEnabled();
      return;
    }
    if (data.command) EXTRA_COMMANDS[kind] = data.command;
    document.getElementById("extra-command").textContent = EXTRA_COMMANDS[kind] || "";
    setError(data.error || "Install failed");
    setExtraStatus("");
    btn.disabled = false;
  } catch (err) {
    setError(err && err.message ? err.message : "Install failed");
    setExtraStatus("");
    btn.disabled = false;
  }
});
syncKindUi(false);
kindSteps().forEach((step) => {
  if (step.id === "table_name" || step.id === "_columns") {
    tableEl.value = combinedTable();
  }
  if (
    step.id === "_columns"
    && !cachedCatalogList(step)
    && Array.isArray(saved.columns)
    && saved.columns.length
  ) {
    catalogLists._columns = { scope: combinedTable(), items: saved.columns };
  }
  paintStep(step);
});
tableEl.value = combinedTable();
syncSnowflakeAuthUi();
seedEventTimeStored();
syncEventTimeKind();
catalogArmed = true;
syncCatalogEnabled();
syncManagedChrome();
if (!applyLayoutCache()) requestLayout();
requestWriteAccess();

const ENTITY_NAME_PRESETS = {
  User: "Users",
  Customer: "Customers",
  Account: "Accounts",
  Subscription: "Subscriptions",
};
const labelChoiceEl = document.getElementById("entity_label_choice");
const labelOtherWrap = document.getElementById("entity_label_other_wrap");
const labelOtherEl = document.getElementById("entity_label_other");
const labelEl = document.getElementById("entity_label");
const labelPluralEl = document.getElementById("entity_label_plural");
function syncEntityName() {
  if (labelChoiceEl.value === "__other__") {
    labelOtherWrap.hidden = false;
    labelEl.value = labelOtherEl.value.trim();
  } else {
    labelOtherWrap.hidden = true;
    labelEl.value = labelChoiceEl.value;
    labelPluralEl.value = ENTITY_NAME_PRESETS[labelChoiceEl.value] || labelPluralEl.value;
  }
}
function seedEntityName() {
  const raw = (labelEl.value || "").trim() || "User";
  const preset = Object.keys(ENTITY_NAME_PRESETS).find((p) => p.toLowerCase() === raw.toLowerCase());
  if (preset) {
    labelChoiceEl.value = preset;
    labelOtherEl.value = "";
  } else {
    labelChoiceEl.value = "__other__";
    labelOtherEl.value = raw;
  }
  syncEntityName();
}
labelChoiceEl.addEventListener("change", () => { syncEntityName(); scheduleSave(); });
labelOtherEl.addEventListener("input", () => { syncEntityName(); scheduleSave(); });
seedEntityName();

// ---- Managed tables ---------------------------------------------------
// Render from the config mirror first; fetch (metadata calls only) when the
// mirror is empty for a set destination, or on Refresh list. Row actions
// POST /api/managed/action and re-render from the registry that returns.
const managedWrap = document.getElementById("managed-wrap");
const managedBody = document.getElementById("managed-list");
const managedStatus = document.getElementById("managed-status");
let managedPayload = null;
let managedBusy = {};
let managedUnreadable = false;
function managedDestSet() {
  if (currentKind() === "snowflake") {
    return !!(document.getElementById("write_database").value.trim()
      && document.getElementById("write_schema").value.trim());
  }
  return !!(document.getElementById("write_project").value.trim()
    && document.getElementById("write_dataset").value.trim());
}
function managedBodyFor() {
  const body = Object.fromEntries(new FormData(form).entries());
  body.kind = currentKind();
  return body;
}
function fmtBytesShort(n) {
  if (n == null) return "";
  const gb = n / (1024 ** 3);
  if (gb >= 10) return Math.round(gb) + " GB";
  if (gb >= 1) return gb.toFixed(1) + " GB";
  const mb = n / (1024 ** 2);
  if (mb >= 1) return Math.round(mb) + " MB";
  return Math.max(1, Math.round(n / 1024)) + " KB";
}
function fmtAgo(iso) {
  if (!iso) return "";
  const t = Date.parse(iso);
  if (Number.isNaN(t)) return "";
  const mins = Math.max(0, Math.round((Date.now() - t) / 60000));
  if (mins < 60) return mins + " min ago";
  const hours = Math.round(mins / 60);
  if (hours < 48) return hours + " h ago";
  return Math.round(hours / 24) + " d ago";
}
function managedSetStatus(text, fail, pause) {
  // Failure is the #66 callout shape: the situation, then the consequence.
  // A read failure pauses the actions (disabled, visible) until the registry
  // reads again; an action failure states its verdict and leaves them live.
  const failing = !!fail && !!text;
  managedUnreadable = failing && pause !== false;
  managedStatus.classList.toggle("callout", failing);
  managedStatus.textContent = "";
  if (!text) return;
  if (!failing) { managedStatus.textContent = text; return; }
  const p = document.createElement("p");
  p.textContent = managedUnreadable
    ? "Could not read the managed tables: " + text + " The list shows the last known state; actions are paused until it reads."
    : text;
  managedStatus.appendChild(p);
}
let managedListLoading = false;
function managedSetLoading(on) {
  managedListLoading = !!on;
  document.getElementById("managed-list-loading").hidden = !on;
  document.getElementById("managed-refresh-list").hidden = !!on;
}
function managedRegistryColumns(payload) {
  if (payload && Array.isArray(payload.columns)) return payload.columns;
  const reg = (payload && payload.registry) || saved.managed_tables || {};
  const cols = reg.columns || {};
  return Object.keys(cols).map((key) => ({key, label: cols[key].label || key, ...cols[key], stale: false}));
}
function renderManaged() {
  managedWrap.hidden = !managedDestSet();
  if (managedWrap.hidden) return;
  const payload = managedPayload;
  const tables = (payload && payload.tables) || [];
  const byName = {};
  tables.forEach((t) => { byName[t.name] = t; });
  managedBody.innerHTML = "";
  function metaText(parts) { return parts.filter(Boolean).join(" \u00b7 "); }
  const names = byName.fc_event_names;
  if (names) {
    const row = document.createElement("div");
    row.className = "mt-row"; row.setAttribute("role", "listitem");
    row.innerHTML = "<div class=\"mt-head\"><span><code>fc_event_names</code></span><span class=\"mt-meta\">" + metaText([fmtBytesShort(names.bytes)]) + "</span></div>"
      + "<div class=\"mt-serves\">Event picker" + (names.census ? " and the freshness census" : "") + "<span class=\"sub\">"
      + (names.census ? "names, rows per month, first and last seen" : "names only; Refresh event names on Events upgrades it") + "</span></div>";
    managedBody.appendChild(row);
  }
  const cols = managedRegistryColumns(payload);
  const idx = byName.fc_column_index;
  cols.forEach((c) => {
    const row = document.createElement("div");
    row.className = "mt-row"; row.setAttribute("role", "listitem");
    row.dataset.key = c.key;
    const busy = managedBusy[c.key];
    const label = c.label || c.key;
    const head = "<div class=\"mt-head\"><span><code>fc_column_index</code> \u203a <code>" + label + "</code></span>"
      + "<span class=\"mt-meta\">" + metaText([idx && cols.length === 1 ? fmtBytesShort(idx.bytes) : "", c.stale ? "" : fmtAgo(c.refreshed_at || c.built_at)]) + "</span></div>";
    if (c.stale) {
      // Under Automatic the next run that uses it rebuilds it; under Off a
      // moved mapping stays live until Mode changes - say the true one.
      const auto = (document.getElementById("managed_mode").value || "auto") === "auto";
      const consequence = auto
        ? "Charts read the full history until the next run that uses it rebuilds it."
        : "Charts read the full history; set Mode to Automatic and the next run that uses it rebuilds it.";
      row.innerHTML = head
        + "<div class=\"callout\"><p>The mapping changed since this was built. " + consequence + "</p></div>"
        + "<div class=\"mt-acts\"><button type=\"button\" class=\"linkish\" data-act=\"drop\">Drop</button></div>";
      managedBody.appendChild(row);
      return;
    }
    let serves = "<div class=\"mt-serves\">Carried and as-of breakdowns<span class=\"sub\">";
    serves += metaText([c.last_used_at ? "last used " + fmtAgo(c.last_used_at) : "", c.bookmark ? "bookmark " + String(c.bookmark).slice(0, 16).replace("T", " ") : ""]);
    serves += "</span></div>";
    // Drop is the only row action: Automatic mode builds, refreshes and
    // rebuilds on its own; the owner withdrew Refresh / Rebuild / Pin /
    // Overrides as noise for the people who use Setup.
    let acts = "<div class=\"mt-acts\">";
    if (busy) {
      acts += "<span class=\"loading\" aria-label=\"" + busy + "\"></span><span class=\"layout-checking\">" + busy + "\u2026</span>";
    } else {
      acts += "<button type=\"button\" class=\"linkish\" data-act=\"drop\">Drop</button>";
    }
    acts += "</div>";
    row.innerHTML = head + serves + acts;
    managedBody.appendChild(row);
  });
  if (managedUnreadable) {
    managedBody.querySelectorAll("button, input").forEach((el) => { el.disabled = true; });
  }
  if (!names && !cols.length) {
    const row = document.createElement("div");
    // While the first read is in flight the label-line spinner says so;
    // "Nothing here yet" is a verdict, not a placeholder.
    if (managedListLoading) return;
    row.className = "mt-empty";
    row.innerHTML = "<span class=\"hint\" style=\"margin:0\">Nothing here yet. Factcat creates tables when a chart needs one.</span>";
    managedBody.appendChild(row);
  }
}
async function loadManaged(force) {
  if (!managedDestSet()) { renderManaged(); return; }
  if (!force && managedPayload) { renderManaged(); return; }
  if (!force && saved.managed_tables && Object.keys(saved.managed_tables.columns || {}).length) {
    managedPayload = {registry: saved.managed_tables, tables: []};
    renderManaged();
    return;
  }
  // Show the section now: the knobs are server-rendered and the destination
  // is set; only the list waits for the warehouse (spinner on the label line).
  // Hidden-until-the-round-trip-returns read as "the section is missing".
  managedSetLoading(true);
  renderManaged();
  try {
    const data = await post("/api/managed", managedBodyFor());
    managedPayload = data;
    if (data.registry) saved.managed_tables = data.registry;
    managedSetStatus("");
  } catch (err) {
    managedSetStatus((err && err.message) || "the warehouse did not answer.", true);
  } finally {
    managedSetLoading(false);
  }
  renderManaged();
}
async function managedAction(key, act, extra) {
  managedBusy[key] = {drop: "Dropping"}[act] || "Working";
  renderManaged();
  managedSetStatus("");
  try {
    const data = await post("/api/managed/action", {...managedBodyFor(), action: act, key: key, ...(extra || {})});
    saved.managed_tables = data.registry || {};
    delete managedBusy[key];
    await loadManaged(true);
  } catch (err) {
    delete managedBusy[key];
    managedSetStatus((err && err.message) || "The action did not run.", true, false);
    renderManaged();
  }
}
managedBody.addEventListener("click", (e) => {
  const btn = e.target.closest("button[data-act]");
  if (!btn) return;
  const tr = btn.closest(".mt-row");
  if (!tr || !tr.dataset.key) return;
  managedAction(tr.dataset.key, btn.dataset.act);
});
document.getElementById("managed-refresh-list").addEventListener("click", () => loadManaged(true));
form.addEventListener("change", (e) => {
  // Only the destination decides whether the section shows; any other
  // Setup change must not rebuild the list (a row mid-action would lose
  // its spinner).
  const id = (e.target && e.target.id) || "";
  if (!/^write_(project|dataset|database|schema)$/.test(id)) return;
  const was = managedWrap.hidden;
  renderManaged();
  if (was && !managedWrap.hidden) loadManaged(false);
});
loadManaged(false);

const autosave = fcAutosave({
  save: async (init) => {
    syncEntityName();
    syncEventTimeStored();
    tableEl.value = combinedTable();
    const body = Object.fromEntries(new FormData(form).entries());
    body.kind = currentKind();
    if (Object.prototype.hasOwnProperty.call(body, "event_column") && !body.event_column) {
      body.event_names = [];
    }
    return post("/api/save", body, init);
  },
  onSaved: () => {
    setError("");
    setStatus("Saved");
  },
  onFail: (msg) => setError(msg || "Could not save mapping"),
  suppressed: () => suppressChange,
});

function scheduleSave() {
  autosave.schedule();
}
form.addEventListener("submit", (e) => {
  e.preventDefault();
  autosave.flush();
});
form.addEventListener("change", scheduleSave);
form.addEventListener("input", (e) => {
  const tag = (e.target && e.target.tagName) || "";
  if (tag === "INPUT" || tag === "TEXTAREA") scheduleSave();
});
</script>
{% endblock %}