pgkiln 0.82.0 → 0.83.0

package/src/builder/i18n.ts

@@ -6,12 +6,14 @@
 // A page gets its translator from the session: `const tx = tr(s)`, then `tx('rail.app_builder')`, or with
 // {placeholders}: `tx('ab.count', { n: 3 })`. The result is plain text: the html`` tag escapes it like any value.
 // `tx.rich()` puts markup (links) into a sentence: the message is escaped, Raw parameters are kept.
+// `tx.code()` (sprint 162): a sentence whose `backticked` parts are code (syntax help).
 // `tx.dyn()` takes a key made at run time (a region type's gallery label, a SQL Workshop tool) with a fallback.
 // A text that is not keyed yet simply stays English. Moving a screen over: docs/guide/12-development.md.
 //
 // The developer's choice: meta.developer.language (migration 127), copied into the session (__BLANG) at sign-in;
 // before signing in, the sign-in page's language links set a cookie (LANG_COOKIE). See language.ts.
 
+import { AsyncLocalStorage } from 'node:async_hooks';
 import type { FastifyRequest } from 'fastify';
 import { esc, raw, Raw } from '../html.ts';
 import type { Session } from '../session.ts';
@@ -70,6 +72,8 @@ export interface BuilderTranslate {
   dyn(key: string, fallback: string, params?: Params): string;
   /** A sentence with markup: the message is escaped, string parameters too; Raw parameters (links) are kept. */
   rich(key: BuilderKey, params: Record<string, string | number | Raw>): Raw;
+  /** (sprint 162) A sentence with `code` in backticks: escaped, each `…` becomes <code>…</code> (syntax help, settings). */
+  code(key: BuilderKey, params?: Params): Raw;
   /** An English label passed around as text (a breadcrumb, a page title) in this language, when it is a known one. */
   label(text: string): string;
 }
@@ -117,6 +121,7 @@ export function builderTranslator(lang: BuilderLang, own: Readonly<Record<string
       const v = params[k];
       return v === undefined ? m : v instanceof Raw ? v.value : esc(v);
     }));
+  tx.code = (key, params) => raw(esc(fill(text(key) ?? key, params)).replace(/`([^`]+)`/g, '<code>$1</code>'));
   tx.label = (label) => (Object.hasOwn(LABELS, label) ? tx(LABELS[label]) : label);
   return tx;
 }
@@ -134,3 +139,16 @@ export const tr = (s: Pick<Session, 'state'> | null | undefined) => translatorFo
 
 /** For tests and the coverage check: the message files. */
 export const builderMessages = (lang: BuilderLang): Readonly<Record<string, string>> => MESSAGES[lang];
+
+// (sprint 162, CD-8) Long form builders (region and report settings) take the translator of the request being rendered
+// from the async context instead of a parameter on every helper: withTranslator(tr(s), () => build()), and inside,
+// scopedTx('key') like tx. Outside withTranslator it is English.
+const SCOPE = new AsyncLocalStorage<BuilderTranslate>();
+const current = () => SCOPE.getStore() ?? translatorFor('en');
+export const withTranslator = <T>(t: BuilderTranslate, fn: () => T): T => SCOPE.run(t, fn);
+export const scopedTx = ((key: BuilderKey, params?: Params) => current()(key, params)) as BuilderTranslate;
+Object.defineProperty(scopedTx, 'lang', { get: () => current().lang });
+scopedTx.dyn = (key, fallback, params) => current().dyn(key, fallback, params);
+scopedTx.rich = (key, params) => current().rich(key, params);
+scopedTx.code = (key, params) => current().code(key, params);
+scopedTx.label = (label) => current().label(label);

package/src/builder/object-actions.ts

@@ -6,6 +6,7 @@ import { readSchema } from '../ddl.ts';
 import { back, BASE, developer, flash, type Req } from './ui.ts';
 import { listObjects, objectDetail, OB_TYPES, SYSTEM_SCHEMAS, type Obj } from './object-browser.ts';
 import { usableSchemas, workshopDb } from './workspaces.ts';
+import { tr, translatorFor, type BuilderTranslate } from './i18n.ts';
 
 // (sprint 94, Database Actions DA-8) An object's menu in the SQL Worksheet's navigator and the Object Browser's
 // tree (Database Actions: the navigator's right-click menu): Open (the Object Browser's detail, in a panel beside
@@ -20,26 +21,26 @@ export type MenuObj = Pick<Obj, 'name' | 'ref'> & { type: Obj['type'] | 'policy'
 const RELATIONS = new Set(['table', 'view', 'matview']);
 
 /** The ⋯ menu of an object (works without JavaScript: a details menu of links). */
-export function objectMenu(schema: string, o: MenuObj): Raw {
+export function objectMenu(schema: string, o: MenuObj, tx: BuilderTranslate = translatorFor('en')): Raw {
   const q = (act: string) => `${BASE}/sql/objects/action?${new URLSearchParams({ schema, k: o.type, o: o.ref, ...(o.type === 'policy' || o.type === 'trigger' ? { n: o.name } : {}), do: act })}`;
   const open = `${BASE}/sql/objects?${new URLSearchParams(o.type === 'policy' ? { schema, k: 'table', o: o.ref, tab: 'rls' } : { schema, k: o.type, o: o.ref })}`;
   const item = (href: string, ic: string, label: string, extra = '') => html`<a href="${href}"${extra ? html` ${extra}` : ''}>${icon(ic)} ${label}</a>`;
   const table = o.type === 'table';
-  return html`<details class="menu obj-menu"><summary title="Actions for ${o.name}" aria-label="Actions for ${o.name}">⋯</summary>
+  return html`<details class="menu obj-menu"><summary title="${tx('oa.actions_for', { name: o.name })}" aria-label="${tx('oa.actions_for', { name: o.name })}">⋯</summary>
     <div class="menu-panel"><div class="menu-section menu-links">
-      ${o.type === 'policy' ? '' : html`<a href="${open}" data-obj-open="${`${BASE}/sql/objects/panel?${new URLSearchParams({ schema, k: o.type, o: o.ref })}`}">${icon('eye')} Open</a>`}
-      ${table ? item(`${BASE}/sql/objects/table?${new URLSearchParams({ schema, o: o.ref })}`, 'edit', 'Edit…') : ''}
-      ${table ? item(`${BASE}/sql/objects/table?${new URLSearchParams({ schema, template: o.ref })}`, 'copy', 'Use as template') : ''}
-      ${table ? item(`${BASE}/sql/objects/security?${new URLSearchParams({ o: o.ref })}`, 'shield', 'Security…') : ''}
-      ${table ? item(`${BASE}/sql/load`, 'upload', 'Load data') : ''}
-      ${table ? item(`${BASE}/sql/objects/fulltext?${new URLSearchParams({ o: o.ref })}`, 'search', 'Add full-text search…') : ''}
-      ${table ? item(`${BASE}/sql/objects/vector?${new URLSearchParams({ o: o.ref })}`, 'search', 'Add vector column…') : ''}
-      ${table ? item(`${BASE}/sql/objects/document?${new URLSearchParams({ o: o.ref })}`, 'file', 'Document view…') : ''}
-      ${table ? html`${item(q('index'), 'list', 'Add index')}${item(q('trigger'), 'bolt', 'Add trigger')}${item(q('policy'), 'shield', 'Add policy')}` : ''}
-      ${RELATIONS.has(o.type) ? item(`${BASE}/sql/rest/object?${new URLSearchParams({ schema, name: o.name })}`, 'globe', 'REST › Enable / Disable') : ''}
-      ${item(q('ddl'), 'code', 'Quick DDL to the worksheet')}
-      ${item(q('download'), 'download', 'Quick DDL as a file')}
-      ${item(q('drop'), 'trash', 'Drop…')}
+      ${o.type === 'policy' ? '' : html`<a href="${open}" data-obj-open="${`${BASE}/sql/objects/panel?${new URLSearchParams({ schema, k: o.type, o: o.ref })}`}">${icon('eye')} ${tx('oa.open')}</a>`}
+      ${table ? item(`${BASE}/sql/objects/table?${new URLSearchParams({ schema, o: o.ref })}`, 'edit', tx('oa.edit')) : ''}
+      ${table ? item(`${BASE}/sql/objects/table?${new URLSearchParams({ schema, template: o.ref })}`, 'copy', tx('oa.template')) : ''}
+      ${table ? item(`${BASE}/sql/objects/security?${new URLSearchParams({ o: o.ref })}`, 'shield', tx('oa.security')) : ''}
+      ${table ? item(`${BASE}/sql/load`, 'upload', tx('oa.load')) : ''}
+      ${table ? item(`${BASE}/sql/objects/fulltext?${new URLSearchParams({ o: o.ref })}`, 'search', tx('oa.fulltext')) : ''}
+      ${table ? item(`${BASE}/sql/objects/vector?${new URLSearchParams({ o: o.ref })}`, 'search', tx('oa.vector')) : ''}
+      ${table ? item(`${BASE}/sql/objects/document?${new URLSearchParams({ o: o.ref })}`, 'file', tx('oa.document')) : ''}
+      ${table ? html`${item(q('index'), 'list', tx('oa.index'))}${item(q('trigger'), 'bolt', tx('oa.trigger'))}${item(q('policy'), 'shield', tx('oa.policy'))}` : ''}
+      ${RELATIONS.has(o.type) ? item(`${BASE}/sql/rest/object?${new URLSearchParams({ schema, name: o.name })}`, 'globe', tx('oa.rest')) : ''}
+      ${item(q('ddl'), 'code', tx('oa.ddl'))}
+      ${item(q('download'), 'download', tx('oa.ddl_file'))}
+      ${item(q('drop'), 'trash', tx('oa.drop'))}
     </div></div></details>`;
 }
 
@@ -149,7 +150,8 @@ export async function objectActionRoutes(app: FastifyInstance) {
     }
     const sql = await draft(db, String(q.schema), o, act);
     s.state.__SQLDRAFT = sql ?? '';
-    flash(s, act === 'ddl' ? `The DDL of ${o.ref}.` : act === 'drop' ? 'Review the DROP statement and run it yourself: nothing has been dropped yet.' : 'Fill in the statement and run it: nothing has been changed yet.');
+    const tx = tr(s);
+    flash(s, act === 'ddl' ? tx('oa.flash.ddl', { name: o.ref }) : act === 'drop' ? tx('oa.flash.drop') : tx('oa.flash.fill'));
     return back(reply, s, `${BASE}/sql/worksheet`);
   });
 

package/src/builder/object-browser.ts

@@ -140,7 +140,7 @@ export async function objectBrowserRoutes(app: FastifyInstance) {
         if (!list.length && filter) return '';
         return html`<details class="ob-folder"${list.length && (filter || list.length <= 50 || selected?.type === t) ? raw(' open') : ''}>
           <summary>${icon(ic)}<span>${tx.dyn(`ob.type.${t}`, label)}</span><span class="kind">${list.length}</span></summary>
-          <ul class="tree">${list.map((o) => html`<li class="ob-item"><a href="${link({ k: o.type, o: o.ref })}"${selected === o ? raw(' aria-current="page"') : ''}>${icon(ic)}<span>${o.name}</span>${o.rls ? html`<span class="tag">RLS</span>` : ''}${o.ext ? html`<span class="tag">${tx('ob.extension')}</span>` : ''}</a>${objectMenu(schema, o)}</li>`)}</ul>
+          <ul class="tree">${list.map((o) => html`<li class="ob-item"><a href="${link({ k: o.type, o: o.ref })}"${selected === o ? raw(' aria-current="page"') : ''}>${icon(ic)}<span>${o.name}</span>${o.rls ? html`<span class="tag">RLS</span>` : ''}${o.ext ? html`<span class="tag">${tx('ob.extension')}</span>` : ''}</a>${objectMenu(schema, o, tx)}</li>`)}</ul>
         </details>`;
       })}</div>`;
 
@@ -160,7 +160,7 @@ export async function objectBrowserRoutes(app: FastifyInstance) {
         <a class="create-source" href="${BASE}/sql/load">${icon('upload')}<span><b>${tx('ob.tile.load')}</b><small class="muted">${tx('ob.tile.load.desc')}</small></span></a></div>
         <p class="muted">${tx('ob.select_hint')}</p>`);
 
-    const main = html`<h1 class="u-mb1">SQL Workshop</h1>${workshopTabs('objects', s)}
+    const main = html`<h1 class="u-mb1">${tx('rail.sql_workshop')}</h1>${workshopTabs('objects', s)}
       <div class="ob-head">
         <form method="get" class="ob-schema">${filter ? html`<input type="hidden" name="q" value="${filter}">` : ''}
           <label class="label" for="ob-schema">${tx('ob.schema')}</label>

package/src/builder/querybuilder.ts

@@ -4,6 +4,7 @@ import { owner } from '../db.ts';
 import { html, raw } from '../html.ts';
 import { icon } from '../icons.ts';
 import { BASE, csrf, developer, region, send, shell, workshopTabs, type Req } from './ui.ts';
+import { tr } from './i18n.ts';
 
 // SQL Workshop → Query Builder: pick tables and views of a schema; joins
 // follow their foreign keys, or columns joined by the developer (drawn on
@@ -90,6 +91,8 @@ export interface BuiltQuery {
   /** whether the query groups (a column has a function) */
   grouped: boolean;
   notes: string[];
+  /** (sprint 162) the tables of `notes`: no foreign key connects them, so they are cross joined */
+  crossJoined: string[];
 }
 
 /** Build the SELECT for a spec, using only names that exist in `relations`. */
@@ -98,6 +101,7 @@ export function buildQuery(relations: CatalogRelation[], fks: CatalogFk[], spec:
   const tables = [...new Set(spec.tables)].filter((t) => byName.has(t));
   if (!tables.length) return null;
   const notes: string[] = [];
+  const crossJoined: string[] = [];
   const aliases = new Map(tables.map((t, k) => [t, `t${k + 1}`]));
   const q = (t: string) => `${ident(spec.schema)}.${ident(t)}`;
 
@@ -130,6 +134,7 @@ export function buildQuery(relations: CatalogRelation[], fks: CatalogFk[], spec:
     if (pick < 0) {
       pick = 0;
       notes.push(`No foreign key connects ${pending[0]} to the other tables: it is cross joined. Join two of their columns on the canvas, or under Joins.`);
+      crossJoined.push(pending[0]);
     }
     const t = pending.splice(pick, 1)[0];
     joins.push({ alias: aliases.get(t)!, table: t, fk: customFor(t).length ? null : fk, custom: customFor(t) });
@@ -196,7 +201,7 @@ export function buildQuery(relations: CatalogRelation[], fks: CatalogFk[], spec:
   if (groupBy.length) sql += `\n group by ${groupBy.join(', ')}`;
   if (order.length) sql += `\n order by ${order.join(', ')}`;
   if (spec.limit) sql += `\n limit ${spec.limit}`;
-  return { sql, aliases, joins, notes, grouped };
+  return { sql, aliases, joins, notes, crossJoined, grouped };
 }
 
 /** Tables and views of a schema, with their columns, and the foreign keys between its tables. */
@@ -272,6 +277,7 @@ export async function queryBuilderRoutes(app: FastifyInstance) {
   app.get(`${BASE}/sql/query`, async (req: Req, reply) => {
     const s = await developer(req, reply);
     if (!s) return;
+    const tx = tr(s);
     const schemas = (
       await owner.query(
         `select nspname as name from pg_namespace where nspname !~ '^pg_' and nspname not in ('information_schema') order by nspname = 'meta', nspname`,
@@ -299,72 +305,72 @@ export async function queryBuilderRoutes(app: FastifyInstance) {
     const orders = [...spec.order.filter((o) => o.column), { column: '', dir: 'asc' as const }];
 
     const form = html`<form method="get" action="${BASE}/sql/query">${chosen.length ? html`<input type="hidden" name="o" value="${chosen.join(',')}">` : ''}
-      ${region('1. Tables and views', html`<div class="form-grid"><div class="field"><label class="label" for="f_schema">Schema</label>
+      ${region(`1. ${tx('qb.tables')}`, html`<div class="form-grid"><div class="field"><label class="label" for="f_schema">${tx('sm.schema')}</label>
           <select id="f_schema" name="schema">${schemas.map((x) => html`<option${sel(x === schema)}>${x}</option>`)}</select></div></div>
         ${rels.length
-          ? html`<fieldset class="field"><legend class="label">Tables and views of ${schema}</legend><div class="qb-pick">
-              ${rels.map((r) => html`<label class="check"><input type="checkbox" name="t" value="${r.name}"${check(chosen.includes(r.name))}> ${r.name}${r.kind === 'view' ? html` <span class="tag">view</span>` : ''}${chosen.includes(r.name) ? html` <span class="muted small">${built!.aliases.get(r.name)}</span>` : ''}</label>`)}
+          ? html`<fieldset class="field"><legend class="label">${tx('qb.tables_of', { schema })}</legend><div class="qb-pick">
+              ${rels.map((r) => html`<label class="check"><input type="checkbox" name="t" value="${r.name}"${check(chosen.includes(r.name))}> ${r.name}${r.kind === 'view' ? html` <span class="tag">${tx('qb.view')}</span>` : ''}${chosen.includes(r.name) ? html` <span class="muted small">${built!.aliases.get(r.name)}</span>` : ''}</label>`)}
             </div></fieldset>`
-          : html`<p class="muted">This schema has no tables or views.</p>`}
-        <div class="buttons"><button class="btn">${icon('check')} Apply</button></div>`)}
+          : html`<p class="muted">${tx('qb.no_tables')}</p>`}
+        <div class="buttons"><button class="btn">${icon('check')} ${tx('qb.apply')}</button></div>`)}
       ${built
         ? html`<div class="u-spacer"></div>
-        ${region('2. Columns', html`<p class="muted u-mt0">None ticked: all columns. A function (count, sum, …) groups the rows by the other chosen columns. Drag a table by its handle (or focus the handle and use the arrow keys); drag the dot next to a column onto a column of another table to join them.</p>
-          <label class="check u-mb1"><input type="checkbox" name="distinct" value="1"${check(spec.distinct)}> Distinct rows</label>
+        ${region(`2. ${tx('ul.columns')}`, html`<p class="muted u-mt0">${tx('qb.columns_help')}</p>
+          <label class="check u-mb1"><input type="checkbox" name="distinct" value="1"${check(spec.distinct)}> ${tx('qb.distinct')}</label>
           <div class="qb-canvas" data-joins="${JSON.stringify(lines)}">${chosen.map((t, k) => {
             const a = built!.aliases.get(t)!;
             const pos = spec.positions[t] ?? { x: 16 + k * 272, y: 16 };
             return html`<div class="qb-table" data-table="${t}" data-alias="${a}" data-x="${pos.x}" data-y="${pos.y}">
               ${spec.positions[t] ? html`<input type="hidden" name="p" value="${t}:${pos.x},${pos.y}">` : ''}
-              <div class="qb-table-head"><button type="button" class="qb-move" hidden aria-label="Move ${t} (arrow keys)" title="Drag to move">${icon('menu')}</button>
+              <div class="qb-table-head"><button type="button" class="qb-move" hidden aria-label="${tx('qb.move', { table: t })}" title="${tx('qb.drag_move')}">${icon('menu')}</button>
                 <strong>${t}</strong> <span class="muted small">${a}</span></div>
               <ul class="qb-cols">${rels.find((r) => r.name === t)!.columns.map((c) => {
                 const ref = `${a}.${c.name}`;
                 return html`<li class="qb-col" data-ref="${ref}">
                   <label class="check"><input type="checkbox" name="c" value="${ref}"${check(spec.columns.includes(ref))}> ${c.name}</label>
                   <span class="muted small qb-type">${c.type}</span>
-                  <select name="fn" aria-label="Function for ${ref}"><option value="">-</option>${Object.entries(FUNCTIONS).map(([fn, label]) => html`<option value="${ref}:${fn}"${sel(spec.fns[ref] === fn)}>${label}</option>`)}</select>
-                  ${chosen.length > 1 ? html`<button type="button" class="qb-link" hidden data-ref="${ref}" aria-label="Join ${ref} to a column of another table" title="Drag onto a column of another table to join them"></button>` : ''}
+                  <select name="fn" aria-label="${tx('qb.function_for', { column: ref })}"><option value="">-</option>${Object.entries(FUNCTIONS).map(([fn, label]) => html`<option value="${ref}:${fn}"${sel(spec.fns[ref] === fn)}>${tx.dyn(`qb.fn.${fn}`, label)}</option>`)}</select>
+                  ${chosen.length > 1 ? html`<button type="button" class="qb-link" hidden data-ref="${ref}" aria-label="${tx('qb.join_label', { column: ref })}" title="${tx('qb.join_title')}"></button>` : ''}
                 </li>`;
               })}</ul></div>`;
           })}</div>`)}
         ${built.joins.length
-          ? html`<div class="u-spacer"></div>${region('3. Joins', html`<p class="muted u-mt0">From the foreign keys between the chosen tables, or the columns you joined.</p>
-              ${built.notes.map((n) => html`<div class="alert alert-error" role="alert">${n}</div>`)}
+          ? html`<div class="u-spacer"></div>${region(`3. ${tx('qb.joins')}`, html`<p class="muted u-mt0">${tx('qb.joins_help')}</p>
+              ${built.crossJoined.map((t) => html`<div class="alert alert-error" role="alert">${tx('qb.cross_join', { table: t })}</div>`)}
               <ul class="qb-joins">${built.joins.map((j) => html`<li class="u-mb1">${j.table} <span class="muted">${j.alias}</span>
                 ${j.custom.length
-                  ? html` on ${j.custom.map((c, k) => html`${k ? ' and ' : ''}<label class="check qb-inline"><input type="checkbox" name="j" value="${c.a}=${c.b}" checked> ${c.a} = ${c.b}</label>`)}`
-                  : j.fk ? html` on ${j.fk.from}(${j.fk.fromCols.join(', ')}) → ${j.fk.to}(${j.fk.toCols.join(', ')})` : html` (cross join)`}
-                ${j.fk || j.custom.length ? html`<label class="sr-only" for="f_jt_${j.alias}">Join type for ${j.table}</label>
-                  <select id="f_jt_${j.alias}" name="jt_${j.alias}"><option value="inner">inner join</option><option value="left"${sel(spec.joinTypes[j.alias] === 'left')}>left join (keep rows without a match)</option></select>` : ''}</li>`)}</ul>
-              <fieldset class="field"><legend class="label">Join two columns</legend><div class="qb-cond">
-                <select name="ja" aria-label="Join: column">${colOptions('')}</select><span class="qb-eq">=</span>
-                <select name="jb" aria-label="Join: column of another table">${colOptions('')}</select></div></fieldset>
-              <div class="buttons"><button class="btn">${icon('check')} Apply</button></div>`)}`
+                  ? html` ${tx('qb.on')} ${j.custom.map((c, k) => html`${k ? ` ${tx('qb.and')} ` : ''}<label class="check qb-inline"><input type="checkbox" name="j" value="${c.a}=${c.b}" checked> ${c.a} = ${c.b}</label>`)}`
+                  : j.fk ? html` ${tx('qb.on')} ${j.fk.from}(${j.fk.fromCols.join(', ')}) → ${j.fk.to}(${j.fk.toCols.join(', ')})` : html` (${tx('qb.cross')})`}
+                ${j.fk || j.custom.length ? html`<label class="sr-only" for="f_jt_${j.alias}">${tx('qb.join_type', { table: j.table })}</label>
+                  <select id="f_jt_${j.alias}" name="jt_${j.alias}"><option value="inner">${tx('qb.inner')}</option><option value="left"${sel(spec.joinTypes[j.alias] === 'left')}>${tx('qb.left')}</option></select>` : ''}</li>`)}</ul>
+              <fieldset class="field"><legend class="label">${tx('qb.join_two')}</legend><div class="qb-cond">
+                <select name="ja" aria-label="${tx('qb.join_a')}">${colOptions('')}</select><span class="qb-eq">=</span>
+                <select name="jb" aria-label="${tx('qb.join_b')}">${colOptions('')}</select></div></fieldset>
+              <div class="buttons"><button class="btn">${icon('check')} ${tx('qb.apply')}</button></div>`)}`
           : ''}
         <div class="u-spacer"></div>
-        ${region(`${built.joins.length ? 4 : 3}. Conditions`, html`<fieldset class="field"><legend class="label">Rows must match</legend><div class="radio-group">
-            <label class="check"><input type="radio" name="any" value="and"${check(!spec.any)}> all conditions</label>
-            <label class="check"><input type="radio" name="any" value="or"${check(spec.any)}> any condition</label></div></fieldset>
+        ${region(`${built.joins.length ? 4 : 3}. ${tx('qb.conditions')}`, html`<fieldset class="field"><legend class="label">${tx('qb.rows_match')}</legend><div class="radio-group">
+            <label class="check"><input type="radio" name="any" value="and"${check(!spec.any)}> ${tx('qb.all')}</label>
+            <label class="check"><input type="radio" name="any" value="or"${check(spec.any)}> ${tx('qb.any')}</label></div></fieldset>
           ${wheres.map((w, k) => html`<div class="qb-cond">
-            <select name="wc" aria-label="Condition ${k + 1}: column">${colOptions(w.column)}</select>
-            <select name="wo" aria-label="Condition ${k + 1}: operator">${Object.entries(OPERATORS).map(([op, label]) => html`<option value="${op}"${sel(op === w.op)}>${op} · ${label}</option>`)}</select>
-            <input name="wv" value="${w.value}" aria-label="Condition ${k + 1}: value"></div>`)}
-          <div class="buttons"><button class="btn">${icon('plus')} Apply / add a condition</button></div>`)}
+            <select name="wc" aria-label="${tx('qb.cond_column', { n: k + 1 })}">${colOptions(w.column)}</select>
+            <select name="wo" aria-label="${tx('qb.cond_operator', { n: k + 1 })}">${Object.entries(OPERATORS).map(([op, label]) => html`<option value="${op}"${sel(op === w.op)}>${op} · ${tx.dyn(`qb.op.${op.replace(/[^a-z]+/g, '_') || { '=': 'eq', '<>': 'ne', '<': 'lt', '<=': 'le', '>': 'gt', '>=': 'ge' }[op]}`, label)}</option>`)}</select>
+            <input name="wv" value="${w.value}" aria-label="${tx('qb.cond_value', { n: k + 1 })}"></div>`)}
+          <div class="buttons"><button class="btn">${icon('plus')} ${tx('qb.add_condition')}</button></div>`)}
         <div class="u-spacer"></div>
-        ${region(`${built.joins.length ? 5 : 4}. Sort and limit`, html`${orders.map((o, k) => html`<div class="qb-cond">
-            <select name="oc" aria-label="Sort ${k + 1}: column">${colOptions(o.column)}</select>
-            <select name="od" aria-label="Sort ${k + 1}: direction"><option value="asc">ascending</option><option value="desc"${sel(o.dir === 'desc')}>descending</option></select><span></span></div>`)}
-          <div class="form-grid"><div class="field"><label class="label" for="f_limit">At most (rows)</label><input id="f_limit" name="limit" type="number" min="1" max="100000" value="${spec.limit ?? ''}"></div></div>
-          <div class="buttons"><button class="btn btn-hot">${icon('check')} Apply</button></div>`)}`
+        ${region(`${built.joins.length ? 5 : 4}. ${tx('qb.sort_limit')}`, html`${orders.map((o, k) => html`<div class="qb-cond">
+            <select name="oc" aria-label="${tx('qb.sort_column', { n: k + 1 })}">${colOptions(o.column)}</select>
+            <select name="od" aria-label="${tx('qb.sort_dir', { n: k + 1 })}"><option value="asc">${tx('qb.asc')}</option><option value="desc"${sel(o.dir === 'desc')}>${tx('qb.desc')}</option></select><span></span></div>`)}
+          <div class="form-grid"><div class="field"><label class="label" for="f_limit">${tx('qb.limit')}</label><input id="f_limit" name="limit" type="number" min="1" max="100000" value="${spec.limit ?? ''}"></div></div>
+          <div class="buttons"><button class="btn btn-hot">${icon('check')} ${tx('qb.apply')}</button></div>`)}`
         : ''}
     </form>`;
 
     const output = built
-      ? html`<div class="u-spacer"></div>${region('SQL', html`<pre class="source" data-code-view="sql" tabindex="0" aria-label="Generated SQL">${built.sql}</pre>
+      ? html`<div class="u-spacer"></div>${region('SQL', html`<pre class="source" data-code-view="sql" tabindex="0" aria-label="${tx('qs.generated')}">${built.sql}</pre>
           <form method="post" action="${BASE}/sql">${csrf(s)}<input type="hidden" name="sql" value="${built.sql}">
-            <div class="buttons"><button class="btn btn-hot">${icon('play')} Run in the SQL Worksheet</button></div></form>`)}`
+            <div class="buttons"><button class="btn btn-hot">${icon('play')} ${tx('qb.run')}</button></div></form>`)}`
       : '';
-    return send(reply, s, shell(s, 'Query Builder', [['SQL Workshop', `${BASE}/sql`], ['Query Builder']], html`<h1 class="u-mb1">SQL Workshop</h1>${workshopTabs('query', s)}${form}${output}`, 'sql'));
+    return send(reply, s, shell(s, tx('sql.tool.query'), [[tx('rail.sql_workshop'), `${BASE}/sql`], [tx('sql.tool.query')]], html`<h1 class="u-mb1">${tx('rail.sql_workshop')}</h1>${workshopTabs('query', s)}${form}${output}`, 'sql'));
   });
 }

package/src/builder/quicksql.ts

@@ -7,6 +7,7 @@ import { clientIp, type Session } from '../session.ts';
 import { runAndRecord, runOptions, SCRIPT_MAX_MB } from './scripts.ts';
 import { back, BASE, csrf, developer, flash, region, send, shell, workshopTabs, type Req } from './ui.ts';
 import { currentWorkspace } from './workspaces.ts';
+import { tr } from './i18n.ts';
 
 // SQL Workshop → Quick SQL: shorthand → DDL preview, then save it as a SQL
 // script or run it (as a script, so the results per statement are kept).
@@ -27,32 +28,29 @@ view department_employees departments employees
 
 export async function quickSqlRoutes(app: FastifyInstance) {
   const render = (s: Session, reply: FastifyReply, src: string, body: Record<string, string | undefined>, error?: string) => {
+    const tx = tr(s);
     const { ddl, warnings } = quickSql(src);
-    const syntax = html`<details class="u-mt1"><summary>Syntax</summary><ul class="small">
-        <li>A table name on a line of its own, its columns indented below it. A table indented under another table is a child table: it gets <code>&lt;parent&gt;_id</code> referencing the parent.</li>
-        <li>Column types from the name (<code>*_id</code> bigint, <code>*_at</code> timestamptz, <code>*_date</code>/<code>*_on</code> date, <code>is_*</code> boolean, <code>price</code>/<code>amount</code> numeric, otherwise text) or written after it: <code>vc200</code>, <code>num</code>, <code>num(10,2)</code>, <code>int</code>, <code>date</code>, <code>ts</code>, <code>tstz</code>, <code>clob</code>, <code>blob</code>, <code>json</code>, <code>bool</code>, <code>uuid</code>.</li>
-        <li>Column directives: <code>/nn</code>, <code>/pk</code>, <code>/unique</code>, <code>/idx</code>, <code>/fk table</code>, <code>/check a, b</code>, <code>/between 1 and 10</code>, <code>/default value</code>, <code>/lower</code>, <code>/upper</code>; <code>[a comment]</code>. Table directive: <code>/auditcols</code>.</li>
-        <li>Settings: <code># pk: identity | seq | guid | none</code>, <code># schema: name</code>, <code># prefix: xx</code>, <code># drop: true</code>, <code># auditcols: true</code>, or <code># settings = { pk: "guid", schema: "app" }</code>.</li>
-        <li><code>view name table1 table2</code>: a view joining the tables by their foreign keys. <code>--</code> starts a comment.</li></ul></details>`;
+    const syntax = html`<details class="u-mt1"><summary>${tx('qs.syntax')}</summary><ul class="small">
+        ${(['qs.syntax.tables', 'qs.syntax.types', 'qs.syntax.directives', 'qs.syntax.settings', 'qs.syntax.views'] as const).map((k) => html`<li>${tx.code(k)}</li>`)}</ul></details>`;
     const main = html`<form method="post" action="${BASE}/sql/quick">${csrf(s)}
       ${error ? html`<div class="alert alert-error" role="alert">${error}</div>` : ''}
       <div class="qs-columns">
-        ${region('Quick SQL', html`<label class="sr-only" for="f_source">Quick SQL</label>
+        ${region(tx('sql.tool.quicksql'), html`<label class="sr-only" for="f_source">${tx('sql.tool.quicksql')}</label>
           <textarea id="f_source" name="source" class="code" rows="22" spellcheck="false">${src}</textarea>
-          <div class="buttons"><button class="btn" name="action" value="preview">${icon('play')} Generate SQL</button></div>${syntax}`)}
+          <div class="buttons"><button class="btn" name="action" value="preview">${icon('play')} ${tx('qs.generate')}</button></div>${syntax}`)}
         ${region('PostgreSQL', html`${warnings.length
-            ? html`<div class="alert alert-error" role="alert"><ul class="u-m0">${warnings.map((w) => html`<li>Line ${w.line}: ${w.message}</li>`)}</ul></div>`
+            ? html`<div class="alert alert-error" role="alert"><ul class="u-m0">${warnings.map((w) => html`<li>${tx('qs.line', { line: w.line, message: w.message })}</li>`)}</ul></div>`
             : ''}
-          <pre class="source ddl" data-code-view="sql" tabindex="0" aria-label="Generated SQL">${ddl}</pre>`)}
+          <pre class="source ddl" data-code-view="sql" tabindex="0" aria-label="${tx('qs.generated')}">${ddl}</pre>`)}
       </div>
       <div class="u-spacer"></div>
-      ${region('Save or run', html`<div class="form-grid"><div class="field"><label class="label" for="f_name">Script name</label>
+      ${region(tx('qs.save_or_run'), html`<div class="form-grid"><div class="field"><label class="label" for="f_name">${tx('qs.script_name')}</label>
           <input id="f_name" name="name" value="${body.name ?? 'Quick SQL'}" maxlength="200"></div></div>
-        ${runOptions(body)}
-        <div class="buttons"><button class="btn" name="action" value="save">${icon('file')} Save as script</button>
-          <button class="btn btn-hot" name="action" value="run">${icon('play')} Run</button></div>`)}
+        ${runOptions(body, tx)}
+        <div class="buttons"><button class="btn" name="action" value="save">${icon('file')} ${tx('qs.save_script')}</button>
+          <button class="btn btn-hot" name="action" value="run">${icon('play')} ${tx('qs.run')}</button></div>`)}
     </form>`;
-    return send(reply, s, shell(s, 'Quick SQL', [['SQL Workshop', `${BASE}/sql`], ['Quick SQL']], html`<h1 class="u-mb1">SQL Workshop</h1>${workshopTabs('quicksql', s)}${main}`, 'sql'));
+    return send(reply, s, shell(s, tx('sql.tool.quicksql'), [[tx('rail.sql_workshop'), `${BASE}/sql`], [tx('sql.tool.quicksql')]], html`<h1 class="u-mb1">${tx('rail.sql_workshop')}</h1>${workshopTabs('quicksql', s)}${main}`, 'sql'));
   };
 
   app.get(`${BASE}/sql/quick`, async (req: Req, reply) => {
@@ -68,7 +66,7 @@ export async function quickSqlRoutes(app: FastifyInstance) {
     const src = (b.source ?? '').replace(/\r\n/g, '\n');
     if (Buffer.byteLength(src) > 1024 * 1024) {
       reply.code(422);
-      return render(s, reply, '', b, 'The Quick SQL is larger than 1 MB.');
+      return render(s, reply, '', b, tr(s)('qs.too_large'));
     }
     if (b.action !== 'save' && b.action !== 'run') return render(s, reply, src, b);
     const { ddl } = quickSql(src);
@@ -78,7 +76,7 @@ export async function quickSqlRoutes(app: FastifyInstance) {
       .join('\n')}\n\n${ddl}`;
     if (Buffer.byteLength(content) > SCRIPT_MAX_MB * 1024 * 1024) {
       reply.code(422);
-      return render(s, reply, src, b, 'The generated script is too large.');
+      return render(s, reply, src, b, tr(s)('qs.script_too_large'));
     }
     const name = (b.name ?? '').trim().slice(0, 200) || 'Quick SQL';
     if (b.action === 'run') {
@@ -88,7 +86,7 @@ export async function quickSqlRoutes(app: FastifyInstance) {
     let unique = name;
     for (let n = 2; await owner.one('select 1 from meta.sql_script where name = $1 and workspace_id = $2', [unique, currentWorkspace(s)]); n++) unique = `${name} (${n})`;
     const r = await owner.one(`insert into meta.sql_script (name, content, created_by, updated_by, workspace_id) values ($1, $2, $3, $3, $4) returning id`, [unique, content, s.username, currentWorkspace(s)]);
-    flash(s, `Saved as script “${unique}”.`);
+    flash(s, tr(s)('qs.saved', { name: unique }));
     return back(reply, s, `${BASE}/sql/scripts/${r!.id}`);
   });
 }