@shival99/z-ui 1.2.33 → 1.2.34

package/fesm2022/shival99-z-ui-components-z-table.mjs

@@ -20,6 +20,7 @@ import { ZSafeHtmlPipe } from '@shival99/z-ui/pipes';
 import { ZTranslateService, ZCacheService } from '@shival99/z-ui/services';
 import { createAngularTable, getFacetedMinMaxValues, getFacetedUniqueValues, getFacetedRowModel, getPaginationRowModel, getSortedRowModel, getFilteredRowModel, getExpandedRowModel, getCoreRowModel, FlexRenderDirective } from '@tanstack/angular-table';
 import { NgScrollbar } from 'ngx-scrollbar';
+import { effectOnceIf } from 'ngxtension/effect-once-if';
 import { explicitEffect } from 'ngxtension/explicit-effect';
 import { injectDestroy } from 'ngxtension/inject-destroy';
 import { ZDropdownMenuComponent } from '@shival99/z-ui/components/z-dropdown-menu';
@@ -3056,13 +3057,35 @@ class ZTableComponent {
         explicitEffect([this._zTranslate.currentLang], () => {
             this._dataForceUpdate.update(v => v + 1);
         });
-        explicitEffect([this.zKey, this.zConfig], ([key, config]) => {
-            if (key && config.columns && config.columns.length > 0) {
+        // Use effectOnceIf to load config cache at the right time
+        // For 'local' mode: load immediately when key and columns are available
+        // For 'server' mode: load when zLoading transitions from true to false (first time)
+        effectOnceIf(computed(() => {
+            const key = this.zKey();
+            const config = this.zConfig();
+            const loading = this.zLoading();
+            const hasValidColumns = config.columns && config.columns.length > 0;
+            const isServerMode = config.mode === 'server';
+            // Must have key and valid columns
+            if (!key || !hasValidColumns) {
+                return false;
+            }
+            // For server mode, wait until loading is complete (loading goes from true to false)
+            if (isServerMode) {
+                // Only trigger when loading is false (data loaded)
+                return !loading;
+            }
+            // For local mode, proceed immediately
+            return true;
+        }), () => {
+            if (!this._configCacheLoaded) {
                 this._loadConfigCache();
+                this._configCacheLoaded = true;
             }
         });
         explicitEffect([this.zConfig], ([cfg]) => {
             const initial = cfg.initialState;
+            console.log('🚀 ~ initial:', initial);
             if (initial) {
                 if (initial.columnPinning) {
                     this.columnPinning.set(initial.columnPinning);
@@ -3652,6 +3675,7 @@ class ZTableComponent {
         }
         try {
             const config = ZCacheService.get(`table-config-${key}`);
+            console.log('🚀 ~ config:', config);
             if (!config) {
                 return;
             }
@@ -3681,6 +3705,7 @@ class ZTableComponent {
             if (config.columnSizing) {
                 this.table.setColumnSizing(config.columnSizing);
             }
+            console.log('zzz🚀 ~ config:', config);
         }
         catch (error) {
             console.error('Failed to load table config:', error);