RED-4247 - added new route path for watermark creation instead of using '0' value as param

apps/red-ui/src/app/modules/admin/admin-routing.module.ts

@@ -81,6 +81,15 @@ const dossierTemplateIdRoutes: Routes = [
                     routeGuards: [AuthGuard, RedRoleGuard],
                 },
             },
+            {
+                path: 'create',
+                component: BaseWatermarkScreenComponent,
+                canActivate: [CompositeRouteGuard],
+                loadChildren: () => import('./screens/watermark/watermark.module').then(m => m.WatermarkModule),
+                data: {
+                    routeGuards: [AuthGuard, RedRoleGuard],
+                },
+            },
             {
                 path: `:${WATERMARK_ID}`,
                 component: BaseWatermarkScreenComponent,

apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.html

@@ -22,7 +22,6 @@
         <div class="iqser-input-group required w-300">
             <label translate="watermark-screen.form.text-label"></label>
             <textarea
-                (mousemove)="triggerChanges()"
                 [placeholder]="'watermark-screen.form.text-placeholder' | translate"
                 class="w-full"
                 formControlName="text"

apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.ts

@@ -79,6 +79,10 @@ export class WatermarkScreenComponent implements OnInit {
     }
 
     async ngOnInit(): Promise<void> {
+        if (!this.#watermarkId) {
+            this._initForm(DEFAULT_WATERMARK);
+            return;
+        }
         await firstValueFrom(this._loadWatermark());
     }
 
@@ -117,8 +121,6 @@ export class WatermarkScreenComponent implements OnInit {
         await this.configChanged();
     }
 
-    triggerChanges() {}
-
     async setValue(type: 'fontType' | 'orientation' | 'hexColor', value: any) {
         if (!this.form.get(type).disabled) {
             this.form.get(type).setValue(value);
@@ -129,16 +131,18 @@ export class WatermarkScreenComponent implements OnInit {
     private _loadWatermark(): Observable<IWatermark> {
         return this._watermarkService.getWatermark(this.#watermarkId).pipe(
             catchError(() => of(DEFAULT_WATERMARK)),
-            tap(watermark => {
-                this._watermark = watermark;
-                this._watermark.dossierTemplateId = this.#dossierTemplateId;
-                this.form.setValue({ ...watermark });
-                this._loadViewer();
-                this._changeDetectorRef.markForCheck();
-            }),
+            tap(watermark => this._initForm(watermark)),
         );
     }
 
+    private _initForm(watermark: IWatermark) {
+        this._watermark = watermark;
+        this._watermark.dossierTemplateId = this.#dossierTemplateId;
+        this.form.setValue({ ...watermark });
+        this._loadViewer();
+        this._changeDetectorRef.markForCheck();
+    }
+
     private _loadViewer() {
         if (!this._instance) {
             WebViewer(

apps/red-ui/src/app/modules/admin/screens/watermarks-listing/watermarks-listing-screen.component.ts

@@ -74,7 +74,7 @@ export class WatermarksListingScreenComponent extends ListingComponent<Watermark
     }
 
     getRouterLink(watermark: Watermark = null): string {
-        return `/main/admin/dossier-templates/${this.#dossierTemplateId}/watermarks/${watermark ? watermark.id : 0}`;
+        return `/main/admin/dossier-templates/${this.#dossierTemplateId}/watermarks/${watermark ? watermark.id : 'create'}`;
     }
 
     private async _loadData(): Promise<void> {