@platforma-sdk/ui-vue 1.24.5 → 1.24.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@platforma-sdk/ui-vue",
-  "version": "1.24.5",
+  "version": "1.24.10",
   "type": "module",
   "main": "dist/lib.umd.cjs",
   "module": "dist/lib.js",
@@ -24,7 +24,7 @@
     "ag-grid-enterprise": "^33.0.4",
     "ag-grid-vue3": "^33.0.4",
     "@milaboratories/uikit": "^2.2.60",
-    "@platforma-sdk/model": "^1.24.5"
+    "@platforma-sdk/model": "^1.24.10"
   },
   "devDependencies": {
     "@faker-js/faker": "^9.2.0",
@@ -46,7 +46,7 @@
     "@types/semver": "^7.5.8",
     "rollup-plugin-sourcemaps2": "^0.5.0",
     "@milaboratories/helpers": "^1.6.11",
-    "@milaboratories/eslint-config": "^1.0.2"
+    "@milaboratories/eslint-config": "^1.0.3"
   },
   "scripts": {
     "test": "vitest run --passWithNoTests",

package/src/components/PlAgDataTable/PlAgDataTable.vue

@@ -22,6 +22,7 @@ import { PlDropdownLine } from '@milaboratories/uikit';
 import {
   getAxisId,
   getRawPlatformaInstance,
+  type PlDataTableGridStateWithoutSheets,
   type AxisId,
   type PlDataTableState,
   type PTableColumnSpec,
@@ -118,10 +119,11 @@ function makeSorting(state?: SortState): PTableSorting[] {
   );
 }
 
-const gridState = computed({
+const gridState = computed<PlDataTableGridStateWithoutSheets>({
   get: () => {
     const state = tableState.value;
     return {
+      sourceId: state.gridState.sourceId,
       columnOrder: state.gridState.columnOrder,
       sort: state.gridState.sort,
       columnVisibility: state.gridState.columnVisibility,
@@ -202,7 +204,7 @@ watch(
     const newSheetsState: Record<string, string | number> = {};
     for (const sheet of settings.sheets) {
       const sheetId = makeSheetId(sheet.axis);
-      newSheetsState[sheetId] = oldSheetsState[sheetId] ?? sheet.defaultValue ?? sheet.options[0].value;
+      newSheetsState[sheetId] = oldSheetsState[sheetId] ?? sheet.defaultValue ?? sheet.options[0]?.value;
     }
     sheetsState.value = newSheetsState;
   },
@@ -316,9 +318,10 @@ const onGridReady = (event: GridReadyEvent) => {
 
 const makePartialState = (state: GridState) => {
   return {
+    sourceId: gridState.value.sourceId,
     columnOrder: state.columnOrder,
     sort: state.sort,
-    columnVisibility: state.columnVisibility ?? (state.columnOrder ? { hiddenColIds: [] } : undefined),
+    columnVisibility: state.columnVisibility,
   };
 };
 
@@ -443,7 +446,7 @@ watch(
             settings.pTable,
             settings.sheets ?? [],
             !!props.clientSideModel || !!selectedRows.value,
-            gridState.value?.columnVisibility?.hiddenColIds,
+            gridState,
             {
               showCellButtonForAxisId: props.showCellButtonForAxisId,
               cellButtonInvokeRowsOnDoubleClick: props.cellButtonInvokeRowsOnDoubleClick,

package/src/components/PlAgDataTable/sources/row-number.ts

@@ -59,8 +59,11 @@ function destroyCellFake(cellFake: HTMLDivElement) {
 }
 
 function adjustRowNumberColumnWidth(gridApi: GridApi, cellFake: HTMLDivElement, force?: boolean) {
+  const rowNode = gridApi.getDisplayedRowAtIndex(gridApi.getLastDisplayedRowIndex());
+  if (!rowNode) return;
+
   const lastDisplayedRowNumber = gridApi.getCellValue({
-    rowNode: gridApi.getDisplayedRowAtIndex(gridApi.getLastDisplayedRowIndex())!,
+    rowNode,
     colKey: PlAgDataTableRowNumberColId,
   });
 
@@ -86,6 +89,7 @@ function adjustRowNumberColumnWidth(gridApi: GridApi, cellFake: HTMLDivElement,
 }
 
 function fixColumnOrder(gridApi: GridApi) {
+  if (gridApi.isDestroyed()) return;
   const columns = gridApi.getAllGridColumns() ?? [];
   const selectionIndex = columns.findIndex(isColumnSelectionCol);
   const numRowsIndex = columns.findIndex((column) => column.getId() === PlAgDataTableRowNumberColId);

package/src/components/PlAgDataTable/sources/table-source.ts

@@ -6,6 +6,9 @@ import type {
   RowModelType,
   ValueFormatterParams,
 } from 'ag-grid-enterprise';
+import type {
+  PlDataTableGridStateWithoutSheets,
+} from '@platforma-sdk/model';
 import {
   getAxisId,
   pTableValue,
@@ -28,6 +31,8 @@ import type { PlAgDataTableRow, PTableRowKey } from '../types';
 import { makeRowNumberColDef, PlAgDataTableRowNumberColId } from './row-number';
 import { getHeterogeneousColumns, updatePFrameGridOptionsHeterogeneousAxes } from './table-source-heterogeneous';
 import { defaultMainMenuItems } from './menu-items';
+import { objectHash } from '../../../objectHash';
+import type { Ref } from 'vue';
 
 type PlAgCellButtonAxisParams = {
   showCellButtonForAxisId?: AxisId;
@@ -154,7 +159,7 @@ export async function updatePFrameGridOptions(
   pt: PTableHandle,
   sheets: PlDataTableSheet[],
   clientSide: boolean,
-  hiddenColIds?: string[],
+  gridState: Ref<PlDataTableGridStateWithoutSheets>,
   cellButtonAxisParams?: PlAgCellButtonAxisParams,
 ): Promise<{
     columnDefs: ColDef[];
@@ -164,6 +169,21 @@ export async function updatePFrameGridOptions(
   }> {
   const specs = await pfDriver.getSpec(pt);
 
+  const oldSourceId = gridState.value.sourceId;
+
+  const newSourceId = await objectHash(specs);
+
+  const isSourceIdChanged = oldSourceId !== newSourceId;
+
+  const columnVisibility = isSourceIdChanged ? undefined : gridState.value.columnVisibility;
+
+  if (isSourceIdChanged) {
+    gridState.value = {
+      ...gridState.value,
+      sourceId: newSourceId,
+    };
+  }
+
   let numberOfAxes = specs.findIndex((s) => s.type === 'column');
   if (numberOfAxes === -1) numberOfAxes = specs.length;
 
@@ -228,7 +248,7 @@ export async function updatePFrameGridOptions(
   const rowCount = ptShape.rows;
   const columnDefs: ColDef<PlAgDataTableRow>[] = [
     makeRowNumberColDef(),
-    ...fields.map((i) => makeColDef(i, specs[i], hiddenColIds, cellButtonAxisParams)),
+    ...fields.map((i) => makeColDef(i, specs[i], columnVisibility?.hiddenColIds, cellButtonAxisParams)),
   ];
 
   if (hColumns.length > 0) {

package/src/components/PlAgGridColumnManager/PlAgGridColumnManager.vue

@@ -40,12 +40,15 @@ function toggleColumnVisibility(col: Column) {
 watch(
   () => gridApi.value,
   (gridApi) => {
+    if (gridApi.isDestroyed()) return;
+
     columns.value = gridApi.getAllGridColumns();
     if (columns.value.length > 0) {
       gridApi.moveColumns(columns.value, 0);
     }
 
     gridApi.addEventListener('displayedColumnsChanged', (event) => {
+      if (gridApi.isDestroyed()) return;
       columns.value = event.api.getAllGridColumns();
       listKey.value++;
     });

package/src/lib.ts

@@ -39,6 +39,8 @@ export * from './aggrid';
 
 export * from './utils';
 
+export * from './objectHash';
+
 export * from './computedResult';
 
 export * from './composition/useWatchFetch';

package/src/objectHash.ts

@@ -0,0 +1,24 @@
+import canonicalize from 'canonicalize';
+
+/**
+ * Calculate a hash of a JSON object
+ * @param jsonObject - The JSON object to hash
+ * @returns A hash of the JSON object
+ */
+export async function objectHash(jsonObject: NonNullable<unknown>) {
+  const canonicalJson = canonicalize(jsonObject);
+
+  if (canonicalJson === undefined) {
+    throw new Error('Failed to canonicalize object: Invalid input type or structure');
+  }
+
+  const encoder = new TextEncoder();
+
+  const data = encoder.encode(canonicalJson);
+
+  const digest = await crypto.subtle.digest('SHA-256', data);
+
+  const hashArray = Array.from(new Uint8Array(digest));
+
+  return hashArray.map((b) => b.toString(16).padStart(2, '0')).join('');
+}