@platforma-sdk/ui-vue 1.30.38 → 1.31.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@platforma-sdk/ui-vue",
-  "version": "1.30.38",
+  "version": "1.31.1",
   "type": "module",
   "main": "dist/lib.umd.cjs",
   "module": "dist/lib.js",
@@ -25,8 +25,8 @@
     "comlink": "~4.4.2",
     "lru-cache": "^11.1.0",
     "vue": "^3.5.13",
-    "@platforma-sdk/model": "^1.30.37",
-    "@milaboratories/uikit": "^2.2.75"
+    "@milaboratories/uikit": "^2.2.75",
+    "@platforma-sdk/model": "^1.30.37"
   },
   "devDependencies": {
     "@faker-js/faker": "^9.2.0",
@@ -47,8 +47,8 @@
     "vue-tsc": "^2.1.10",
     "yarpm": "^1.2.0",
     "zod": "~3.23.8",
-    "@milaboratories/eslint-config": "^1.0.4",
-    "@milaboratories/helpers": "^1.6.11"
+    "@milaboratories/helpers": "^1.6.11",
+    "@milaboratories/eslint-config": "^1.0.4"
   },
   "scripts": {
     "test": "vitest run --passWithNoTests",

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

@@ -1,10 +1,3 @@
-import type {
-  ColDef,
-  ICellRendererParams,
-  IServerSideDatasource,
-  IServerSideGetRowsParams,
-  RowModelType,
-} from 'ag-grid-enterprise';
 import type {
   AxisId,
   PlDataTableGridStateWithoutSheets,
@@ -24,21 +17,28 @@ import {
   type PlDataTableSheet,
   type PTableVector,
 } from '@platforma-sdk/model';
+import type {
+  ColDef,
+  ICellRendererParams,
+  IServerSideDatasource,
+  IServerSideGetRowsParams,
+  RowModelType,
+} from 'ag-grid-enterprise';
+import canonicalize from 'canonicalize';
 import * as lodash from 'lodash';
-import type { PlAgDataTableV2Row, PTableKeyJson } from '../types';
-import { makeRowNumberColDef, PlAgDataTableRowNumberColId } from './row-number';
-import { objectHash } from '../../../objectHash';
 import type { Ref } from 'vue';
+import { objectHash } from '../../../objectHash';
+import type { PlAgHeaderComponentParams, PlAgHeaderComponentType } from '../../PlAgColumnHeader';
+import { PlAgColumnHeader } from '../../PlAgColumnHeader';
+import { PlAgTextAndButtonCell } from '../../PlAgTextAndButtonCell';
+import type { PlAgDataTableV2Row, PTableKeyJson } from '../types';
 import {
   defaultValueFormatter,
   isLabelColumn,
   PTableHidden,
 } from './common';
-import canonicalize from 'canonicalize';
-import type { PlAgHeaderComponentType, PlAgHeaderComponentParams } from '../../PlAgColumnHeader';
-import { PlAgColumnHeader } from '../../PlAgColumnHeader';
-import { PlAgTextAndButtonCell } from '../../PlAgTextAndButtonCell';
 import { defaultMainMenuItems } from './menu-items';
+import { makeRowNumberColDef, PlAgDataTableRowNumberColId } from './row-number';
 
 /** Convert columnar data from the driver to rows, used by ag-grid */
 function columns2rows(
@@ -192,13 +192,23 @@ export async function updatePFrameGridOptions(
     }
   }
 
-  // indices of axes in allIndices array
-  const axes: number[] = [];
-  for (let i = 0; i < numberOfAxes; ++i) {
-    const fieldIdx = axisToFieldIdx.get(i);
-    if (fieldIdx === undefined || fieldIdx === -1) throw new Error('assertion exception');
-    axes.push(fieldIdx);
-  }
+  // Construct the `axes` array for key generation in `columns2rows`.
+  // The key components should be ordered according to the display order of axis columns from the `fields` array.
+  const axes: number[] = fields.filter((idx) => specs[idx].type === 'axis').map((idx) => {
+    const r = allIndices.indexOf(idx);
+    if (r === -1) {
+      console.error(
+        'Key construction error: Original axis spec index from `fields` not found in `allIndices`.',
+        {
+          originalAxisSpecIdx: idx,
+        },
+      );
+      throw new Error(
+        `Assertion failed: Original axis spec index ${idx} (from fields) for key construction not found in allIndices.`,
+      );
+    }
+    return r;
+  });
 
   const requestIndices: number[] = [];
   const resultMapping: number[] = [];

package/src/components/PlMultiSequenceAlignment/data.ts

@@ -3,8 +3,6 @@ import type {
   AxisId,
   CalculateTableDataRequest,
   CanonicalizedJson,
-  ColumnJoinEntry,
-  InlineColumnJoinEntry,
   PColumnIdAndSpec,
   PColumnPredicate,
   PFrameHandle,
@@ -13,7 +11,6 @@ import type {
   PTableColumnIdAxis,
   PTableColumnIdColumn,
   PTableColumnIdJson,
-  PTableSorting,
 } from '@platforma-sdk/model';
 import {
   canonicalizeJson,
@@ -280,7 +277,7 @@ async function getSequenceRows(
     rowSelectionModel,
   );
 
-  const predef = {
+  const predef: CalculateTableDataRequest<PObjectId> = {
     src: {
       type: 'outer',
       primary: {
@@ -288,40 +285,32 @@ async function getSequenceRows(
         entries: [
           ...(filterColumn && filterColumn.data.length > 0
             ? [
-              {
-                type: 'inlineColumn',
-                column: filterColumn,
-              } satisfies InlineColumnJoinEntry,
+                {
+                  type: 'inlineColumn' as const,
+                  column: filterColumn,
+                },
               ]
             : []),
-          ...linkerColumns.map((c) => ({
-            type: 'column',
-            column: c.columnId,
-          } satisfies ColumnJoinEntry<PObjectId>)),
           ...sequenceColumnIds.map((c) => ({
-            type: 'column',
+            type: 'column' as const,
             column: c,
-          } satisfies ColumnJoinEntry<PObjectId>)),
-        ].filter((e): e is ColumnJoinEntry<PObjectId> => e !== undefined),
+          })),
+        ],
       },
-      secondary: labelColumnIds
-        .map((c) => parseJson(c))
-        .filter((c) => c.type === 'column')
-        .map((c) => ({
-          type: 'column',
-          column: c.id,
-        } satisfies ColumnJoinEntry<PObjectId>)),
+      secondary: [
+        ...linkerColumns.map((c) => c.columnId),
+        ...labelColumnIds.map((c) => parseJson(c))
+          .filter((c) => c.type === 'column')
+          .map((c) => c.id),
+      ].map((c) => ({
+        type: 'column' as const,
+        column: c,
+      })),
     },
     filters: [],
-    sorting: sequenceColumnIds.map((c) => ({
-      column: {
-        type: 'column',
-        id: c,
-      },
-      ascending: true,
-      naAndAbsentAreLeastValues: true,
-    } satisfies PTableSorting)),
-  } satisfies CalculateTableDataRequest<PObjectId>;
+
+    sorting: [], // @TODO: may be add sorting ?
+  };
 
   const def = JSON.parse(JSON.stringify(predef));
   const table = await pFrameDriver.calculateTableData(pframe, def);

package/src/components/PlTableFilters/PlTableFilters.vue

@@ -1,20 +1,21 @@
 <script lang="ts" setup>
 import type { ListOption } from '@milaboratories/uikit';
-import { PlBtnGhost, PlIcon24, PlSlideModal, PlMaskIcon16, PlMaskIcon24 } from '@milaboratories/uikit';
-import { computed, onBeforeUnmount, onMounted, reactive, ref, toRefs, watch } from 'vue';
+import { PlBtnGhost, PlBtnSecondary, PlIcon24, PlMaskIcon16, PlMaskIcon24, PlSlideModal } from '@milaboratories/uikit';
 import type {
-  PlTableFiltersModel,
-  PlTableFilterType,
   PlTableFilter,
-  PTableColumnSpec,
+  PlTableFilterColumnId,
+  PlTableFiltersModel,
   PlTableFiltersState,
   PlTableFiltersStateEntry,
-  PlTableFilterColumnId,
+  PlTableFilterType,
+  PTableColumnSpec,
 } from '@platforma-sdk/model';
 import * as lodash from 'lodash';
-import type { PlTableFiltersDefault, PlTableFiltersRestriction } from '../PlAgDataTable/types';
-import PlTableFilterEntry from './PlTableFilterEntry.vue';
+import { computed, onBeforeUnmount, onMounted, reactive, ref, toRefs, watch } from 'vue';
+import type { PlTableFiltersRestriction } from '../PlAgDataTable/types';
+import { useDataTableToolsPanelTarget } from '../PlAgDataTableToolsPanel';
 import PlTableAddFilter from './PlTableAddFilter.vue';
+import PlTableFilterEntry from './PlTableFilterEntry.vue';
 import {
   filterTypesNumber,
   filterTypesString,
@@ -25,13 +26,14 @@ import {
   makePredicate,
 } from './filters_logic';
 import './pl-table-filters.scss';
-import { useDataTableToolsPanelTarget } from '../PlAgDataTableToolsPanel';
+
+type DefaultFilters = (spec: PTableColumnSpec) => (PlTableFilter | undefined);
 
 const model = defineModel<PlTableFiltersModel>({ required: true });
 const props = defineProps<{
   columns: Readonly<PTableColumnSpec[]>;
   restrictions?: Readonly<PlTableFiltersRestriction[]>;
-  defaults?: Readonly<PlTableFiltersDefault[]>;
+  defaults?: DefaultFilters;
 }>();
 const { columns, restrictions, defaults } = toRefs(props);
 
@@ -53,6 +55,27 @@ const columnsById = computed<Record<PlTableFilterColumnId, PTableColumnSpec>>(()
   }
   return result;
 });
+
+const defaultsMap = computed<Record<PlTableFilterColumnId, PlTableFiltersStateEntry>>(() => {
+  const cols = columns.value;
+  const defFn = defaults.value;
+
+  if (!cols || !defFn) return {};
+
+  const result: Record<PlTableFilterColumnId, PlTableFiltersStateEntry> = {};
+  for (const column of cols) {
+    const f = defFn(column);
+    if (!f) continue;
+    const id = makeColumnId(column);
+    result[id] = {
+      columnId: id,
+      filter: f,
+      disabled: false,
+    };
+  }
+  return result;
+});
+
 const restrictionsMap = computed<Record<PlTableFilterColumnId, PlTableFilterType[]>>(() => {
   const restrictionsValue = restrictions.value ?? [];
   const map: Record<PlTableFilterColumnId, PlTableFilterType[]> = {};
@@ -65,21 +88,6 @@ const restrictionsMap = computed<Record<PlTableFilterColumnId, PlTableFilterType
   }
   return map;
 });
-const defaultsMap = computed<Record<PlTableFilterColumnId, PlTableFiltersStateEntry>>(() => {
-  const defaultsValue = defaults.value ?? [];
-  const map: Record<PlTableFilterColumnId, PlTableFiltersStateEntry> = {};
-  for (const [id, column] of Object.entries(columnsById.value)) {
-    const entry = lodash.find(defaultsValue, (entry) => lodash.isEqual(entry.column.id, column.id));
-    if (entry) {
-      map[id] = {
-        columnId: id,
-        filter: entry.default,
-        disabled: false,
-      };
-    }
-  }
-  return map;
-});
 
 /* State upgrader */ (() => {
   const state = model.value.state;
@@ -93,10 +101,30 @@ const defaultsMap = computed<Record<PlTableFilterColumnId, PlTableFiltersStateEn
       }));
   }
 })();
+
+const defaultState = () => lodash.cloneDeep(Object.values(defaultsMap.value));
+
 const makeState = (state?: PlTableFiltersState): PlTableFiltersState => {
-  return state ?? Object.values(defaultsMap.value);
+  return state ?? [];
 };
 const reactiveModel = reactive({ state: makeState(model.value.state) });
+
+const resetToDefaults = () => {
+  reactiveModel.state = defaultState();
+};
+
+watch(
+  () => columns.value,
+  (columns, previousColumns) => {
+    // @TODO: we need to somehow store that user modified defaults
+    // rn we will e.g. reset to defaults on page refresh if user removed all filters at all
+    if (defaults.value && model.value.state?.length === 0 && (!previousColumns || previousColumns.length === 0) && columns.length > 0) {
+      resetToDefaults();
+    }
+  },
+  { immediate: true },
+);
+
 watch(
   () => model.value,
   (model) => {
@@ -178,6 +206,7 @@ const makeFilter = (columnId: string): PlTableFiltersStateEntry =>
     filter: getFilterDefault(filterOptions.value[columnId][0].value),
     disabled: false,
   };
+
 const resetFilter = (index: number) => {
   reactiveModel.state[index] = makeFilter(reactiveModel.state[index].columnId);
 };
@@ -306,6 +335,7 @@ const teleportTarget = useDataTableToolsPanelTarget();
 
       <div v-if="!filterOptionsPresent">No filters applicable</div>
     </div>
+    <PlBtnSecondary v-if="defaults" @click.stop="resetToDefaults">Reset to defaults</PlBtnSecondary>
   </PlSlideModal>
 
   <PlTableAddFilter