UI: added validators for trendz apiKey

ui-ngx/src/app/modules/home/pages/admin/trendz-settings.component.html

@@ -47,6 +47,9 @@
             <mat-form-field class="tb-trendz-api-key mat-block flex-1" subscriptSizing="dynamic">
               <mat-label translate>admin.trendz-api-key</mat-label>
               <input matInput formControlName="apiKey">
+              <mat-error *ngIf="trendzSettingsForm.get('apiKey').hasError('pattern')">
+                {{ 'widgets.persistent-table.white-space-error' | translate }}
+              </mat-error>
             </mat-form-field>
           </section>
           <div class="flex w-full flex-row flex-wrap items-center justify-end">

ui-ngx/src/app/modules/home/pages/admin/trendz-settings.component.ts

@@ -41,7 +41,7 @@ export class TrendzSettingsComponent extends PageComponent implements OnInit, Ha
     this.trendzSettingsForm = this.fb.group({
       isTrendzEnabled: [false],
       trendzUrl: [null, [Validators.pattern(/^(https?:\/\/)[^\s/$.?#].[^\s]*$/i)]],
-      apiKey: [null]
+      apiKey: [null, [Validators.pattern(/^\S+$/)]]
     });
 
     this.trendzSettingsService.getTrendzSettings().subscribe((trendzSettings) => {
@@ -82,7 +82,7 @@ export class TrendzSettingsComponent extends PageComponent implements OnInit, Ha
   save(): void {
     const isTrendzEnabled =   this.trendzSettingsForm.get('isTrendzEnabled').value;
     const trendzUrl = this.trendzSettingsForm.get('trendzUrl').value;
-    const apiKey = this.trendzSettingsForm.get('apiKey').value;
+    const apiKey = this.trendzSettingsForm.get('apiKey').value.trim();
 
     const trendzSettings: TrendzSettings = {
       enabled: isTrendzEnabled,