@acorex/platform 20.6.0-next.1 → 20.6.0-next.3

package/core/index.d.ts

@@ -989,8 +989,8 @@ type AXPWidgetTriggers = AXPWidgetTrigger[];
 
 type AXPFileStatus = 'attached' | 'uploading' | 'uploaded' | 'deleted' | 'remote';
 interface AXPFileSource {
-    kind: 'blob' | 'url' | 'preview' | 'none' | 'fileId' | 'documentId';
-    value?: Blob | string;
+    kind: 'blob' | 'url' | 'preview' | 'none' | 'fileId' | 'reference';
+    value?: Blob | string | AXPEntityReference;
 }
 interface AXPFileListItem {
     id?: string;

package/fesm2022/acorex-platform-layout-widget-core.mjs

@@ -686,65 +686,83 @@ class AXPDataListWidgetComponent extends AXPValueWidgetComponent {
             return result;
         }, ...(ngDevMode ? [{ debugName: "isReady" }] : []));
         this.selectedItems = signal([], ...(ngDevMode ? [{ debugName: "selectedItems" }] : []));
+        //#region ----   DataSource Loading Effect   ----
+        /**
+         * Track the last loaded string dataSource reference to prevent infinite loops
+         * Only used for string-based datasources (not arrays or AXDataSource instances)
+         */
+        this.lastStringDataSourceRef = null;
         this.rf = effect(async () => {
             const rawValue = this.options()['dataSource'];
-            // static  datasource class
-            untracked(async () => {
-                if (!isEqual(this.options()['dataSource'].config, this.dataSource().config)) {
-                    if (rawValue instanceof AXDataSource) {
+            // For string datasources: prevent infinite loop by checking reference
+            if (typeof rawValue === 'string') {
+                if (rawValue === this.lastStringDataSourceRef) {
+                    return;
+                }
+                this.lastStringDataSourceRef = rawValue;
+            }
+            else {
+                // Reset string reference when dataSource changes to non-string
+                this.lastStringDataSourceRef = null;
+            }
+            // Process dataSource creation in untracked context
+            await untracked(async () => {
+                if (rawValue instanceof AXDataSource) {
+                    // For AXDataSource instances, check if config changed
+                    if (!isEqual(rawValue.config, this.dataSource().config)) {
                         this.dataSource.set(rawValue);
                     }
-                    // static array datasource
-                    else if (Array.isArray(rawValue)) {
-                        const ds = new AXDataSource({
+                }
+                // static array datasource - always recreate when options change
+                else if (Array.isArray(rawValue)) {
+                    const ds = new AXDataSource({
+                        key: this.valueField(),
+                        pageSize: 10,
+                        load: async (e) => {
+                            const raw = this.options()['dataSource'];
+                            const skip = e.skip ?? 0;
+                            const take = e.take ?? raw.length;
+                            return {
+                                items: raw.slice(skip, skip + take),
+                                total: raw.length,
+                            };
+                        },
+                        byKey: (key) => {
+                            const raw = this.options()['dataSource'];
+                            const item = raw.filter((c) => c[this.valueField()] == key);
+                            return Promise.resolve(item[0]);
+                        },
+                    });
+                    this.dataSource.set(ds);
+                }
+                // resolve data source by name (string or object with id)
+                else if (rawValue && (typeof rawValue == 'string' || typeof rawValue == 'object')) {
+                    const id = typeof rawValue == 'object' ? rawValue['id'] : rawValue;
+                    const c = await this.dataService.get(id);
+                    if (this.mode == 'designer' && c?.samples?.length) {
+                        this.dataSource.set(convertArrayToDataSource(c.samples, {
                             key: this.valueField(),
-                            pageSize: 10,
-                            load: async (e) => {
-                                const raw = this.options()['dataSource'];
-                                const skip = e.skip ?? 0;
-                                const take = e.take ?? raw.length;
-                                return {
-                                    items: raw.slice(skip, skip + take),
-                                    total: raw.length,
-                                };
-                            },
-                            byKey: (key) => {
-                                const raw = this.options()['dataSource'];
-                                const item = raw.filter((c) => c[this.valueField()] == key);
-                                return Promise.resolve(item[0]);
-                            },
-                        });
-                        this.dataSource.set(ds);
+                            pageSize: 500,
+                        }));
                     }
-                    // resolve data source by name
-                    else if (rawValue && (typeof rawValue == 'string' || typeof rawValue == 'object')) {
-                        const id = typeof rawValue == 'object' ? rawValue['id'] : rawValue;
-                        const c = await this.dataService.get(id);
-                        if (this.mode == 'designer' && c?.samples?.length) {
-                            this.dataSource.set(convertArrayToDataSource(c.samples, {
-                                key: this.valueField(),
-                                pageSize: 500,
-                            }));
+                    else {
+                        const ds = c?.source();
+                        if (ds && ds instanceof Promise) {
+                            const d = await ds;
+                            this.dataSource.set(d);
                         }
+                        else if (ds) {
+                            this.dataSource.set(ds);
+                        }
+                        // empty datasource
                         else {
-                            const ds = c?.source();
-                            if (ds && ds instanceof Promise) {
-                                const d = await ds;
-                                this.dataSource.set(d);
-                            }
-                            else if (ds) {
-                                this.dataSource.set(ds);
-                            }
-                            // empty datasource
-                            else {
-                                this.dataSource.set(convertArrayToDataSource([]));
-                            }
+                            this.dataSource.set(convertArrayToDataSource([]));
                         }
                     }
-                    // empty datasource
-                    else {
-                        this.dataSource.set(convertArrayToDataSource([]));
-                    }
+                }
+                // empty datasource
+                else {
+                    this.dataSource.set(convertArrayToDataSource([]));
                 }
             });
         }, ...(ngDevMode ? [{ debugName: "rf" }] : []));
@@ -760,6 +778,7 @@ class AXPDataListWidgetComponent extends AXPValueWidgetComponent {
             this.selectedItems.set(items.filter((c) => c != null));
         }, ...(ngDevMode ? [{ debugName: "effect2" }] : []));
     }
+    //#endregion
     async extractItem(item) {
         if (isNil(item)) {
             return null;