@adecore/database 0.39.0 → 0.40.0

package/src/grid/GridHeaderCell.tsx

@@ -56,6 +56,7 @@ type MenuProps = Pick<GridHeaderCellProps, 'column' | 'index' | 'sortable' | 'ha
 /* The items of the menu a header opens, from its button and from a right click. */
 function HeaderMenuItems({ column, index, sortable, hasSorts, pinned, hasHidden, canHide, actions }: MenuProps) {
     const { t } = useTranslation('database');
+
     return (
         <>
             {sortable && (
@@ -102,6 +103,7 @@ function HeaderMenuItems({ column, index, sortable, hasSorts, pinned, hasHidden,
 function ColumnFacts({ column }: { column: GridColumn }) {
     const { t } = useTranslation('database');
     const keys = { primaryKey: column.primaryKey === true, foreignKey: column.foreignKey === true };
+
     const facts = [
         keys.primaryKey || keys.foreignKey ? t(keyLabelOf(keys)) : null,
         column.type === '' ? null : column.type,
@@ -109,6 +111,7 @@ function ColumnFacts({ column }: { column: GridColumn }) {
         column.defaultValue === undefined || column.defaultValue === null ? null : t('grid.column.default', { value: column.defaultValue }),
         column.autoIncrement === true ? t('grid.column.autoIncrement') : null
     ].filter((fact) => fact !== null);
+
     return (
         <>
             <span className="block">{column.name}</span>
@@ -141,6 +144,7 @@ export function GridHeaderCell({
     const lastPress = useRef<number | null>(null);
     // Set by a press on the resize strip, since the click that ends the drag would otherwise pick the column.
     const resized = useRef(false);
+
     const { startResize } = useColumnResize(cell, {
         size: width,
         min: MIN_COLUMN_WIDTH,
@@ -151,25 +155,32 @@ export function GridHeaderCell({
 
     const pressHandle = (event: PointerEvent<HTMLElement>): void => {
         resized.current = true;
+
         if (isDoubleClick(lastPress.current, event.timeStamp)) {
             lastPress.current = null;
             actions.onFit(index);
+
             return;
         }
+
         lastPress.current = event.timeStamp;
         startResize(event);
     };
 
     const handleClick = (event: MouseEvent<HTMLDivElement>): void => {
         const target = event.target as Element;
+
         // A click inside a menu popup reaches here through the React tree, not the DOM.
         if (!event.currentTarget.contains(target) || target.closest('button') !== null) {
             return;
         }
+
         if (resized.current) {
             resized.current = false;
+
             return;
         }
+
         actions.onSelect(index, { shiftKey: event.shiftKey, mod: isModHeld(event, isApplePlatform()) });
     };
 

package/src/grid/GridRowView.tsx

@@ -85,6 +85,7 @@ export interface GridRowViewProps {
 export const GridRowView = memo(function GridRowView({ row, index, selected, focusedColumn, rangeStart, rangeEnd, editing, look, actions }: GridRowViewProps) {
     const { columns, order, widths, pinnedShown, gutter, notation, enumTypes, picked } = look;
     const tint = row.state === undefined ? (selected ? 'bg-accent-soft/40' : '') : ROW_STATE[row.state];
+
     const cells = order.map((columnIndex, position) => {
         const column = columns[columnIndex]!;
         const cell = row.cells[columnIndex] ?? null;
@@ -96,6 +97,7 @@ export const GridRowView = memo(function GridRowView({ row, index, selected, foc
         const isEditing = editing !== null && editing.column === columnIndex;
         const pinned = position < pinnedShown;
         const enumType = enumTypes[columnIndex] ?? null;
+
         return (
             <div
                 key={columnIndex}
@@ -154,6 +156,7 @@ export const GridRowView = memo(function GridRowView({ row, index, selected, foc
             </div>
         );
     });
+
     return (
         <div
             role="row"

package/src/grid/RecordView.tsx

@@ -56,13 +56,16 @@ const textOf = (cell: GridRow['cells'][number], kind: GridColumn['kind'], notati
     if (isPreview(cell)) {
         return cellView(cell, kind, notation).text;
     }
+
     if (cell !== null && typeof cell === 'object' && cell.kind === 'default') {
         return '';
     }
+
     // A field that can be edited holds the server's text, which is what an edit starts from.
     if (readOnly && isNumericKind(kind) && (typeof cell === 'number' || typeof cell === 'string')) {
         return numeralText(cell, notation);
     }
+
     return draftOf(cell);
 };
 
@@ -116,6 +119,7 @@ export function RecordView({
         if (editing !== null && !editing.loading && row !== undefined && editing.draft !== editing.initial) {
             onCommit?.(row.key, editing.column, parseDraft(editing.draft, columns[editing.column]!.kind));
         }
+
         setEditing(null);
     };
 
@@ -127,19 +131,25 @@ export function RecordView({
 
     const beginEdit = async (column: number): Promise<void> => {
         const cell = row?.cells[column] ?? null;
+
         if (row === undefined || !canEdit(column) || !isPreview(cell) || loadValue === undefined) {
             return;
         }
+
         setEditing({ column, draft: '', initial: '', loading: true });
         const value = await loadValue(row.key, column);
+
         setEditing((now) => {
             if (now === null || !now.loading || now.column !== column) {
                 return now;
             }
+
             if (value === undefined) {
                 return null;
             }
+
             const text = draftOf(value);
+
             return { column, draft: text, initial: text, loading: false };
         });
     };
@@ -155,9 +165,11 @@ export function RecordView({
     const toggleOpened = (column: number): void => {
         setOpened((now) => {
             const next = new Set(now);
+
             if (!next.delete(column)) {
                 next.add(column);
             }
+
             return next;
         });
     };
@@ -171,10 +183,13 @@ export function RecordView({
         if (event.nativeEvent.isComposing) {
             return;
         }
+
         const mod = isModHeld(event, apple);
+
         if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
             event.preventDefault();
             const direction = event.key === 'ArrowUp' ? -1 : 1;
+
             if (mod) {
                 moveRow(index + direction);
             } else {
@@ -241,6 +256,7 @@ export function RecordView({
                         const placeholder = cell === null ? 'NULL' : typeof cell === 'object' && cell.kind === 'default' ? 'DEFAULT' : undefined;
                         const expandable = enumType === null && opensUp(cell, column.kind);
                         const expanded = expandable && opened.has(position);
+
                         return (
                             <ContextMenu.Root key={position}>
                                 <ContextMenu.Trigger
@@ -382,12 +398,15 @@ function WholeValue({
         if (known !== undefined || loadValue === undefined) {
             return;
         }
+
         let live = true;
+
         void loadValue(row.key, column).then((whole) => {
             if (live) {
                 setFetched({ cell, value: whole });
             }
         });
+
         return () => {
             live = false;
         };

package/src/grid/ValueDock.tsx

@@ -25,6 +25,7 @@ export function ValueDock({ open, panel, children, width: given, onWidthChange,
     const dock = useRef<HTMLDivElement>(null);
     const [own, setOwn] = useState(VALUE_PANEL_WIDTH);
     const width = given ?? own;
+
     const { startResize } = useColumnResize(dock, {
         size: width,
         min: VALUE_PANEL_MIN_WIDTH,
@@ -34,6 +35,7 @@ export function ValueDock({ open, panel, children, width: given, onWidthChange,
             if (given === undefined) {
                 setOwn(next);
             }
+
             onWidthChange?.(next);
         }
     });

package/src/grid/aggregates.ts

@@ -32,10 +32,13 @@ const numberOf = (cell: Shown): { value: number; text: string } | null => {
     if (typeof cell === 'number') {
         return Number.isFinite(cell) ? { value: cell, text: String(cell) } : null;
     }
+
     if (typeof cell === 'string') {
         const text = cell.trim();
+
         return NUMERIC_TEXT.test(text) ? { value: Number(text), text } : null;
     }
+
     return null;
 };
 
@@ -52,31 +55,40 @@ export const aggregateBlock = (rows: readonly (readonly Shown[])[], kinds: reado
     let sum = 0;
     let minimum: { value: number; text: string } | null = null;
     let maximum: { value: number; text: string } | null = null;
+
     for (let row = block.top; row <= block.bottom; row++) {
         const cells = rows[row];
+
         if (cells === undefined) {
             continue;
         }
+
         for (const column of block.columns) {
             count++;
             const kind = kinds[column];
             const found = kind !== undefined && isNumericKind(kind) ? numberOf(cells[column] ?? null) : null;
+
             if (found === null) {
                 continue;
             }
+
             numbers++;
             sum += found.value;
+
             if (minimum === null || found.value < minimum.value) {
                 minimum = found;
             }
+
             if (maximum === null || found.value > maximum.value) {
                 maximum = found;
             }
         }
     }
+
     if (numbers === 0 || minimum === null || maximum === null) {
         return { count, numeric: null };
     }
+
     return {
         count,
         numeric: {

package/src/grid/column-layout.ts

@@ -1,5 +1,6 @@
 import type { ColumnView } from './column-view.ts';
 import { MAX_RESIZED_WIDTH, MIN_COLUMN_WIDTH } from './layout.ts';
+import { sameList } from '../same-list.ts';
 
 /* What a person did to the columns of a grid, by column name so it outlives a change of the column order. */
 export interface GridLayout {
@@ -10,8 +11,6 @@ export interface GridLayout {
     readonly pinned: readonly string[];
 }
 
-export const NO_GRID_LAYOUT: GridLayout = { widths: {}, hidden: [], pinned: [] };
-
 export interface ColumnState {
     readonly resized: Readonly<Record<number, number>>;
     readonly view: ColumnView;
@@ -22,36 +21,46 @@ export const restoreLayout = (columns: readonly { readonly name: string }[], lay
     const resized: Record<number, number> = {};
     const hidden = new Set<number>();
     const pinned: number[] = [];
+
     if (layout !== undefined) {
         columns.forEach((column, index) => {
             const width = layout.widths[column.name];
+
             if (width !== undefined) {
                 resized[index] = Math.max(MIN_COLUMN_WIDTH, Math.min(Math.round(width), MAX_RESIZED_WIDTH));
             }
+
             if (layout.hidden.includes(column.name)) {
                 hidden.add(index);
             }
         });
+
         for (const name of layout.pinned) {
             const index = columns.findIndex((column) => column.name === name);
+
             if (index >= 0 && !hidden.has(index) && !pinned.includes(index)) {
                 pinned.push(index);
             }
         }
     }
+
     return { resized, view: { hidden: hidden.size >= columns.length ? new Set() : hidden, pinned } };
 };
 
 /* The layout of a grid's state, with the columns by name. */
 export const captureLayout = (columns: readonly { readonly name: string }[], state: ColumnState): GridLayout => {
     const widths: Record<string, number> = {};
+
     for (const [index, width] of Object.entries(state.resized)) {
         const column = columns[Number(index)];
+
         if (column !== undefined) {
             widths[column.name] = width;
         }
     }
+
     const namesOf = (indexes: readonly number[]): string[] => indexes.flatMap((index) => columns[index]?.name ?? []);
+
     return {
         widths,
         hidden: namesOf([...state.view.hidden].sort((a, b) => a - b)),
@@ -59,10 +68,9 @@ export const captureLayout = (columns: readonly { readonly name: string }[], sta
     };
 };
 
-const sameList = (a: readonly string[], b: readonly string[]): boolean => a.length === b.length && a.every((item, index) => item === b[index]);
-
 export const sameLayout = (a: GridLayout, b: GridLayout): boolean => {
     const names = Object.keys(a.widths);
+
     return (
         names.length === Object.keys(b.widths).length &&
         names.every((name) => a.widths[name] === b.widths[name]) &&

package/src/grid/column-selection.ts

@@ -19,22 +19,31 @@ export const NO_COLUMN_SELECTION: ColumnSelection = { columns: new Set(), anchor
  */
 export const selectColumn = (current: ColumnSelection, order: readonly number[], index: number, click: ColumnClick): ColumnSelection => {
     const at = order.indexOf(index);
+
     if (at < 0) {
         return current;
     }
+
     const anchorAt = current.anchor === null ? -1 : order.indexOf(current.anchor);
+
     if (click.shiftKey && anchorAt >= 0) {
         const range = order.slice(Math.min(anchorAt, at), Math.max(anchorAt, at) + 1);
+
         return { columns: new Set(click.mod ? [...current.columns, ...range] : range), anchor: current.anchor };
     }
+
     if (click.mod) {
         const next = new Set(current.columns);
+
         if (next.delete(index)) {
             return { columns: next, anchor: next.size === 0 ? null : current.anchor };
         }
+
         next.add(index);
+
         return { columns: next, anchor: index };
     }
+
     return { columns: new Set([index]), anchor: index };
 };
 

package/src/grid/column-view.ts

@@ -7,15 +7,19 @@ export interface ColumnView {
 
 export const NO_COLUMN_VIEW: ColumnView = { hidden: new Set(), pinned: [] };
 
+const shownPins = (count: number, view: ColumnView): number[] => view.pinned.filter((index) => index < count && !view.hidden.has(index));
+
 /* The columns to draw as indexes: the pinned ones first in pin order, then the rest as they come, hidden ones left out. */
 export const displayOrder = (count: number, view: ColumnView): number[] => {
-    const pinned = view.pinned.filter((index) => index < count && !view.hidden.has(index));
+    const pinned = shownPins(count, view);
     const rest: number[] = [];
+
     for (let i = 0; i < count; i++) {
         if (!view.hidden.has(i) && !pinned.includes(i)) {
             rest.push(i);
         }
     }
+
     return [...pinned, ...rest];
 };
 
@@ -32,4 +36,4 @@ export const togglePin = (view: ColumnView, index: number): ColumnView => ({
 });
 
 /* How many of the first columns of `displayOrder` are pinned. */
-export const pinnedCount = (count: number, view: ColumnView): number => view.pinned.filter((index) => index < count && !view.hidden.has(index)).length;
+export const pinnedCount = (count: number, view: ColumnView): number => shownPins(count, view).length;

package/src/grid/copy-formats.ts

@@ -34,19 +34,24 @@ const jsonOf = (cell: Shown, kind: ValueKind): string => {
     if (cell === null) {
         return 'null';
     }
+
     if (typeof cell === 'boolean') {
         return String(cell);
     }
+
     if (typeof cell === 'number') {
         if (kind === 'boolean' && (cell === 0 || cell === 1)) {
             return String(cell === 1);
         }
+
         return Number.isFinite(cell) ? String(cell) : 'null';
     }
+
     if (typeof cell === 'string') {
         if (isNumericKind(kind) && JSON_NUMBER.test(cell)) {
             return cell;
         }
+
         if (kind === 'json') {
             try {
                 return JSON.stringify(JSON.parse(cell));
@@ -54,8 +59,10 @@ const jsonOf = (cell: Shown, kind: ValueKind): string => {
                 return JSON.stringify(cell);
             }
         }
+
         return JSON.stringify(cell);
     }
+
     return cell.kind === 'default' ? 'null' : JSON.stringify(copyTextOf(cell));
 };
 
@@ -70,13 +77,17 @@ const toJson = ({ columns, rows }: CopyInput): string => {
     if (rows.length === 0) {
         return '[]';
     }
+
     const objects = rows.map((row) => {
         if (columns.length === 0) {
             return '  {}';
         }
+
         const fields = columns.map((column, index) => `    ${JSON.stringify(column.name)}: ${jsonOf(row[index] ?? null, column.kind)}`);
+
         return `  {\n${fields.join(',\n')}\n  }`;
     });
+
     return `[\n${objects.join(',\n')}\n]`;
 };
 
@@ -84,7 +95,9 @@ const toSql = ({ columns, rows, target }: CopyInput): string => {
     if (target === undefined) {
         throw new Error('Copying as SQL needs the table the rows belong to.');
     }
+
     const head = `INSERT INTO ${qualifiedName(target)} (${columns.map((column) => quoteIdentifier(target.engine, column.name)).join(', ')}) VALUES`;
+
     return rows.map((row) => `${head} (${columns.map((column, index) => sqlLiteral(target.engine, row[index] ?? null, column.kind)).join(', ')});`).join('\n');
 };
 

package/src/grid/display.ts

@@ -1,5 +1,5 @@
 import { formatBytes, formatNumeral } from '@adecore/ui/format';
-import type { BinaryValue, Cell, EditValue, ValueKind } from '../protocol/index.ts';
+import type { Cell, EditValue, ValueKind } from '../protocol/index.ts';
 import { isNumericKind } from '../sql.ts';
 import type { GridColumn } from './types.ts';
 
@@ -21,6 +21,7 @@ export type NumberNotation = 'database' | 'region';
 
 /* A cell never draws more than this, however long the text: the DOM stays small and the cell is one line anyway. */
 export const DISPLAY_LIMIT = 200;
+
 /* How many bytes of a binary value the cell spells out. */
 export const BINARY_PREVIEW_BYTES = 8;
 
@@ -33,9 +34,11 @@ export const isPreview = (cell: Shown): boolean => {
     if (!isObject(cell)) {
         return false;
     }
+
     if (cell.kind === 'longText') {
         return true;
     }
+
     return cell.kind === 'binary' && cell.hex.length < cell.length * 2;
 };
 
@@ -44,13 +47,16 @@ export const numeralText = (numeral: string | number, notation: NumberNotation):
     if (notation === 'database') {
         return String(numeral);
     }
+
     const formatted = formatNumeral(numeral);
+
     return formatted === String(numeral).trim() ? String(numeral) : formatted;
 };
 
 /* Identifiers are labels, even when the database stores their characters as a number. */
 export function columnNotation(column: GridColumn, notation: NumberNotation): NumberNotation {
     const identifierName = (name: string): boolean => /^(?:id|.+_id)$/i.test(name) || /(?:Id|ID)$/.test(name);
+
     return column.primaryKey === true ||
         column.foreignKey === true ||
         column.autoIncrement === true ||
@@ -65,18 +71,23 @@ const cut = (text: string): string => (text.length > DISPLAY_LIMIT ? `${text.sli
 export const cellView = (cell: Shown, kind: ValueKind, notation: NumberNotation = 'database'): CellView => {
     const numeric = isNumericKind(kind);
     const align = numeric ? 'end' : 'start';
+
     if (cell === null) {
         return { text: 'NULL', tone: 'null', align };
     }
+
     if (typeof cell === 'boolean') {
         return { text: cell ? 'true' : 'false', tone: 'value', align };
     }
+
     if (typeof cell === 'number') {
         return { text: numeric ? numeralText(cell, notation) : String(cell), tone: 'value', align };
     }
+
     if (typeof cell === 'string') {
         return { text: cut(numeric ? numeralText(cell, notation) : cell), tone: 'value', align };
     }
+
     switch (cell.kind) {
         case 'default':
             return { text: 'DEFAULT', tone: 'default', align };
@@ -85,6 +96,7 @@ export const cellView = (cell: Shown, kind: ValueKind, notation: NumberNotation
         case 'binary': {
             const shown = cell.hex.slice(0, BINARY_PREVIEW_BYTES * 2);
             const truncated = shown.length < cell.length * 2;
+
             return { text: `0x${shown}${truncated ? ELLIPSIS : ''}`, tone: 'value', align: 'start', suffix: formatBytes(cell.length) };
         }
     }
@@ -95,9 +107,11 @@ export const copyTextOf = (cell: Shown): string => {
     if (cell === null) {
         return 'NULL';
     }
+
     if (typeof cell !== 'object') {
         return String(cell);
     }
+
     switch (cell.kind) {
         case 'default':
             return 'DEFAULT';
@@ -111,8 +125,8 @@ export const copyTextOf = (cell: Shown): string => {
 /* An edit as a cell, so the grid draws a pending value the way it draws a loaded one. */
 export const shownOfEdit = (value: EditValue): Shown => {
     if (value !== null && typeof value === 'object' && value.kind === 'binary') {
-        const binary = value as BinaryValue;
-        return { kind: 'binary', hex: binary.hex, length: binary.hex.length / 2 };
+        return { kind: 'binary', hex: value.hex, length: value.hex.length / 2 };
     }
+
     return value as Shown;
 };

package/src/grid/edit-value.ts

@@ -11,42 +11,53 @@ export const draftOf = (value: Cell | Value | { readonly kind: 'default' }): str
     if (value === null) {
         return '';
     }
+
     if (typeof value !== 'object') {
         return String(value);
     }
+
     if (value.kind === 'binary') {
         return `0x${value.hex}`;
     }
+
     if (value.kind === 'longText') {
         return value.preview;
     }
+
     return '';
 };
 
 /* What a person typed, as the value to send. A number the text spells exactly stays a number; anything else goes as text and the server decides. */
 export const parseDraft = (text: string, kind: ValueKind): EditValue => {
     const trimmed = text.trim();
+
     if (trimmed === '' && EMPTY_IS_NULL.has(kind)) {
         return null;
     }
+
     switch (kind) {
         case 'integer': {
             const number = Number(trimmed);
+
             return INTEGER.test(trimmed) && Number.isSafeInteger(number) ? number : trimmed;
         }
         case 'float': {
             const number = Number(trimmed);
+
             return Number.isFinite(number) ? number : trimmed;
         }
         case 'boolean': {
             const lower = trimmed.toLowerCase();
+
             if (lower === 'true' || lower === '1') {
                 return true;
             }
+
             return lower === 'false' || lower === '0' ? false : trimmed;
         }
         case 'binary': {
             const match = HEX.exec(trimmed);
+
             return match !== null && match[1]!.length % 2 === 0 ? { kind: 'binary', hex: match[1]!.toLowerCase() } : trimmed;
         }
         case 'decimal':

package/src/grid/enum-type.ts

@@ -11,44 +11,59 @@ const DECLARATION = /^(enum|set)\s*\(/i;
  */
 export const parseEnumType = (type: string): EnumType | null => {
     const head = DECLARATION.exec(type.trim());
+
     if (head === null) {
         return null;
     }
+
     const source = type.trim().slice(head[0].length);
     const values: string[] = [];
     let position = 0;
+
     while (position < source.length) {
         if (source[position] !== "'") {
             return null;
         }
+
         position++;
         let value = '';
+
         for (;;) {
             if (position >= source.length) {
                 return null;
             }
+
             if (source[position] === "'") {
                 if (source[position + 1] === "'") {
                     value += "'";
                     position += 2;
+
                     continue;
                 }
+
                 position++;
+
                 break;
             }
+
             value += source[position];
             position++;
         }
+
         values.push(value);
         const next = source[position];
+
         if (next === ')') {
             return source.slice(position + 1).trim() === '' ? tidy(head[1]!, values) : null;
         }
+
         if (next !== ',') {
             return null;
         }
+
         position++;
     }
+
     return null;
 };