pgkiln 0.41.0 → 0.43.0

package/public/builder.js

@@ -209,6 +209,132 @@
     });
   }
 
+  // ---------------------------------------------------------------- the rendering tree's context menu (sprint 77)
+  // Right-click (or Shift+F10 / the menu key) on a region, item or button: create in or below it, duplicate,
+  // copy to another page, expand or collapse everything below, delete. Every entry is a link or a form post
+  // the server also answers without JavaScript.
+  function setupTreeMenu(tree) {
+    const pid = tree.dataset.pageId;
+    const base = `/builder/pages/${pid}`;
+    const token = document.querySelector('input[name="__csrf"]')?.value ?? '';
+    let menu = null;
+    let opener = null;
+    const close = (refocus = true) => {
+      menu?.remove();
+      menu = null;
+      if (refocus) opener?.focus();
+    };
+    const submit = (action, fields, confirmText) => {
+      if (confirmText && !window.confirm(confirmText)) return;
+      const f = document.createElement('form');
+      f.method = 'post';
+      f.action = action;
+      for (const [k, v] of Object.entries({ __csrf: token, ...fields })) {
+        const i = document.createElement('input');
+        i.type = 'hidden';
+        i.name = k;
+        i.value = v;
+        f.appendChild(i);
+      }
+      document.body.appendChild(f);
+      f.submit();
+    };
+    const setAll = (node, open) => {
+      const li = node.closest('li');
+      for (const sub of [li, ...li.querySelectorAll('li')]) {
+        const n = sub.querySelector(':scope > .pd-node.has-kids');
+        if (!n) continue;
+        sub.toggleAttribute('data-collapsed', !open);
+        n.setAttribute('aria-expanded', String(open));
+      }
+    };
+    const entries = (node) => {
+      const kind = node.dataset.kind;
+      const id = node.dataset.id;
+      const label = node.querySelector('.pd-label')?.textContent ?? '';
+      const go = (q) => () => window.location.assign(`${base}?${q}`);
+      const copyDialog = () => {
+        const d = document.getElementById('pd-copy-dialog');
+        if (!d) return;
+        d.querySelector('input[name="kind"]').value = kind;
+        d.querySelector('input[name="id"]').value = id;
+        d.querySelector('[data-copy-what]').textContent = `${kind[0].toUpperCase()}${kind.slice(1)}: ${label}`;
+        d.showModal();
+      };
+      const list = [];
+      if (kind === 'region') {
+        list.push(['Create page item', go(`new=item&region=${id}`)], ['Create button', go(`new=button&region=${id}`)],
+          ['Create dynamic action', go('new=dynamic_action')],
+          ['Create region below', () => submit(`${base}/layout/create`, { kind: 'region', type: 'static', position: node.dataset.position ?? '', before: node.dataset.next ?? '' })], null);
+      }
+      list.push(['Duplicate', () => submit(`${base}/layout/duplicate`, { kind, id })], ['Copy to other page…', copyDialog]);
+      if (kind !== 'region') list.push(['Create dynamic action', go('new=dynamic_action')]);
+      if (node.classList.contains('has-kids')) list.push(null, ['Expand all below', () => setAll(node, true)], ['Collapse all below', () => setAll(node, false)]);
+      list.push(null, ['Delete', () => submit(`${base}/c/${kind}/${id}/delete`, {}, `Delete ${kind} ${label}?`), 'danger']);
+      return list;
+    };
+    const open = (node, x, y) => {
+      close(false);
+      opener = node;
+      menu = document.createElement('div');
+      menu.className = 'pd-menu';
+      menu.setAttribute('role', 'menu');
+      menu.setAttribute('aria-label', `Actions: ${node.querySelector('.pd-label')?.textContent ?? ''}`);
+      for (const e of entries(node)) {
+        if (!e) {
+          const sep = document.createElement('div');
+          sep.setAttribute('role', 'separator');
+          menu.appendChild(sep);
+          continue;
+        }
+        const b = document.createElement('button');
+        b.type = 'button';
+        b.setAttribute('role', 'menuitem');
+        b.tabIndex = -1;
+        b.textContent = e[0];
+        if (e[2]) b.classList.add(`is-${e[2]}`);
+        b.addEventListener('click', () => {
+          close(e[0] !== 'Copy to other page…');
+          e[1]();
+        });
+        menu.appendChild(b);
+      }
+      document.body.appendChild(menu);
+      const r = menu.getBoundingClientRect();
+      menu.style.left = `${Math.max(4, Math.min(x, window.innerWidth - r.width - 4))}px`;
+      menu.style.top = `${Math.max(4, Math.min(y, window.innerHeight - r.height - 4))}px`;
+      menu.querySelector('[role=menuitem]')?.focus();
+      menu.addEventListener('keydown', (e) => {
+        const items = [...menu.querySelectorAll('[role=menuitem]')];
+        const i = items.indexOf(document.activeElement);
+        if (e.key === 'ArrowDown') items[(i + 1) % items.length].focus();
+        else if (e.key === 'ArrowUp') items[(i - 1 + items.length) % items.length].focus();
+        else if (e.key === 'Home') items[0].focus();
+        else if (e.key === 'End') items[items.length - 1].focus();
+        else if (e.key === 'Escape' || e.key === 'Tab') close();
+        else return;
+        e.preventDefault();
+      });
+    };
+    tree.addEventListener('contextmenu', (e) => {
+      const node = e.target.closest('.pd-node[data-kind][data-id]');
+      if (!node || !['region', 'item', 'button'].includes(node.dataset.kind)) return;
+      e.preventDefault();
+      const r = node.getBoundingClientRect();
+      // the keyboard's menu key has no pointer position
+      open(node, e.clientX || r.left + 24, e.clientY || r.bottom);
+    });
+    document.addEventListener('pointerdown', (e) => {
+      if (menu && !menu.contains(e.target)) close(false);
+    });
+    window.addEventListener('blur', () => close(false));
+    const dialog = document.getElementById('pd-copy-dialog');
+    dialog?.querySelector('[data-dialog-close]')?.addEventListener('click', () => {
+      dialog.close();
+      opener?.focus();
+    });
+  }
+
   // ---------------------------------------------------------------- property editor
   function setupProperties() {
     const pe = document.querySelector('.pe');
@@ -269,6 +395,102 @@
         }
       });
     }
+    // (sprint 77, APEX: Show Common / Show All, Go to Group) next to the filter
+    if (row && groups.length) {
+      const bar = document.createElement('div');
+      bar.className = 'pe-view';
+      if (pe.querySelector('[data-more]')) {
+        const seg = document.createElement('div');
+        seg.className = 'segmented pe-common';
+        seg.setAttribute('role', 'group');
+        seg.setAttribute('aria-label', 'Properties shown');
+        const showCommon = (on, remember) => {
+          pe.classList.toggle('pe-show-common', on);
+          for (const b of seg.querySelectorAll('button')) b.setAttribute('aria-pressed', String((b.value === 'common') === on));
+          for (const fs of groups) fs.classList.toggle('pe-group-more', on && !fs.querySelector('.field:not([data-more] .field), .options-field:not([data-more] .options-field)'));
+          if (remember) store.set('pe.common', on ? '1' : null);
+        };
+        for (const [v, label] of [['common', 'Common'], ['all', 'All']]) {
+          const b = document.createElement('button');
+          b.type = 'button';
+          b.value = v;
+          b.textContent = label;
+          b.addEventListener('click', () => showCommon(v === 'common', true));
+          seg.appendChild(b);
+        }
+        bar.appendChild(seg);
+        showCommon(store.get('pe.common') === '1', false);
+      }
+      const named = groups.filter((fs) => fs.querySelector(':scope > legend'));
+      if (named.length > 1) {
+        const sel = document.createElement('select');
+        sel.className = 'pe-goto';
+        sel.setAttribute('aria-label', 'Go to group');
+        sel.innerHTML = '<option value="">Go to group</option>';
+        named.forEach((fs, i) => {
+          const o = document.createElement('option');
+          o.value = String(i);
+          o.textContent = fs.querySelector(':scope > legend').textContent.trim();
+          sel.appendChild(o);
+        });
+        sel.addEventListener('change', () => {
+          const fs = named[Number(sel.value)];
+          sel.value = '';
+          if (!fs) return;
+          // a group on another tab (a region's Attributes): open that tab first (tabify names its tab <panel id>-tab)
+          const panel = fs.closest('[data-tab]');
+          if (panel?.hidden) document.getElementById(`${panel.id}-tab`)?.click();
+          const t = fs.querySelector('.pe-toggle');
+          if (t?.getAttribute('aria-expanded') === 'false') t.click();
+          fs.scrollIntoView({ block: 'start', behavior: 'smooth' });
+          t?.focus({ preventScroll: true });
+        });
+        bar.appendChild(sel);
+      }
+      if (bar.children.length) row.after(bar);
+    }
+    // (sprint 77, APEX: the Template Options dialog) the checkboxes in a dialog, opened from a button that counts them.
+    // The dialog is the body's (not inside the form or the property editor's wrappers, which Common hides); the
+    // checkboxes belong to their form through the form attribute, so they are saved with it.
+    let optionDialogs = 0;
+    for (const fs of pe.querySelectorAll('fieldset.options-field')) {
+      const form = fs.closest('form');
+      if (!form) continue;
+      if (!form.id) form.id = `pe-form-${++optionDialogs}`;
+      const boxes = [...fs.querySelectorAll('input[type=checkbox]')];
+      for (const x of boxes) x.setAttribute('form', form.id);
+      const legend = fs.querySelector('legend')?.textContent.trim() ?? 'Options';
+      const holder = document.createElement('div');
+      holder.className = 'field pe-options-open';
+      const b = document.createElement('button');
+      b.type = 'button';
+      b.className = 'btn btn-sm';
+      const count = () => {
+        const n = boxes.filter((x) => x.checked).length;
+        b.textContent = `${legend}${n ? ` (${n})` : ''}…`;
+      };
+      const d = document.createElement('dialog');
+      d.className = 'pd-dialog';
+      d.setAttribute('aria-label', legend);
+      fs.replaceWith(holder);
+      holder.appendChild(b);
+      d.appendChild(fs);
+      const ok = document.createElement('div');
+      ok.className = 'pd-dialog-buttons';
+      ok.innerHTML = '<button type="button" class="btn btn-primary">OK</button>';
+      d.appendChild(ok);
+      document.body.appendChild(d);
+      // the count follows every change (Escape closes the dialog without OK); a change is an unsaved change
+      for (const x of boxes)
+        x.addEventListener('change', () => {
+          count();
+          document.querySelector(`.tb-save[form="${form.id}"]`)?.classList.add('is-dirty');
+        });
+      ok.querySelector('button').addEventListener('click', () => d.close());
+      d.addEventListener('close', () => b.focus());
+      b.addEventListener('click', () => d.showModal());
+      count();
+    }
     if (head) {
       const h = () => pe.style.setProperty('--pe-head-h', `${head.offsetHeight}px`);
       h();
@@ -360,9 +582,12 @@
       e.dataTransfer.effectAllowed = drag.isNew ? 'copy' : 'move';
       e.dataTransfer.setData('text/plain', drag.isNew ? `new ${drag.kind} ${drag.type}` : `${drag.kind} ${drag.id}`);
       (drag.kind === 'region' && !drag.isNew ? src.closest('.pd-region') : src).classList.add('is-dragging');
+      // (sprint 77) empty display positions and button positions show while something can drop there
+      canvas.classList.add(`pd-dragging-${drag.kind}`);
     });
     document.addEventListener('dragend', () => {
       for (const el of document.querySelectorAll('.is-dragging')) el.classList.remove('is-dragging');
+      canvas.classList.remove('pd-dragging-region', 'pd-dragging-item', 'pd-dragging-button');
       clear();
       drag = null;
     });
@@ -411,8 +636,10 @@
       clear();
       const before = t.before ? t.before.dataset.id : '';
       const region = d.kind === 'region' ? '' : t.zone.dataset.region;
-      if (d.isNew) post('create', { kind: d.kind, type: d.type, region, before });
-      else if (before !== d.id) post('move', { kind: d.kind, id: d.id, region, before });
+      // a region's display position, a button's position in its region
+      const place = d.kind === 'region' ? { position: t.zone.dataset.position ?? '' } : d.kind === 'button' ? { slot: t.zone.dataset.slot ?? '' } : {};
+      if (d.isNew) post('create', { kind: d.kind, type: d.type, region, before, ...place });
+      else if (before !== d.id || t.zone !== canvas.querySelector(`[data-kind="${d.kind}"][data-id="${d.id}"]`)?.closest('.pd-grid, .pd-slot')) post('move', { kind: d.kind, id: d.id, region, before, ...place });
     });
 
     // ------------------------------------------------ resizing a region (drag its right edge)
@@ -476,7 +703,7 @@
   // ---------------------------------------------------------------- small things
   // a select that navigates (the toolbar's page switcher)
   document.addEventListener('change', (e) => {
-    if (e.target.matches?.('select[data-autosubmit]')) e.target.form?.submit();
+    if (e.target.matches?.('select[data-autosubmit], input[type=checkbox][data-autosubmit]')) e.target.form?.submit();
   });
 
   // a search box that filters a list as you type (the App Builder's applications);
@@ -776,6 +1003,7 @@
     setupThemePreview();
     setupTabs();
     for (const tree of document.querySelectorAll('.pd-tree')) setupTree(tree);
+    for (const tree of document.querySelectorAll('.pd-tree[data-tree-menu]')) setupTreeMenu(tree);
     setupProperties();
     setupCanvas();
   }
@@ -859,3 +1087,83 @@ document.addEventListener('click', async (e) => {
     show(e.target.closest?.('.pe [data-prop]'));
   });
 })();
+
+// (sprint 73) a proposed value is selected on the first focus, so typing replaces it (data-select-once)
+document.querySelectorAll('input[data-select-once]').forEach((el) => {
+  el.addEventListener('focus', () => {
+    el.select();
+    // the click that focused it would put the caret back: keep the selection
+    el.addEventListener('mouseup', (e) => e.preventDefault(), { once: true });
+  }, { once: true });
+});
+
+// (sprint 73) a form that takes a while (data-progress="Creating …"): an overlay with the message while the server works
+document.addEventListener('submit', (e) => {
+  const form = e.target.closest?.('form[data-progress]');
+  if (!form || e.defaultPrevented || !form.checkValidity()) return;
+  const overlay = document.createElement('div');
+  overlay.className = 'progress-overlay';
+  overlay.setAttribute('role', 'status');
+  overlay.setAttribute('aria-live', 'polite');
+  const box = document.createElement('div');
+  box.className = 'progress-box';
+  const spin = document.createElement('span');
+  spin.className = 'progress-spinner';
+  spin.setAttribute('aria-hidden', 'true');
+  const text = document.createElement('span');
+  text.textContent = form.dataset.progress;
+  box.append(spin, text);
+  overlay.append(box);
+  document.body.append(overlay);
+  // back from the browser's cache (the back button): no overlay
+  window.addEventListener('pageshow', (ev) => { if (ev.persisted) overlay.remove(); }, { once: true });
+});
+
+// (sprint 74) a search box that filters a list's rows while typing (data-filter-rows="tbody id"); the form still works without it
+document.querySelectorAll('input[data-filter-rows]').forEach((el) => {
+  const body = document.getElementById(el.dataset.filterRows);
+  if (!body) return;
+  el.addEventListener('input', () => {
+    const q = el.value.trim().toLowerCase();
+    body.querySelectorAll(':scope > tr, :scope > li').forEach((tr) => { tr.hidden = !!q && !tr.textContent.toLowerCase().includes(q); });
+  });
+});
+
+// (sprint 74) Settings tabs without a reload; the form remembers the tab for the redirect after Save.
+// The authentication type shows only its own fields.
+(() => {
+  const links = [...document.querySelectorAll('[data-tab-link]')];
+  if (!links.length) return;
+  const show = (tab) => {
+    document.querySelectorAll('.settings-panel').forEach((p) => { p.hidden = p.dataset.tab !== tab; });
+    links.forEach((l) => (l.dataset.tabLink === tab ? l.setAttribute('aria-current', 'page') : l.removeAttribute('aria-current')));
+    document.querySelectorAll('[data-settings-tab]').forEach((i) => { i.value = tab; });
+    const save = document.querySelector('.settings-save');
+    if (save) save.hidden = tab === 'errors' || tab === 'pwa';
+    history.replaceState(null, '', `?tab=${tab}`);
+  };
+  links.forEach((l) => l.addEventListener('click', (e) => { e.preventDefault(); show(l.dataset.tabLink); }));
+  const auth = document.querySelector('.settings-form select[name="authentication"]');
+  auth?.addEventListener('change', () => {
+    document.querySelectorAll('.auth-part').forEach((p) => { p.hidden = p.dataset.auth !== auth.value; });
+  });
+})();
+
+// (sprint 75) the Object Browser's filter: objects whose name holds the text; folders without any are hidden
+document.querySelectorAll('input[data-filter-tree]').forEach((el) => {
+  const tree = document.getElementById(el.dataset.filterTree);
+  if (!tree) return;
+  el.addEventListener('input', () => {
+    const q = el.value.trim().toLowerCase();
+    tree.querySelectorAll('details.ob-folder').forEach((folder) => {
+      let n = 0;
+      folder.querySelectorAll('li').forEach((li) => {
+        const hit = !q || li.textContent.toLowerCase().includes(q);
+        li.hidden = !hit;
+        if (hit) n++;
+      });
+      folder.hidden = !!q && n === 0;
+      if (q && n) folder.open = true;
+    });
+  });
+});

package/src/builder/appfromfile.ts

@@ -21,7 +21,7 @@ import type { Session } from '../session.ts';
 import { MAX_MB, preview, resultHtml } from './dataload.ts';
 import { buildAppFromSheets, MAX_SHEETS, parseBook, sheetsForm, type BuiltBook, type NamedSheet } from './appsheets.ts';
 import { appWizardRoutes, PASTED } from './appwizard.ts';
-import { checkNewApp, createApp, createAppError, reservedSchema, type CheckedApp } from './newapp.ts';
+import { finishGeneratedApp, checkNewApp, createApp, createAppError, reservedSchema, type CheckedApp } from './newapp.ts';
 import { currentWorkspace } from './workspaces.ts';
 import { BASE, csrf, developer, input, region, select, send, shell, type Body, type Req } from './ui.ts';
 
@@ -149,9 +149,9 @@ export async function buildAppFromFile(checked: CheckedApp, sheet: Sheet, b: Bod
     const generate = async (kind: string, page: number, options: Record<string, unknown>) => {
       await c.query('select meta.generate_page($1, $2, $3::regclass, $4, $5::jsonb)', [checked.alias, kind, T, page, JSON.stringify(options)]);
     };
-    const label = (await c.query(`select meta.wizard_label($1) as l`, [tableName])).rows[0].l as string;
-    await generate('report_form', 2, { form_page: 3, label });
-    pages.push({ page: 2, label }, { page: 3, label: `${label} form` });
+    const { label, singular } = (await c.query('select meta.wizard_table_label($1::regclass) as label, meta.wizard_table_label($1::regclass, false) as singular', [T])).rows[0] as { label: string; singular: string };
+    await generate('report_form', 2, { form_page: 3 });
+    pages.push({ page: 2, label }, { page: 3, label: `${singular} form` });
     let next = 4;
     // the statistics tell which columns group the rows: a few values, repeated (not a name per row)
     const rows = result.inserted;
@@ -178,6 +178,7 @@ export async function buildAppFromFile(checked: CheckedApp, sheet: Sheet, b: Bod
         pages.push({ page: next++, label: `Faceted search (${facets.join(', ')})` });
       }
     }
+    await finishGeneratedApp(c, app.id, { description: checked.description });
     return { app: { id: app.id, alias: checked.alias, existingAccount: app.existingAccount }, table: T, result, pages, notes };
   });
 }

package/src/builder/appsheets.ts

@@ -19,7 +19,7 @@ import {
   type Sheet,
 } from '../dataload.ts';
 import { preview } from './dataload.ts';
-import { createApp, createAppError, type CheckedApp } from './newapp.ts';
+import { finishGeneratedApp, createApp, createAppError, type CheckedApp } from './newapp.ts';
 import { groupColumn } from './appfromfile.ts';
 import { region, type Body } from './ui.ts';
 
@@ -278,14 +278,21 @@ interface Catalog {
  * 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
  * column whose values repeat (from the statistics). Null when no table has one.
+ * (097) Tables with row level security are left out (the application's role may
+ * see none of their rows: an empty chart); the charts are titled "Employees by
+ * Manager", and the Dashboard comes right after Home in the navigation menu.
  */
-export async function addDashboard(c: Client, alias: string, tables: string[], page: number): Promise<{ page: number; label: string } | null> {
+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 }[] = [];
   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];
+    if (rel.rls) {
+      skipped.push(t);
+      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 rows = Number((await c.query('select greatest(reltuples, 0) as n from pg_class where oid = $1::regclass', [t])).rows[0].n);
-    const group = catalog.find((x) => x.fk_table && !x.is_pk)?.column_name ?? groupColumn(catalog, 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 });
   }
   if (!picks.length) return null;
@@ -295,7 +302,7 @@ export async function addDashboard(c: Client, alias: string, tables: string[], p
       JSON.stringify({ label: 'Dashboard', icon: 'chart', nav, label_column: group, function: 'count', value_column: null }),
     ]);
   const title = async (table: string, group: string) =>
-    (await c.query(`select meta.wizard_label(relname) || ' per ' || lower(meta.wizard_label(regexp_replace($2, '_(id|no|code)$', ''))) as t from pg_class where oid = $1::regclass`, [table, group])).rows[0].t as 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)]);
   for (const [n, p] of picks.slice(1).entries()) {
@@ -306,7 +313,13 @@ export async function addDashboard(c: Client, alias: string, tables: string[], 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]);
-  return { page, label: `Dashboard (${picks.map((p) => `${p.table.replace(/^.*\./, '')} per ${p.group}`).join(', ')})` };
+  // right after Home (the first top-level entry)
+  await c.query(
+    `update meta.nav_entry e set seq = coalesce((select min(seq) from meta.nav_entry h where h.app_id = e.app_id and h.parent_id is null and h.target_page = a.home_page), 0) + 1
+       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(', ')})` };
 }
 
 /** Create the application, the tables, the rows, the foreign keys and the pages, in one transaction. */
@@ -371,9 +384,9 @@ export async function buildAppFromSheets(checked: CheckedApp, sheets: NamedSheet
     let next = 2;
     for (const p of plans) {
       const T = qualified.get(p.k)!;
-      const label = (await c.query('select meta.wizard_label($1) as l', [p.table])).rows[0].l as string;
-      await c.query('select meta.generate_page($1, $2, $3::regclass, $4, $5::jsonb)', [checked.alias, 'report_form', T, next, JSON.stringify({ form_page: next + 1, label })]);
-      pages.push({ page: next, label }, { page: next + 1, label: `${label} form` });
+      const { label, singular } = (await c.query('select meta.wizard_table_label($1::regclass) as label, meta.wizard_table_label($1::regclass, false) as singular', [T])).rows[0] as { label: string; singular: string };
+      await c.query('select meta.generate_page($1, $2, $3::regclass, $4, $5::jsonb)', [checked.alias, 'report_form', T, next, JSON.stringify({ form_page: next + 1 })]);
+      pages.push({ page: next, label }, { page: next + 1, label: `${singular} form` });
       next += 2;
     }
     if (b.chart === 'true') {
@@ -381,6 +394,7 @@ export async function buildAppFromSheets(checked: CheckedApp, sheets: NamedSheet
       if (dash) pages.push(dash);
       else notes.push('No dashboard: no table has a foreign key or a text, yes/no or date column with a few values that repeat, to count the rows by.');
     }
+    await finishGeneratedApp(c, app.id, { description: checked.description });
     return { app: { id: app.id, alias: checked.alias, existingAccount: app.existingAccount }, tables, foreignKeys, pages, notes };
   });
 }