UI: Fixed mobile center translate, validation and editor

ui-ngx/src/app/modules/home/pages/mobile/applications/mobile-app.component.ts

@@ -76,9 +76,9 @@ export class MobileAppComponent extends EntityComponent<MobileApp> {
       }),
       storeInfo: this.fb.group({
         storeLink: [entity?.storeInfo?.storeLink ? entity.storeInfo.storeLink : '',
-          Validators.pattern(/^https?:\/\/play\.google\.com\/store\/apps\/details\?id=[a-zA-Z0-9._]+$/)],
+          Validators.pattern(/^https?:\/\/play\.google\.com\/store\/apps\/details\?id=[a-zA-Z0-9._]+(?:&[a-zA-Z0-9._-]+=[a-zA-Z0-9._%-]*)*$/)],
         sha256CertFingerprints: [entity?.storeInfo?.sha256CertFingerprints ? entity.storeInfo.sha256CertFingerprints : '',
-          Validators.pattern(/^[A-Fa-f0-9]{2}(:[A-Fa-f0-9]{2}){1,31}$/)],
+          Validators.pattern(/^[A-Fa-f0-9]{2}(:[A-Fa-f0-9]{2}){31}$/)],
         appId: [entity?.storeInfo?.appId ? entity.storeInfo.appId : '', Validators.pattern(/^[A-Z0-9]{10}\.[a-zA-Z0-9]+(\.[a-zA-Z0-9]+)*$/)],
       }),
     });
@@ -89,11 +89,11 @@ export class MobileAppComponent extends EntityComponent<MobileApp> {
       if (value === PlatformType.ANDROID) {
         form.get('storeInfo.sha256CertFingerprints').enable({emitEvent: false});
         form.get('storeInfo.appId').disable({emitEvent: false});
-        form.get('storeInfo.storeLink').setValidators(Validators.pattern(/^https?:\/\/play\.google\.com\/store\/apps\/details\?id=[a-zA-Z0-9._]+$/));
+        form.get('storeInfo.storeLink').setValidators(Validators.pattern(/^https?:\/\/play\.google\.com\/store\/apps\/details\?id=[a-zA-Z0-9._]+(?:&[a-zA-Z0-9._-]+=[a-zA-Z0-9._%-]*)*$/));
       } else if (value === PlatformType.IOS) {
         form.get('storeInfo.sha256CertFingerprints').disable({emitEvent: false});
         form.get('storeInfo.appId').enable({emitEvent: false});
-        form.get('storeInfo.storeLink').setValidators(Validators.pattern(/^https?:\/\/apps\.apple\.com\/[a-z]{2}\/app\/[\w-]+\/id\d{7,10}$/));
+        form.get('storeInfo.storeLink').setValidators(Validators.pattern(/^https?:\/\/apps\.apple\.com\/[a-z]{2}\/app\/[\w-]+\/id\d{7,10}(?:\?[^\s]*)?$/));
       }
       form.get('storeInfo.storeLink').setValue('', {emitEvent: false});
     });

ui-ngx/src/app/modules/home/pages/mobile/bundes/layout/mobile-layout.component.ts

@@ -207,7 +207,7 @@ export class MobileLayoutComponent implements ControlValueAccessor, Validator {
 
   private updateModel() {
     if (isDefaultMobilePagesConfig(this.pagesForm.value.pages as MobilePage[])) {
-      this.propagateChange({pages: []});
+      this.propagateChange(null);
     } else {
       this.propagateChange(this.pagesForm.value);
     }

ui-ngx/src/app/modules/home/pages/mobile/bundes/layout/mobile-page-item-row.component.ts

@@ -187,7 +187,7 @@ export class MobilePageItemRowComponent implements ControlValueAccessor, OnInit,
       }
     } else {
       this.isCustomMenuItem = true;
-      this.mobilePageRowForm.get('label').setValidators([Validators.required]);
+      this.mobilePageRowForm.get('label').addValidators([Validators.required]);
       this.mobilePageRowForm.get('label').updateValueAndValidity({emitEvent: false});
     }
     this.updateCleanupState();
@@ -270,7 +270,7 @@ export class MobilePageItemRowComponent implements ControlValueAccessor, OnInit,
 
   private updateModel() {
     this.modelValue.visible = this.mobilePageRowForm.get('visible').value;
-    const label = this.mobilePageRowForm.get('label').value;
+    const label = this.mobilePageRowForm.get('label').value.trim();
     if (label) {
       this.modelValue.label = label;
     } else {

ui-ngx/src/app/modules/home/pages/mobile/common/editor-panel.component.ts

@@ -17,6 +17,7 @@
 import { Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation } from '@angular/core';
 import { FormBuilder, FormControl } from '@angular/forms';
 import { TbPopoverComponent } from '@shared/components/popover.component';
+import { EditorOptions } from 'tinymce';
 
 @Component({
   selector: 'tb-release-notes-panel',
@@ -43,7 +44,7 @@ export class EditorPanelComponent implements OnInit {
 
   editorControl: FormControl<string>;
 
-  tinyMceOptions: Record<string, any> = {
+  tinyMceOptions: Partial<EditorOptions> = {
     base_url: '/assets/tinymce',
     suffix: '.min',
     plugins: ['lists'],
@@ -55,7 +56,14 @@ export class EditorPanelComponent implements OnInit {
     autofocus: false,
     branding: false,
     promotion: false,
-    resize: false
+    resize: false,
+    setup: (editor) => {
+      editor.on('PostRender', function() {
+        const container = editor.getContainer();
+        const uiContainer = document.querySelector('.tox.tox-tinymce-aux');
+        container.parentNode.appendChild(uiContainer);
+      });
+    }
   };
 
   constructor(private fb: FormBuilder) {

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -3550,7 +3550,7 @@
         "tablet-959": "Tablet (max 959px)",
         "max-element-number": "Max elements number",
         "page-name": "Page name",
-        "page-nam-required": "Page name is required.",
+        "page-name-required": "Page name is required.",
         "page-type": "Page type",
         "pages-types": {
             "dashboard": "Dashboard",
@@ -3560,7 +3560,7 @@
         "url": "URL",
         "url-pattern": "Invalid URL",
         "path": "Path",
-        "path-pattern": "Path pattern",
+        "path-pattern": "Invalid path",
         "custom-page": "Custom page",
         "edit-page": "Edit page",
         "edit-custom-page": "Edit custom page",