@antelopejs/dms-database 0.0.13 → 0.1.0

package/dist/types/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/types/constants.ts"],"names":[],"mappings":";;;AAAa,QAAA,WAAW,GAAG,cAAc,CAAC;AAE7B,QAAA,oBAAoB,GAAG,GAAG,CAAC;AAE3B,QAAA,uBAAuB,GAAG,oBAAoB,CAAC"}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/types/constants.ts"],"names":[],"mappings":";;;AAAa,QAAA,WAAW,GAAG,cAAc,CAAC;AAE7B,QAAA,oBAAoB,GAAG,GAAG,CAAC;AAE3B,QAAA,uBAAuB,GAAG,oBAAoB,CAAC;AAC/C,QAAA,mBAAmB,GAAG,CAAC,CAAC;AAGxB,QAAA,aAAa,GAAG,GAAG,CAAC"}

package/dist/utils/query.d.ts

@@ -10,8 +10,6 @@ export declare function parseFilter(raw: unknown): ParsedFilter | undefined;
 export declare function unwrapIsFilter(raw: unknown): string | undefined;
 export declare function decodeInstanceFilter(raw: unknown): InstanceId | undefined;
 export declare function applyFilterToList<T>(rows: T[], field: keyof T, rawFilter: unknown): T[];
-export declare function applySearchToList<T>(rows: T[], field: keyof T, search: unknown): T[];
 export declare function cellToText(value: unknown): string;
-export declare function applySortToList<T>(rows: T[], sortKey: unknown, sortDirection: unknown): T[];
 export type SortDirection = "asc" | "desc";
 export declare function normalizeSortDirection(value: unknown): SortDirection;

package/dist/utils/query.js

@@ -7,9 +7,7 @@ exports.parseFilter = parseFilter;
 exports.unwrapIsFilter = unwrapIsFilter;
 exports.decodeInstanceFilter = decodeInstanceFilter;
 exports.applyFilterToList = applyFilterToList;
-exports.applySearchToList = applySearchToList;
 exports.cellToText = cellToText;
-exports.applySortToList = applySortToList;
 exports.normalizeSortDirection = normalizeSortDirection;
 const interface_database_1 = require("@antelopejs/interface-database");
 const constants_1 = require("../types/constants");
@@ -69,12 +67,6 @@ function applyFilterToList(rows, field, rawFilter) {
         return rows;
     return rows.filter((row) => predicate(String(row[field] ?? ""), parsed.value));
 }
-function applySearchToList(rows, field, search) {
-    const needle = asNonEmptyString(search)?.toLowerCase();
-    if (!needle)
-        return rows;
-    return rows.filter((row) => cellToText(row[field]).toLowerCase().includes(needle));
-}
 function cellToText(value) {
     if (value === null || value === undefined)
         return "";
@@ -97,18 +89,6 @@ function cellToText(value) {
         return "";
     }
 }
-function compareValues(a, b) {
-    if (typeof a === "number" && typeof b === "number")
-        return a - b;
-    return cellToText(a).localeCompare(cellToText(b));
-}
-function applySortToList(rows, sortKey, sortDirection) {
-    const key = asNonEmptyString(sortKey);
-    if (!key)
-        return rows;
-    const direction = asNonEmptyString(sortDirection) === "desc" ? -1 : 1;
-    return [...rows].sort((a, b) => compareValues(a[key], b[key]) * direction);
-}
 const SORT_DIRECTION_DESC = "desc";
 function normalizeSortDirection(value) {
     return asNonEmptyString(value) === SORT_DIRECTION_DESC ? "desc" : "asc";

package/dist/utils/query.js.map

@@ -1 +1 @@
-{"version":3,"file":"query.js","sourceRoot":"","sources":["../../src/utils/query.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"query.js","sourceRoot":"","sources":["../../src/utils/query.ts"],"names":[],"mappings":"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"}

package/frontend-vue/app/{composables → build/composables}/useDataBrowserGrid.ts

@@ -1,88 +1,103 @@
+import { type BrowserTab, DEFAULT_INSTANCE_VALUE } from './useDataBrowserTabs'
 // Per-tab grid state (paging, sort, filters, column widths) and a data cache
 // so switching tabs restores instantly without a refetch. Keyed by
 // BrowserTab.id.
 
 export interface ColumnFilterState {
-	mode: "is" | "contains";
-	value: string;
+	mode: 'is' | 'contains'
+	value: string
 }
 
-export interface GridState {
-	page: number;
-	pageSize: number;
-	sortKey: string | null;
-	sortDirection: "asc" | "desc";
-	search: string;
-	filters: Record<string, ColumnFilterState>;
-	columnWidths: Record<string, number>;
+interface GridState {
+	page: number
+	pageSize: number
+	sortKey: string | null
+	sortDirection: 'asc' | 'desc'
+	search: string
+	filters: Record<string, ColumnFilterState>
+	columnWidths: Record<string, number>
 }
 
 export interface GridColumn {
-	name: string;
+	name: string
 	// Coarse runtime type sampled by the backend: string | number | boolean |
 	// object | array | null | undefined.
-	type: string;
-	isPrimaryKey: boolean;
+	type: string
+	isPrimaryKey: boolean
 }
 
 export interface GridData {
-	columns: GridColumn[];
-	rows: Record<string, unknown>[];
-	total: number;
-	primaryKey: string | null;
+	columns: GridColumn[]
+	rows: Record<string, unknown>[]
+	total: number
+	primaryKey: string | null
 	// Serialised query parameters that produced this payload; lets the grid
 	// skip refetching when nothing changed.
-	paramsKey: string;
+	paramsKey: string
 }
 
-export const GRID_PAGE_SIZES = [25, 50, 100, 200];
+export const GRID_PAGE_SIZES = [25, 50, 100, 200]
 
 function defaultGridState(): GridState {
 	return {
 		page: 0,
-		pageSize: 25,
+		pageSize: 50,
 		sortKey: null,
-		sortDirection: "asc",
-		search: "",
+		sortDirection: 'asc',
+		search: '',
 		filters: {},
 		columnWidths: {},
-	};
+	}
 }
 
 export function useDataBrowserGrid() {
 	const states = useDmsState<Record<string, GridState>>(
-		"dms-database-grid-states",
+		'dms-database-grid-states',
 		() => ({}),
-	);
+	)
 	const cache = useDmsState<Record<string, GridData>>(
-		"dms-database-grid-cache",
+		'dms-database-grid-cache',
 		() => ({}),
-	);
+	)
 
 	function getState(tabId: string): GridState {
-		if (!states.value[tabId]) states.value[tabId] = defaultGridState();
-		return states.value[tabId];
+		if (!states.value[tabId]) states.value[tabId] = defaultGridState()
+		return states.value[tabId]
 	}
 
 	function getCache(tabId: string): GridData | null {
-		return cache.value[tabId] ?? null;
+		return cache.value[tabId] ?? null
 	}
 
 	function setCache(tabId: string, data: GridData) {
-		cache.value[tabId] = data;
+		cache.value[tabId] = data
 	}
 
 	function invalidate(tabId: string) {
-		Reflect.deleteProperty(cache.value, tabId);
+		Reflect.deleteProperty(cache.value, tabId)
 	}
 
 	// Forget everything about a closed tab.
 	function drop(tabId: string) {
-		Reflect.deleteProperty(states.value, tabId);
-		Reflect.deleteProperty(cache.value, tabId);
+		Reflect.deleteProperty(states.value, tabId)
+		Reflect.deleteProperty(cache.value, tabId)
+	}
+
+	// A tab switched to another instance keeps what the user narrowed the
+	// rows to (search, filters, sort, page size, widths), from its first page.
+	function carry(fromId: string, toId: string) {
+		const from = states.value[fromId]
+		if (!from) return
+		states.value[toId] = {
+			...from,
+			filters: { ...from.filters },
+			columnWidths: { ...from.columnWidths },
+			page: 0,
+		}
+		Reflect.deleteProperty(cache.value, toId)
 	}
 
-	return { getState, getCache, setCache, invalidate, drop };
+	return { getState, getCache, setCache, invalidate, drop, carry }
 }
 
 // --- query helpers shared by the grid ---
@@ -91,10 +106,10 @@ export function useDataBrowserGrid() {
 // SELECTION_FILTER_KEYS): a data filter on a column literally named `schema`,
 // `table` or `instance` would clobber the selection parameters, so it is never
 // emitted and the filter UI is disabled for these columns.
-const RESERVED_FILTER_FIELDS = new Set(["schema", "table", "instance"]);
+const RESERVED_FILTER_FIELDS = new Set(['schema', 'table', 'instance'])
 
 export function isReservedFilterField(field: string): boolean {
-	return RESERVED_FILTER_FIELDS.has(field);
+	return RESERVED_FILTER_FIELDS.has(field)
 }
 
 // Normalized (empty-pruned, reserved-pruned, name-sorted) filter entries: the
@@ -105,18 +120,18 @@ function activeFilterEntries(
 ): Array<[string, ColumnFilterState]> {
 	return Object.entries(state.filters)
 		.filter(([field, filter]) => filter.value && !isReservedFilterField(field))
-		.sort(([a], [b]) => a.localeCompare(b));
+		.sort(([a], [b]) => a.localeCompare(b))
 }
 
 // Single encoder for the `<mode>:<value>` wire tokens parseFilter decodes
 // server-side (src/utils/query.ts) — the grammar is defined here once instead
 // of scattered string literals.
-export function filterToken(mode: "is" | "contains", value: string): string {
-	return `${mode}:${value}`;
+function filterToken(mode: 'is' | 'contains', value: string): string {
+	return `${mode}:${value}`
 }
 
 export function isFilterToken(value: string): string {
-	return filterToken("is", value);
+	return filterToken('is', value)
 }
 
 // Selection filters identifying the table, in the wire format the browse
@@ -125,11 +140,11 @@ export function browseSelectionQuery(tab: BrowserTab): Record<string, string> {
 	const query: Record<string, string> = {
 		filter_schema: isFilterToken(tab.schema),
 		filter_table: isFilterToken(tab.table),
-	};
+	}
 	if (tab.instance !== DEFAULT_INSTANCE_VALUE) {
-		query.filter_instance = isFilterToken(tab.instance);
+		query.filter_instance = isFilterToken(tab.instance)
 	}
-	return query;
+	return query
 }
 
 export function browseListQuery(
@@ -139,13 +154,13 @@ export function browseListQuery(
 		offset: state.page * state.pageSize,
 		limit: state.pageSize,
 		sortDirection: state.sortDirection,
-	};
-	if (state.sortKey) query.sortKey = state.sortKey;
-	if (state.search) query.search = state.search;
+	}
+	if (state.sortKey) query.sortKey = state.sortKey
+	if (state.search) query.search = state.search
 	for (const [field, filter] of activeFilterEntries(state)) {
-		query[`filter_${field}`] = filterToken(filter.mode, filter.value);
+		query[`filter_${field}`] = filterToken(filter.mode, filter.value)
 	}
-	return query;
+	return query
 }
 
 // Everything that changes the server payload (column widths deliberately not).
@@ -158,5 +173,5 @@ export function browseParamsKey(tab: BrowserTab, state: GridState): string {
 		state.sortDirection,
 		state.search,
 		activeFilterEntries(state),
-	]);
+	])
 }

package/frontend-vue/app/build/composables/useDataBrowserTabs.ts

@@ -0,0 +1,366 @@
+import { CROSS_INSTANCE_SENTINEL } from '../utils/stagedSerialization'
+import { useDataBrowserGrid } from './useDataBrowserGrid'
+import type { InstanceChoice } from '../data/instanceOptions'
+import { rememberTable } from '../data/recentTables'
+import { useStagedEdits } from '../data/stagedEdits'
+import {
+	decodeMatch,
+	instanceFromUrl,
+	instanceToUrl,
+} from '../utils/databaseLinks'
+
+// Shared state for the data-browser tabs: each tab pins a (schema, instance,
+// table) triplet. The active tab is mirrored to the URL query (deep-links) and
+// the whole tab set is persisted to sessionStorage (stays per browser tab); a
+// page refresh brings every tab back, the preview one still a preview.
+
+// A tab's instance as its id and the browse routes' `filter_instance` carry
+// it: these two values, or a named instance id.
+export const DEFAULT_INSTANCE_VALUE = '__DEFAULT__'
+export const CROSS_INSTANCE_VALUE = CROSS_INSTANCE_SENTINEL
+
+/**
+ * A tab's instance as a choice ("all": read-only), as pickers and the URL
+ * (see instanceFromUrl) carry it.
+ */
+export function instanceChoiceOf(instance: string): InstanceChoice {
+	if (instance === DEFAULT_INSTANCE_VALUE) return { kind: 'default' }
+	if (instance === CROSS_INSTANCE_VALUE) return { kind: 'all' }
+	return { kind: 'named', id: instance }
+}
+
+/** The tab instance a choice stands for. */
+export function tabInstanceOf(choice: InstanceChoice): string {
+	if (choice.kind === 'default') return DEFAULT_INSTANCE_VALUE
+	if (choice.kind === 'all') return CROSS_INSTANCE_VALUE
+	return choice.id
+}
+
+/** How a tab names its instance: null for the default one, "@eu", "@all". */
+export function instanceBadge(
+	instance: string,
+	allLabel: string,
+): string | null {
+	if (instance === DEFAULT_INSTANCE_VALUE) return null
+	return `@${instance === CROSS_INSTANCE_VALUE ? allLabel : instance}`
+}
+
+export interface BrowserTab {
+	id: string
+	schema: string
+	// DEFAULT_INSTANCE_VALUE, CROSS_INSTANCE_VALUE or a named instance id.
+	instance: string
+	table: string
+	// VS Code-style preview tab: the next openTab reuses it instead of adding
+	// a new tab. At most one per session; pinning (double-click, pin icon,
+	// drag-reorder, editing a cell) clears the flag.
+	preview?: boolean
+}
+
+const STORAGE_KEY = 'dms-database:data-browser:tabs'
+const ACTIVATIONS_STATE = 'dms-database-browser-activations'
+
+function browserTabId(schema: string, instance: string, table: string): string {
+	return `${schema}::${instance}::${table}`
+}
+
+interface PersistedTabs {
+	tabs: BrowserTab[]
+	activeId: string | null
+}
+
+function readPersisted(): PersistedTabs | null {
+	if (typeof window === 'undefined') return null
+	try {
+		const raw = window.sessionStorage.getItem(STORAGE_KEY)
+		if (!raw) return null
+		const parsed = JSON.parse(raw) as PersistedTabs
+		if (!Array.isArray(parsed.tabs)) return null
+		const tabs = parsed.tabs
+			.filter(
+				(tab) =>
+					tab &&
+					typeof tab.schema === 'string' &&
+					typeof tab.instance === 'string' &&
+					typeof tab.table === 'string',
+			)
+			.map((tab) => ({
+				...tab,
+				id: browserTabId(tab.schema, tab.instance, tab.table),
+				preview: tab.preview === true,
+			}))
+			// Recomputed ids can collide on a legacy/hand-edited payload; duplicate
+			// ids would break the tab bar's v-for keys and closeTab.
+			.filter(
+				(tab, index, all) => all.findIndex((t) => t.id === tab.id) === index,
+			)
+		// The preview slot is a singleton; a hand-edited payload could carry
+		// several — honour only the first.
+		const firstPreview = tabs.findIndex((tab) => tab.preview)
+		for (const [index, tab] of tabs.entries()) {
+			if (index !== firstPreview) tab.preview = false
+		}
+		const activeId = tabs.some((tab) => tab.id === parsed.activeId)
+			? parsed.activeId
+			: (tabs[0]?.id ?? null)
+		return { tabs, activeId }
+	} catch {
+		return null
+	}
+}
+
+export function useDataBrowserTabs() {
+	const tabs = useDmsState<BrowserTab[]>('dms-database-browser-tabs', () => [])
+	const activeId = useDmsState<string | null>(
+		'dms-database-browser-active',
+		() => null,
+	)
+	// Counts the activations, a tab already active included: the sidebar
+	// follows the tab the user goes to, even back to the same one.
+	const activations = useDmsState<number>(ACTIVATIONS_STATE, () => 0)
+	const route = useDmsRoute()
+	const router = useDmsRouter()
+	// Captured at setup so closeTab can drop the closed tab's
+	// grid state itself instead of relying on every caller to remember to.
+	const grid = useDataBrowserGrid()
+	const staged = useStagedEdits()
+
+	const activeTab = computed(
+		() => tabs.value.find((tab) => tab.id === activeId.value) ?? null,
+	)
+	// When tabs span several schemas the tab bar disambiguates its labels.
+	const hasMultipleSchemas = computed(
+		() => new Set(tabs.value.map((tab) => tab.schema)).size > 1,
+	)
+
+	function persist() {
+		if (typeof window === 'undefined') return
+		try {
+			window.sessionStorage.setItem(
+				STORAGE_KEY,
+				JSON.stringify({ tabs: tabs.value, activeId: activeId.value }),
+			)
+		} catch {
+			// Quota/private-mode failures only cost tab restoration.
+		}
+	}
+
+	// The URL carries the ACTIVE tab only (deep-links); per-tab grid state
+	// deliberately stays out of it.
+	function syncUrl() {
+		const tab = activeTab.value
+		const query = { ...route.query }
+		delete query.schema
+		delete query.instance
+		delete query.table
+		delete query.match
+		if (tab) {
+			query.schema = tab.schema
+			query.table = tab.table
+			const instance = instanceToUrl(instanceChoiceOf(tab.instance))
+			if (instance) query.instance = instance
+		}
+		if (
+			Object.keys(query).length === Object.keys(route.query).length &&
+			Object.entries(query).every(([key, value]) => route.query[key] === value)
+		)
+			return
+		void router.replace({ query })
+	}
+
+	function activateTab(id: string) {
+		const tab = tabs.value.find((candidate) => candidate.id === id)
+		if (!tab) return
+		rememberTable({
+			schema: tab.schema,
+			instance: tab.instance,
+			table: tab.table,
+		})
+		activeId.value = id
+		activations.value += 1
+		syncUrl()
+		persist()
+	}
+
+	// Promote a preview tab to a permanent one (double-click, pin icon, drag).
+	function pinTab(id: string) {
+		const tab = tabs.value.find((t) => t.id === id)
+		if (!tab?.preview) return
+		tabs.value = tabs.value.map((t) =>
+			t.id === id ? { ...t, preview: false } : t,
+		)
+		persist()
+	}
+
+	// Opens as a preview by default (VS Code-style: single-click reuses the
+	// preview slot). Pass preview = false for an explicitly permanent open
+	// (sidebar double-click, deep-links) — it also pins the tab if already
+	// open as preview.
+	function openTab(
+		schema: string,
+		instance: string,
+		table: string,
+		preview = true,
+	) {
+		const id = browserTabId(schema, instance, table)
+		const existing = tabs.value.find((tab) => tab.id === id)
+		if (existing) {
+			if (!preview) pinTab(id)
+			activateTab(id)
+			return
+		}
+		const tab: BrowserTab = { id, schema, instance, table, preview }
+		let previewIndex = tabs.value.findIndex((t) => t.preview)
+		// A tab holding staged edits is never replaced: it is kept instead
+		// (staging a cell already keeps it; this guards any other path).
+		if (previewIndex >= 0 && staged.count(tabs.value[previewIndex]!.id) > 0) {
+			pinTab(tabs.value[previewIndex]!.id)
+			previewIndex = -1
+		}
+		if (preview && previewIndex >= 0) {
+			// Reuse the preview slot in place: swap its content, drop the replaced
+			// tab's grid state (its id dies with it).
+			const replaced = tabs.value[previewIndex]!
+			const next = [...tabs.value]
+			next[previewIndex] = tab
+			tabs.value = next
+			grid.drop(replaced.id)
+		} else {
+			tabs.value = [...tabs.value, tab]
+		}
+		activateTab(id)
+	}
+
+	/**
+	 * Puts another table in a tab's place (an instance switch): same position,
+	 * same preview state, and the grid's search, filters and sort carried
+	 * over. A tab already open on that table is activated instead, and the
+	 * replaced one closed.
+	 */
+	function replaceTab(
+		oldId: string,
+		schema: string,
+		instance: string,
+		table: string,
+	) {
+		const index = tabs.value.findIndex((tab) => tab.id === oldId)
+		const old = tabs.value[index]
+		if (!old) return openTab(schema, instance, table, false)
+		const id = browserTabId(schema, instance, table)
+		if (id === oldId) return activateTab(id)
+		if (tabs.value.some((tab) => tab.id === id)) {
+			tabs.value = tabs.value.filter((tab) => tab.id !== oldId)
+			grid.drop(oldId)
+			activateTab(id)
+			return
+		}
+		const next = [...tabs.value]
+		next[index] = { id, schema, instance, table, preview: old.preview }
+		tabs.value = next
+		grid.carry(oldId, id)
+		grid.drop(oldId)
+		activateTab(id)
+	}
+
+	function closeTab(id: string) {
+		const index = tabs.value.findIndex((tab) => tab.id === id)
+		if (index < 0) return
+		const next = tabs.value.filter((tab) => tab.id !== id)
+		tabs.value = next
+		if (activeId.value === id) {
+			// Right neighbour first, then left — mirrors browser tab behaviour.
+			activeId.value = (next[index] ?? next[index - 1])?.id ?? null
+		}
+		// The closed tab's grid state and cached rows go with it — otherwise they
+		// leak for the rest of the session.
+		grid.drop(id)
+		syncUrl()
+		persist()
+	}
+
+	// Reorder (drag & drop): move the dragged tab to the target tab's position.
+	// Pure reorder — pin-on-drag is a gesture policy and lives at the drop site
+	// (the tab bar's onDrop), not in this primitive.
+	function moveTab(draggedId: string, targetId: string) {
+		if (draggedId === targetId) return
+		const next = [...tabs.value]
+		const from = next.findIndex((tab) => tab.id === draggedId)
+		const to = next.findIndex((tab) => tab.id === targetId)
+		if (from < 0 || to < 0) return
+		const [moved] = next.splice(from, 1)
+		if (!moved) return
+		next.splice(to, 0, moved)
+		tabs.value = next
+		persist()
+	}
+
+	// Opens the table the URL names (overview links, the inspector's "Browse
+	// data", relation links, shared URLs): permanently, since the preview
+	// slot is for casual browsing from the list.
+	// The table the URL names, if any.
+	function routeTable() {
+		const schema = route.query.schema
+		const table = route.query.table
+		if (
+			typeof schema !== 'string' ||
+			!schema ||
+			typeof table !== 'string' ||
+			!table
+		)
+			return null
+		const instance = tabInstanceOf(instanceFromUrl(route.query.instance))
+		return {
+			schema,
+			instance,
+			table,
+			id: browserTabId(schema, instance, table),
+			// A link to one row (a relation, a reference) opens the table filtered
+			// on it; the filter shows as a chip the user removes.
+			match: decodeMatch(route.query.match),
+		}
+	}
+
+	function openFromRoute() {
+		const target = routeTable()
+		if (!target) return false
+		const { schema, instance, table, id, match } = target
+		// The route names the active tab: the browser wrote it itself (a tab
+		// activated, a reload), so it opens nothing and a preview tab stays one.
+		if (!match && id === activeId.value) return true
+		if (match) {
+			const state = grid.getState(id)
+			state.filters = { [match.field]: { mode: 'is', value: match.value } }
+			state.page = 0
+		}
+		openTab(schema, instance, table, false)
+		return true
+	}
+
+	// Restore persisted tabs, preview included, then let the URL win for the
+	// active selection. Call once, from the page's onMounted.
+	function restore() {
+		const persisted = readPersisted()
+		if (persisted) {
+			tabs.value = persisted.tabs
+			activeId.value = persisted.activeId
+		}
+		// A schema-only link (?schema=X) is the sidebar's to honour.
+		if (!openFromRoute() && !route.query.schema && activeTab.value) syncUrl()
+	}
+
+	return {
+		tabs,
+		activeId,
+		activeTab,
+		activations,
+		hasMultipleSchemas,
+		openTab,
+		replaceTab,
+		closeTab,
+		activateTab,
+		pinTab,
+		moveTab,
+		restore,
+		openFromRoute,
+	}
+}