estela 0.1.39 → 0.1.40

package/web/app.js

@@ -428,7 +428,14 @@ function haceCuanto(days) {
 
 async function loadSummary() {
   const { from, to } = periodRange(state.period === "all" ? "quarter" : state.period);
-  state.summary = await api(`/api/summary?from=${from}&to=${to}`);
+  // La cuota es siempre de esta semana, sea cual sea el periodo elegido: si
+  // fallara, el resumen se pinta igual y la tarjeta simplemente no sale.
+  const [summary, quota] = await Promise.all([
+    api(`/api/summary?from=${from}&to=${to}`),
+    api("/api/quota").catch(() => null),
+  ]);
+  state.summary = summary;
+  state.quota = quota;
   renderSummary();
 }
 
@@ -473,6 +480,8 @@ function renderSummary() {
     parts.push(`<div class="plist">${s.projects.map(renderProjectRow).join("")}</div>`);
   }
 
+  parts.push(renderQuota(state.quota));
+
   if (s.activity.length) {
     parts.push(`<h2 class="block-title">${tr("summary.activity")}</h2>`);
     parts.push(`<div class="feed">${s.activity.map(renderActivity).join("")}</div>`);
@@ -510,6 +519,57 @@ function renderSummary() {
   });
 }
 
+/* ¿Qué proyecto se come tu cuota? El mismo reparto de la semana que da
+   `estela quota`, por agente y nunca mezclados: Claude Code gasta la cuota de
+   Anthropic y Codex la de OpenAI. Solo consumo real: ni "te queda" ni
+   "se acaba", porque esos límites no se publican. */
+function renderQuota(q) {
+  if (!q || (!q.agents.length && !q.excluded.length)) return "";
+  const AGENT = { "claude-code": "Claude Code", codex: "Codex" };
+  const out = [];
+
+  for (const a of q.agents) {
+    out.push(`<h2 class="block-title">${tr("quota.title", { agent: AGENT[a.agent] || a.agent })}</h2>`);
+    out.push(`<div class="plist">${a.week.projects.map(quotaRow).join("")}</div>`);
+    out.push(`<p class="quota-note">${esc(quotaComparison(a.comparison))}</p>`);
+  }
+  if (q.excluded.length) out.push(`<p class="quota-note">${tr("quota.copilot")}</p>`);
+  if (q.agents.length) out.push(`<p class="quota-note">${tr("quota.estimate")}</p>`);
+  return out.join("");
+}
+
+function quotaRow(p) {
+  const name = p.projectName ?? (p.folder ? tr("quota.folder", { folder: p.folder }) : tr("quota.noFolder"));
+  const pct = Math.round(p.share * 100);
+  return `
+<div class="prow">
+  <div class="prow-text">
+    <div class="prow-name">${esc(name)}</div>
+    <div class="prow-meta">${tr("quota.breakdown", {
+      input: fmtTokens(p.input), output: fmtTokens(p.output),
+      read: fmtTokens(p.cacheRead), write: fmtTokens(p.cacheWrite) })}</div>
+    <div class="quota-bar"><i style="width:${pct}%"></i></div>
+  </div>
+  <div class="prow-figs">
+    <div class="prow-hours">${fmtTokens(p.total)}</div>
+    <div class="prow-amount">${tr("quota.share", { n: pct })}</div>
+  </div>
+</div>`;
+}
+
+function quotaComparison(c) {
+  if (c.status !== "ok") return tr("quota.noHistory", { weeks: c.weeks, have: c.completeWeeks });
+  if (c.ratio === null) return tr("quota.noPastUsage", { current: fmtTokens(c.current), weeks: c.weeks });
+  const diff = Math.round((c.ratio - 1) * 100);
+  const how = diff > 0 ? tr("quota.more", { n: diff }) : diff < 0 ? tr("quota.less", { n: -diff }) : tr("quota.same");
+  return tr("quota.vsHistory", { current: fmtTokens(c.current), average: fmtTokens(c.average), weeks: c.weeks, how });
+}
+
+/** Tokens con el formato corto del idioma: "22,7 M" o "22.7M". */
+function fmtTokens(n) {
+  return new Intl.NumberFormat(localeTag(), { notation: "compact", maximumFractionDigits: 1 }).format(n);
+}
+
 function kpi(value, label, extra = "") {
   return `<div class="kpi ${extra}">
     <div class="kpi-value">${esc(value)}</div>

package/web/i18n.js

@@ -40,6 +40,7 @@
       "refresh.searching": "Buscando…",
       "refresh.failed": "No se pudo actualizar",
       "upgrade.btn": "Actualizar a Pro o Teams",
+      "upgrade.btnShort": "Pro o Teams",
       "upgrade.cycle": "Ciclo de facturación",
       "upgrade.monthly": "Mensual",
       "upgrade.yearly": "Anual",
@@ -140,6 +141,19 @@
       "summary.approveAll": "Hay <b>{n}</b> bloques de trabajo <b>tuyo</b> sin revisar en este periodo. Al configurar un proyecto entra de golpe todo su histórico. Pulsa el aviso de cada proyecto para ir a ellos.",
       "summary.approveAll.btn": "Aprobar el periodo",
       "summary.activity": "Actividad reciente",
+      "quota.title": "Cuota de {agent} esta semana",
+      "quota.breakdown": "entrada {input} · salida {output} · lect. caché {read} · escr. caché {write}",
+      "quota.share": "{n} % de la semana",
+      "quota.folder": "sin proyecto · {folder}",
+      "quota.noFolder": "sin carpeta",
+      "quota.vsHistory": "Frente a tu historial: {current} esta semana, y una media de {average} en el mismo tramo de las {weeks} semanas anteriores: {how}.",
+      "quota.noPastUsage": "Frente a tu historial: {current} esta semana; en el mismo tramo de las {weeks} semanas anteriores no hubo consumo.",
+      "quota.noHistory": "Sin historial suficiente para comparar: hacen falta {weeks} semanas completas y hay {have}.",
+      "quota.more": "un {n} % más",
+      "quota.less": "un {n} % menos",
+      "quota.same": "lo mismo",
+      "quota.copilot": "Copilot no guarda tokens fiables y queda fuera de este cálculo.",
+      "quota.estimate": "Solo consumo real, calculado en tu máquina: los límites de cada plan no se publican, y lo que uses en claude.ai u otro equipo también cuenta y Estela no lo ve. El detalle de la ventana de 5 h, con <code>estela quota</code>.",
       "summary.nothingLeft": "Ya no queda nada por revisar ahí",
       "summary.pendingHere": "{blocks} por revisar aquí · {more}",
       "summary.moreDays": { one: "1 día más con pendientes", other: "{n} días más con pendientes" },
@@ -323,6 +337,7 @@
       "refresh.searching": "Looking…",
       "refresh.failed": "Couldn't refresh",
       "upgrade.btn": "Upgrade to Pro or Teams",
+      "upgrade.btnShort": "Pro or Teams",
       "upgrade.cycle": "Billing cycle",
       "upgrade.monthly": "Monthly",
       "upgrade.yearly": "Yearly",
@@ -423,6 +438,19 @@
       "summary.approveAll": "There are <b>{n}</b> blocks of <b>your</b> work unreviewed in this period. Setting up a project brings in its whole history at once. Click each project's notice to go to them.",
       "summary.approveAll.btn": "Approve the period",
       "summary.activity": "Recent activity",
+      "quota.title": "{agent} quota this week",
+      "quota.breakdown": "input {input} · output {output} · cache read {read} · cache write {write}",
+      "quota.share": "{n}% of the week",
+      "quota.folder": "no project · {folder}",
+      "quota.noFolder": "no folder",
+      "quota.vsHistory": "Against your history: {current} this week, and an average of {average} over the same stretch of the previous {weeks} weeks: {how}.",
+      "quota.noPastUsage": "Against your history: {current} this week; over the same stretch of the previous {weeks} weeks there was no usage.",
+      "quota.noHistory": "Not enough history to compare: it takes {weeks} complete weeks and there are {have}.",
+      "quota.more": "{n}% more",
+      "quota.less": "{n}% less",
+      "quota.same": "about the same",
+      "quota.copilot": "Copilot doesn't record reliable tokens and is left out of this calculation.",
+      "quota.estimate": "Real usage only, calculated on your machine: each plan's limits aren't published, and anything you use on claude.ai or another machine also counts and Estela can't see it. For the 5-hour window, run <code>estela quota</code>.",
       "summary.nothingLeft": "Nothing left to review there",
       "summary.pendingHere": "{blocks} to review here · {more}",
       "summary.moreDays": { one: "1 more day with pending blocks", other: "{n} more days with pending blocks" },

package/web/index.html

@@ -30,7 +30,10 @@
             data-i18n="sync.now" data-i18n-title="sync.now.title"
             title="Sube tus horas a la nube y baja lo de tus otras máquinas">Sincronizar</button>
     <div class="upgrade-wrap" id="upgrade-wrap" hidden>
-      <button type="button" class="btn-main btn-upgrade" id="upgrade-btn" data-i18n="upgrade.btn">Actualizar a Pro o Teams</button>
+      <button type="button" class="btn-main btn-upgrade" id="upgrade-btn"
+              data-i18n-aria-label="upgrade.btn" aria-label="Actualizar a Pro o Teams"><span class="up-long"
+              data-i18n="upgrade.btn">Actualizar a Pro o Teams</span><span class="up-short"
+              data-i18n="upgrade.btnShort">Pro o Teams</span></button>
       <div class="upgrade-menu" id="upgrade-menu" hidden>
         <div class="upgrade-ciclo" role="group" aria-label="Ciclo de facturación" data-i18n-aria-label="upgrade.cycle">
           <button type="button" data-ciclo="monthly" class="is-on" data-i18n="upgrade.monthly">Mensual</button>