@valtimo/process-link 13.44.0 → 13.45.0

package/fesm2022/valtimo-process-link.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
 import { Injectable, InjectionToken, Optional, Inject, Component, EventEmitter, Output, Input, ViewChild, Directive, ChangeDetectionStrategy, NgModule, ViewContainerRef } from '@angular/core';
-import { catchError, of, BehaviorSubject, combineLatest, map, Subject, switchMap, filter, Subscription, forkJoin, startWith, mergeMap, tap, withLatestFrom as withLatestFrom$1, take as take$1, shareReplay, distinctUntilChanged } from 'rxjs';
+import { catchError, of, BehaviorSubject, combineLatest, map, Subject, switchMap, throwError, filter, Subscription, forkJoin, startWith, mergeMap, tap, withLatestFrom as withLatestFrom$1, take as take$1, shareReplay, distinctUntilChanged } from 'rxjs';
 import * as i2 from '@angular/common/http';
 import { HttpHeaders, HttpParams } from '@angular/common/http';
 import * as i1 from '@valtimo/shared';
 import { BaseApiService, InterceptorSkip, getCaseManagementRouteParams, getBuildingBlockManagementRouteParams, getContextObservable, ROLE_ADMIN } from '@valtimo/shared';
-import { map as map$1, take, switchMap as switchMap$1, withLatestFrom, filter as filter$1, catchError as catchError$1, tap as tap$1 } from 'rxjs/operators';
+import { map as map$1, take, takeUntil, catchError as catchError$1, switchMap as switchMap$1, withLatestFrom, filter as filter$1, tap as tap$1 } from 'rxjs/operators';
 import * as i1$1 from '@valtimo/plugin';
 import { PluginTranslatePipeModule, PluginConfigurationContainerModule } from '@valtimo/plugin';
 import * as i1$5 from '@valtimo/form-flow-management';
@@ -545,6 +545,7 @@ class PluginStateService {
         this._selectedPluginFunction$ = new BehaviorSubject(undefined);
         this._save$ = new Subject();
         this._selectedProcessLink$ = new BehaviorSubject(undefined);
+        this._cancelPluginLoad$ = new Subject();
     }
     get selectedPluginDefinition$() {
         return this._selectedPluginDefinition$.asObservable();
@@ -568,20 +569,7 @@ class PluginStateService {
                 this._selectedPluginConfiguration$,
                 this._selectedPluginDefinition$,
             ]).pipe(map$1(([configuration, definition]) => configuration?.pluginDefinition.key || definition?.key))
-            : combineLatest([
-                this._selectedProcessLink$,
-                this.pluginService.pluginSpecifications$,
-            ]).pipe(map$1(([processLink, pluginSpecifications]) => {
-                if (processLink?.pluginDefinitionKey) {
-                    return processLink.pluginDefinitionKey;
-                }
-                const pluginSpecification = pluginSpecifications.find(specification => {
-                    const functionKeys = specification?.functionConfigurationComponents &&
-                        Object.keys(specification.functionConfigurationComponents);
-                    return functionKeys?.includes(processLink?.pluginActionDefinitionKey);
-                });
-                return pluginSpecification?.pluginId;
-            }))));
+            : this.getPluginDefinitionKeyForProcessLink(selectedProcesLink)));
     }
     selectPluginDefinition(definition) {
         this._selectedPluginDefinition$.next(definition);
@@ -593,62 +581,83 @@ class PluginStateService {
         this._selectedPluginFunction$.next(pluginFunction);
     }
     selectProcessLink(processLink) {
+        this._cancelPluginLoad$.next();
+        this.clearPluginSelection();
         this._selectedProcessLink$.next(processLink);
         // When editing a plugin process link, populate the plugin definition
         if (processLink?.processLinkType === 'plugin') {
             this.loadPluginDefinitionForProcessLink(processLink);
         }
     }
+    clearPluginSelection() {
+        this._selectedPluginDefinition$.next(undefined);
+        this._selectedPluginConfiguration$.next(undefined);
+        this._selectedPluginFunction$.next(undefined);
+    }
     loadPluginDefinitionForProcessLink(processLink) {
-        // Get the plugin definition key - either directly or from plugin specifications
+        // Get the plugin definition key - either directly or from the configuration the link points at
         this.getPluginDefinitionKeyForProcessLink(processLink)
-            .pipe(take(1))
-            .subscribe(pluginDefinitionKey => {
-            if (pluginDefinitionKey) {
-                // Fetch all plugin definitions and find the one matching the key
-                this.pluginManagementService
-                    .getPluginDefinitions()
-                    .pipe(take(1), map$1(definitions => definitions.find(d => d.key === pluginDefinitionKey)))
-                    .subscribe(definition => {
-                    if (definition) {
-                        this._selectedPluginDefinition$.next(definition);
-                        // Also set the selected function if available
-                        if (processLink.pluginActionDefinitionKey) {
-                            this._selectedPluginFunction$.next({
-                                key: processLink.pluginActionDefinitionKey,
-                            });
+            .pipe(take(1), takeUntil(this._cancelPluginLoad$))
+            .subscribe({
+            next: pluginDefinitionKey => {
+                if (pluginDefinitionKey) {
+                    // Fetch all plugin definitions and find the one matching the key
+                    this.pluginManagementService
+                        .getPluginDefinitions()
+                        .pipe(take(1), map$1(definitions => definitions.find(d => d.key === pluginDefinitionKey)), takeUntil(this._cancelPluginLoad$))
+                        .subscribe(definition => {
+                        if (definition) {
+                            this._selectedPluginDefinition$.next(definition);
+                            // Also set the selected function if available
+                            if (processLink.pluginActionDefinitionKey) {
+                                this._selectedPluginFunction$.next({
+                                    key: processLink.pluginActionDefinitionKey,
+                                });
+                            }
                         }
-                    }
-                });
-            }
+                    });
+                }
+            },
+            error: () => this.clearPluginSelection(),
         });
         // Load and set the plugin configuration if available
         if (processLink.pluginConfigurationId) {
-            this.pluginManagementService
-                .getAllPluginConfigurations()
-                .pipe(take(1), map$1(configs => configs.find(c => c.id === processLink.pluginConfigurationId)))
-                .subscribe(configuration => {
-                if (configuration) {
-                    this._selectedPluginConfiguration$.next(configuration);
-                }
+            this.getPluginConfigurationForProcessLink(processLink)
+                .pipe(take(1), takeUntil(this._cancelPluginLoad$))
+                .subscribe({
+                next: configuration => {
+                    if (configuration) {
+                        this._selectedPluginConfiguration$.next(configuration);
+                    }
+                },
+                error: () => this.clearPluginSelection(),
             });
         }
     }
     getPluginDefinitionKeyForProcessLink(processLink) {
         // If the key is directly available, use it
-        if (processLink.pluginDefinitionKey) {
+        if (processLink?.pluginDefinitionKey) {
             return of(processLink.pluginDefinitionKey);
         }
-        // Otherwise, derive it from plugin specifications using the action key
+        // An action key can occur in several plugins, so the configuration the link points at decides which one
+        if (processLink?.pluginConfigurationId) {
+            return this.getPluginConfigurationForProcessLink(processLink).pipe(map$1(configuration => configuration?.pluginDefinition?.key));
+        }
+        // Only a link recording neither is left to the action key, where a single match is all there is to go on
         return this.pluginService.pluginSpecifications$.pipe(map$1(pluginSpecifications => {
             const pluginSpecification = pluginSpecifications.find(specification => {
                 const functionKeys = specification?.functionConfigurationComponents &&
                     Object.keys(specification.functionConfigurationComponents);
-                return functionKeys?.includes(processLink.pluginActionDefinitionKey);
+                return functionKeys?.includes(processLink?.pluginActionDefinitionKey);
             });
             return pluginSpecification?.pluginId;
         }));
     }
+    getPluginConfigurationForProcessLink(processLink) {
+        return this.pluginManagementService
+            .getPluginConfiguration(processLink.pluginConfigurationId)
+            .pipe(catchError$1(error => (error?.status === 404 ? of(undefined) : throwError(() => error))));
+    }
     deselectProcessLink() {
         this._selectedProcessLink$.next(undefined);
     }
@@ -2081,11 +2090,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
  * limitations under the License.
  */
 class SelectPluginActionComponent {
-    constructor(buttonService, injector, pluginManagementService, pluginService, stateService, stepService, processLinkStateService) {
+    constructor(buttonService, injector, pluginManagementService, pluginService, pluginTranslationService, stateService, stepService, processLinkStateService) {
         this.buttonService = buttonService;
         this.injector = injector;
         this.pluginManagementService = pluginManagementService;
         this.pluginService = pluginService;
+        this.pluginTranslationService = pluginTranslationService;
         this.stateService = stateService;
         this.stepService = stepService;
         this.processLinkStateService = processLinkStateService;
@@ -2108,7 +2118,7 @@ class SelectPluginActionComponent {
                 const props = (selectedConfiguration?.properties ?? {});
                 const filterFn = specification.functionConfigurationComponentsFilter;
                 return forkJoin(functions.map(fn => filterFn(props, fn.key, this.injector).pipe(map$1(visible => ({ fn, visible }))))).pipe(map$1(results => results.filter(r => r.visible).map(r => r.fn)));
-            }));
+            }), switchMap$1(functions => this.sortByTranslatedTitle(functions, selectedDefinition.key)));
         }));
         this.selectedPluginDefinition$ = this.stateService.selectedPluginDefinition$;
         this.selectedPluginFunction$ = this.stateService.selectedPluginFunction$;
@@ -2131,6 +2141,15 @@ class SelectPluginActionComponent {
     stringify(object) {
         return JSON.stringify(object);
     }
+    sortByTranslatedTitle(pluginFunctions, pluginDefinitionKey) {
+        if (!pluginFunctions?.length)
+            return of(pluginFunctions);
+        return combineLatest(pluginFunctions.map(pluginFunction => this.pluginTranslationService
+            .translate(pluginFunction.key, pluginDefinitionKey)
+            .pipe(map$1(title => ({ pluginFunction, title }))))).pipe(map$1(translatedFunctions => [...translatedFunctions]
+            .sort((a, b) => a.title.localeCompare(b.title))
+            .map(translatedFunction => translatedFunction.pluginFunction)));
+    }
     openBackButtonSubscription() {
         this.buttonService.backButtonClick$
             .pipe(withLatestFrom(this.processLinkStateService.isEditing$), filter$1(([, isEditing]) => !isEditing), switchMap$1(() => this.stepService.hasOneProcessLinkType$), take(1))
@@ -2145,13 +2164,13 @@ class SelectPluginActionComponent {
             this.stepService.setConfigurePluginActionSteps();
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SelectPluginActionComponent, deps: [{ token: ProcessLinkButtonService }, { token: i0.Injector }, { token: i1$1.PluginManagementService }, { token: i1$1.PluginService }, { token: PluginStateService }, { token: ProcessLinkStepService }, { token: ProcessLinkStateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SelectPluginActionComponent, deps: [{ token: ProcessLinkButtonService }, { token: i0.Injector }, { token: i1$1.PluginManagementService }, { token: i1$1.PluginService }, { token: i1$1.PluginTranslationService }, { token: PluginStateService }, { token: ProcessLinkStepService }, { token: ProcessLinkStateService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: SelectPluginActionComponent, isStandalone: false, selector: "valtimo-select-plugin-action", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginFunctions$ | async as pluginFunctions; else loading\">\n  <div\n    class=\"choose-plugin-action\"\n    *ngIf=\"pluginFunctions?.length > 0\"\n    [attr.data-test-id]=\"testIds.container\"\n  >\n    <p class=\"step-description\">\n      {{ 'processLinkConfiguration.choosePluginActionDescription' | translate }}\n    </p>\n    <div class=\"action-tiles\">\n      <cds-tile-group\n        [attr.data-test-id]=\"testIds.tileGroup\"\n        [multiple]=\"false\"\n        *ngIf=\"{selectedPluginDefinition: selectedPluginDefinition$ | async} as obs\"\n        (selected)=\"selected($event)\"\n      >\n        <cds-selection-tile\n          *ngFor=\"let pluginFunction of pluginFunctions\"\n          [attr.data-test-id]=\"tileTestIdPrefix + pluginFunction.key\"\n          [value]=\"stringify(pluginFunction)\"\n          [selected]=\"false\"\n          >{{\n            pluginFunction.key | pluginTranslate: obs.selectedPluginDefinition.key | async\n          }}</cds-selection-tile\n        >\n      </cds-tile-group>\n    </div>\n  </div>\n  <ng-container *ngIf=\"!pluginFunctions || pluginFunctions?.length === 0\">\n    <ng-container *ngTemplateOutlet=\"noPluginFunctionsTemplate\"> </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #noPluginFunctionsTemplate>\n  <p class=\"step-description\" [attr.data-test-id]=\"testIds.noActionsMessage\">\n    {{ 'processLink.noPluginFunctions' | translate }}\n  </p>\n</ng-template>\n\n<ng-template #loading>\n  <div class=\"loading-container\">\n    <cds-loading></cds-loading>\n  </div>\n</ng-template>\n", styles: [".btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-container{display:flex;justify-content:center;margin-top:40px;flex-direction:row}.action-tiles{margin-top:24px;width:calc(100% + 8px);margin-left:-8px}::ng-deep .choose-plugin-action cds-selection-tile{display:flex;width:calc(33.3% - 8px)}::ng-deep .choose-plugin-action .cds--tile{width:100%}::ng-deep .choose-plugin-action cds-tile-group fieldset{display:flex;flex-direction:row;flex-wrap:wrap}::ng-deep .choose-plugin-action cds-selection-tile{margin-left:8px}::ng-deep .choose-plugin-action cds-selection-tile:nth-child(n+4){margin-top:8px}::ng-deep .action-tiles .cds--tile{background-color:var(--cds-layer-02, #ffffff)}::ng-deep .action-tiles .cds--tile:hover{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "component", type: i5.SelectionTile, selector: "cds-selection-tile, ibm-selection-tile", inputs: ["theme", "id", "selected", "value", "disabled"], outputs: ["change"] }, { kind: "component", type: i5.TileGroup, selector: "cds-tile-group, ibm-tile-group", inputs: ["name", "multiple", "legend"], outputs: ["selected"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.PluginTranslatePipe, name: "pluginTranslate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SelectPluginActionComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: 'valtimo-select-plugin-action', template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginFunctions$ | async as pluginFunctions; else loading\">\n  <div\n    class=\"choose-plugin-action\"\n    *ngIf=\"pluginFunctions?.length > 0\"\n    [attr.data-test-id]=\"testIds.container\"\n  >\n    <p class=\"step-description\">\n      {{ 'processLinkConfiguration.choosePluginActionDescription' | translate }}\n    </p>\n    <div class=\"action-tiles\">\n      <cds-tile-group\n        [attr.data-test-id]=\"testIds.tileGroup\"\n        [multiple]=\"false\"\n        *ngIf=\"{selectedPluginDefinition: selectedPluginDefinition$ | async} as obs\"\n        (selected)=\"selected($event)\"\n      >\n        <cds-selection-tile\n          *ngFor=\"let pluginFunction of pluginFunctions\"\n          [attr.data-test-id]=\"tileTestIdPrefix + pluginFunction.key\"\n          [value]=\"stringify(pluginFunction)\"\n          [selected]=\"false\"\n          >{{\n            pluginFunction.key | pluginTranslate: obs.selectedPluginDefinition.key | async\n          }}</cds-selection-tile\n        >\n      </cds-tile-group>\n    </div>\n  </div>\n  <ng-container *ngIf=\"!pluginFunctions || pluginFunctions?.length === 0\">\n    <ng-container *ngTemplateOutlet=\"noPluginFunctionsTemplate\"> </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #noPluginFunctionsTemplate>\n  <p class=\"step-description\" [attr.data-test-id]=\"testIds.noActionsMessage\">\n    {{ 'processLink.noPluginFunctions' | translate }}\n  </p>\n</ng-template>\n\n<ng-template #loading>\n  <div class=\"loading-container\">\n    <cds-loading></cds-loading>\n  </div>\n</ng-template>\n", styles: [".btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-container{display:flex;justify-content:center;margin-top:40px;flex-direction:row}.action-tiles{margin-top:24px;width:calc(100% + 8px);margin-left:-8px}::ng-deep .choose-plugin-action cds-selection-tile{display:flex;width:calc(33.3% - 8px)}::ng-deep .choose-plugin-action .cds--tile{width:100%}::ng-deep .choose-plugin-action cds-tile-group fieldset{display:flex;flex-direction:row;flex-wrap:wrap}::ng-deep .choose-plugin-action cds-selection-tile{margin-left:8px}::ng-deep .choose-plugin-action cds-selection-tile:nth-child(n+4){margin-top:8px}::ng-deep .action-tiles .cds--tile{background-color:var(--cds-layer-02, #ffffff)}::ng-deep .action-tiles .cds--tile:hover{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
-        }], ctorParameters: () => [{ type: ProcessLinkButtonService }, { type: i0.Injector }, { type: i1$1.PluginManagementService }, { type: i1$1.PluginService }, { type: PluginStateService }, { type: ProcessLinkStepService }, { type: ProcessLinkStateService }] });
+        }], ctorParameters: () => [{ type: ProcessLinkButtonService }, { type: i0.Injector }, { type: i1$1.PluginManagementService }, { type: i1$1.PluginService }, { type: i1$1.PluginTranslationService }, { type: PluginStateService }, { type: ProcessLinkStepService }, { type: ProcessLinkStateService }] });
 
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.