@webitel/ui-datalist 1.0.84 → 1.0.86

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-datalist",
-  "version": "1.0.84",
+  "version": "1.0.86",
   "description": "Toolkit for building data lists in webitel ui system",
   "scripts": {
     "make-all": "npm version patch --git-tag-version false && ( npm run lint:fix || true) && (npm run build:types || true) && npm run utils:publish",
@@ -36,7 +36,7 @@
     "@vuelidate/core": "^2.0.3",
     "@vuelidate/validators": "^2.0.4",
     "@vueuse/core": "^13.3.0",
-    "@webitel/api-services": "^0.0.73",
+    "@webitel/api-services": "^0.0.74",
     "@webitel/styleguide": "^24.12.61",
     "@webitel/ui-sdk": "^25.8.62",
     "zod": "^3.25.55"

package/src/modules/headers/createTableHeadersStore.ts

@@ -1,7 +1,7 @@
 import { WtTableHeader } from '@webitel/ui-sdk/components/wt-table/types/WtTable';
 import { sortToQueryAdapter } from '@webitel/ui-sdk/scripts';
 import { SortSymbols } from '@webitel/ui-sdk/scripts/sortQueryAdapters';
-import { computed, ref, nextTick } from 'vue';
+import { computed, nextTick, ref } from 'vue';
 
 import { createDatalistStore } from '../_shared/createDatalistStore';
 import { PersistedStorageType } from '../persist/PersistedStorage.types';
@@ -58,11 +58,30 @@ export const tableHeadersStoreBody = ({
 
   const setHeaderOrder = (orderedFields: string[]) => {
     const arrayFieldOrder = new Map<string, number>();
-    headers.value.forEach((header, idx) => arrayFieldOrder.set(header.field, idx));
-
-    const newOrder = orderedFields.map(field => arrayFieldOrder.get(field));
-
-    return newOrder.map(idx => headers.value[idx]);
+    headers.value.forEach((header, idx) =>
+      arrayFieldOrder.set(header.field, idx),
+    );
+
+    const newOrder = orderedFields.map((field) => arrayFieldOrder.get(field));
+
+    const newOrderFiltered = newOrder
+      .map((idx) => headers.value[idx])
+      .filter((header) => header);
+
+    /**
+     * @author @Oleksandr Palonnyi
+     *
+     * [WTEL-8038](https://webitel.atlassian.net/browse/WTEL-8038)
+     *
+     * Additionally, we append the `show: true` property to each item
+     * to ensure that all newly processed elements are visible by default.
+     * */
+    return newOrderFiltered.map((item) => {
+      return {
+        ...item,
+        show: true,
+      };
+    });
   };
 
   const updateFields = (fields: string[]) => {
@@ -71,7 +90,9 @@ export const tableHeadersStoreBody = ({
       show: fields.includes(header.field),
     }));
 
-    const customFields = fields.filter((field) => !headers.value.some((header) => header.field === field));
+    const customFields = fields.filter(
+      (field) => !headers.value.some((header) => header.field === field),
+    );
     const customFieldHeaders = customFields.map((field) => ({
       show: true,
       field,
@@ -79,10 +100,16 @@ export const tableHeadersStoreBody = ({
     }));
 
     const mergedHeaders = [...newHeaders, ...customFieldHeaders];
-    const orderedFields = fields.filter(field => mergedHeaders.some(header => header.field === field));
+    const orderedFields = fields.filter((field) =>
+      mergedHeaders.some((header) => header.field === field),
+    );
     const reordered = setHeaderOrder(orderedFields);
 
-    updateShownHeaders(reordered);
+    const uniqueMerged = mergedHeaders.filter(
+      (merged) => !reordered.some((r) => r.field === merged.field),
+    );
+
+    updateShownHeaders([...reordered, ...uniqueMerged]);
   };
 
   const updateSort = (column) => {
@@ -170,14 +197,18 @@ export const tableHeadersStoreBody = ({
       },
     });
 
-    return Promise.allSettled([restoreFields(), restoreSort(), restoreColumnWidths()]);
+    return Promise.allSettled([
+      restoreFields(),
+      restoreSort(),
+      restoreColumnWidths(),
+    ]);
   };
 
   const getHeaderByField = (field: string) => {
     return headers.value.find((header) => header.field === field);
   };
 
-  const columnResize = ({columnName, columnWidth}) => {
+  const columnResize = ({ columnName, columnWidth }) => {
     const column = getHeaderByField(columnName);
 
     if (column) {