pgkiln 0.45.0 → 0.47.0

package/src/i18n.ts

@@ -90,6 +90,7 @@ const en = {
   'common.back': 'Go back',
   'common.home': 'Go to the home page',
   'common.skip': 'Skip to content',
+  'common.back_to_top': "Back to top",
   'common.toggle_nav': 'Toggle navigation',
   'common.dismiss': 'Dismiss',
   // messages and errors
@@ -417,6 +418,9 @@ const en = {
   'facets.stars_up': '{n} stars and up',
   'facets.star_up': '1 star and up',
   'facets.clear_short': 'Clear',
+  'facets.menu': 'Options of {facet}',
+  'facets.sort_count': 'Sort by count',
+  'facets.sort_name': 'Sort by name',
   'facets.show_all': 'Show all ({n})',
   'facets.total': 'Total row count {n}',
   'smart.placeholder': 'Search or filter…',
@@ -712,6 +716,64 @@ const en = {
   'reporter.changed': "changed {date}",
   'reporter.no_match': "No reports match the search.",
   'reporter.chart_tag': "chart",
+  // Form Designer (form-designer.ts)
+  'formdesigner.no_sources': "No tables are set up for this region yet.",
+  'formdesigner.no_forms': "There are no forms yet.",
+  'formdesigner.new': "New form",
+  'formdesigner.create': "Design",
+  'formdesigner.draft': "Draft",
+  'formdesigner.design': "Design form",
+  'formdesigner.design_of': "Design of {name}",
+  'formdesigner.back': "All forms",
+  'formdesigner.add': "Add",
+  'formdesigner.edit_row': "Edit",
+  'formdesigner.rows': "Rows of {form}",
+  'formdesigner.save': "Save",
+  'formdesigner.delete': "Delete",
+  'formdesigner.delete_confirm': "Delete this row?",
+  'formdesigner.cancel': "Cancel",
+  'formdesigner.saved_row': "Saved.",
+  'formdesigner.deleted_row': "Deleted.",
+  'formdesigner.required': "{field} is required.",
+  'formdesigner.not_in_list': "{field}: choose a value from the list.",
+  'formdesigner.changed': "Someone else changed this row in the meantime. Check it and save again.",
+  'formdesigner.row_not_found': "This row does not exist, or you may not see it.",
+  'formdesigner.not_allowed': "You may not do that with this row.",
+  'formdesigner.form_not_found': "This form does not exist (any more).",
+  'formdesigner.unknown_source': "This form's table is no longer offered.",
+  'formdesigner.nothing': "This form has no fields yet.",
+  'formdesigner.choose': "- Choose -",
+  'formdesigner.name': "Name",
+  'formdesigner.description': "Description",
+  'formdesigner.published': "Published: everyone who can see this page may use the form",
+  'formdesigner.fields': "Fields",
+  'formdesigner.field_on': "On the form",
+  'formdesigner.column': "Column",
+  'formdesigner.key': "key",
+  'formdesigner.order': "Order",
+  'formdesigner.label': "Label",
+  'formdesigner.help': "Help text",
+  'formdesigner.required_short': "Required",
+  'formdesigner.display': "Display",
+  'formdesigner.default': "Default",
+  'formdesigner.in_list': "In the list",
+  'formdesigner.display_auto': "Field",
+  'formdesigner.display_textarea': "Text area",
+  'formdesigner.display_select': "Select list",
+  'formdesigner.display_radio': "Radio group",
+  'formdesigner.actions': "Users may",
+  'formdesigner.allow_insert': "add rows",
+  'formdesigner.allow_update': "change rows",
+  'formdesigner.allow_delete': "delete rows",
+  'formdesigner.list_help': "The list of rows shows the columns ticked \"In the list\"; without any, the form only adds rows.",
+  'formdesigner.save_form': "Save form",
+  'formdesigner.delete_form': "Delete form",
+  'formdesigner.delete_form_confirm': "Delete the form \"{name}\"? The rows it saved stay.",
+  'formdesigner.form_saved': "Form \"{name}\" saved.",
+  'formdesigner.form_deleted': "Form deleted.",
+  'formdesigner.name_required': "Give the form a name.",
+  'formdesigner.no_fields': "Put at least one column on the form.",
+  'formdesigner.changed_by': "changed by {user} on {date}",
   // AI assistant region and natural-language report filters (assistant.ts, ai-filter.ts)
   'assistant.conversation': "Conversation",
   'assistant.you': "You",
@@ -799,6 +861,7 @@ const nl: Record<MessageKey, string> = {
   'common.back': 'Terug',
   'common.home': 'Naar de startpagina',
   'common.skip': 'Naar de inhoud',
+  'common.back_to_top': "Naar boven",
   'common.toggle_nav': 'Navigatie tonen of verbergen',
   'common.dismiss': 'Sluiten',
   'error.not_found': 'Niet gevonden',
@@ -1123,6 +1186,9 @@ const nl: Record<MessageKey, string> = {
   'facets.stars_up': '{n} sterren of meer',
   'facets.star_up': '1 ster of meer',
   'facets.clear_short': 'Wissen',
+  'facets.menu': 'Opties van {facet}',
+  'facets.sort_count': 'Sorteren op aantal',
+  'facets.sort_name': 'Sorteren op naam',
   'facets.show_all': 'Alle tonen ({n})',
   'facets.total': 'Totaal aantal rijen {n}',
   'smart.placeholder': 'Zoeken of filteren…',
@@ -1417,6 +1483,64 @@ const nl: Record<MessageKey, string> = {
   'reporter.changed': "gewijzigd {date}",
   'reporter.no_match': "Geen rapporten gevonden.",
   'reporter.chart_tag': "grafiek",
+  // Form Designer (form-designer.ts)
+  'formdesigner.no_sources': "Voor deze regio zijn nog geen tabellen ingesteld.",
+  'formdesigner.no_forms': "Er zijn nog geen formulieren.",
+  'formdesigner.new': "Nieuw formulier",
+  'formdesigner.create': "Ontwerpen",
+  'formdesigner.draft': "Concept",
+  'formdesigner.design': "Formulier ontwerpen",
+  'formdesigner.design_of': "Ontwerp van {name}",
+  'formdesigner.back': "Alle formulieren",
+  'formdesigner.add': "Toevoegen",
+  'formdesigner.edit_row': "Bewerken",
+  'formdesigner.rows': "Rijen van {form}",
+  'formdesigner.save': "Opslaan",
+  'formdesigner.delete': "Verwijderen",
+  'formdesigner.delete_confirm': "Deze rij verwijderen?",
+  'formdesigner.cancel': "Annuleren",
+  'formdesigner.saved_row': "Opgeslagen.",
+  'formdesigner.deleted_row': "Verwijderd.",
+  'formdesigner.required': "{field} is verplicht.",
+  'formdesigner.not_in_list': "{field}: kies een waarde uit de lijst.",
+  'formdesigner.changed': "Iemand anders heeft deze rij intussen gewijzigd. Controleer haar en sla opnieuw op.",
+  'formdesigner.row_not_found': "Deze rij bestaat niet, of je mag haar niet zien.",
+  'formdesigner.not_allowed': "Dat mag je met deze rij niet doen.",
+  'formdesigner.form_not_found': "Dit formulier bestaat niet (meer).",
+  'formdesigner.unknown_source': "De tabel van dit formulier wordt niet meer aangeboden.",
+  'formdesigner.nothing': "Dit formulier heeft nog geen velden.",
+  'formdesigner.choose': "- Kies -",
+  'formdesigner.name': "Naam",
+  'formdesigner.description': "Omschrijving",
+  'formdesigner.published': "Gepubliceerd: iedereen die deze pagina kan zien mag het formulier gebruiken",
+  'formdesigner.fields': "Velden",
+  'formdesigner.field_on': "Op het formulier",
+  'formdesigner.column': "Kolom",
+  'formdesigner.key': "sleutel",
+  'formdesigner.order': "Volgorde",
+  'formdesigner.label': "Label",
+  'formdesigner.help': "Helptekst",
+  'formdesigner.required_short': "Verplicht",
+  'formdesigner.display': "Weergave",
+  'formdesigner.default': "Standaard",
+  'formdesigner.in_list': "In de lijst",
+  'formdesigner.display_auto': "Veld",
+  'formdesigner.display_textarea': "Tekstvak",
+  'formdesigner.display_select': "Keuzelijst",
+  'formdesigner.display_radio': "Keuzerondjes",
+  'formdesigner.actions': "Gebruikers mogen",
+  'formdesigner.allow_insert': "rijen toevoegen",
+  'formdesigner.allow_update': "rijen wijzigen",
+  'formdesigner.allow_delete': "rijen verwijderen",
+  'formdesigner.list_help': "De lijst met rijen toont de kolommen met een vinkje bij \"In de lijst\"; zonder vinkjes voegt het formulier alleen rijen toe.",
+  'formdesigner.save_form': "Formulier opslaan",
+  'formdesigner.delete_form': "Formulier verwijderen",
+  'formdesigner.delete_form_confirm': "Het formulier \"{name}\" verwijderen? De rijen die ermee zijn opgeslagen blijven bestaan.",
+  'formdesigner.form_saved': "Formulier \"{name}\" opgeslagen.",
+  'formdesigner.form_deleted': "Formulier verwijderd.",
+  'formdesigner.name_required': "Geef het formulier een naam.",
+  'formdesigner.no_fields': "Zet minstens één kolom op het formulier.",
+  'formdesigner.changed_by': "gewijzigd door {user} op {date}",
   // AI assistant region and natural-language report filters (assistant.ts, ai-filter.ts)
   'assistant.conversation': "Gesprek",
   'assistant.you': "Jij",

package/src/metadata.ts

@@ -98,6 +98,8 @@ export interface App {
   availability_users: string[];
   /** (084) users can send feedback from the navigation bar */
   feedback: boolean;
+  /** (107) the application's version (Release 1.0), shown in its pages' footer */
+  version: string | null;
   /** (085) schema.function(jsonb) returns jsonb that rewrites error messages; seconds of the session timeout warning */
   error_function: string | null;
   session_warning_seconds: number;
@@ -146,7 +148,7 @@ export interface Region {
   title: string | null;
   /** (0.31, 073) optional, unique on the page */
   static_id?: string | null;
-  type: 'login' | 'report' | 'form' | 'chart' | 'cards' | 'static' | 'grid' | 'calendar' | 'dynamic' | 'facets' | 'tasks' | 'workflows' | 'map' | 'tree' | 'template_component' | 'smart_filters' | 'display_selector' | 'list' | 'data_reporter' | 'ai_assistant' | 'plugin' | 'url' | 'search';
+  type: 'login' | 'report' | 'form' | 'chart' | 'cards' | 'static' | 'grid' | 'calendar' | 'dynamic' | 'facets' | 'tasks' | 'workflows' | 'map' | 'tree' | 'template_component' | 'smart_filters' | 'display_selector' | 'list' | 'data_reporter' | 'ai_assistant' | 'plugin' | 'url' | 'search' | 'form_designer';
   source: string | null;
   table_name: string | null;
   pk_column: string | null;
@@ -359,7 +361,7 @@ const agg = (table: string, fk: string, parent: string, appId: string) =>
 // No caching on purpose: edits made in the builder show up on the next request.
 export async function loadApp(alias: string) {
   return runtime.one<App>(
-    `select a.id, a.alias, a.name, a.home_page, a.authentication, a.access_control, a.sso_providers, a.local_login, a.remember_me_days, a.login_page, a.password_reset, a.session_group, a.ldap_directories, a.header_name, a.header_auto_create, a.logout_url, a.db_auth_roles, a.db_auth_member_of, a.custom_auth_function, a.custom_auth_code, a.custom_auth_post_code, a.nav_list, a.navbar_list, a.pwa, a.pwa_short_name, a.pwa_icon is not null as pwa_has_icon, a.pwa_offline_pages, a.pwa_offline_submit, a.pwa_push, a.db_role, a.debug, a.debug_level, a.theme,
+    `select a.id, a.alias, a.name, a.version, a.home_page, a.authentication, a.access_control, a.sso_providers, a.local_login, a.remember_me_days, a.login_page, a.password_reset, a.session_group, a.ldap_directories, a.header_name, a.header_auto_create, a.logout_url, a.db_auth_roles, a.db_auth_member_of, a.custom_auth_function, a.custom_auth_code, a.custom_auth_post_code, a.nav_list, a.navbar_list, a.pwa, a.pwa_short_name, a.pwa_icon is not null as pwa_has_icon, a.pwa_offline_pages, a.pwa_offline_submit, a.pwa_push, a.db_role, a.debug, a.debug_level, a.theme,
             a.availability, a.availability_message, a.availability_users, a.feedback, a.error_function, a.session_warning_seconds, a.component_settings,
             a.language, a.languages, a.language_from, a.date_format, a.timestamp_format, a.time_zone, a.time_zone_auto, a.currency,
             coalesce((select jsonb_agg(jsonb_build_object('name', l.name, 'query', l.query, 'rest_source', l.rest_source)) from meta.lov l where l.app_id = a.id), '[]') as lovs,

package/src/runtime/devbar.ts

@@ -97,7 +97,7 @@ export function devbarHtml(ctx: PageContext): Raw | '' {
     <nav aria-label="Developer toolbar"><ul class="devbar-tools">
       ${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(`${BUILDER}/apps/${ctx.app.id}/pages/${page}`, `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}">

package/src/runtime/facet-state.ts

@@ -174,7 +174,10 @@ export const isFacetParam = (reportId: number, name: string) => Object.values(fa
  * The facet filters on a report that its facets allow (except those on one
  * column: a facet's own counts ignore its own selection).
  */
-export function facetFilters(params: URLSearchParams, reportId: number, defs: Map<string, FacetDef>, except?: string): FacetFilter[] {
+/** (sprint 84) Reads a custom range's bound typed in the application's date format as YYYY-MM-DD (null: not a date in it). */
+export type DateReader = (text: string) => string | null;
+
+export function facetFilters(params: URLSearchParams, reportId: number, defs: Map<string, FacetDef>, except?: string, readDate?: DateReader): FacetFilter[] {
   const k = facetKeys(reportId);
   const out: FacetFilter[] = [];
   for (const def of defs.values()) {
@@ -194,8 +197,10 @@ export function facetFilters(params: URLSearchParams, reportId: number, defs: Ma
       const r = parseRange(chosen);
       if (r && def.ranges.some((x) => x.from === r.from && x.to === r.to)) out.push({ column, kind: 'range', from: r.from, to: r.to, custom: false });
     } else if (def.custom) {
-      const from = (params.get(k.from + column) ?? '').trim();
-      const to = (params.get(k.to + column) ?? '').trim();
+      // (sprint 84) a date bound in the date format is read as YYYY-MM-DD; a number stays as it is
+      const bound = (v: string) => (v && readDate && !/^-?\d+(\.\d+)?$/.test(v) ? (readDate(v) ?? v) : v);
+      const from = bound((params.get(k.from + column) ?? '').trim());
+      const to = bound((params.get(k.to + column) ?? '').trim());
       if ((from || to) && anyBound(from) && anyBound(to)) out.push({ column, kind: 'range', from, to, custom: true });
     }
   }
@@ -235,8 +240,8 @@ export function rangeSql(c: string, oid: number | undefined, r: { from: string;
 }
 
 /** The conditions of all applicable filters. */
-export function facetWhere(params: URLSearchParams, reportId: number, defs: Map<string, FacetDef>, cols: Map<string, number>, p: SqlParams, except?: string): string[] {
-  return facetFilters(params, reportId, defs, except)
+export function facetWhere(params: URLSearchParams, reportId: number, defs: Map<string, FacetDef>, cols: Map<string, number>, p: SqlParams, except?: string, readDate?: DateReader): string[] {
+  return facetFilters(params, reportId, defs, except, readDate)
     .map((f) => facetFilterSql(f, cols, p))
     .filter((s): s is string => s !== null);
 }

package/src/runtime/facets.ts

@@ -4,7 +4,7 @@ import { savepoint } from '../db.ts';
 import { html, raw, type Raw } from '../html.ts';
 import type { Region } from '../metadata.ts';
 import { bindValues, publicError, stripSemicolon, toState, type PageContext } from './context.ts';
-import { heading } from './items.ts';
+import { appDateMask, appDateReader, dateField, heading } from './items.ts';
 import { fieldsOf, regionUrl } from './report.ts';
 import { renderChartBody } from './charts.ts';
 import {
@@ -54,7 +54,7 @@ const col = (name: string) => `"__q".${pg.escapeIdentifier(name)}`;
 
 /** The search and every other facet's filter, as conditions (their values in p). */
 function othersWhere(ctx: PageContext, fs: FacetSource, except: string, p: SqlParams, withSearch = true) {
-  const where = facetWhere(ctx.params, fs.report.id, fs.all, fs.cols, p, except);
+  const where = facetWhere(ctx.params, fs.report.id, fs.all, fs.cols, p, except, appDateReader(ctx));
   if (withSearch && fs.search) where.unshift(searchSql(fs.search, p, hidesColumns(fs.report) ? userColumnNames(fs.report, [...fs.cols.keys()]) : undefined));
   return where;
 }
@@ -99,6 +99,9 @@ export async function rangeCounts(ctx: PageContext, fs: FacetSource, f: FacetDef
   return res.rows[0] as number[];
 }
 
+/** (sprint 84) The URL parameter of a checkbox facet's order: "name", else by count. Not a filter: Apply and Reset keep it. */
+export const facetSortKey = (reportId: number, column: string) => `r${reportId}_fo_${column}`;
+
 /** (sprint 78) Checkbox facet values shown before "Show all" (APEX shows seven). */
 export const FACET_SHOWN = 7;
 
@@ -141,13 +144,28 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
   const k = facetKeys(report.id);
   const formId = `ff${r.id}`;
   const defs = facetDefs(r.config).filter((f) => fs.cols.has(f.column));
-  const active = new Set(facetFilters(ctx.params, report.id, fs.all).map((f) => f.column));
+  const active = new Set(facetFilters(ctx.params, report.id, fs.all, undefined, appDateReader(ctx)).map((f) => f.column));
   const groups: Raw[] = [];
   const clearLink = (f: FacetDef) =>
     active.has(f.column)
       ? html` <a class="facet-clear" href="${regionUrl(ctx, report, (p) => { for (const n of facetParamNames(report.id, f.column)) p.delete(n); p.delete(`r${report.id}_p`); })}" aria-label="${t('facets.clear_one', { facet: facetLabel(ctx, f) })}">${t('facets.clear_short')}</a>`
       : '';
 
+  // (sprint 84; APEX: a facet's ⋮ menu) Clear, and the values sorted by count or by name; links, so it works without JavaScript
+  const facetMenu = (f: FacetDef, label: string, byName: boolean) => {
+    const sortHref = (by: 'count' | 'name') => regionUrl(ctx, report, (p) => {
+      if (by === 'name') p.set(facetSortKey(report.id, f.column), 'name');
+      else p.delete(facetSortKey(report.id, f.column));
+    });
+    const current = (on: boolean) => (on ? raw(' aria-current="true"') : '');
+    return html`<details class="menu facet-menu"><summary aria-label="${t('facets.menu', { facet: label })}"><span aria-hidden="true">⋮</span></summary>
+      <div class="menu-panel"><div class="menu-section menu-links">
+        ${active.has(f.column) ? html`<a href="${regionUrl(ctx, report, (p) => { for (const n of facetParamNames(report.id, f.column)) p.delete(n); p.delete(`r${report.id}_p`); })}">${t('facets.clear_short')}</a>` : ''}
+        <a href="${sortHref('count')}"${current(!byName)}>${t('facets.sort_count')}</a>
+        <a href="${sortHref('name')}"${current(byName)}>${t('facets.sort_name')}</a>
+      </div></div></details>`;
+  };
+
   // the search facet: the report's own search, in the facet panel
   if (r.config.search === true) {
     groups.push(html`<div class="facet facet-search">
@@ -169,10 +187,13 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
       const selected = new Set(ctx.params.getAll(k.values + f.column));
       // 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 });
+      // (sprint 84; APEX: the facet's menu) the values by count (the query's order) or by name
+      const byName = ctx.params.get(facetSortKey(report.id, f.column)) === 'name';
       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) ?? ''));
+      if (byName) values.sort((a, b) => shown(a.v).localeCompare(shown(b.v), ctx.locale.lang, { numeric: true, sensitivity: 'base' }));
       const chart = facetChart(ctx, report, f, label, values.map((x) => ({
         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); },
@@ -181,7 +202,7 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
         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>
+        <legend>${label}${clearLink(f)}</legend>${facetMenu(f, label, byName)}
         ${chart}
         ${values.slice(0, FACET_SHOWN).map(value)}
         ${values.length > FACET_SHOWN
@@ -219,7 +240,10 @@ export async function renderFacets(ctx: PageContext, r: Region): Promise<Raw> {
     const fid = `${formId}_${f.column.replace(/[^A-Za-z0-9_]/g, '_')}`;
     const input = (which: 'from' | 'to', value: string) =>
       html`<label class="sr-only" for="${fid}_${which}">${label}: ${t(`facets.${which}`)}</label>
-        <input id="${fid}_${which}" type="${kind === 'date' ? 'date' : 'number'}"${kind === 'number' ? raw(' step="any"') : ''} form="${formId}" name="${which === 'from' ? k.from : k.to}${f.column}" value="${isCustom ? value : ''}" placeholder="${t(`facets.${which}`)}">`;
+        ${kind === 'date'
+          // (sprint 84) a date in the application's date format, with pgkiln's date picker
+          ? dateField(ctx, { id: `${fid}_${which}`, iso: isCustom ? value : '', mask: appDateMask(ctx), attrs: html` form="${formId}" name="${which === 'from' ? k.from : k.to}${f.column}"` })
+          : html`<input id="${fid}_${which}" type="number" step="any" form="${formId}" name="${which === 'from' ? k.from : k.to}${f.column}" value="${isCustom ? value : ''}" placeholder="${t(`facets.${which}`)}">`}`;
     const rangeChart = facetChart(ctx, report, f, label, f.ranges.map((x, i) => ({
       label: f.type === 'star' ? ctx.locale.t(Number(x.from) === 1 ? 'facets.star_up' : 'facets.stars_up', { n: String(x.from) }) : rangeLabel(x, t),
       n: counts![i],