@planeasyinc/le-angular 0.0.22 → 0.0.24

package/dist/fesm2022/planeasyinc-le-angular.mjs

@@ -16,14 +16,14 @@ import { NestedTreeControl, CdkTree, CdkNestedTreeNode, CdkTreeNodeDef, CdkTreeN
 import { ArrayDataSource, SelectionModel } from '@angular/cdk/collections';
 import { CdkMenuTrigger, CdkMenu, CdkMenuItem } from '@angular/cdk/menu';
 import { A11yModule } from '@angular/cdk/a11y';
+import { createEngine } from '@planeasyinc/fe-core';
 import { adaptOld } from '@planeasyinc/fe-adapters-old';
 import { adaptSections } from '@planeasyinc/fe-adapters-sections';
-import { createEngine } from '@planeasyinc/fe-core';
 import { FeFieldHost } from '@planeasyinc/fe-angular';
 import * as i1 from '@angular/forms';
 import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 
-const IS_LIBRARY_REQUEST = new HttpContextToken(() => false);
+const LE_REQUEST_CONTEXT_TOKEN = new HttpContextToken(() => false);
 
 const defaultConfig = {
     apiUrl: '',
@@ -87,7 +87,7 @@ class LEApiService {
         const url = new UrlFragmentBuilder(this.apiUrl())
             .setFragment('api/contrib/frontend-config/dashboard/config')
             .build();
-        return this.http.get(url, { context: new HttpContext().set(IS_LIBRARY_REQUEST, true) });
+        return this.http.get(url, { context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true) });
     }
     getObject(className, query = '') {
         const url = new UrlFragmentBuilder(this.apiUrl())
@@ -97,7 +97,7 @@ class LEApiService {
             .setQuery(query)
             .build();
         return this.http.get(url, {
-            context: new HttpContext().set(IS_LIBRARY_REQUEST, true),
+            context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true),
         });
     }
     getObjectByAddress(address, params) {
@@ -106,7 +106,7 @@ class LEApiService {
             .setQuery(`all_versions=${params.includeVersions ?? false}&include_metadata=${params.includeMeta ?? false}&load_references=${params.loadReferences ?? false}&file_optimized=${params.fileOptimized ?? true}`)
             .build();
         return this.http.get(url, {
-            context: new HttpContext().set(IS_LIBRARY_REQUEST, true),
+            context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true),
         });
     }
     executeTransaction(name, body, query = '') {
@@ -115,20 +115,20 @@ class LEApiService {
             .setQuery(query)
             .build();
         return this.http.post(url, body ?? {}, {
-            context: new HttpContext().set(IS_LIBRARY_REQUEST, true),
+            context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true),
         });
     }
     request(method, path, body) {
         const url = new UrlFragmentBuilder(this.apiUrl()).setFragment(path).build();
         const request = new HttpRequest(method, url, body, {
             responseType: 'json',
-            context: new HttpContext().set(IS_LIBRARY_REQUEST, true),
+            context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true),
         });
         return this.http.request(request);
     }
     getBlob(path) {
         return this.http
-            .get(path, { responseType: 'blob', context: new HttpContext().set(IS_LIBRARY_REQUEST, true) })
+            .get(path, { responseType: 'blob', context: new HttpContext().set(LE_REQUEST_CONTEXT_TOKEN, true) })
             .pipe(map((blob) => URL.createObjectURL(blob)));
     }
     normalizeApiUrl(url) {
@@ -165,7 +165,8 @@ class LeNavigationService {
         if (!this.config.withRouting)
             return;
         const path = this.mapNodeToLocationPath(node);
-        this.location.go(`/v2/${path}`, undefined, { node });
+        const fullPath = [this.config.rootPath, path].filter(Boolean).join('/');
+        this.location.go(`/${fullPath}`, undefined, { node });
     }
     mapNodeToLocationPath(node) {
         let pathChunks = [];
@@ -173,13 +174,20 @@ class LeNavigationService {
         if (node.type === 'table') {
             pathChunks.push(node?.title || node?.dataSource?.entity);
             if (node?.dataSource?.params) {
-                query = Object.entries(node.dataSource.params).map(entry => entry.join('=')).join('&');
+                query = Object.entries(node.dataSource.params)
+                    .map((entry) => entry.join('='))
+                    .join('&');
             }
         }
-        if (node.type === 'form') {
+        else if (node.type === 'form') {
             pathChunks.push('details', node.controlSource?.kind, node.controlSource?.entity, node.controlSource?.params?.className, node.controlSource?.params?.address, node.controlSource?.params?.mode);
         }
-        const path = pathChunks.filter(v => !!v).join('/');
+        else {
+            const title = (node.title ?? '').replace(' ', '-');
+            if (title)
+                pathChunks.push(title);
+        }
+        const path = pathChunks.filter((v) => !!v).join('/');
         return query ? `${path}?${query}` : path;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: LeNavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
@@ -249,7 +257,7 @@ class LEDataService {
     navigateByNodeId(id) {
         const node = this.getNodeById(id);
         if (node) {
-            this._view.set(node);
+            this.setView(node);
         }
     }
     getNodeById(id, node = this._config()) {
@@ -1242,8 +1250,9 @@ class TableViewComponent {
         const result = [];
         const firstRow = this.data().getValueByIndex(0);
         const columnKeys = this.columns().map((column) => column.key);
+        const hasMetadata = !!(firstRow && firstRow._metadata);
         const hasVersion = !!(firstRow && firstRow._metadata && firstRow._metadata.object_version);
-        if (firstRow && !this.config()?.hideInfo) {
+        if (hasMetadata && !this.config()?.hideInfo) {
             result.push('info');
         }
         result.push(...columnKeys);
@@ -1342,11 +1351,11 @@ class TableViewComponent {
             injector: this.injector,
         })
             .subscribe({
-            next: event => {
+            next: (event) => {
                 if (event.type === 'cell_clicked') {
                     this.onCellClicked(event.data);
                 }
-            }
+            },
         });
     }
     onCellClicked(data) {
@@ -1382,6 +1391,20 @@ class TableViewComponent {
                 }
             });
         }
+        else if (type === 'update_form') {
+            if (clone.controlSource?.params) {
+                clone.controlSource.params = this.interpolateRowValues(clone.controlSource.params, row);
+            }
+            this.setView({
+                id: action.type,
+                type: 'form',
+                controlSource: {
+                    kind: clone.controlSource.kind,
+                    entity: clone.controlSource.entity,
+                    params: clone.controlSource.params,
+                },
+            });
+        }
     }
     processTableAction(action) {
         if (action.type === 'update_form') {
@@ -1425,7 +1448,7 @@ class TableViewComponent {
         }
         if (node.dataSource?.kind === 'transaction') {
             const body = Object.assign({}, node.dataSource.params, buildRequestBody(ctx));
-            this.apiService.executeTransaction(node.dataSource.entity, body);
+            return this.apiService.executeTransaction(node.dataSource.entity, body);
         }
         if (node.dataSource?.kind === 'object') {
             return this.apiService.getObjectByAddress(node.dataSource.entity, node.dataSource.params ?? {});
@@ -1849,17 +1872,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
             args: [{ imports: [ToastListItemComponent], template: "@if (toasts().length) {\n  <div class=\"le-toast-list\">\n    @for (toast of toasts(); track toast.id) {\n      <div\n        class=\"le-toast\"\n        [class.le-toast--success]=\"toast.type === 'success'\"\n        [class.le-toast--info]=\"toast.type === 'info'\"\n        [class.le-toast--warning]=\"toast.type === 'warning'\"\n        [class.le-toast--error]=\"toast.type === 'error'\"\n      >\n        <le-toast-list-item\n          [controls]=\"toast.controls\"\n          (actions)=\"onActions($event)\"\n        ></le-toast-list-item>\n      </div>\n    }\n  </div>\n}\n" }]
         }] });
 
-let ID = 100_000_000;
+let ID$1 = 100_000_000;
 class LeToastService {
     overlayRef;
     overlay = inject(Overlay);
     _toasts = signal([]);
     toasts = this._toasts.asReadonly();
+    hasToasts = computed(() => this._toasts().length > 0);
     action$ = new Subject();
     constructor() {
         effect(() => {
-            const toasts = this._toasts();
-            if (toasts.length > 0) {
+            if (this.hasToasts()) {
                 this.show();
             }
             else {
@@ -1899,7 +1922,7 @@ class LeToastService {
         this.overlayRef = undefined;
     }
     buildToast(type, messages) {
-        const id = `${type}_${ID++}`;
+        const id = `${type}_${ID$1++}`;
         return {
             id,
             type,
@@ -2092,12 +2115,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
             type: Injectable
         }] });
 
+class LeActionsService {
+    _queue = [];
+    _data = null;
+    get hasActions() {
+        return this._queue.length > 0;
+    }
+    setActions(actions, data) {
+        this._queue = actions;
+        this._data = data;
+    }
+    getActions() {
+        const actions = this._queue.slice();
+        const data = Object.assign({}, this._data);
+        this._queue = [];
+        this._data = null;
+        return {
+            actions,
+            data,
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: LeActionsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: LeActionsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: LeActionsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+let ID = 100_000_000;
 class FormViewComponent {
     apiService = inject(LEApiService);
     dataService = inject(LEDataService);
     attachmentService = inject(FormViewAttachmentService);
     viewportScroller = inject(ViewportScroller);
     toastService = inject(LeToastService);
+    actionsService = inject(LeActionsService);
     _isLoading = signal(false);
     _form = signal(null);
     _sections = signal([]);
@@ -2172,15 +2227,20 @@ class FormViewComponent {
             return of(null);
         },
         show_popup: (action, response) => {
+            const rawControls = this.normalizeControls(action.controls);
+            const controls = this.populatePopupControlsWithResponseData(rawControls, response);
             this.toastService.notify({
-                controls: this.populatePopupControlsWithResponse(action.controls, response),
+                controls,
                 id: action.id,
                 type: 'success',
             });
             return of(null);
         },
         close_popup: (action) => {
-            this.toastService.remove(action.target_id);
+            // TODO: models alignment required (to target_id)
+            // @ts-ignore
+            const id = action.target_id || action.target;
+            this.toastService.remove(id);
             return of(null);
         },
         open_url: (action) => {
@@ -2269,6 +2329,7 @@ class FormViewComponent {
             objectLatest: (className) => firstValueFrom(this.dataService.getObjectByClassName(className)),
         };
         this._engine.set(createEngine(form, {}, resolvers));
+        this.checkDelayedActions();
         // this._engine()?.on('valueChanges', (value) => {
         //   console.log('Value Changes', value);
         //   // this.cdr.markForCheck();
@@ -2349,13 +2410,35 @@ class FormViewComponent {
         };
     }
     processActionList(items, response) {
+        const updateViewActionIndex = items.findIndex((item) => item.type === 'update_form' || item.type === 'update_table');
+        if (updateViewActionIndex !== -1) {
+            const delayedActions = items.splice(updateViewActionIndex + 1);
+            this.actionsService.setActions(delayedActions, response ?? null);
+        }
         from(items)
             .pipe(concatMap((a) => this.processAction(a, response)), finalize(() => {
             this._isLoading.set(false);
         }))
             .subscribe();
     }
-    populatePopupControlsWithResponse(controls, response) {
+    checkDelayedActions() {
+        if (this.actionsService.hasActions) {
+            const { actions, data } = this.actionsService.getActions();
+            this.processActionList(actions, data);
+        }
+    }
+    normalizeControls(controls) {
+        return controls.map((control) => {
+            if (!control.id) {
+                return {
+                    ...control,
+                    id: `${control.type}_${ID++}`,
+                };
+            }
+            return control;
+        });
+    }
+    populatePopupControlsWithResponseData(controls, response) {
         return controls.map((control) => {
             if (isPlaceholder(control.value)) {
                 const path = getPlaceholderValue(control.value);
@@ -2691,7 +2774,7 @@ const LEAuthInterceptor = (req, next) => {
     if (authService.isGuest()) {
         return next(req);
     }
-    if (req.context.get(IS_LIBRARY_REQUEST)) {
+    if (req.context.get(LE_REQUEST_CONTEXT_TOKEN)) {
         try {
             authService.validateToken();
             return next(req.clone({ setHeaders: { Authorization: authService.token() } }));
@@ -2708,5 +2791,5 @@ const LEAuthInterceptor = (req, next) => {
  * Generated bundle index. Do not edit.
  */
 
-export { CONFIG_TOKEN, LEAuthInterceptor, LEAuthService, LeContainerComponent, LeToastService, provideConfig };
+export { CONFIG_TOKEN, LEAuthInterceptor, LEAuthService, CONFIG_TOKEN as LE_CONFIG_TOKEN, LE_REQUEST_CONTEXT_TOKEN, LeContainerComponent, LeToastService, provideConfig };
 //# sourceMappingURL=planeasyinc-le-angular.mjs.map