@bongos/core 1.24.41 → 1.24.43

package/modules/hall-ui/public/profile-own.js

@@ -0,0 +1,639 @@
+// profile-own.js — the numbers only you see, on your own profile (task 1005050).
+//
+// Owner decision 2026-11-03 (idea 1001315, item 2): Accomplishments and Profile
+// both showed your shipped work, karma and achievements, so they are one page.
+// Profile already draws everything that is public; this draws the rest, the part
+// that was only ever yours — where you stand on the rank ladder, how your work was
+// reviewed, your karma feed, the peer-recognition votes, and your progress curve —
+// into the profile's "Just you" screen, and ONLY when the profile is the viewer's
+// own (profile.js calls render() after its self-detect; for anyone else's profile
+// it is never called, and the screen and its rail key stay hidden).
+//
+// The renderers MOVED here from builders.js and hall-render.js with the
+// Accomplishments view, rather than being copied: the index no longer draws any
+// of it. Every read below is the viewer's own or public, and each route keeps its
+// own gate; hiding the screen is presentation, not the wall.
+(function () {
+  'use strict';
+
+  const { escapeHtml, $, fmtNum } = window.OTB;
+  const fmtDate = (iso) => window.OTB.fmtDate(iso);
+  const rankLabel = (rank) => window.OTB.rankLabel(rank);
+  const curLabel = (caps) => {
+    const b = window.OTBBranding;
+    return (b && b.currencyLabel && b.currencyLabel(caps ? { caps: true } : undefined)) || (caps ? 'Credits' : 'credits');
+  };
+  // The ladder, pinned in tests/rank_tier_single_source.mjs.
+  const RANK_LADDER = ['xenos', 'thetes', 'metic', 'archon'];
+  const normalizeRank = (rank) => (RANK_LADDER.includes(rank) ? rank : 'xenos');
+  function renderRankBadge(rank) {
+    const variant = RANK_LADDER.includes(rank) ? `rank-badge--${rank}` : 'rank-badge--unknown';
+    return `<span class="rank-badge ${variant}" aria-label="Rank: ${escapeHtml(rankLabel(rank))}">${escapeHtml(rankLabel(rank))}</span>`;
+  }
+  function emptyRow(colspan, message) {
+    return `<tr><td colspan="${colspan}" class="ledger__empty">${escapeHtml(message)}</td></tr>`;
+  }
+  function signClasses(n, prefix) {
+    const v = Number(n) || 0;
+    return `${prefix}--${v > 0 ? 'up' : v < 0 ? 'down' : 'flat'}`;
+  }
+  const pct = (v) => (v == null ? '—' : `${Math.round(Number(v) * 100)}%`);
+  const usd = (v) => `$${(Number(v) || 0).toFixed(2)}`;
+  const mins = (v) => (v == null ? '—' : `${Math.round(Number(v))}m`);
+
+  // Set by render(): the page's client, and whether this is a newcomer (#748: a
+  // gated newcomer never shows the karma or acclaim feed, as on Accomplishments).
+  let API = '/api/bongos';
+  let api = null;
+  let newcomerGated = false;
+  async function getJSON(path) {
+    const res = await api.request('GET', path);
+    if (!res.ok) throw new Error(`${path} → ${res.status}`);
+    return res.data;
+  }
+
+  // "Where you stand" (task 1005046): the personal half of the retired Ranks
+  // page, a card on Accomplishments until task 1005050 put it here. The ladder itself — every rank and what
+  // it unlocks — is the Primer's rank-ladder chapter, written once; this card
+  // says only what is true for the VIEWER: their rank, what it is, the rank
+  // above, and how they reach it. Moved from ranks.js with the page.
+  const RANK_TITLE = {
+    xenos: 'The newcomer',
+    thetes: 'The proven builder',
+    metic: 'The trusted builder',
+    archon: 'The steward',
+  };
+  const RANK_BLURB = {
+    xenos: 'A newcomer with a deliberately small surface: onboarding, safe starter tasks, and your own standing.',
+    thetes: 'A builder who has shipped their first work — the day-to-day surfaces are open.',
+    metic: 'A trusted builder: triage, reviews, planning sessions, and security reporting are open.',
+    archon: 'The steward of the whole system — approvals, the roster, budgets, and the Archon pages.',
+  };
+  // How a builder rises FROM their current rank. NB: these strings contain
+  // markup (<strong>) and are injected via innerHTML without escaping, which is
+  // safe only because they are author-controlled constants. Never source them
+  // from server or user data without switching the render site to escapeHtml.
+  const RISE_FROM = {
+    xenos:
+      `Claim and ship the newcomer-friendly tasks an Archon has opened to newcomers. Each clean ship earns ${curLabel()}; each ratified idea earns karma. On your <strong>third</strong> clean ship you are promoted automatically to <strong>Thetes</strong>, out of the newcomer sandbox with the whole queue open to you. No fee, no application; the third ship does it.`,
+    thetes:
+      'You have the run of the queue. Promotion to <strong>Metic</strong> (triage, blockers, planning, the shaping of work) is granted by a standing Archon alone, to a builder whose judgement has earned the project’s trust. Keep shipping; rank is granted, never bought.',
+    metic:
+      'The <strong>Archon</strong> rank is granted rarely, by a standing Archon alone, to a Metic who has shaped the project’s direction and earned its deepest trust. There is no checklist, only the weight of what you have built.',
+    archon:
+      'You hold the highest rank. There is no rank above it, only the care of everything below.',
+  };
+  // The rank one rung up, off the ladder (pinned in tests/rank_tier_single_source.mjs).
+  function nextRank(rank) {
+    const i = RANK_LADDER.indexOf(rank);
+    return i >= 0 && i < RANK_LADDER.length - 1 ? RANK_LADDER[i + 1] : null;
+  }
+  function renderRankStanding(builder) {
+    const host = document.getElementById('rank-standing-body');
+    if (!host) return;
+    const scroll = $('#rank-scroll');
+    if (scroll) scroll.hidden = false;
+    const rank = normalizeRank(builder && builder.rank);
+    const next = nextRank(rank);
+    // At the top there is no rung to name; RISE_FROM says so in its own words,
+    // so the line is left out rather than said twice.
+    const nextLine = next
+      ? `<p class="ranks-standing__next">The rank above yours is ${renderRankBadge(next)}.</p>`
+      : '';
+    host.innerHTML = `
+      <div class="ranks-standing">
+        <div class="ranks-standing__badge">${renderRankBadge(rank)}</div>
+        <p class="ranks-standing__title">${escapeHtml(RANK_TITLE[rank] || rankLabel(rank))}</p>
+        <p class="ranks-standing__blurb">${escapeHtml(RANK_BLURB[rank] || '')}</p>
+        ${nextLine}
+      </div>
+      <p class="ranks-rise__body">${RISE_FROM[rank] || RISE_FROM.xenos}</p>
+      <p class="card-foot"><a href="/primer#the-rank-ladder">Every rank and what it unlocks, in the Primer →</a></p>`;
+  }
+
+  // task 1002835: a karma vote on a peer's ship was a vote on a title alone.
+  // The two facts the ship already recorded — what the grader scored it and
+  // what it cost — turn it into an informed one. ABSENCE IS NOT ZERO: an
+  // ungraded ship says so, and so does an unlogged cost, because "0.0" and
+  // "$0.00" would read as measurements that were never taken.
+  function acclaimEvidenceHtml(t) {
+    const score = t.grade_score == null ? null : Number(t.grade_score);
+    const grade = score == null || !Number.isFinite(score)
+      ? '<span class="ledger__verdict--none">not graded</span>'
+      : `<span class="${t.grade_passed ? 'ledger__verdict--ok' : 'ledger__verdict--danger'}">${score.toFixed(1)} / 10</span>`;
+    // Three states, not two. The route OMITS cost_usd for a builder who may not
+    // vote, and that is not the same fact as a logged cost of nothing: a reader
+    // who is shown no figure is told nothing, never "no cost logged".
+    const parts = [grade];
+    if (Object.prototype.hasOwnProperty.call(t, 'cost_usd')) {
+      const usd = t.cost_usd == null ? null : Number(t.cost_usd);
+      parts.push(usd == null || !Number.isFinite(usd)
+        ? '<span class="ledger__verdict--none">no cost logged</span>'
+        : `<span class="acclaim__cost">$${usd.toFixed(2)}</span>`);
+    }
+    return `<span class="acclaim__evidence">${parts.join(' · ')}</span>`;
+  }
+  // ---- recent grades (task 197) -------------------------------------------
+
+  function renderRecentGrades(grades) {
+    const tbody = $('#recent-grades tbody');
+    if (!tbody) return;
+    if (!grades || !grades.length) {
+      tbody.innerHTML = emptyRow(5, 'No work reviewed yet.');
+      return;
+    }
+    tbody.innerHTML = grades.map((g) => {
+      // A grader OUTAGE row (panel_outcome 'unavailable') carries a placeholder
+      // score of 0 — label it, never render it as a 0.0 fail (task 1002652).
+      const isOutage = g.panel_outcome === 'unavailable';
+      // A json-null gating axis (task 1003318 — the Quality worker never ran)
+      // is likewise not a judgment: the score is the surviving axis, not a fail.
+      const isLensOut = !isOutage && !!g.rubric_scores && g.rubric_scores.code_quality === null;
+      const score = isOutage || isLensOut ? '—' : Number(g.score).toFixed(1);
+      // A verdict is verification state: it wears the fixed vocabulary through
+      // .ledger__verdict--* (style.css), never an inline colour. The literals
+      // that stood here painted `passed` from a --olive that is not a token of
+      // the world, so every hall ever rendered it as the fallback (task 1003495).
+      const verdict = isOutage
+        ? `<span class="ledger__verdict--none">not graded (grader outage)</span>`
+        : isLensOut
+          ? `<span class="ledger__verdict--none">not graded (quality lens unavailable)</span>`
+          : g.passed
+          ? `<span class="ledger__verdict--ok">passed</span>`
+          : `<span class="ledger__verdict--danger">fell short</span>`;
+      return `
+        <tr>
+          <td class="ledger__num">#${g.task_id}</td>
+          <td>${escapeHtml(g.title || '')}</td>
+          <td class="ledger__drachmae">${isOutage || isLensOut ? '—' : `${score} / 10`}</td>
+          <td>${verdict}</td>
+          <td class="ledger__date">${fmtDate(g.graded_at)}</td>
+        </tr>
+      `;
+    }).join('');
+  }
+
+  function renderRollingNote(rolling) {
+    const note = $('#grades-rolling-note');
+    if (!note) return;
+    if (!rolling || !rolling.n || Number(rolling.n) === 0) {
+      note.hidden = true;
+      return;
+    }
+    const avg = Number(rolling.avg_score).toFixed(1);
+    const passed = Number(rolling.n_passed || 0);
+    const n = Number(rolling.n);
+    note.textContent = `Last 14 days: ${avg} / 10 average across ${n} graded work${n === 1 ? '' : 's'} (${passed} passed).`;
+    note.hidden = false;
+  }
+
+  // No `isArchon` here: the curve's scope was rank-gated until task 1004005, and
+  // the field is gone rather than left write-only — a state flag nothing reads is
+  // how a removed gate quietly grows back.
+  //
+  // `kind` is the active filter (null = all work). `kinds` is the picker's source
+  // — the UNFILTERED fingerprint, held separately because a filtered payload's
+  // top_kinds would otherwise shrink to the one kind selected and strand the
+  // reader there with no way back.
+  const analyticsState = { builderId: null, scope: 'self', kind: null, kinds: [], self: null, eco: null };
+  // The line drawing moved to OTBKit.sparklineHtml (task 1003445) — it was one
+  // of four chart implementations in this surface. This wrapper keeps the
+  // Curve's own default colour, which is NOT the kit's: these four charts each
+  // spend a different accent, and --accent-deep is the first one's.
+  function sparkline(values, opts = {}) {
+    return window.OTBKit.sparklineHtml(values, { color: 'var(--accent-deep)', ...opts });
+  }
+  function statCard(label, value, sub) {
+    return `<div class="curve__stat">
+      <div class="curve__stat-value">${escapeHtml(String(value))}</div>
+      <div class="curve__stat-label">${escapeHtml(label)}</div>
+      ${sub ? `<div class="curve__stat-sub">${escapeHtml(sub)}</div>` : ''}
+    </div>`;
+  }
+  // `overlay` is the ecosystem benchmark for this same chart, or null. When it is
+  // present the card also carries a legend — two lines with no key cannot be
+  // read. The legend is built here rather than inside sparklineHtml because the
+  // NAMES are this page's ("You" / "All builders"), not the kit's.
+  function chartCard(title, values, color, footer, overlay) {
+    const has = Array.isArray(values) && values.length > 0;
+    const hasOverlay = Array.isArray(overlay) && overlay.length > 0;
+    const body = has
+      ? sparkline(values, hasOverlay ? { color, overlay, overlayLabel: 'all builders' } : { color })
+      : '';
+    const legend = has && hasOverlay
+      ? window.OTBKit.chartLegendHtml([
+        { label: 'You', color },
+        { label: 'All builders', color: 'var(--ink-soft)' },
+      ])
+      : '';
+    return window.OTBKit.chartCardHtml(title, body ? body + legend : '', footer);
+  }
+  // The kind picker (task 1004005) — "how am I doing at THIS kind of work".
+  //
+  // Built from analyticsState.kinds, the UNFILTERED fingerprint captured on the
+  // first load, NOT from the current payload's top_kinds. Under a filter the
+  // payload would list only the selected kind, so a picker built from it would
+  // lose every other option the moment one was chosen — the reader could narrow
+  // once and never move again.
+  //
+  // A <select> rather than a row of chips: the kind list is open-ended (it is a
+  // free-text column with an 'unspecified' bucket), so the control has to cope
+  // with more options than fit on a line, and a native select is also the one
+  // that arrives keyboard- and screen-reader-correct with no work.
+  function kindFilterHtml() {
+    const kinds = Array.isArray(analyticsState.kinds) ? analyticsState.kinds : [];
+    if (kinds.length < 2) return ''; // one kind of work is not a choice
+    const cur = analyticsState.kind;
+    const opt = (value, label, n) => {
+      const sel = (value === null ? cur === null : cur === value) ? ' selected' : '';
+      const count = n === undefined ? '' : ` (${n})`;
+      return `<option value="${escapeHtml(value === null ? '' : value)}"${sel}>${escapeHtml(label)}${escapeHtml(count)}</option>`;
+    };
+    return `<span class="curve__filter">`
+      + `<label class="curve__filter-label" for="curve-kind">Kind of work</label>`
+      + `<select id="curve-kind" class="curve__filter-select">`
+      + opt(null, 'All work')
+      + kinds.map((k) => opt(k.kind, k.kind, k.n)).join('')
+      + `</select></span>`;
+  }
+
+  function renderCurveBody() {
+    const headlineEl = $('#curve-headline');
+    const gridEl = $('#curve-grid');
+    const kindsEl = $('#curve-kinds');
+    const emptyEl = $('#curve-empty');
+    const noteEl = $('#curve-scope-note');
+    if (!headlineEl || !gridEl || !kindsEl) return;
+
+    const isEco = analyticsState.scope === 'eco';
+    const data = isEco ? analyticsState.eco : analyticsState.self;
+
+    // The controls — scope toggle and kind filter.
+    //
+    // WRITTEN BEFORE EVERY EARLY RETURN BELOW, and that ordering is the whole
+    // reason they are here. A kind with nothing shipped in the window is an
+    // ordinary, reachable state, and it takes the `totalShipped === 0` branch —
+    // which blanks the headline, the grid and the bars. If the filter that
+    // caused the empty view were drawn after that return, the reader would be
+    // left looking at "no data" with no control on screen to undo it, and the
+    // only way out would be a page reload.
+    //
+    // The scope toggle is no longer Archon-gated (task 1004005): the feed behind
+    // "All builders" is a public, identity-stripped aggregate, so the gate
+    // withheld the comparison rather than protecting anything.
+    if (noteEl) {
+      noteEl.innerHTML =
+        `<span class="curve__scope" role="group" aria-label="Analytics scope">` +
+        `<button type="button" class="curve__scope-btn${!isEco ? ' is-active' : ''}" data-scope="self">You</button>` +
+        `<button type="button" class="curve__scope-btn${isEco ? ' is-active' : ''}" data-scope="eco">All builders</button>` +
+        `</span>` +
+        kindFilterHtml();
+    }
+
+    if (!data) { gridEl.innerHTML = ''; headlineEl.innerHTML = ''; kindsEl.innerHTML = ''; return; }
+
+    // Under a kind filter the server cannot answer cost at all (cost_log has no
+    // kind), and says so in `unavailable` rather than sending a misleading zero.
+    const costUnavailable = Array.isArray(data.unavailable) && data.unavailable.includes('cost_trend');
+
+    const totalShipped = data.headline?.total_shipped || 0;
+    if (totalShipped === 0) {
+      if (emptyEl) emptyEl.style.display = '';
+      headlineEl.innerHTML = ''; gridEl.innerHTML = ''; kindsEl.innerHTML = '';
+      return;
+    }
+    if (emptyEl) emptyEl.style.display = 'none';
+
+    // Headline stat cards.
+    const h = data.headline;
+    const cards = [];
+    cards.push(statCard(isEco ? 'Works shipped' : 'Works shipped', totalShipped, `last ${data.window_days}d`));
+    if (isEco) {
+      cards.push(statCard('Active builders', h.active_builders ?? 0));
+      cards.push(statCard('Avg time / work', mins(h.avg_duration_min)));
+    } else {
+      // '—', never usd(null) → "$0.00". Zero is a measurement; this is the
+      // absence of one, and printing a price here would be a false statement.
+      cards.push(costUnavailable
+        ? statCard('Cost / work', '—', 'not tracked per kind')
+        : statCard('Cost / work', usd(h.cost_per_task)));
+      cards.push(statCard('Avg time / work', mins(h.avg_duration_min)));
+      cards.push(statCard('Confirmation rate', pct(h.confirmation_rate), `${h.resolved_claims || 0} claims`));
+      cards.push(statCard('Grade pass rate', pct(h.grade_pass_rate), `${h.graded_n || 0} graded`));
+    }
+    headlineEl.innerHTML = cards.join('');
+
+    // Sparkline charts.
+    //
+    // THE OVERLAY ONLY EVER RIDES ON THE 'self' VIEW, and only where the
+    // ecosystem publishes the SAME series. Overlaying the benchmark on the
+    // benchmark would draw one line twice; and the ecosystem feed carries only
+    // ship-rate and duration (grade and cost have their own public feeds and are
+    // not part of that payload), so those two are the only charts that CAN
+    // compare. A chart with no counterpart simply draws one line, as before.
+    const eco = (!isEco && analyticsState.eco) ? analyticsState.eco : null;
+    const ecoOf = (rows, pick) => (eco && Array.isArray(eco[rows]) ? eco[rows].map(pick) : null);
+    const charts = [];
+    charts.push(chartCard('Works shipped / day', (data.ship_rate || []).map((r) => r.n), 'var(--accent-deep)',
+      `${(data.ship_rate || []).reduce((s, r) => s + Number(r.n), 0)} over ${data.window_days}d`,
+      ecoOf('ship_rate', (r) => r.n)));
+    charts.push(chartCard('Time / work (min)', (data.duration_trend || []).map((r) => r.avg_actual), 'var(--sea)',
+      'actual minutes per shipped work',
+      ecoOf('duration_trend', (r) => r.avg_actual)));
+    if (!isEco) {
+      // COST IS NOT ANSWERABLE PER KIND — cost_log has no kind and reaches tasks
+      // only through a mostly-NULL task_id, so the server returns cost_trend: []
+      // and names it in `unavailable` rather than plotting a near-zero line that
+      // would read as "this kind of work is cheap". Say so where the chart was.
+      if (costUnavailable) {
+        charts.push(window.OTBKit.chartCardHtml('Cost / work ($)', '',
+          '', 'not tracked per kind of work — clear the filter to see cost'));
+      } else {
+        charts.push(chartCard('Cost / work ($)', (data.cost_trend || []).map((r) => r.per_work), 'var(--terracotta)',
+          `total ${usd(h.total_cost_usd)}`));
+      }
+      // n counts quality-graded rows only (task 1002652); a day whose grades
+      // were all outages has n=0 and must not plot as a 0% dip.
+      charts.push(chartCard('Grade pass rate', (data.grade_trend || []).filter((r) => Number(r.n) > 0).map((r) => r.n_passed / r.n), 'var(--accent)',
+        'share of work passing review'));
+    }
+    gridEl.innerHTML = charts.join('');
+
+    // Top kinds — horizontal bars.
+    const kinds = (data.top_kinds || []).slice(0, 8);
+    if (kinds.length) {
+      kindsEl.innerHTML =
+        `<div class="kit-chart__title">Kinds of work shipped</div>` +
+        window.OTBKit.barSeriesHtml(
+          kinds.map((k) => ({ label: k.kind, value: k.n })),
+        );
+    } else {
+      kindsEl.innerHTML = '';
+    }
+  }
+  // Fire-and-forget loader: fetch the builder's own curve (and, for an Archon,
+  // the ecosystem aggregate) and render. A failed/empty feed simply leaves the
+  // section hidden rather than holding up the rest of the page.
+  async function loadAnalytics(builder) {
+    const scroll = $('#analytics-scroll');
+    if (!scroll || !builder?.id) return;
+    analyticsState.builderId = builder.id;
+    analyticsState.scope = 'self';
+    analyticsState.kind = null;
+    try {
+      const self = await getJSON(`${API}/analytics/builder/${builder.id}?days=90`);
+      analyticsState.self = self;
+      // The picker's options come from THIS first, unfiltered load and are then
+      // left alone — see kindFilterHtml. A later filtered payload's top_kinds is
+      // deliberately not allowed to overwrite them.
+      analyticsState.kinds = Array.isArray(self?.top_kinds) ? self.top_kinds : [];
+      // A gated newcomer with nothing shipped: keep the section hidden.
+      if (!self || (self.headline?.total_shipped || 0) === 0) { scroll.hidden = true; return; }
+      scroll.hidden = false;
+      renderCurveBody();
+      // THE BENCHMARK IS FOR EVERY BUILDER, NOT JUST THE ARCHON (task 1004005).
+      // This fetch used to sit behind `if (analyticsState.isArchon)`, so the
+      // ecosystem average a builder is meant to measure themselves against was
+      // fetched for exactly one of them. The route is `rank: public` — no auth
+      // middleware, CORS '*', per-builder identity stripped server-side — and the
+      // unauthenticated status page already reads it, so the gate protected
+      // nothing and only withheld the comparison. Still fire-and-forget: the
+      // ecosystem feed is optional context, never a reason to hold up the curve.
+      getJSON(`${API}/public/analytics/ecosystem?days=90`)
+        // ALWAYS re-render, not only in the 'eco' scope. That condition was
+        // correct while the two scopes merely SWAPPED which single series was
+        // drawn; now the ecosystem series is also the benchmark overlaid on the
+        // 'self' view, so a self-scoped reader who arrived before this resolved
+        // would sit with no overlay until they touched an unrelated control.
+        .then((eco) => { analyticsState.eco = eco; renderCurveBody(); })
+        .catch(() => { /* ecosystem optional */ });
+    } catch (err) {
+      console.error('[profile] analytics load failed', err);
+      scroll.hidden = true;
+    }
+  }
+
+  // Re-fetch BOTH series under a kind filter (task 1004005). Both, always: an
+  // overlay that narrowed one side and not the other would compare one kind of
+  // work against all work and still look like a like-for-like benchmark — the
+  // failure this task's own text calls worse than no benchmark at all.
+  //
+  // `kinds` is deliberately not refreshed here; see kindFilterHtml.
+  let curveKindSeq = 0;
+  async function reloadCurveForKind(kind) {
+    const id = analyticsState.builderId;
+    if (!id) return;
+    analyticsState.kind = kind;
+    // A dropdown can be changed faster than a round trip returns, and the two
+    // fetches can land out of order. Only the newest request may write state.
+    const seq = ++curveKindSeq;
+    const q = kind ? `&kind=${encodeURIComponent(kind)}` : '';
+    renderCurveBody(); // reflect the new selection immediately
+    try {
+      const [self, eco] = await Promise.all([
+        getJSON(`${API}/analytics/builder/${id}?days=90${q}`),
+        getJSON(`${API}/public/analytics/ecosystem?days=90${q}`).catch(() => null),
+      ]);
+      if (seq !== curveKindSeq) return;
+      analyticsState.self = self;
+      if (eco) analyticsState.eco = eco;
+      renderCurveBody();
+    } catch (err) {
+      if (seq !== curveKindSeq) return;
+      console.error('[profile] curve kind filter failed', err);
+    }
+  }
+
+  // ---- karma feed (V3.R26 #246) -------------------------------------------
+  //
+  // The recent karma_log entries for the current builder. The /me payload
+  // already includes them under `karma.recent`. The scroll stays hidden when
+  // the builder has no history yet (zero karma is a common starting state,
+  // so we don't want to push an empty table at every new citizen).
+
+  function renderKarmaFeed(entries) {
+    const scroll = $('#karma-scroll');
+    const tbody = $('#karma-feed tbody');
+    if (!scroll || !tbody) return;
+    if (!Array.isArray(entries) || entries.length === 0) {
+      // Hide the scroll entirely if the builder has no karma history.
+      // Keeps the page tidy for fresh citizens; reappears the moment a
+      // karma_log row lands.
+      scroll.hidden = true;
+      return;
+    }
+    // #748: a gated newcomer never shows the karma feed, even if karma exists.
+    scroll.hidden = newcomerGated;
+    tbody.innerHTML = entries.map((k) => {
+      const delta = Number(k.delta) || 0;
+      const deltaCls = signClasses(delta, 'karma-feed__delta');
+      const deltaText = delta > 0 ? `+${fmtNum(delta)}` : fmtNum(delta);
+      const granted = k.granted_by
+        ? `@${escapeHtml(k.granted_by_login || k.granted_by_display_name || `builder #${k.granted_by}`)}`
+        : '<span style="opacity:0.6;">— all builders —</span>';
+      return `
+        <tr>
+          <td class="ledger__date">${escapeHtml(fmtDate(k.recorded_at))}</td>
+          <td class="karma-feed__delta ${deltaCls}">${deltaText}</td>
+          <td>${escapeHtml(k.reason || '')}</td>
+          <td>${granted}</td>
+        </tr>
+      `;
+    }).join('');
+  }
+
+  // ---- peer acclaim feed (V3.R25 #245) ------------------------------------
+  //
+  // Other builders' recently confirmed/shipped work, each with a +/- vote
+  // widget. Votes fold into the shipping builder's karma on a weekly tally,
+  // lagged 7 days (server-enforced). Metic+ may vote; the endpoint returns
+  // can_vote so Xenos see the tallies read-only. The endpoint already excludes
+  // the caller's own ships (anti-self-vote), so there's nothing to vote on that
+  // isn't a peer's work.
+
+  let acclaimCanVote = false;
+  // task 1002446: this was the hall's last unpaged list. The endpoint returns the
+  // whole feed in one call, so the rows are held here and the kit's client-side
+  // pager slices them — a page change re-renders without a refetch.
+  const acclaimState = { tasks: [] };
+  const acclaimPager = window.OTBKit.makePager('acclaim', 'otb.standing.acclaimPerPage', { defaultPerPage: 10 });
+
+  function renderAcclaimFeed(data) {
+    const scroll = $('#acclaim-scroll');
+    if (!scroll) return;
+    const tasks = (data && Array.isArray(data.tasks)) ? data.tasks : [];
+    acclaimState.tasks = tasks;
+    acclaimCanVote = !!(data && data.can_vote);
+    if (tasks.length === 0) {
+      // Nothing to acclaim yet (e.g. the only confirmed work so far is your
+      // own). Hide rather than show an empty ledger.
+      scroll.hidden = true;
+      return;
+    }
+    // #748: a gated newcomer never shows the acclaim feed.
+    scroll.hidden = newcomerGated;
+    renderAcclaimRows();
+  }
+
+  function renderAcclaimRows() {
+    const tbody = $('#acclaim-feed tbody');
+    if (!tbody) return;
+    const slice = window.OTBKit.paginate(acclaimState.tasks, acclaimPager);
+    tbody.innerHTML = slice.map((t) => {
+      // task 1004432: an approved page is its artist's; the applying session rides along as a helper.
+      const helperName = t.helper_display_name || (t.helper_login ? `@${t.helper_login}` : '');
+      const by = escapeHtml(t.display_name || (t.github_login ? `@${t.github_login}` : `builder #${t.shipped_by}`)) + (helperName ? ` <span class="acclaim__evidence">with help from ${escapeHtml(helperName)}</span>` : '');
+      // task 1004833: the votes are THE shared list control (vote-control.js),
+      // pre-painted from the feed's own net_votes/my_vote so it costs no extra
+      // read. A viewer below the vote floor sees the net alone.
+      const net = Number(t.net_votes) || 0;
+      const votes = acclaimCanVote && window.OTBVote
+        ? window.OTBVote.taskHtml(t)
+        : `<span class="vote__net" title="Metic rank and above may vote">${net > 0 ? `+${net}` : `${net}`}</span>`;
+      const title = escapeHtml(t.value_summary || t.title || `task #${t.id}`);
+      return `
+        <tr>
+          <td>${title}${acclaimEvidenceHtml(t)}</td>
+          <td>${by}</td>
+          <td>${votes}</td>
+        </tr>
+      `;
+    }).join('');
+  }
+
+  async function loadAcclaimFeed() {
+    try {
+      const data = await getJSON(`${API}/tasks/peer-votes/feed?limit=25`);
+      renderAcclaimFeed(data);
+    } catch (err) {
+      // Non-fatal: a feed failure shouldn't take down the page.
+      console.warn('[profile] acclaim feed failed:', err.message);
+      const scroll = $('#acclaim-scroll');
+      if (scroll) scroll.hidden = true;
+    }
+  }
+
+  // task 1004833: the shared vote control casts the vote and repaints its own
+  // row; it then raises 'otb-vote' with the server's answer. The feed is paged,
+  // so the vote must land in the HELD rows too (task 1002446), or flipping to
+  // page 2 and back re-renders the stale tally over the one just cast.
+  function onAcclaimVote(ev) {
+    const d = ev && ev.detail;
+    if (!d || d.kind !== 'task') return;
+    const taskIdNum = Number(d.id);
+    acclaimState.tasks = acclaimState.tasks.map((t) => (Number(t.id) === taskIdNum
+      ? { ...t, net_votes: d.net_votes, my_vote: d.my_vote }
+      : t));
+  }
+
+
+  let wired = false;
+  function wire() {
+    if (wired) return;
+    wired = true;
+    // The curve's scope toggle and kind filter, delegated from the whole Progress
+    // section: renderCurveBody replaces the controls' innerHTML, and they render
+    // into #curve-scope-note in the lede, a sibling of #curve-body (task 1004079).
+    $('#analytics-scroll')?.addEventListener('click', (e) => {
+      const btn = e.target.closest('.curve__scope-btn[data-scope]');
+      if (!btn) return;
+      const scope = btn.dataset.scope === 'eco' ? 'eco' : 'self';
+      if (scope === analyticsState.scope) return;
+      analyticsState.scope = scope;
+      renderCurveBody();
+    });
+    // 'change', not 'input': arrowing through a native select fires input per option.
+    $('#analytics-scroll')?.addEventListener('change', (e) => {
+      const sel = e.target.closest('#curve-kind');
+      if (!sel) return;
+      const kind = sel.value ? sel.value : null;
+      if (kind === analyticsState.kind) return;
+      reloadCurveForKind(kind);
+    });
+    // task 1004833: the shared vote control reports each landed vote to the feed.
+    $('#acclaim-feed')?.addEventListener('otb-vote', onAcclaimVote);
+    // The kit's pager bar, stamped under the feed (task 1002446), then wired.
+    const bar = $('#acclaim-pager-mount');
+    if (bar && !bar.innerHTML) bar.innerHTML = window.OTBKit.pagerBarHtml('acclaim', { label: 'entries' });
+    window.OTBKit.wirePager(acclaimPager, renderAcclaimRows);
+  }
+
+  // render({ api, API, me }) — `me` is the viewer's own /me payload (grades, karma
+  // and the builder ride on it), so the sections it fills cost no read at all. The
+  // two feeds that need their own (peer recognition; the curve, two reads) wait
+  // for open(): a profile visit for its Works should not pay for a screen it never
+  // opens.
+  let viewer = null;
+  let opened = false;
+  function render(opts) {
+    api = opts.api;
+    API = opts.API || API;
+    const me = opts.me || {};
+    const builder = me.builder || me;
+    if (!builder || builder.id == null) return;
+    newcomerGated = normalizeRank(builder.rank) === 'xenos';
+    wire();
+    renderRankStanding(builder);
+    const grades = $('#grades-scroll');
+    if (grades) grades.hidden = false;
+    renderRecentGrades((me.grades && me.grades.recent) || []);
+    renderRollingNote((me.grades && me.grades.rolling) || null);
+    renderKarmaFeed((me.karma && me.karma.recent) || []);
+    viewer = builder;
+    if (opened) loadFeeds();
+  }
+
+  // open() — the "Just you" screen was shown (profile.js calls it on the switch).
+  // Loads the two feeds once; each hides itself when empty.
+  function open() {
+    if (opened) return;
+    opened = true;
+    if (viewer) loadFeeds();
+  }
+  function loadFeeds() {
+    loadAcclaimFeed();
+    loadAnalytics(viewer);
+  }
+
+  window.OTBProfileOwn = { render, open };
+})();

package/modules/hall-ui/public/profile.css

@@ -164,7 +164,8 @@
 .profile-groups[data-active="overview"] > [data-group="overview"],
 .profile-groups[data-active="works"] > [data-group="works"],
 .profile-groups[data-active="activity"] > [data-group="activity"],
-.profile-groups[data-active="connections"] > [data-group="connections"] { display: block; }
+.profile-groups[data-active="connections"] > [data-group="connections"],
+.profile-groups[data-active="yours"] > [data-group="yours"] { display: block; }
 .profile-groups > [data-group][hidden] { display: none !important; }
 .profile-groups .scroll { margin: 0 0 var(--sp-sm); }
 #profile-rail .rail-link { min-height: 38px; padding: 0 14px; font-size: 14.5px; text-transform: none; border-radius: var(--radius-pill); }