add more localization tags #123

src-ui/src/app/components/common/confirm-dialog/confirm-dialog.component.ts

@@ -14,7 +14,7 @@ export class ConfirmDialogComponent implements OnInit {
   public confirmClicked = new EventEmitter()
 
   @Input()
-  title = "Confirmation"
+  title = $localize`Confirmation`
 
   @Input()
   messageBold
@@ -26,7 +26,7 @@ export class ConfirmDialogComponent implements OnInit {
   btnClass = "btn-primary"
 
   @Input()
-  btnCaption = "Confirm"
+  btnCaption = $localize`Confirm`
 
   confirmButtonEnabled = true
   seconds = 0

src-ui/src/app/components/common/date-dropdown/date-dropdown.component.html

@@ -10,12 +10,12 @@
         <div class="list-group-item d-flex flex-column align-items-start" role="menuitem">
 
           <div class="mb-2 d-flex flex-row w-100 justify-content-between small">
-            <div>After</div>
+            <div i18n>After</div>
             <a *ngIf="dateAfter" class="btn btn-link p-0 m-0" (click)="clearAfter()">
               <svg width="0.8em" height="0.8em" viewBox="0 0 16 16" class="bi bi-x" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                 <path fill-rule="evenodd" d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" />
               </svg>
-              <small>Clear</small>
+              <small i18n>Clear</small>
             </a>
           </div>
 
@@ -26,12 +26,12 @@
         <div class="list-group-item d-flex flex-column align-items-start" role="menuitem">
 
           <div class="mb-2 d-flex flex-row w-100 justify-content-between small">
-            <div>Before</div>
+            <div i18n>Before</div>
             <a *ngIf="dateBefore" class="btn btn-link p-0 m-0" (click)="clearBefore()">
               <svg width="0.8em" height="0.8em" viewBox="0 0 16 16" class="bi bi-x" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                 <path fill-rule="evenodd" d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" />
               </svg>
-              <small>Clear</small>
+              <small i18n>Clear</small>
             </a>
           </div>
 

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html

@@ -25,7 +25,7 @@
         </ng-container>
       </div>
       <button *ngIf="editing" class="list-group-item list-group-item-action bg-light" (click)="applyClicked()" [disabled]="!selectionModel.isDirty()">
-        <small class="ml-1" [ngClass]="{'font-weight-bold': selectionModel.isDirty()}">Apply</small>
+        <small class="ml-1" [ngClass]="{'font-weight-bold': selectionModel.isDirty()}" i18n>Apply</small>
         <svg width="1.5em" height="1em" viewBox="0 0 16 16" fill="currentColor">
           <use xlink:href="assets/bootstrap-icons.svg#arrow-right" />
         </svg>

src-ui/src/app/components/common/select-dialog/select-dialog.component.html

@@ -10,6 +10,6 @@
 
 </div>
 <div class="modal-footer">
-  <button type="button" class="btn btn-outline-dark" (click)="cancelClicked()">Cancel</button>
+  <button type="button" class="btn btn-outline-dark" (click)="cancelClicked()" i18n>Cancel</button>
-  <button type="button" class="btn btn-primary" (click)="selectClicked.emit(selected)">Select</button>
+  <button type="button" class="btn btn-primary" (click)="selectClicked.emit(selected)" i18n>Select</button>
 </div>

src-ui/src/app/components/common/select-dialog/select-dialog.component.ts

@@ -15,10 +15,10 @@ export class SelectDialogComponent implements OnInit {
   public selectClicked = new EventEmitter()
 
   @Input()
-  title = "Select"
+  title = $localize`Select`
 
   @Input()
-  message = "Please select an object"
+  message = $localize`Please select an object`
 
   @Input()
   objects: ObjectWithId[] = []

src-ui/src/app/components/document-detail/metadata-collapse/metadata-collapse.component.ts

@@ -15,7 +15,7 @@ export class MetadataCollapseComponent implements OnInit {
   metadata
 
   @Input()
-  title = "Metadata"
+  title = $localize`Metadata`
 
   ngOnInit(): void {
   }

src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.html

@@ -3,32 +3,29 @@
     <button class="btn btn-sm btn-outline-danger" (click)="list.selectNone()">
       <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
         <use xlink:href="assets/bootstrap-icons.svg#slash-circle" />
-      </svg>
+      </svg>&nbsp;<ng-container i18n>Cancel</ng-container>
-      Cancel
     </button>
   </div>
   <div class="w-100 d-xl-none"></div>
   <div class="col-auto mb-2 mb-xl-0" role="group" aria-label="Select">
-    <label class="mr-2 mb-0">Select:</label>
+    <label class="mr-2 mb-0" i18n>Select:</label>
     <div class="btn-group">
       <button class="btn btn-sm btn-outline-primary" (click)="list.selectPage()">
         <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
           <use xlink:href="assets/bootstrap-icons.svg#file-earmark-check" />
-        </svg>
+        </svg>&nbsp;<ng-container i18n>Page</ng-container>
-        Page
       </button>
       <button class="btn btn-sm btn-outline-primary" (click)="list.selectAll()">
         <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
           <use xlink:href="assets/bootstrap-icons.svg#check-all" />
-        </svg>
+        </svg>&nbsp;<ng-container i18n>All</ng-container>
-        All
       </button>
     </div>
   </div>
   <div class="w-100 d-xl-none"></div>
   <div class="col-auto mb-2 mb-xl-0">
     <div class="d-flex">
-      <label class="ml-auto mt-1 mb-0 mr-2">Edit:</label>
+      <label class="ml-auto mt-1 mb-0 mr-2" i18n>Edit:</label>
       <app-filterable-dropdown class="mr-2 mr-md-3" title="Tags" icon="tag-fill"
         [items]="tags"
         [editing]="true"
@@ -58,8 +55,7 @@
     <button type="button" class="btn btn-sm btn-outline-danger ml-0 ml-lg-auto" (click)="applyDelete()">
       <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
         <use xlink:href="assets/bootstrap-icons.svg#trash" />
-      </svg>
+      </svg>&nbsp;<ng-container i18n>Delete</ng-container>
-      Delete
     </button>
   </div>
 </div>

src-ui/src/app/components/document-list/document-list.component.html

@@ -4,13 +4,13 @@
     <button class="btn btn-sm btn-outline-primary" id="dropdownSelect" ngbDropdownToggle>
       <svg class="toolbaricon" fill="currentColor">
         <use xlink:href="assets/bootstrap-icons.svg#text-indent-left" />
-      </svg>
+      </svg>&nbsp;<ng-container i18n>Select</ng-container>
-      Select
+      
     </button>
     <div ngbDropdownMenu aria-labelledby="dropdownSelect" class="shadow">
-      <button ngbDropdownItem (click)="list.selectPage()">Select page</button>
+      <button ngbDropdownItem (click)="list.selectNone()" i18n>Select none</button>
-      <button ngbDropdownItem (click)="list.selectAll()">Select all</button>
+      <button ngbDropdownItem (click)="list.selectPage()" i18n>Select page</button>
-      <button ngbDropdownItem (click)="list.selectNone()">Select none</button>
+      <button ngbDropdownItem (click)="list.selectAll()" i18n>Select all</button>
     </div>
   </div>
 

src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html

@@ -1,18 +1,18 @@
 <div class="row">
    <div class="col mb-2 mb-xl-0">
      <div class="form-inline d-flex">
-         <label class="text-muted mr-2">Filter by:</label>
+         <label class="text-muted mr-2" i18n>Filter by:</label>
-         <input class="form-control form-control-sm flex-grow-1" type="text" [(ngModel)]="titleFilter" placeholder="Title">
+         <input class="form-control form-control-sm flex-grow-1" type="text" [(ngModel)]="titleFilter" placeholder="Title" i18n-placeholder>
      </div>
   </div>
   <div class="w-100 d-xl-none"></div>
    <div class="col col-xl-auto mb-2 mb-xl-0">
      <div class="d-flex">
-       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="tags" [(selectionModel)]="tagSelectionModel" (selectionModelChange)="updateRules()" [multiple]="true" title="Tags" icon="tag-fill"></app-filterable-dropdown>
+       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="tags" [(selectionModel)]="tagSelectionModel" (selectionModelChange)="updateRules()" [multiple]="true" title="Tags" icon="tag-fill" i18n-title></app-filterable-dropdown>
-       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="correspondents" [(selectionModel)]="correspondentSelectionModel" (selectionModelChange)="updateRules()" title="Correspondents" icon="person-fill"></app-filterable-dropdown>
+       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="correspondents" [(selectionModel)]="correspondentSelectionModel" (selectionModelChange)="updateRules()" title="Correspondents" icon="person-fill" i18n-title></app-filterable-dropdown>
-       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="documentTypes" [(selectionModel)]="documentTypeSelectionModel" (selectionModelChange)="updateRules()" title="Document types" icon="file-earmark-fill"></app-filterable-dropdown>
+       <app-filterable-dropdown class="mr-2 mr-md-3" [items]="documentTypes" [(selectionModel)]="documentTypeSelectionModel" (selectionModelChange)="updateRules()" title="Document types" icon="file-earmark-fill" i18n-title></app-filterable-dropdown>
-       <app-date-dropdown class="mr-2 mr-md-3" [(dateBefore)]="dateCreatedBefore" [(dateAfter)]="dateCreatedAfter" title="Created" (datesSet)="updateRules()"></app-date-dropdown>
+       <app-date-dropdown class="mr-2 mr-md-3" [(dateBefore)]="dateCreatedBefore" [(dateAfter)]="dateCreatedAfter" title="Created" (datesSet)="updateRules()" i18n-title></app-date-dropdown>
-       <app-date-dropdown [(dateBefore)]="dateAddedBefore" [(dateAfter)]="dateAddedAfter" title="Added"  (datesSet)="updateRules()"></app-date-dropdown>
+       <app-date-dropdown [(dateBefore)]="dateAddedBefore" [(dateAfter)]="dateAddedAfter" title="Added"  (datesSet)="updateRules()" i18n-title></app-date-dropdown>
      </div>
    </div>
    <div class="w-100 d-xl-none"></div>
@@ -20,8 +20,8 @@
      <button class="btn btn-link btn-sm px-0 mx-0 ml-xl-n4" [disabled]="!hasFilters()" (click)="clearSelected()">
        <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-x" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
          <path fill-rule="evenodd" d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
-       </svg>
+       </svg>&nbsp;<ng-container i18n>Clear all filters</ng-container>
-       Clear all filters
+       
      </button>
    </div>
 </div>

src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts

@@ -25,13 +25,13 @@ export class FilterEditorComponent implements OnInit, OnDestroy {
       switch(this.filterRules[0].rule_type) {
 
         case FILTER_CORRESPONDENT:
-          return `Correspondent: ${this.correspondents.find(c => c.id == +rule.value)?.name}`
+          return $localize`Correspondent: ${this.correspondents.find(c => c.id == +rule.value)?.name}`
 
         case FILTER_DOCUMENT_TYPE:
-          return `Type: ${this.documentTypes.find(dt => dt.id == +rule.value)?.name}`
+          return $localize`Type: ${this.documentTypes.find(dt => dt.id == +rule.value)?.name}`
 
         case FILTER_HAS_TAG:
-          return `Tag: ${this.tags.find(t => t.id == +rule.value)?.name}`
+          return $localize`Tag: ${this.tags.find(t => t.id == +rule.value)?.name}`
 
       }
     }