refactor: Translate strings on dialog components

Author: FilipLeitner

projects/hslayers/common/confirm/confirm-dialog.component.html

@@ -3,14 +3,14 @@
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title">
-                    {{data.title}}
+                    {{data.title | translateHs}}
                 </h4>
                 <button type="button" (click)="no()" class="btn-close" data-dismiss="modal"
                     [attr.aria-label]="'COMMON.close' | translateHs "></button>
             </div>
             <div class="modal-body" style="overflow-y:auto">
-                <p class="fw-bold h6">{{data.message}}</p>
-                <p class="h6 small">{{data.note}}</p>
+                <p class="fw-bold h6">{{data.message | translateHs}}</p>
+                <p class="h6 small">{{data.note | translateHs}}</p>
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-primary" (click)="yes()" [title]="'COMMON.yes' | translateHs"

projects/hslayers/common/confirm/confirm-dialog.component.ts

@@ -5,10 +5,13 @@ import {
   HsDialogContainerService,
   HsDialogItem,
 } from 'hslayers-ng/common/dialogs';
+import {TranslateCustomPipe} from 'hslayers-ng/shared/language';
 
 @Component({
   selector: 'hs-confirm-dialog',
   templateUrl: './confirm-dialog.component.html',
+  standalone: true,
+  imports: [TranslateCustomPipe],
 })
 export class HsConfirmDialogComponent implements HsDialogComponent {
   dialogItem: HsDialogItem;

projects/hslayers/common/confirm/confirm.module.ts

@@ -1,2 +1 @@
 export * from './confirm-dialog.component';
-export * from './confirm.module';

projects/hslayers/common/confirm/public-api.ts

@@ -10,7 +10,7 @@ <h4 class="modal-title">{{'COMMON.warning' | translateHs }}</h4>
             <div class="modal-body" style="max-height: 600px; overflow-y: auto">
                 <br>{{'COMMON.name' | translateHs }}: <b>{{data.composition_title}}</b>
                 <hr>
-                <br>{{data.message}}
+                <br>{{data.message | translateHs}}
                 <br>{{'COMPOSITIONS.dialogWarning.toContinue' | translateHs }}
             </div>
             <div class="modal-footer">

projects/hslayers/common/dialogs/compositions-warning/warning-dialog.component.html

@@ -18,8 +18,7 @@ import {getTitle} from 'hslayers-ng/common/extensions';
 })
 export class HsClearLayerComponent
   extends HsQueryPopupWidgetBaseComponent
-  implements OnInit
-{
+  implements OnInit {
   @Input() data: {
     layerDescriptor: any;
     service: HsQueryPopupServiceModel;
@@ -48,10 +47,7 @@ export class HsClearLayerComponent
         message: this.hsLanguageService
           .getTranslation('QUERY.reallyDeleteAllFeaturesFrom', undefined)
           .replace('{0}', getTitle(layer)),
-        title: this.hsLanguageService.getTranslation(
-          'QUERY.confirmClear',
-          undefined,
-        ),
+        title: 'QUERY.confirmClear',
       },
     );
     const confirmed = await dialog.waitResult();

projects/hslayers/common/query-popup/widgets/clear-layer.component.ts

@@ -24,8 +24,7 @@ import {
 })
 export class HsFeatureInfoComponent
   extends HsQueryPopupWidgetBaseComponent
-  implements OnInit
-{
+  implements OnInit {
   layerDescriptor: any;
   attributesForHover: any[] = [];
   name = 'feature-info';
@@ -84,14 +83,8 @@ export class HsFeatureInfoComponent
     const dialog = this.hsDialogContainerService.create(
       HsConfirmDialogComponent,
       {
-        message: this.hsLanguageService.getTranslation(
-          'QUERY.reallyDelete',
-          undefined,
-        ),
-        title: this.hsLanguageService.getTranslation(
-          'QUERY.confirmDelete',
-          undefined,
-        ),
+        message: 'QUERY.reallyDelete',
+        title: 'QUERY.confirmDelete',
       },
     );
     const confirmed = await dialog.waitResult();

projects/hslayers/common/query-popup/widgets/feature-info.component.ts

@@ -3,7 +3,7 @@
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title">
-                    {{data.title}}
+                    {{data.title | translateHs}}
                 </h4>
                 <button type="button" (click)="no()" class="btn-close" data-dismiss="modal"
                     [attr.aria-label]="'COMMON.close' | translateHs "></button>
@@ -19,9 +19,9 @@ <h4 class="modal-title">
                             option)}}</button>
                     </div>
                 </div>
-                <p *ngIf="deleteFrom === 'catalogue'" class="h6 small">{{data.note}}</p>
+                <p *ngIf="deleteFrom === 'catalogue'" class="h6 small">{{data.note | translateHs}}</p>
                 <div *ngIf="deleteFrom && data.multiple">
-                    <p class="fw-bold h6">{{data.message}}</p>
+                    <p class="fw-bold h6">{{data.message | translateHs}}</p>
 
                     <div style="max-height: 65vh;" *ngIf="data.items?.length > 0">
                         <div class="d-flex w-100 justify-content-center">

projects/hslayers/common/remove-multiple/remove-layer-dialog.component.html

@@ -36,9 +36,9 @@ export class HsRemoveLayerDialogService {
       HsRmLayerDialogComponent,
       {
         multiple: false,
-        message: this.translate('DRAW.reallyDeleteThisLayer'),
+        message: 'DRAW.reallyDeleteThisLayer',
         note: this.getDeleteNote(),
-        title: this.translate('COMMON.confirmDelete'),
+        title: 'COMMON.confirmDelete',
       },
     );
     const confirmed: HsRmLayerDialogResponse = await dialog.waitResult();
@@ -65,9 +65,9 @@ export class HsRemoveLayerDialogService {
       HsRmLayerDialogComponent,
       {
         multiple: true,
-        message: this.translate('DRAW.pleaseCheckTheLayers'),
+        message: 'DRAW.pleaseCheckTheLayers',
         note: this.getDeleteNote(true),
-        title: this.translate('COMMON.selectAndConfirmToDeleteMultiple'),
+        title: 'COMMON.selectAndConfirmToDeleteMultiple',
         items: items,
       },
     );
@@ -151,7 +151,9 @@ export class HsRemoveLayerDialogService {
 
   getDeleteNote(plural?: boolean): string {
     return this.hsDrawService.isAuthenticated
-      ? this.translate(plural ? 'DRAW.deleteNotePlural' : 'DRAW.deleteNote')
+      ? plural
+        ? 'DRAW.deleteNotePlural'
+        : 'DRAW.deleteNote'
       : '';
   }
 }

projects/hslayers/common/remove-multiple/remove-layer-dialog.service.ts

@@ -8,7 +8,6 @@ import {HsAddDataUrlService} from 'hslayers-ng/shared/add-data';
 import {HsDialogContainerService} from 'hslayers-ng/common/dialogs';
 import {HsEventBusService} from 'hslayers-ng/shared/event-bus';
 import {HsGetCapabilitiesErrorComponent} from './common/capabilities-error-dialog/capabilities-error-dialog.component';
-import {HsLanguageService} from 'hslayers-ng/shared/language';
 import {HsLayoutService} from 'hslayers-ng/shared/layout';
 import {HsPanelBaseComponent} from 'hslayers-ng/common/panels';
 import {HsShareUrlService} from 'hslayers-ng/components/share';
@@ -26,7 +25,6 @@ export class HsAddDataComponent
 
   constructor(
     public hsAddDataService: HsAddDataService,
-    public hsLanguageService: HsLanguageService,
     public hsShareUrlService: HsShareUrlService,
     public hsLayoutService: HsLayoutService,
     public hsEventBusService: HsEventBusService,
@@ -59,23 +57,11 @@ export class HsAddDataComponent
       .subscribe((e) => {
         let error = e.toString();
         if (error?.includes('Unsuccessful OAuth2')) {
-          error = this.hsLanguageService.getTranslationIgnoreNonExisting(
-            'COMMON',
-            'Authentication failed. Login to the catalogue.',
-            undefined,
-          );
+          error = 'COMMON.Authentication failed. Login to the catalogue.';
         } else if (error.includes('property')) {
-          error = this.hsLanguageService.getTranslationIgnoreNonExisting(
-            'ADDLAYERS',
-            'serviceTypeNotMatching',
-            undefined,
-          );
+          error = 'ADDLAYERS.serviceTypeNotMatching';
         } else {
-          error = this.hsLanguageService.getTranslationIgnoreNonExisting(
-            'ADDLAYERS',
-            error,
-            undefined,
-          );
+          error = `ADDLAYERS.${error}`;
         }
         this.hsDialogContainerService.create(HsGetCapabilitiesErrorComponent, {
           error: error,

projects/hslayers/components/add-data/add-data.component.ts

@@ -207,18 +207,9 @@ export class HsCatalogueListItemComponent implements OnInit {
     const dialog = this.hsDialogContainerService.create(
       HsConfirmDialogComponent,
       {
-        message: this.hsLanguageService.getTranslation(
-          'DRAW.reallyDeleteThisLayer',
-          undefined,
-        ),
-        note: this.hsLanguageService.getTranslation(
-          'DRAW.deleteNote',
-          undefined,
-        ),
-        title: this.hsLanguageService.getTranslation(
-          'COMMON.confirmDelete',
-          undefined,
-        ),
+        message: 'DRAW.reallyDeleteThisLayer',
+        note: 'DRAW.deleteNote',
+        title: 'COMMON.confirmDelete',
       },
     );
     const confirmed = await dialog.waitResult();

projects/hslayers/components/add-data/catalogue/catalogue-list-item/catalogue-list-item.component.ts

@@ -10,7 +10,7 @@ <h4 class="modal-title text-uppercase">
             </div>
             <div class="modal-body" style="max-height:600px; overflow-y:auto">
                 <p>{{'ADDLAYERS.ERROR.thereWasErrorWhile' | translateHs }}</p>
-                <p>{{data.error}}</p>
+                <p>{{data.error | translateHs}}</p>
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary" (click)="close()" data-dismiss="modal">{{'COMMON.close'

projects/hslayers/components/add-data/common/capabilities-error-dialog/capabilities-error-dialog.component.html

@@ -3,13 +3,13 @@
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title">
-                    {{data.title}}
+                    {{data.title | translateHs}} ?
                 </h4>
                 <button type="button" (click)="no()" class="btn-close" data-dismiss="modal"
                     [attr.aria-label]="'COMMON.close' | translateHs"></button>
             </div>
             <div class="modal-body" style="overflow-y:auto">
-                <p class="fw-bold h6">{{data.message}}</p>
+                <p class="fw-bold h6">{{data.message | translateHs}}</p>
                 <div class="form-floating m-2">
                     <input class="form-control" name="title" [(ngModel)]="data.layerTitle"
                         [placeholder]="'COMMON.title' | translateHs" />

projects/hslayers/components/layer-manager/dialogs/copy-layer-dialog.component.html

@@ -15,7 +15,6 @@ import {HsDrawService} from 'hslayers-ng/shared/draw';
 import {HsEventBusService} from 'hslayers-ng/shared/event-bus';
 import {HsExtentWidgetComponent} from '../widgets/extent-widget/extent-widget.component';
 import {HsIdwWidgetComponent} from '../widgets/idw-widget.component';
-import {HsLanguageService} from 'hslayers-ng/shared/language';
 import {HsLayerDescriptor} from 'hslayers-ng/types';
 import {HsLayerEditorDimensionsComponent} from '../dimensions/layer-editor-dimensions.component';
 import {HsLayerEditorService} from './layer-editor.service';
@@ -74,7 +73,6 @@ export class HsLayerEditorComponent {
     public HsDrawService: HsDrawService,
     public HsEventBusService: HsEventBusService,
     public HsDialogContainerService: HsDialogContainerService,
-    public HsLanguageService: HsLanguageService,
     public hsWidgetContainerService: HsLayerEditorWidgetContainerService,
   ) {}
 
@@ -104,15 +102,8 @@ export class HsLayerEditorComponent {
     const dialog = this.HsDialogContainerService.create(
       HsConfirmDialogComponent,
       {
-        message:
-          this.HsLanguageService.getTranslation(
-            'LAYERMANAGER.layerEditor.savegeojson',
-            undefined,
-          ) + '?',
-        title: this.HsLanguageService.getTranslation(
-          'COMMON.confirm',
-          undefined,
-        ),
+        message: 'LAYERMANAGER.layerEditor.savegeojson',
+        title: 'COMMON.confirm',
       },
     );
     const confirmed = await dialog.waitResult();
@@ -248,15 +239,8 @@ export class HsLayerEditorComponent {
     const dialog = this.HsDialogContainerService.create(
       HsCopyLayerDialogComponent,
       {
-        message:
-          this.HsLanguageService.getTranslation(
-            'LAYERMANAGER.layerEditor.copyLayer',
-            undefined,
-          ) + '?',
-        title: this.HsLanguageService.getTranslation(
-          'COMMON.copyLayer',
-          undefined,
-        ),
+        message: 'LAYERMANAGER.layerEditor.copyLayer',
+        title: 'COMMON.copyLayer',
         layerTitle: getTitle(this.currentLayer.layer),
       },
     );

projects/hslayers/components/layer-manager/editor/layer-editor.component.ts

@@ -6,9 +6,7 @@ import {Image as ImageLayer, Tile} from 'ol/layer';
 import {ImageWMS, TileWMS} from 'ol/source';
 
 import {HsConfirmDialogComponent} from 'hslayers-ng/common/confirm';
-import {HsConfirmModule} from 'hslayers-ng/common/confirm';
 import {HsDialogContainerService} from 'hslayers-ng/common/dialogs';
-import {HsLanguageService} from 'hslayers-ng/shared/language';
 import {HsLayerEditorWidgetBaseComponent} from '../layer-editor-widget-base.component';
 import {HsLayerSelectorService} from 'hslayers-ng/shared/layer-manager';
 import {HsLayerShiftingService} from 'hslayers-ng/shared/layer-shifting';
@@ -20,7 +18,7 @@ import {TranslateCustomPipe} from 'hslayers-ng/shared/language';
 @Component({
   selector: 'hs-wms-source-widget',
   standalone: true,
-  imports: [CommonModule, NgFor, HsConfirmModule, TranslateCustomPipe],
+  imports: [CommonModule, NgFor, HsConfirmDialogComponent, TranslateCustomPipe],
   templateUrl: './wms-source-widget.component.html',
 })
 export class HsWmsSourceWidgetComponent extends HsLayerEditorWidgetBaseComponent {
@@ -36,7 +34,6 @@ export class HsWmsSourceWidgetComponent extends HsLayerEditorWidgetBaseComponent
     private hsMapService: HsMapService,
     private hsLayerShiftingService: HsLayerShiftingService,
     private hsDialogContainerService: HsDialogContainerService,
-    private hsLanguageService: HsLanguageService,
   ) {
     super(hsLayerSelectorService);
     this.isEnabled = this.layerDescriptor.pipe(
@@ -63,18 +60,9 @@ export class HsWmsSourceWidgetComponent extends HsLayerEditorWidgetBaseComponent
     const dialog = this.hsDialogContainerService.create(
       HsConfirmDialogComponent,
       {
-        message: this.hsLanguageService.getTranslation(
-          'LAYERMANAGER.layerEditor.changeLayerType',
-          undefined,
-        ),
-        note: this.hsLanguageService.getTranslation(
-          'LAYERMANAGER.layerEditor.layerTypeChangeNote',
-          undefined,
-        ),
-        title: this.hsLanguageService.getTranslation(
-          'LAYERMANAGER.layerEditor.confirmLayerTypeChange',
-          undefined,
-        ),
+        message: 'LAYERMANAGER.layerEditor.changeLayerType',
+        note: 'LAYERMANAGER.layerEditor.layerTypeChangeNote',
+        title: 'LAYERMANAGER.layerEditor.confirmLayerTypeChange',
       },
     );
     const confirmed = await dialog.waitResult();

projects/hslayers/components/layer-manager/widgets/wms-source-widget/wms-source-widget.component.ts

@@ -6,8 +6,6 @@ import {Geometry} from 'ol/geom';
 import {HsConfirmDialogComponent} from 'hslayers-ng/common/confirm';
 import {HsDialogContainerService} from 'hslayers-ng/common/dialogs';
 import {HsFeatureCommonService} from '../feature-common.service';
-import {HsLanguageService} from 'hslayers-ng/shared/language';
-import {HsLayerUtilsService} from 'hslayers-ng/shared/utils';
 import {HsQueryBaseService} from 'hslayers-ng/shared/query';
 import {HsQueryVectorService} from 'hslayers-ng/shared/query';
 import {exportFormats} from '../feature-common.service';
@@ -36,10 +34,8 @@ export class HsQueryFeatureListComponent {
 
   constructor(
     private hsQueryVectorService: HsQueryVectorService,
-    private hsLanguageService: HsLanguageService,
     private hsDialogContainerService: HsDialogContainerService,
     public hsFeatureCommonService: HsFeatureCommonService,
-    private hsLayerUtilsService: HsLayerUtilsService,
     public hsQueryBaseService: HsQueryBaseService,
   ) {}
 
@@ -125,14 +121,8 @@ export class HsQueryFeatureListComponent {
     const dialog = this.hsDialogContainerService.create(
       HsConfirmDialogComponent,
       {
-        message: this.hsLanguageService.getTranslation(
-          'QUERY.reallyDeleteAllSelectedLayers',
-          undefined,
-        ),
-        title: this.hsLanguageService.getTranslation(
-          'COMMON.confirmDelete',
-          undefined,
-        ),
+        message: 'QUERY.reallyDeleteAllSelectedLayers',
+        title: 'COMMON.confirmDelete',
       },
     );
     const confirmed = await dialog.waitResult();