pgkiln 0.84.0 → 0.86.0

package/src/builder/workspace-transfer.ts

@@ -7,9 +7,10 @@ import { html } from '../html.ts';
 import { icon } from '../icons.ts';
 import { readMultipart } from '../runtime/files.ts';
 import { clientIp, logActivity, type Session } from '../session.ts';
-import { describeWorkspaceFile, exportWorkspace, importWorkspace, PART_LABELS, PARTS, type Part } from '../workspace-export.ts';
+import { describeWorkspaceFile, exportWorkspace, importWorkspace, PARTS, type Part } from '../workspace-export.ts';
 import { back, BASE, csrf, developer, flash, region, send, shell, type Body, type Req } from './ui.ts';
 import { currentWorkspace, workspaceAdmin } from './workspaces.ts';
+import { scopedTx as tx, type BuilderKey } from './i18n.ts';
 
 // Workspace utilities → Export / import (APEX: Workspace Utilities → Export):
 // the current workspace's components as one file, and such a file imported
@@ -19,7 +20,14 @@ import { currentWorkspace, workspaceAdmin } from './workspaces.ts';
 
 const RESULT = '__WS_IMPORT_RESULT';
 const page = `${BASE}/workspace-export`;
-const crumbs: [string, string?][] = [['App Builder', BASE], ['Workspace utilities', `${BASE}/utilities`], ['Export and import']];
+const crumbs = (): [string, string?][] => [[tx('rail.app_builder'), BASE], [tx('wu.title'), `${BASE}/utilities`], [tx('wu.export')]];
+/** The kinds of component in the developer's language (PART_LABELS in English: src/workspace-export.ts). */
+const PART_KEYS: Record<Part, BuilderKey> = {
+  settings: 'wtr.part.settings', developers: 'wtr.part.developers', app_groups: 'wtr.part.app_groups', extension_links: 'wtr.part.extension_links',
+  rest_catalogs: 'wtr.part.rest_catalogs', sql_scripts: 'wtr.part.sql_scripts', blueprints: 'wtr.part.blueprints', data_generators: 'wtr.part.data_generators',
+  datasets: 'wtr.part.datasets', team: 'wtr.part.team', workspace_files: 'wtr.part.workspace_files', remote_servers: 'wtr.part.remote_servers',
+  web_credentials: 'wtr.part.web_credentials',
+};
 const MAX_MB = 20;
 
 let version: string | null | undefined;
@@ -41,16 +49,16 @@ const chosen = (b: Body | undefined): Part[] => {
 
 async function adminOr403(s: Session, reply: FastifyReply) {
   if (s.workspace && (await workspaceAdmin(s.username, s.workspace.id))) return true;
-  await send(reply.code(403), s, shell(s, 'Export and import', crumbs, html`<h1 class="u-mb1">Export and import</h1>
-    <div class="alert alert-error" role="alert">Only administrators and the workspace's administrators export or import a workspace's components.</div>`));
+  await send(reply.code(403), s, shell(s, tx('wu.export'), crumbs(), html`<h1 class="u-mb1">${tx('wu.export')}</h1>
+    <div class="alert alert-error" role="alert">${tx('wtr.admins_only')}</div>`));
   return false;
 }
 
 const partBoxes = (counts?: Partial<Record<Part, number>>) =>
-  html`<fieldset class="field" data-wide><legend class="label">Components</legend>${PARTS.map((p) =>
+  html`<fieldset class="field" data-wide><legend class="label">${tx('wtr.components')}</legend>${PARTS.map((p) =>
     counts && counts[p] === undefined
       ? ''
-      : html`<label class="check"><input type="checkbox" name="part" value="${p}" checked> ${PART_LABELS[p]}${counts ? html` <span class="muted">(${p === 'settings' ? 'in the file' : p === 'team' ? `${counts[p]} issue(s)` : counts[p]})</span>` : ''}</label>`)}</fieldset>`;
+      : html`<label class="check"><input type="checkbox" name="part" value="${p}" checked> ${tx(PART_KEYS[p])}${counts ? html` <span class="muted">(${p === 'settings' ? tx('wtr.in_file') : p === 'team' ? tx('wtr.issues', { n: counts[p] }) : counts[p]})</span>` : ''}</label>`)}</fieldset>`;
 
 export async function workspaceTransferRoutes(app: FastifyInstance) {
   app.get(page, async (req: Req, reply) => {
@@ -59,22 +67,22 @@ export async function workspaceTransferRoutes(app: FastifyInstance) {
     const result = s.state[RESULT] ? (JSON.parse(s.state[RESULT]!) as string[]) : null;
     delete s.state[RESULT];
     const name = s.workspace!.name;
-    const main = html`<div class="title-row"><h1>Export and import</h1></div>
-      <p class="muted u-mt0">The components of the workspace ${name} as one file: to copy them to another workspace or installation, or to keep them with your applications' files. Applications are exported on their own (App Builder → an application → Export).</p>
-      ${result ? html`<div class="alert alert-success" role="status"><b>Imported into ${name}:</b><ul>${result.map((l) => html`<li>${l}</li>`)}</ul></div>` : ''}
-      ${region('Export', html`<form method="post" action="${page}">${csrf(s)}
+    const main = html`<div class="title-row"><h1>${tx('wu.export')}</h1></div>
+      <p class="muted u-mt0">${tx('wtr.intro', { name })}</p>
+      ${result ? html`<div class="alert alert-success" role="status"><b>${tx('wtr.imported_into', { name })}</b><ul>${result.map((l) => html`<li>${l}</li>`)}</ul></div>` : ''}
+      ${region(tx('wtr.export'), html`<form method="post" action="${page}">${csrf(s)}
         ${partBoxes()}
-        <p class="muted">Not in the file: the workspace's name, its isolation and database roles, passwords and secrets, script runs and other history.</p>
-        <div class="buttons"><button class="btn btn-hot">${icon('download')} Export</button></div></form>`)}
-      ${region('Import', html`<form method="post" action="${BASE}/workspace-import" enctype="multipart/form-data">${csrf(s)}
-        <p class="muted u-mt0">A file exported from a workspace, imported into <b>${name}</b>. Nothing is deleted; developers are added only when this installation has a developer of that name.</p>
+        <p class="muted">${tx('wtr.not_in_file')}</p>
+        <div class="buttons"><button class="btn btn-hot">${icon('download')} ${tx('wtr.export')}</button></div></form>`)}
+      ${region(tx('wtr.import'), html`<form method="post" action="${BASE}/workspace-import" enctype="multipart/form-data">${csrf(s)}
+        <p class="muted u-mt0">${tx.rich('wtr.import_intro', { name: html`<b>${name}</b>` })}</p>
         <div class="form-grid">
-          <div class="field" data-wide><label class="label" for="f_file">Workspace file</label><input id="f_file" type="file" name="file" accept=".json,application/json" required></div>
+          <div class="field" data-wide><label class="label" for="f_file">${tx('wtr.file')}</label><input id="f_file" type="file" name="file" accept=".json,application/json" required></div>
           ${partBoxes()}
-          <div class="field" data-wide><label class="check"><input type="checkbox" name="replace" value="true"> Replace components with the same name (otherwise this workspace's own are kept)</label></div>
+          <div class="field" data-wide><label class="check"><input type="checkbox" name="replace" value="true"> ${tx('wtr.replace')}</label></div>
         </div>
-        <div class="buttons"><button class="btn">${icon('upload')} Import</button></div></form>`)}`;
-    return send(reply, s, shell(s, 'Export and import', crumbs, main));
+        <div class="buttons"><button class="btn">${icon('upload')} ${tx('wtr.import')}</button></div></form>`)}`;
+    return send(reply, s, shell(s, tx('wu.export'), crumbs(), main));
   });
 
   app.post(page, async (req: Req, reply) => {
@@ -82,7 +90,7 @@ export async function workspaceTransferRoutes(app: FastifyInstance) {
     if (!s || !(await adminOr403(s, reply))) return;
     const parts = chosen(req.body);
     if (!parts.length) {
-      flash(s, 'Choose at least one kind of component.', 'error');
+      flash(s, tx('wtr.choose_part'), 'error');
       return back(reply, s, page);
     }
     const doc = await exportWorkspace(currentWorkspace(s), parts, { version: pgkilnVersion() ?? undefined, by: s.username });
@@ -104,23 +112,23 @@ export async function workspaceTransferRoutes(app: FastifyInstance) {
     const s = await developer(req, reply);
     if (!s || !(await adminOr403(s, reply))) return;
     try {
-      if (tooBig) throw new Error(`The file is larger than ${MAX_MB} MB.`);
-      if (!text.trim()) throw new Error('Choose a workspace file.');
+      if (tooBig) throw new Error(tx('wtr.too_big', { n: MAX_MB }));
+      if (!text.trim()) throw new Error(tx('wtr.choose_file'));
       let doc: unknown;
       try {
         doc = JSON.parse(text);
       } catch {
-        throw new Error('The file is not valid JSON.');
+        throw new Error(tx('wtr.not_json'));
       }
       describeWorkspaceFile(doc);
       const parts = chosen(req.body);
-      if (!parts.length) throw new Error('Choose at least one kind of component.');
+      if (!parts.length) throw new Error(tx('wtr.choose_part'));
       const ws = currentWorkspace(s);
       const result = await owner.tx((c) => importWorkspace(c, ws, doc, parts, { replace: req.body?.replace === 'true', by: s.username }));
       await logActivity({ appId: null, username: s.username, event: 'workspace', ip: clientIp(req), detail: `imported into workspace ${ws}: ${result.added} added, ${result.replaced} replaced, ${result.skipped} kept` });
       s.state[RESULT] = JSON.stringify(result.lines);
     } catch (e) {
-      flash(s, `Import failed, nothing was changed: ${friendly(e)}`, 'error');
+      flash(s, tx('wtr.failed', { reason: friendly(e) }), 'error');
     }
     return back(reply, s, page);
   });
@@ -129,8 +137,8 @@ export async function workspaceTransferRoutes(app: FastifyInstance) {
 /** A database refusal in words (the transaction rolled back). */
 function friendly(e: unknown) {
   const err = e as { message: string; constraint?: string; table?: string; code?: string };
-  if (err.code === '23514' || err.code === '23502' || err.code === '22P02') return `the file has a value this installation refuses (${err.table ?? ''}${err.constraint ? `: ${err.constraint}` : ''}).`;
-  if (err.code === '23505') return `the file has two components with the same name (${err.constraint ?? err.table ?? ''}).`;
+  if (err.code === '23514' || err.code === '23502' || err.code === '22P02') return tx('wtr.refused_value', { detail: `${err.table ?? ''}${err.constraint ? `: ${err.constraint}` : ''}` });
+  if (err.code === '23505') return tx('wtr.duplicate', { detail: err.constraint ?? err.table ?? '' });
   return err.message;
 }
 

package/src/runtime/engine.ts

@@ -301,9 +301,10 @@ export async function validate(ctx: PageContext) {
     };
     try {
       const outcome = await validationPasses(ctx, v, value);
-      if (outcome !== true) report(typeof outcome === 'string' ? outcome : v.message);
+      // (166) &ITEM. in the message, as in APEX (plain text: the message is escaped where it is shown)
+      if (outcome !== true) report(typeof outcome === 'string' ? outcome : substitute(v.message, ctx, (x) => x));
     } catch (e) {
-      report(`${v.message} (${await publicError(ctx, e, `validation ${v.name}`)})`);
+      report(`${substitute(v.message, ctx, (x) => x)} (${await publicError(ctx, e, `validation ${v.name}`)})`);
     }
   }
 
@@ -683,7 +684,9 @@ export async function runProcesses(ctx: PageContext, point: 'submit' | 'load') {
       continue;
     }
     const msg = await runOne(ctx, p, names, 0);
-    if (msg) messages.push(msg);
+    // (166) &ITEM. in a success message, with the values after the process (a new row's key, say), as in APEX;
+    // once here, so a chain's messages (joined by runOne) are filled in once
+    if (msg) messages.push(substitute(msg, ctx, (x) => x));
   }
   return messages;
 }

package/src/runtime/lists.ts

@@ -231,9 +231,9 @@ export function navbarMarkup(nodes: ListNode[], label: string, live?: string): R
   if (!nodes.length) return raw('');
   return html`<nav class="t-navbar" aria-label="${label}"><ul>${nodes.map((n) =>
     n.children.length
-      ? html`<li><details class="menu"><summary${hasIcon(n) ? html` class="nb-icon" aria-label="${n.label}"` : ''}>${icon(n.icon)}<span>${n.label}</span>${badge(n, live)}</summary><div class="menu-panel align-right"><ul class="t-navbar-menu">${
+      ? html`<li><details class="menu"><summary${hasIcon(n) ? html` class="nb-icon"` : ''}>${icon(n.icon)}<span>${n.label}</span>${badge(n, live)}</summary><div class="menu-panel align-right"><ul class="t-navbar-menu">${
           [...(n.href ? [n] : []), ...n.children].map((c) => html`<li><a ${linkAttrs(c)}>${icon(c.icon)}<span>${c.label}</span>${badge(c, live)}</a></li>`)}</ul></div></details></li>`
-      : html`<li><a ${linkAttrs(n, hasIcon(n) ? 'nb-icon' : undefined)}${hasIcon(n) ? html` aria-label="${n.label}"` : ''}>${icon(n.icon)}<span>${n.label}</span>${badge(n, live)}</a></li>`)}</ul></nav>`;
+      : html`<li><a ${linkAttrs(n, hasIcon(n) ? 'nb-icon' : undefined)}>${icon(n.icon)}<span>${n.label}</span>${badge(n, live)}</a></li>`)}</ul></nav>`;
 }
 
 function linksMarkup(nodes: ListNode[]): Raw {

package/src/runtime/push.ts

@@ -12,6 +12,8 @@ import { loadContext, type Req } from './routes.ts';
 // action push_subscribe: both after a click, as browsers require) and posts
 // it here. The application's public key reaches the page as data-push.
 
+let pushKeyWarned = false;
+
 /** Whether the app offers notifications. */
 export const pushOn = (a: Pick<App, 'pwa' | 'pwa_push'>) => a.pwa && a.pwa_push;
 
@@ -22,7 +24,11 @@ export async function pushBody(a: Pick<App, 'id' | 'pwa' | 'pwa_push'>, username
     return { 'data-push': await appPublicKey(a.id), 'data-push-user': username.toLowerCase() };
   } catch (e) {
     // no key yet and no PGKILN_SECRET_KEY to store one: the page works, without notifications
-    console.error('push notifications:', (e as Error).message);
+    // (166) said once per server, not on every page
+    if (!pushKeyWarned) {
+      pushKeyWarned = true;
+      console.error('push notifications:', (e as Error).message);
+    }
     return {};
   }
 }

package/src/runtime/regions.ts

@@ -481,9 +481,12 @@ async function regionShell(ctx: PageContext, r: Region, hidden: Set<string>, bod
     </dialog>`;
 
   const header = html`<h2 id="${titleId}">${r.title}</h2>${buttonsOnTop ? buttons : ''}`;
+  // (166) the header buttons sit beside the summary, not in it: a summary is the toggle, and a button inside it is
+  // nested interactive content (axe); they come first so they are reached before the region's body
   if (r.template === 'collapsible')
-    return html`<section class="${cls}" id="R${r.id}"${staticAttr}${hiddenAttr} aria-labelledby="${titleId}">
-      <details open><summary class="region-header">${header}</summary>
+    return html`<section class="${cls}${buttonsOnTop && buttons ? ' has-header-buttons' : ''}" id="R${r.id}"${staticAttr}${hiddenAttr} aria-labelledby="${titleId}">
+      ${buttonsOnTop && buttons ? html`<div class="region-header-buttons">${buttons}</div>` : ''}
+      <details open><summary class="region-header"><h2 id="${titleId}">${r.title}</h2></summary>
         <div class="region-body"${scrollable(r)}>${body}</div>
         ${!buttonsOnTop && buttons ? html`<footer class="region-footer">${buttons}</footer>` : ''}
       </details></section>`;
@@ -518,9 +521,11 @@ async function slottedShell(ctx: PageContext, r: Region, hidden: Set<string>, bo
     return html`<section class="${cls}" id="R${r.id}"${staticAttr}${hiddenAttr} aria-label="${r.title}">
       ${top ? html`<div class="region-toolbar">${top}</div>` : ''}${body}${footer}</section>`;
   const header = html`<h2 id="${titleId}">${r.title}</h2>${top}`;
+  // (166) as above: the header buttons beside the summary, not in it
   if (r.template === 'collapsible')
-    return html`<section class="${cls}" id="R${r.id}"${staticAttr}${hiddenAttr} aria-labelledby="${titleId}">
-      <details open><summary class="region-header">${header}</summary><div class="region-body"${scrollable(r)}>${body}</div>${footer}</details></section>`;
+    return html`<section class="${cls}${top ? ' has-header-buttons' : ''}" id="R${r.id}"${staticAttr}${hiddenAttr} aria-labelledby="${titleId}">
+      ${top ? html`<div class="region-header-buttons">${top}</div>` : ''}
+      <details open><summary class="region-header"><h2 id="${titleId}">${r.title}</h2></summary><div class="region-body"${scrollable(r)}>${body}</div>${footer}</details></section>`;
   return html`<section class="${cls}" id="R${r.id}"${staticAttr}${hiddenAttr}${r.title ? raw(` aria-labelledby="${titleId}"`) : ''}>
     ${r.title || top ? html`<header class="region-header">${header}</header>` : ''}
     <div class="region-body"${scrollable(r)}>${body}</div>${footer}