pgkiln 0.43.0 → 0.44.0

package/public/app.css

@@ -478,6 +478,8 @@ details.btn-menu[open] > summary .btn-caret { transform: rotate(-90deg); }
 .report-toolbar { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: flex-end; margin-bottom: 0.75rem; }
 .report-toolbar .field { flex: 0 1 240px; }
 .search { display: flex; gap: 0.4rem; flex: 1 1 320px; max-width: 560px; margin-left: auto; }
+/* (sprint 78) a report whose search is the facets': the Actions menu at the start of the toolbar */
+.report-toolbar .search:not(:has(input[type=search])) { flex: 0 1 auto; min-width: 0; margin-left: 0; }
 .chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.75rem; }
 .chip { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.83rem; padding: 0.15rem 0.3rem 0.15rem 0.7rem; background: var(--accent-soft); border-radius: 99px; }
 .chip a { text-decoration: none; font-size: 1rem; line-height: 1; padding: 0 0.3rem; border-radius: 99px; }
@@ -1144,6 +1146,10 @@ td[data-add]:hover > .cal-add, .cal-add:focus-visible { opacity: 1; }
 .facet-chart .donut-figure { max-width: 9rem; margin: 0 auto; }
 .facet-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
 .facet-count { font-size: 0.75rem; color: var(--muted); background: var(--surface-3); border-radius: 99px; padding: 0 0.5rem; font-variant-numeric: tabular-nums; }
+/* (sprint 78) values after the seventh, and the rows the filters leave */
+.facet-more > summary { cursor: pointer; font-size: 0.85rem; color: var(--accent, var(--link)); padding: 0.15rem 0; }
+.facet-more[open] > summary { margin-bottom: 0.2rem; }
+.facet-total { margin: 0 0 0.6rem; font-size: 0.85rem; color: var(--muted); font-variant-numeric: tabular-nums; }
 .js .facet-actions .btn-hot { display: none; }
 .facet-exclude { font-size: 0.85rem; color: var(--muted); margin-top: 0.15rem; }
 .facet-excluded .facet-value .facet-label { text-decoration: line-through; }
@@ -1811,6 +1817,14 @@ dialog.crop-dialog::backdrop { background: rgb(15 20 30 / 55%); }
 .devbar-tool::-webkit-details-marker { display: none; }
 .devbar .devbar-tool:hover, .devbar-menu[open] > .devbar-tool, .devbar-quick[aria-pressed="true"] { background: #2f3b4f; color: #fff; }
 .devbar-debug-menu.is-on > .devbar-tool { color: #ffd166; }
+/* (sprint 79, UI-4) a text next to each icon (App 12, Page 3, Debug off); icons only when chosen or docked at a side */
+.devbar .devbar-tool:has(.devbar-text) { width: auto; min-width: 2.25rem; padding: 0 0.55rem; grid-auto-flow: column; gap: 0.35rem; white-space: nowrap; }
+.devbar[data-compact] .devbar-text, .devbar[data-dock="left"] .devbar-text, .devbar[data-dock="right"] .devbar-text { display: none; }
+.devbar[data-compact] .devbar-tool:has(.devbar-text), .devbar[data-dock="left"] .devbar-tool:has(.devbar-text), .devbar[data-dock="right"] .devbar-tool:has(.devbar-text) { width: 2.25rem; padding: 0; }
+@media (max-width: 900px) {
+  .devbar .devbar-text { display: none; }
+  .devbar .devbar-tool:has(.devbar-text) { width: 2.25rem; padding: 0; }
+}
 .devbar a, .devbar-pop a { color: #9cc8ff; }
 .devbar a:focus-visible, .devbar button:focus-visible, .devbar select:focus-visible, .devbar summary:focus-visible, .devbar input:focus-visible { outline: 2px solid #9cc8ff; outline-offset: 2px; }
 .devbar-menu { position: relative; }
@@ -1887,8 +1901,9 @@ a.search-hit:hover, a.search-hit:focus-visible { background: var(--accent-soft);
 .devbar-quick[aria-pressed="true"] { background: var(--accent); color: var(--accent-text); }
 
 /* (sprint 76) the pager: rows per page; a Go button only without JavaScript */
-.pager-size { display: inline-flex; align-items: center; gap: 0.4rem; margin-left: auto; font-size: 0.85rem; }
+.pager .pager-size { margin-right: 0; display: inline-flex; align-items: center; gap: 0.4rem; margin-left: auto; font-size: 0.85rem; }
 .pager-size select { min-height: 0; padding: 0.15rem 0.4rem; }
+.pager-size label { white-space: nowrap; }
 .js .no-js-only { display: none; }
 
 /* (sprint 76) the interactive report's Actions menu: one line per entry, submenus, forms in dialogs */
@@ -1914,6 +1929,13 @@ a.search-hit:hover, a.search-hit:focus-visible { background: var(--accent-soft);
 .search-field { display: flex; flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
 .search-field:focus-within { outline: 2px solid var(--accent); outline-offset: 1px; }
 .search-field .search-scope { border: 0; border-right: 1px solid var(--border); border-radius: var(--radius) 0 0 var(--radius); max-width: 9rem; background: var(--surface-2); }
+/* (sprint 79, IR-3; APEX: the column scope in the magnifier of the search field) all columns: only the magnifier;
+   a column: the magnifier and its name */
+.search-scope-wrap { position: relative; display: flex; flex: none; }
+.search-scope-wrap > .icon { position: absolute; left: 0.6rem; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--muted); }
+.search-field .search-scope-wrap .search-scope { padding-left: 2rem; }
+.search-field .search-scope-wrap .search-scope:has(option[value=""]:checked) { width: 2.75rem; padding-right: 0.5rem; color: transparent; }
+.search-field .search-scope option { color: var(--text); }
 .search-field input[type=search] { border: 0; flex: 1; min-width: 0; background: transparent; }
 .search-field input[type=search]:focus { outline: none; }
 /* a column heading's menu */

package/public/app.js

@@ -3642,7 +3642,7 @@ function areaFilter(map, f) {
   const bar = document.querySelector('.devbar');
   if (!bar) return;
   const KEY = 'pgkiln.devbar';
-  let prefs = { dock: 'bottom', autohide: true };
+  let prefs = { dock: 'bottom', autohide: true, compact: false };
   try { prefs = { ...prefs, ...JSON.parse(localStorage.getItem(KEY) || '{}') }; } catch {}
   if (!['bottom', 'top', 'left', 'right'].includes(prefs.dock)) prefs.dock = 'bottom';
   const save = () => { try { localStorage.setItem(KEY, JSON.stringify(prefs)); } catch {} };
@@ -3650,6 +3650,10 @@ function areaFilter(map, f) {
   settings?.closest('li')?.removeAttribute('hidden');
   const apply = () => {
     bar.dataset.dock = prefs.dock;
+    // (sprint 79) "Icons only": the tools without their texts
+    bar.toggleAttribute('data-compact', !!prefs.compact);
+    const compact = bar.querySelector('input[name="devbar-compact"]');
+    if (compact) compact.checked = !!prefs.compact;
     bar.querySelectorAll('input[name="devbar-dock"]').forEach((r) => { r.checked = r.value === prefs.dock; });
     const auto = bar.querySelector('input[name="devbar-autohide"]');
     if (auto) auto.checked = !!prefs.autohide;
@@ -3658,6 +3662,7 @@ function areaFilter(map, f) {
   bar.addEventListener('change', (e) => {
     if (e.target.name === 'devbar-dock') prefs.dock = e.target.value;
     else if (e.target.name === 'devbar-autohide') prefs.autohide = e.target.checked;
+    else if (e.target.name === 'devbar-compact') prefs.compact = e.target.checked;
     else return;
     save();
     apply();

package/src/builder/appsheets.ts

@@ -274,6 +274,45 @@ interface Catalog {
   fk_table: string | null;
 }
 
+/** (sprint 79) A number column that holds an amount: a dashboard sums it (Salary by Department). */
+const AMOUNT = /(^|_)(sal|salary|salaries|amount|amt|total|price|cost|costs|revenue|value|budget|balance|fee|fees|pay|wage|wages)(_|$)/i;
+
+interface ChartPlan {
+  table: string;
+  group: string;
+  /** count, or sum of `value` */
+  fn: 'count' | 'sum';
+  value: string | null;
+  kind: 'donut' | 'line' | 'bar';
+}
+
+/**
+ * (sprint 79, GEN-6) How a table is charted: by its first foreign key that says something, else a text,
+ * yes/no or date column whose values repeat; the sum of an amount column when there is one, else the
+ * number of rows; a donut for six groups or fewer, a line for dates, else a sorted bar. A grouping that
+ * says nothing (one group, or every group the same) is skipped.
+ */
+async function chartPlan(c: Client, table: string, catalog: Catalog[], rows: number): Promise<ChartPlan | null> {
+  const amount = catalog.find((x) => x.kind === 'number' && !x.is_pk && !x.fk_table && AMOUNT.test(x.column_name))?.column_name ?? null;
+  const groups = [...catalog.filter((x) => x.fk_table && !x.is_pk).map((x) => x.column_name), groupColumn(catalog, rows)].filter(
+    (g, i, all): g is string => !!g && all.indexOf(g) === i,
+  );
+  for (const group of groups) {
+    for (const value of amount ? [amount, null] : [null]) {
+      const measure = value ? `sum(${pg.escapeIdentifier(value)})` : 'count(*)';
+      const spread = (
+        await c.query<{ groups: number; lo: string | null; hi: string | null }>(
+          `select count(*)::int as groups, min(v)::text as lo, max(v)::text as hi from (select ${pg.escapeIdentifier(group)} as g, ${measure} as v from ${table} group by 1) x`,
+        )
+      ).rows[0];
+      if (spread.groups < 2 || spread.lo === spread.hi) continue;
+      const kind = catalog.find((x) => x.column_name === group)?.kind === 'date' ? 'line' : spread.groups <= 6 ? 'donut' : 'bar';
+      return { table, group, fn: value ? 'sum' : 'count', value, kind };
+    }
+  }
+  return null;
+}
+
 /**
  * A dashboard page: a chart per table (at most six) with the number of rows per
  * parent row (the first foreign key), or per value of a text, yes/no or date
@@ -283,7 +322,7 @@ interface Catalog {
  * Manager", and the Dashboard comes right after Home in the navigation menu.
  */
 export async function addDashboard(c: Client, alias: string, tables: string[], page: number, skipped: string[] = []): Promise<{ page: number; label: string } | null> {
-  const picks: { table: string; group: string }[] = [];
+  const picks: ChartPlan[] = [];
   for (const t of tables) {
     if (picks.length >= MAX_CHARTS) break;
     const rel = (await c.query('select relrowsecurity as rls, greatest(reltuples, 0) as n from pg_class where oid = $1::regclass', [t])).rows[0];
@@ -292,24 +331,25 @@ export async function addDashboard(c: Client, alias: string, tables: string[], p
       continue;
     }
     const catalog = (await c.query<Catalog>('select column_name, kind, is_pk, distinct_values, fk_table::text from meta.wizard_catalog($1::regclass)', [t])).rows;
-    const group = catalog.find((x) => x.fk_table && !x.is_pk)?.column_name ?? groupColumn(catalog, Number(rel.n));
-    if (group) picks.push({ table: t, group });
+    const plan = await chartPlan(c, t, catalog, Number(rel.n));
+    if (plan) picks.push(plan);
   }
   if (!picks.length) return null;
-  const generate = (table: string, group: string, no: number, nav: boolean) =>
+  const generate = (p: ChartPlan, no: number, nav: boolean) =>
     c.query<{ id: number }>('select meta.generate_page($1, \'chart\', $2::regclass, $3, $4::jsonb) as id', [
-      alias, table, no,
-      JSON.stringify({ label: 'Dashboard', icon: 'chart', nav, label_column: group, function: 'count', value_column: null }),
+      alias, p.table, no,
+      JSON.stringify({ label: 'Dashboard', icon: 'chart', nav, label_column: p.group, function: p.fn, value_column: p.value, chart: p.kind }),
     ]);
-  const title = async (table: string, group: string) =>
-    (await c.query(`select meta.wizard_table_label($1::regclass) || ' by ' || meta.wizard_column_label($1::regclass, $2) as t`, [table, group])).rows[0].t as string;
-  const dash = (await generate(picks[0].table, picks[0].group, page, true)).rows[0].id;
-  await c.query('update meta.region set title = $2 where page_id = $1', [dash, await title(picks[0].table, picks[0].group)]);
+  // Employees by Manager; a sum: Salary by Department
+  const title = async (p: ChartPlan) =>
+    (await c.query(`select coalesce(meta.wizard_column_label($1::regclass, $3), meta.wizard_table_label($1::regclass)) || ' by ' || meta.wizard_column_label($1::regclass, $2) as t`, [p.table, p.group, p.value])).rows[0].t as string;
+  const dash = (await generate(picks[0], page, true)).rows[0].id;
+  await c.query('update meta.region set title = $2 where page_id = $1', [dash, await title(picks[0])]);
   for (const [n, p] of picks.slice(1).entries()) {
     // generated on a page of its own, then moved onto the dashboard
     const spare = (await c.query('select max(page_no) + 1000 as n from meta.page where app_id = (select id from meta.app where alias = $1)', [alias])).rows[0].n as number;
-    const tmp = (await generate(p.table, p.group, spare, false)).rows[0].id;
-    await c.query('update meta.region set page_id = $2, seq = $3, title = $4 where page_id = $1', [tmp, dash, (n + 2) * 10, await title(p.table, p.group)]);
+    const tmp = (await generate(p, spare, false)).rows[0].id;
+    await c.query('update meta.region set page_id = $2, seq = $3, title = $4 where page_id = $1', [tmp, dash, (n + 2) * 10, await title(p)]);
     await c.query('delete from meta.page where id = $1', [tmp]);
   }
   if (picks.length > 1) await c.query('update meta.region set columns = 6 where page_id = $1', [dash]);
@@ -319,7 +359,7 @@ export async function addDashboard(c: Client, alias: string, tables: string[], p
        from meta.app a where a.alias = $1 and e.app_id = a.id and e.parent_id is null and e.target_page = $2`,
     [alias, page],
   );
-  return { page, label: `Dashboard (${(await Promise.all(picks.map((p) => title(p.table, p.group)))).join(', ')})` };
+  return { page, label: `Dashboard (${(await Promise.all(picks.map((p) => title(p)))).join(', ')})` };
 }
 
 /** Create the application, the tables, the rows, the foreign keys and the pages, in one transaction. */

package/src/builder/appwizard.ts

@@ -40,6 +40,8 @@ export const pastedName = (title: string) =>
 
 interface Relation {
   relname: string;
+  /** (sprint 78) the friendly name of its pages: Employees */
+  label: string;
   kind: 'table' | 'view';
   pk: string | null;
   /** the planner's estimate (null: never analyzed) */
@@ -54,7 +56,7 @@ interface Relation {
 export async function schemaRelations(schema: string): Promise<Relation[]> {
   return (
     await owner.query<Relation>(
-      `select c.relname, case when c.relkind in ('v', 'm') then 'view' else 'table' end as kind,
+      `select c.relname, meta.wizard_table_label(c.oid) as label, case when c.relkind in ('v', 'm') then 'view' else 'table' end as kind,
               meta.wizard_pk(c.oid) as pk, case when c.reltuples >= 0 then c.reltuples::bigint end as rows,
               meta.wizard_defaults('calendar', c.oid) ->> 'start' is not null as calendar,
               meta.wizard_pk(c.oid) is not null and meta.wizard_defaults('master_detail', c.oid) ->> 'detail' is not null as detail
@@ -350,9 +352,9 @@ async function createPage(s: Session, reply: FastifyReply, schema: string, b: Bo
         ${known
           ? relations.length
             ? relations.map((r, i) => html`<li><input type="hidden" name="t_${i}" value="${r.relname}">
-                <label class="aw-page-kind" for="f_k_${i}">${icon(r.kind === 'view' ? 'eye' : 'table')} ${r.relname}</label>
+                <label class="aw-page-kind" for="f_k_${i}">${icon(r.kind === 'view' ? 'eye' : 'table')} ${r.label}</label>
                 <select id="f_k_${i}" name="k_${i}">${kindsFor(r).map((k) => html`<option value="${k}"${k === kindOf(r, i) ? raw(' selected') : ''}>${PAGE_KINDS[k]}</option>`)}</select>
-                <small class="muted">${r.kind === 'view' ? 'view' : rows(r)}${r.kind === 'table' && !r.pk ? ', no single-column key: no form' : ''}${Number(r.rows ?? 0) > LARGE_TABLE ? ': a paged grid' : ''}</small></li>`)
+                <small class="muted"><code>${r.relname}</code> · ${r.kind === 'view' ? 'view' : rows(r)}${r.kind === 'table' && !r.pk ? ', no single-column key: no form' : ''}${Number(r.rows ?? 0) > LARGE_TABLE ? ': a paged grid' : ''}</small></li>`)
             : html`<li class="muted">${schema} has no tables or views.</li>`
           : html`<li class="muted">Choose a schema under Data for a page per table, or add pages with the page wizards later.</li>`}
       </ul>

package/src/i18n/ar.ts

@@ -390,6 +390,8 @@ export const ar: Record<MessageKey, string> = {
   'facets.stars_up': "{n} نجوم فأكثر",
   'facets.star_up': "نجمة واحدة فأكثر",
   'facets.clear_short': "مسح",
+  'facets.show_all': "عرض الكل ({n})",
+  'facets.total': "إجمالي عدد الصفوف {n}",
   'smart.placeholder': "بحث أو تصفية…",
   'smart.active': "عوامل التصفية المستخدمة",
   'smart.remove': "إزالة عامل التصفية {filter}",

package/src/i18n/cs.ts

@@ -390,6 +390,8 @@ export const cs: Record<MessageKey, string> = {
   'facets.stars_up': "{n} hvězdičky a více",
   'facets.star_up': "1 hvězdička a více",
   'facets.clear_short': "Vymazat",
+  'facets.show_all': "Zobrazit vše ({n})",
+  'facets.total': "Celkový počet řádků {n}",
   'smart.placeholder': "Hledat nebo filtrovat…",
   'smart.active': "Použité filtry",
   'smart.remove': "Odebrat filtr {filter}",

package/src/i18n/da.ts

@@ -390,6 +390,8 @@ export const da: Record<MessageKey, string> = {
   'facets.stars_up': "{n} stjerner og op",
   'facets.star_up': "1 stjerne og op",
   'facets.clear_short': "Ryd",
+  'facets.show_all': "Vis alle ({n})",
+  'facets.total': "Antal rækker i alt {n}",
   'smart.placeholder': "Søg eller filtrér…",
   'smart.active': "Filtre i brug",
   'smart.remove': "Fjern filteret {filter}",

package/src/i18n/de.ts

@@ -390,6 +390,8 @@ export const de: Record<MessageKey, string> = {
   'facets.stars_up': '{n} Sterne und mehr',
   'facets.star_up': '1 Stern und mehr',
   'facets.clear_short': 'Löschen',
+  'facets.show_all': 'Alle anzeigen ({n})',
+  'facets.total': 'Zeilen insgesamt {n}',
   'smart.placeholder': 'Suchen oder filtern…',
   'smart.active': 'Aktive Filter',
   'smart.remove': 'Filter {filter} entfernen',

package/src/i18n/el.ts

@@ -390,6 +390,8 @@ export const el: Record<MessageKey, string> = {
   'facets.stars_up': "{n} αστέρια και πάνω",
   'facets.star_up': "1 αστέρι και πάνω",
   'facets.clear_short': "Απαλοιφή",
+  'facets.show_all': "Εμφάνιση όλων ({n})",
+  'facets.total': "Συνολικός αριθμός γραμμών {n}",
   'smart.placeholder': "Αναζήτηση ή φιλτράρισμα…",
   'smart.active': "Φίλτρα σε χρήση",
   'smart.remove': "Αφαίρεση του φίλτρου {filter}",

package/src/i18n/es.ts

@@ -390,6 +390,8 @@ export const es: Record<MessageKey, string> = {
   'facets.stars_up': '{n} estrellas o más',
   'facets.star_up': '1 estrella o más',
   'facets.clear_short': 'Borrar',
+  'facets.show_all': 'Mostrar todo ({n})',
+  'facets.total': 'Total de filas {n}',
   'smart.placeholder': 'Buscar o filtrar…',
   'smart.active': 'Filtros en uso',
   'smart.remove': 'Quitar el filtro {filter}',

package/src/i18n/fi.ts

@@ -390,6 +390,8 @@ export const fi: Record<MessageKey, string> = {
   'facets.stars_up': "{n} tähteä tai enemmän",
   'facets.star_up': "1 tähti tai enemmän",
   'facets.clear_short': "Tyhjennä",
+  'facets.show_all': "Näytä kaikki ({n})",
+  'facets.total': "Rivejä yhteensä {n}",
   'smart.placeholder': "Hae tai suodata…",
   'smart.active': "Käytössä olevat suodattimet",
   'smart.remove': "Poista suodatin {filter}",

package/src/i18n/fr.ts

@@ -390,6 +390,8 @@ export const fr: Record<MessageKey, string> = {
   'facets.stars_up': '{n} étoiles et plus',
   'facets.star_up': '1 étoile et plus',
   'facets.clear_short': 'Effacer',
+  'facets.show_all': 'Tout afficher ({n})',
+  'facets.total': 'Nombre total de lignes {n}',
   'smart.placeholder': 'Rechercher ou filtrer…',
   'smart.active': 'Filtres actifs',
   'smart.remove': 'Supprimer le filtre {filter}',

package/src/i18n/he.ts

@@ -390,6 +390,8 @@ export const he: Record<MessageKey, string> = {
   'facets.stars_up': "{n} כוכבים ומעלה",
   'facets.star_up': "כוכב אחד ומעלה",
   'facets.clear_short': "ניקוי",
+  'facets.show_all': "הצג הכול ({n})",
+  'facets.total': "סך כל השורות {n}",
   'smart.placeholder': "חיפוש או סינון…",
   'smart.active': "מסננים בשימוש",
   'smart.remove': "הסרת המסנן {filter}",

package/src/i18n/it.ts

@@ -390,6 +390,8 @@ export const it: Record<MessageKey, string> = {
   'facets.stars_up': "{n} stelle e più",
   'facets.star_up': "1 stella e più",
   'facets.clear_short': "Cancella",
+  'facets.show_all': "Mostra tutto ({n})",
+  'facets.total': "Numero totale di righe {n}",
   'smart.placeholder': "Cerca o filtra…",
   'smart.active': "Filtri attivi",
   'smart.remove': "Rimuovi il filtro {filter}",

package/src/i18n/ja.ts

@@ -390,6 +390,8 @@ export const ja: Record<MessageKey, string> = {
   'facets.stars_up': "星 {n} つ以上",
   'facets.star_up': "星 1 つ以上",
   'facets.clear_short': "クリア",
+  'facets.show_all': "すべて表示 ({n})",
+  'facets.total': "合計行数 {n}",
   'smart.placeholder': "検索またはフィルター…",
   'smart.active': "使用中のフィルター",
   'smart.remove': "フィルター {filter} を削除",

package/src/i18n/ko.ts

@@ -390,6 +390,8 @@ export const ko: Record<MessageKey, string> = {
   'facets.stars_up': "별 {n}개 이상",
   'facets.star_up': "별 1개 이상",
   'facets.clear_short': "지우기",
+  'facets.show_all': "모두 표시 ({n})",
+  'facets.total': "전체 행 수 {n}",
   'smart.placeholder': "검색 또는 필터…",
   'smart.active': "사용 중인 필터",
   'smart.remove': "{filter} 필터 제거",

package/src/i18n/nb.ts

@@ -390,6 +390,8 @@ export const nb: Record<MessageKey, string> = {
   'facets.stars_up': "{n} stjerner og opp",
   'facets.star_up': "1 stjerne og opp",
   'facets.clear_short': "Fjern",
+  'facets.show_all': "Vis alle ({n})",
+  'facets.total': "Totalt antall rader {n}",
   'smart.placeholder': "Søk eller filtrer…",
   'smart.active': "Filtre i bruk",
   'smart.remove': "Fjern filteret {filter}",

package/src/i18n/pl.ts

@@ -390,6 +390,8 @@ export const pl: Record<MessageKey, string> = {
   'facets.stars_up': "{n} gwiazdki i więcej",
   'facets.star_up': "1 gwiazdka i więcej",
   'facets.clear_short': "Wyczyść",
+  'facets.show_all': "Pokaż wszystkie ({n})",
+  'facets.total': "Łączna liczba wierszy {n}",
   'smart.placeholder': "Szukaj lub filtruj…",
   'smart.active': "Używane filtry",
   'smart.remove': "Usuń filtr {filter}",

package/src/i18n/pt.ts

@@ -390,6 +390,8 @@ export const pt: Record<MessageKey, string> = {
   'facets.stars_up': "{n} estrelas ou mais",
   'facets.star_up': "1 estrela ou mais",
   'facets.clear_short': "Limpar",
+  'facets.show_all': "Mostrar tudo ({n})",
+  'facets.total': "Total de linhas {n}",
   'smart.placeholder': "Pesquisar ou filtrar…",
   'smart.active': "Filtros em uso",
   'smart.remove': "Remover o filtro {filter}",

package/src/i18n/ru.ts

@@ -390,6 +390,8 @@ export const ru: Record<MessageKey, string> = {
   'facets.stars_up': "{n} звезды и выше",
   'facets.star_up': "1 звезда и выше",
   'facets.clear_short': "Очистить",
+  'facets.show_all': "Показать все ({n})",
+  'facets.total': "Всего строк {n}",
   'smart.placeholder': "Поиск или фильтр…",
   'smart.active': "Действующие фильтры",
   'smart.remove': "Удалить фильтр {filter}",

package/src/i18n/sv.ts

@@ -390,6 +390,8 @@ export const sv: Record<MessageKey, string> = {
   'facets.stars_up': "{n} stjärnor och uppåt",
   'facets.star_up': "1 stjärna och uppåt",
   'facets.clear_short': "Rensa",
+  'facets.show_all': "Visa alla ({n})",
+  'facets.total': "Totalt antal rader {n}",
   'smart.placeholder': "Sök eller filtrera…",
   'smart.active': "Filter som används",
   'smart.remove': "Ta bort filtret {filter}",

package/src/i18n/tr.ts

@@ -390,6 +390,8 @@ export const tr: Record<MessageKey, string> = {
   'facets.stars_up': "{n} yıldız ve üzeri",
   'facets.star_up': "1 yıldız ve üzeri",
   'facets.clear_short': "Temizle",
+  'facets.show_all': "Tümünü göster ({n})",
+  'facets.total': "Toplam satır sayısı {n}",
   'smart.placeholder': "Ara veya süz…",
   'smart.active': "Kullanılan süzgeçler",
   'smart.remove': "{filter} süzgecini kaldır",

package/src/i18n/uk.ts

@@ -390,6 +390,8 @@ export const uk: Record<MessageKey, string> = {
   'facets.stars_up': "{n} зірки й вище",
   'facets.star_up': "1 зірка й вище",
   'facets.clear_short': "Очистити",
+  'facets.show_all': "Показати все ({n})",
+  'facets.total': "Усього рядків {n}",
   'smart.placeholder': "Пошук або фільтр…",
   'smart.active': "Чинні фільтри",
   'smart.remove': "Видалити фільтр {filter}",

package/src/i18n/zh.ts

@@ -390,6 +390,8 @@ export const zh: Record<MessageKey, string> = {
   'facets.stars_up': "{n} 星及以上",
   'facets.star_up': "1 星及以上",
   'facets.clear_short': "清除",
+  'facets.show_all': "显示全部 ({n})",
+  'facets.total': "总行数 {n}",
   'smart.placeholder': "搜索或筛选…",
   'smart.active': "正在使用的筛选器",
   'smart.remove': "删除筛选器 {filter}",

package/src/i18n.ts

@@ -417,6 +417,8 @@ const en = {
   'facets.stars_up': '{n} stars and up',
   'facets.star_up': '1 star and up',
   'facets.clear_short': 'Clear',
+  'facets.show_all': 'Show all ({n})',
+  'facets.total': 'Total row count {n}',
   'smart.placeholder': 'Search or filter…',
   'smart.active': 'Filters in use',
   'smart.remove': 'Remove filter {filter}',
@@ -1121,6 +1123,8 @@ const nl: Record<MessageKey, string> = {
   'facets.stars_up': '{n} sterren of meer',
   'facets.star_up': '1 ster of meer',
   'facets.clear_short': 'Wissen',
+  'facets.show_all': 'Alle tonen ({n})',
+  'facets.total': 'Totaal aantal rijen {n}',
   'smart.placeholder': 'Zoeken of filteren…',
   'smart.active': 'Gebruikte filters',
   'smart.remove': 'Filter {filter} verwijderen',

package/src/runtime/account.ts

@@ -7,7 +7,7 @@ import { forgetAllRemembered, rememberCookie, rememberedCount } from '../remembe
 import { getSession, loginThrottled, logActivity, saveState, takeFlash } from '../session.ts';
 import { loginWindowMinutes } from '../security.ts';
 import type { PageContext } from './context.ts';
-import { databaseTimeZone, isTheme, matchLanguage, sameOffset, THEME_COOKIE, timeZoneFor, timeZoneNames, validTimeZone } from './locale.ts';
+import { databaseTimeZone, isTheme, matchLanguage, sameOffset, THEME_COOKIE, themeCookieOptions, timeZoneFor, timeZoneNames, validTimeZone } from './locale.ts';
 import { chrome, clientTexts } from './render.ts';
 import { appStyles, choosable, chosenStyleName, styleChoice } from './styles.ts';
 import { loadApp } from '../metadata.ts';
@@ -28,8 +28,8 @@ async function saveStyle(appId: number, username: string, style: string) {
   );
 }
 
-const themeCookie = (reply: FastifyReply, theme: string) =>
-  reply.setCookie(THEME_COOKIE, theme, { path: '/', sameSite: 'lax', secure: process.env.COOKIE_SECURE === 'true', maxAge: 365 * 86400 });
+// (sprint 79) per application: a choice in one application doesn't change another's mode
+const themeCookie = (reply: FastifyReply, theme: string, base: string) => reply.setCookie(THEME_COOKIE, theme, themeCookieOptions(base));
 
 /** My account → Time zone: automatic (the browser's) or one of PostgreSQL's time zones. */
 async function timeZoneField(ctx: PageContext) {
@@ -160,7 +160,7 @@ export async function accountRoutes(app: FastifyInstance) {
     }
     if (theme) {
       ctx.session.state.__THEME = theme;
-      themeCookie(reply, theme);
+      themeCookie(reply, theme, ctx.base);
     }
     if (language) ctx.session.state.__LANG = language;
     // a style variant: only one of the app's own styles ('' = the base colours)
@@ -263,7 +263,7 @@ export async function accountRoutes(app: FastifyInstance) {
     const to = safeNext(a, b.next);
     if (b.__csrf !== session.csrf_token || a.theme?.user_choice === false || !isTheme(b.theme)) return reply.redirect(to, 303);
     session.state.__THEME = b.theme;
-    themeCookie(reply, b.theme);
+    themeCookie(reply, b.theme, `/a/${a.alias}`);
     if (session.username) {
       await runtime.query('update meta.account set theme_pref = $2 where lower(username) = lower($1)', [session.username, b.theme]);
     }

package/src/runtime/devbar.ts

@@ -86,26 +86,28 @@ export function devbarHtml(ctx: PageContext): Raw | '' {
   const level = sessionDebugLevel(ctx.session);
   const appLevel = Number(ctx.app.debug_level ?? 0);
   const page = ctx.page.page_no;
-  const tool = (href: string, label: string, name: string) =>
-    html`<li><a class="devbar-tool" href="${href}" title="${label}" aria-label="${label}">${icon(name)}</a></li>`;
-  const menu = (label: string, name: string, cls: string, body: Raw, hidden = false) =>
-    html`<li${hidden ? raw(' hidden') : ''}><details class="devbar-menu ${cls}"><summary class="devbar-tool" title="${label}" aria-label="${label}">${icon(name)}</summary>
+  // (sprint 79, UI-4; APEX: App 77536, Page 8, Debug ⏻) each tool with a short text; "Icons only" in Settings
+  const text = (s: string) => html`<span class="devbar-text" aria-hidden="true">${s}</span>`;
+  const tool = (href: string, label: string, name: string, short: string) =>
+    html`<li><a class="devbar-tool" href="${href}" title="${label}" aria-label="${label}">${icon(name)}${text(short)}</a></li>`;
+  const menu = (label: string, name: string, cls: string, body: Raw, hidden = false, short = label) =>
+    html`<li${hidden ? raw(' hidden') : ''}><details class="devbar-menu ${cls}"><summary class="devbar-tool" title="${label}" aria-label="${label}">${icon(name)}${text(short)}</summary>
       <div class="devbar-pop" role="group" aria-label="${label}">${body}</div></details></li>`;
   return html`<div class="devbar" data-dock="bottom">
     <nav aria-label="Developer toolbar"><ul class="devbar-tools">
-      ${tool(BUILDER, 'App Builder', 'home')}
-      ${tool(`${BUILDER}/apps/${ctx.app.id}`, `Application ${ctx.app.id}`, 'grid')}
-      ${tool(`${BUILDER}/pages/${ctx.page.id}`, `Edit page ${page}`, 'edit')}
-      ${tool(`${ctx.base}/${page}/devbar/session`, 'Session', 'database')}
-      ${menu('Debug', 'bolt', `devbar-debug-menu${level || appLevel ? ' is-on' : ''}`, html`<form method="post" action="${ctx.base}/${page}/devbar/debug" class="devbar-debug">
+      ${tool(BUILDER, 'App Builder', 'home', 'Home')}
+      ${tool(`${BUILDER}/apps/${ctx.app.id}`, `Application ${ctx.app.id}`, 'grid', `App ${ctx.app.id}`)}
+      ${tool(`${BUILDER}/pages/${ctx.page.id}`, `Edit page ${page}`, 'edit', `Page ${page}`)}
+      ${tool(`${ctx.base}/${page}/devbar/session`, 'Session', 'database', 'Session')}
+      ${menu(`Debug: ${level || appLevel ? 'on' : 'off'}`, 'bolt', `devbar-debug-menu${level || appLevel ? ' is-on' : ''}`, html`<form method="post" action="${ctx.base}/${page}/devbar/debug" class="devbar-debug">
         <input type="hidden" name="__csrf" value="${ctx.session.csrf_token}">
         <label for="devbar-debug">Debug messages</label>
         <select id="devbar-debug" name="level">${DEBUG_LEVELS.map(([n, label]) =>
           html`<option value="${n}"${n === level ? raw(' selected') : ''}>${n === 0 ? (appLevel ? `Application (${appLevel})` : 'Off') : label}</option>`)}</select>
         <button>Set</button>
-      </form>${level || appLevel ? html`<a href="${BUILDER}/apps/${ctx.app.id}/debug">View debug</a>` : ''}`)}
-      <li><button type="button" class="devbar-tool devbar-quick" data-quick-edit="${BUILDER}/pages/${ctx.page.id}" aria-pressed="false" title="Quick edit" aria-label="Quick edit" hidden>${icon('scan')}</button></li>
-      ${tool(`${BUILDER}/apps/${ctx.app.id}/theme`, 'Customize (Theme Roller)', 'sliders')}
+      </form>${level || appLevel ? html`<a href="${BUILDER}/apps/${ctx.app.id}/debug">View debug</a>` : ''}`, false, `Debug ${level || appLevel ? 'on' : 'off'}`)}
+      <li><button type="button" class="devbar-tool devbar-quick" data-quick-edit="${BUILDER}/pages/${ctx.page.id}" aria-pressed="false" title="Quick edit" aria-label="Quick edit" hidden>${icon('scan')}${text('Quick edit')}</button></li>
+      ${tool(`${BUILDER}/apps/${ctx.app.id}/theme`, 'Customize (Theme Roller)', 'sliders', 'Customize')}
       ${menu('Info', 'info', 'devbar-info', html`<dl class="devbar-facts">
         <dt>Application</dt><dd>${ctx.app.name} (${ctx.app.id})</dd>
         <dt>Page</dt><dd>${page}: ${ctx.page.name}</dd>
@@ -115,7 +117,8 @@ export function devbarHtml(ctx: PageContext): Raw | '' {
       ${menu('Settings', 'settings', 'devbar-settings', html`<fieldset class="devbar-dock"><legend>Position</legend>
         ${(['bottom', 'top', 'left', 'right'] as const).map((d) => html`<label><input type="radio" name="devbar-dock" value="${d}"${d === 'bottom' ? raw(' checked') : ''}> ${d[0].toUpperCase() + d.slice(1)}</label>`)}
       </fieldset>
-      <label class="devbar-autohide"><input type="checkbox" name="devbar-autohide" checked> Hide when not used</label>`, true)}
+      <label class="devbar-autohide"><input type="checkbox" name="devbar-autohide" checked> Hide when not used</label>
+      <label class="devbar-autohide"><input type="checkbox" name="devbar-compact"> Icons only</label>`, true)}
     </ul></nav>
   </div>`;
 }

package/src/runtime/facets.ts

@@ -99,6 +99,20 @@ export async function rangeCounts(ctx: PageContext, fs: FacetSource, f: FacetDef
   return res.rows[0] as number[];
 }
 
+/** (sprint 78) Checkbox facet values shown before "Show all" (APEX shows seven). */
+export const FACET_SHOWN = 7;
+
+/** (sprint 78) The rows the report shows: the search and every facet's filter. */
+export async function totalRows(ctx: PageContext, fs: FacetSource): Promise<number> {
+  const p = new SqlParams();
+  const where = othersWhere(ctx, fs, '', p);
+  const c = ctx.client!;
+  const res = await savepoint(c, () =>
+    c.query<{ n: number }>({ text: `select count(*)::int as n from (\n${fs.src}\n) "__q"${where.length ? ` where ${where.join(' and ')}` : ''}`, values: queryValues(p.values) }),
+  );
+  return res.rows[0].n;
+}
+
 export const facetLabel = (ctx: PageContext, f: FacetDef) => f.label ?? ctx.locale.tr(heading(f.column));
 
 /** A star rating drawn with stars, read as "4 stars and up". */
@@ -156,15 +170,24 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
       // keep selected values visible even when their count dropped to 0
       for (const s of selected) if (s && !values.some((x) => x.v === s)) values.push({ v: s, n: 0 });
       const excluded = f.exclude && ctx.params.get(k.exclude + f.column) === '1';
+      // (sprint 78) a boolean's values as Yes and No, not true and false
+      const bool = fs.cols.get(f.column) === 16;
+      const shown = (v: string) => (bool && (v === 'true' || v === 'false') ? t(v === 'true' ? 'item.yes' : 'item.no') : (toState(v) ?? ''));
       const chart = facetChart(ctx, report, f, label, values.map((x) => ({
-        label: toState(x.v) ?? '', n: x.n,
+        label: shown(x.v), n: x.n,
         apply: (p) => { p.delete(k.values + f.column); p.delete(k.exclude + f.column); p.append(k.values + f.column, x.v); },
       })));
+      const value = (x: { v: string; n: number }) =>
+        html`<label class="check facet-value"><input type="checkbox" form="${formId}" name="${k.values}${f.column}" value="${x.v}"${selected.has(x.v) ? raw(' checked') : ''} data-facet>
+            <span class="facet-label">${shown(x.v)}</span><span class="facet-count">${x.n}</span></label>`;
       groups.push(html`<fieldset class="facet${excluded ? ' facet-excluded' : ''}">
         <legend>${label}${clearLink(f)}</legend>
         ${chart}
-        ${values.map((x) => html`<label class="check facet-value"><input type="checkbox" form="${formId}" name="${k.values}${f.column}" value="${x.v}"${selected.has(x.v) ? raw(' checked') : ''} data-facet>
-            <span class="facet-label">${toState(x.v)}</span><span class="facet-count">${x.n}</span></label>`)}
+        ${values.slice(0, FACET_SHOWN).map(value)}
+        ${values.length > FACET_SHOWN
+          ? html`<details class="facet-more"${values.slice(FACET_SHOWN).some((x) => selected.has(x.v)) ? raw(' open') : ''}><summary>${t('facets.show_all', { n: String(values.length) })}</summary>
+            ${values.slice(FACET_SHOWN).map(value)}</details>`
+          : ''}
         ${f.exclude
           ? html`<label class="check facet-exclude"><input type="checkbox" form="${formId}" name="${k.exclude}${f.column}" value="1"${excluded ? raw(' checked') : ''} data-facet> ${t('facets.exclude')}</label>`
           : ''}
@@ -225,7 +248,15 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
     html`<form id="${formId}" method="get" action="${ctx.base}/${ctx.page.page_no}">${keep.map(([name, v]) => html`<input type="hidden" name="${name}" value="${v}">`)}</form>`,
   );
   const any = defs.some((f) => active.has(f.column)) || (r.config.search === true && fs.search !== '');
+  // (sprint 78; APEX: the results' "Total Row Count") the rows the filters leave
+  let total: number | null = null;
+  try {
+    total = await totalRows(ctx, fs);
+  } catch {
+    total = null; // the facets' own errors are shown above
+  }
   return html`<div class="facets">
+    ${total !== null ? html`<p class="facet-total" role="status">${t('facets.total', { n: total.toLocaleString(ctx.locale.lang) })}</p>` : ''}
     ${groups}
     <div class="buttons facet-actions">
       <button class="btn btn-hot" form="${formId}">${t('report.apply')}</button>