Version 4.16.2

package.json

@@ -3,7 +3,7 @@
   "displayName": "Cyclos 4 UI",
   "description": "The new Cyclos 4 frontend",
   "icon": "cyclos.png",
-  "version": "4.16.1",
+  "version": "4.16.2",
   "license": "MIT",
   "author": {
     "name": "Cyclos development team",

src/app/shared/helper.ts

@@ -358,11 +358,13 @@ export function validateBeforeSubmit(control: AbstractControl, returnNonValid =
     control.controls.forEach(current => {
       Array.prototype.push.apply(result, validateBeforeSubmit(current, true) as FormControl[]);
     });
+    control.updateValueAndValidity({ onlySelf: true });
   } else if (control instanceof FormGroup) {
     Object.keys(control.controls).forEach(key => {
       const current = control.controls[key];
       Array.prototype.push.apply(result, validateBeforeSubmit(current, true) as FormControl[]);
     });
+    control.updateValueAndValidity({ onlySelf: true });
   }
   const valid = empty(result);
   if (!valid) {

src/app/ui/banking/external-payment/external-payment-step-form.component.html

@@ -61,8 +61,8 @@
   </ng-template>
 
   <!-- To principal -->
-  <radio-group-field #toPrincipalType formControlName="toPrincipalType"
-    [label]="i18n.transaction.receiver">
+  <radio-group-field #toPrincipalType *ngIf="data.principalTypes.length > 1"
+    formControlName="toPrincipalType" [label]="i18n.transaction.receiver">
     <field-option *ngFor="let pt of data.principalTypes" [value]="pt.id"
       [text]="pt.name"></field-option>
   </radio-group-field>

src/app/ui/initialize.ts

@@ -11,10 +11,10 @@ import { NextRequestState } from 'app/core/next-request-state';
 import { ScriptLoaderService } from 'app/core/script-loader.service';
 import { StateManager } from 'app/core/state-manager';
 import { ApiHelper } from 'app/shared/api-helper';
-import { apiUrl, empty, i18nRoot, initializeStyleLinks, isSameOrigin } from 'app/shared/helper';
+import { apiUrl, empty, i18nRoot, initializeStyleLinks, isSameOrigin, setRootSpinnerVisible } from 'app/shared/helper';
 import { BreadcrumbService } from 'app/ui/core/breadcrumb.service';
 import { forkJoin, of, timer } from 'rxjs';
-import { catchError, filter, first, switchMap } from 'rxjs/operators';
+import { catchError, filter, first, map, switchMap } from 'rxjs/operators';
 
 declare const UpUp: any;
 declare const dataForFrontend: DataForFrontend;
@@ -35,6 +35,11 @@ export function initialize(
   return async () => {
     const apiRoot = apiUrl();
 
+    const themeLoaded$ = timer(1000, 500).pipe(filter(() => {
+      const style = getComputedStyle(document.body);
+      return !empty(style.getPropertyValue('--primary').trim());
+    }), first());
+
     // Will split the session token if running on the same origin as the API
     nextRequestState.useCookie = isSameOrigin(apiRoot);
 
@@ -53,7 +58,6 @@ export function initialize(
     // Initialize the API configuration
     apiConfig.rootUrl = apiRoot;
 
-
     // Initialize the style links
     initializeStyleLinks();
 
@@ -98,6 +102,36 @@ export function initialize(
       }
       return of(d);
     });
+    dataForFrontendHolder.registerLoadHook(d => {
+      const theme = d.theme || {};
+      if (theme.id && theme.lastModifiedInMillis) {
+        const stylesLink = document.getElementById('stylesLink') as HTMLLinkElement;
+        const url = stylesLink?.href;
+        const marker = '/ui/theme.css';
+        const pos = url?.indexOf(marker);
+        if (pos > 0) {
+          const newUrl = `${url.substring(0, pos + marker.length)}?id=${theme.id}&mod=${theme.lastModifiedInMillis}&k=${d.dataForUi?.resourceCacheKey}`;
+          const root = document.querySelector('ui-root') as HTMLElement;
+          if (newUrl !== url && root) {
+            root.style.display = 'none';
+            root.classList.remove('d-flex');
+            setRootSpinnerVisible(true);
+            document.head.removeChild(stylesLink);
+            return timer(0).pipe(switchMap(() => {
+              stylesLink.href = newUrl;
+              document.head.appendChild(stylesLink);
+              return themeLoaded$.pipe(map(() => {
+                root.style.display = '';
+                root.classList.add('d-flex');
+                setRootSpinnerVisible(false);
+                return d;
+              }));
+            }));
+          }
+        }
+      }
+      return of(d);
+    });
     if (environment.production && !environment.standalone) {
       dataForFrontendHolder.registerLoadHook(d => {
         return scriptLoader.loadScript('upup.min.js').pipe(
@@ -115,10 +149,6 @@ export function initialize(
       });
     }
     const dataForFrontend$ = dataForFrontendHolder.initialize(dataForFrontend);
-    const themeLoaded$ = timer(1000, 500).pipe(filter(() => {
-      const style = getComputedStyle(document.body);
-      return !empty(style.getPropertyValue('--primary').trim());
-    }), first());
 
 
     return forkJoin([dataForFrontend$, themeLoaded$]).toPromise();

src/app/ui/login/login.component.ts

@@ -152,8 +152,10 @@ export class LoginComponent
   private get afterLogin(): () => any {
     return () => {
       setRootSpinnerVisible(false);
-      // Redirect to the correct URL
-      this.router.navigateByUrl(this.loginState.redirectUrl || '');
+      // Redirect to the correct URL if login confirmation isn't required
+      if (!this.dataForFrontendHolder.dataForUi?.auth?.loginConfirmation) {
+        this.router.navigateByUrl(this.loginState.redirectUrl || '');
+      }
     };
   }
 }

src/app/ui/marketplace/search/search-ads.component.html

@@ -70,16 +70,14 @@
             </custom-field-filter>
           </div>
           <div
-            *ngIf="marketplacePermissions.userSimple.view || marketplacePermissions.userWebshop.view"
+            *ngIf="marketplacePermissions.userSimple.view && marketplacePermissions.userWebshop.view"
             class="col-12 col-md-6">
             <single-selection-field formControlName="kind"
               [label]="i18n.general.type"
               [emptyOption]="i18n.general.notApplied">
-              <field-option *ngIf="marketplacePermissions.userSimple.view"
-                [text]="i18n.ad.type.simple" value="simple">
+              <field-option [text]="i18n.ad.type.simple" value="simple">
               </field-option>
-              <field-option *ngIf="marketplacePermissions.userWebshop.view"
-                [text]="i18n.ad.type.webshop" value="webshop">
+              <field-option [text]="i18n.ad.type.webshop" value="webshop">
               </field-option>
             </single-selection-field>
           </div>

src/app/ui/operations/run-operation.component.ts

@@ -1,5 +1,5 @@
 import { HttpHeaders, HttpResponse } from '@angular/common/http';
-import { ChangeDetectionStrategy, Component, Injector, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Injector, OnDestroy, OnInit } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 import { Params } from '@angular/router';
 import {
@@ -35,7 +35,7 @@ import { debounceTime, first, tap } from 'rxjs/operators';
 })
 export class RunOperationComponent
   extends BasePageComponent<OperationDataForRun>
-  implements OnInit {
+  implements OnInit, OnDestroy {
 
   /** Cache keys to be used with the StateManager */
   static OPERATION_DATA = 'operationData';
@@ -93,6 +93,7 @@ export class RunOperationComponent
     const route = this.route.snapshot;
     this.runScope = route.data.runScope;
     this.userParam = route.params.user;
+    this.clearCloseTimer();
 
     if (!this.runScope) {
       throw new Error(`No runScope on ${route.url}`);
@@ -262,6 +263,17 @@ export class RunOperationComponent
     }
   }
 
+  ngOnDestroy(): void {
+    this.clearCloseTimer();
+  }
+
+  clearCloseTimer() {
+    if (this.closeTimer) {
+      clearTimeout(this.closeTimer);
+      this.closeTimer = null;
+    }
+  }
+
   cleanCache() {
     this.stateManager.delete(RunOperationComponent.OPERATION_DATA);
     this.stateManager.delete(RunOperationComponent.OPERATION_RESULT_RESPONSE);
@@ -406,10 +418,7 @@ export class RunOperationComponent
   }
 
   reload() {
-    if (this.closeTimer) {
-      clearTimeout(this.closeTimer);
-      this.closeTimer = null;
-    }
+    this.clearCloseTimer();
     this.runOperationHelper.startNewOperation = true;
     super.reload();
   }

src/app/ui/records/search-records.component.html

@@ -49,7 +49,7 @@
           </ng-container>
           <ng-container *ngIf="this.generalSearch || !isOwnRecords()">
             <div class="col-12 col-md-6">
-              <user-field formControlName="createdBy"
+              <user-field formControlName="createdBy" [allowSelf]="true"
                 [label]="i18n.record.createdBy"></user-field>
             </div>
             <!-- Force a new line to keep date range in same row -->

src/app/ui/records/search-records.component.ts

@@ -90,7 +90,7 @@ export class SearchRecordsComponent
       headingActions.push(new HeadingAction(SvgIcon.PlusCircle, this.i18n.general.addNew, () =>
         this.router.navigate(['/records', this.param, this.type, 'new']), true));
     }
-    this.exportHelper.headingActions(data.exportFormats,
+    const exportActions = this.exportHelper.headingActions(data.exportFormats,
       f => {
         const params = {
           format: f.internalName,
@@ -102,7 +102,7 @@ export class SearchRecordsComponent
           return this.recordsService.exportOwnerRecords$Response(params);
         }
       });
-    this.headingActions = headingActions;
+    this.headingActions = [...headingActions, ...exportActions];
   }
 
   showKeywords(): boolean {

src/app/ui/shared/agreement-content-dialog.component.html

@@ -1,12 +1,12 @@
 <ng-container *ngIf="content$ | async as content; else loading">
-  <div #content>
+  <div #contentDiv>
     <h1>
       {{ agreement.name }}
     </h1>
     <div class="mb-3" [innerHTML]="content | trust"></div>
   </div>
   <actions forceRow>
-    <action-button (action)="print(content, printOutput)"
+    <action-button (action)="print(contentDiv, printOutput)"
       [label]="i18n.general.print">
     </action-button>
     <action-button outline (action)="modalRef.hide()"

src/app/ui/users/operators/search-user-operators.component.html

@@ -9,6 +9,10 @@
     [headingActions]="headingActions$ | async">
     <div [formGroup]="form" class="filters-form filters-form-separator">
       <div class="row">
+        <div class="col-12 col-md-6">
+          <input-field formControlName="keywords"
+            [label]="i18n.general.keywords"></input-field>
+        </div>
         <div class="col-12 col-md-6" *ngIf="!self">
           <label-value [label]="i18n.general.user" kind="fieldView">
             <user-link [user]="data.user"></user-link>

src/app/ui/users/operators/search-user-operators.component.ts

@@ -37,7 +37,7 @@ export class SearchUserOperatorsComponent
   }
 
   protected getFormControlNames() {
-    return ['operatorGroups', 'statuses', 'creationBegin', 'creationEnd'];
+    return ['keywords', 'operatorGroups', 'statuses', 'creationBegin', 'creationEnd'];
   }
 
   ngOnInit() {