i18n the dashboard

src/app/tabs/dashboard.component.html

@@ -2,77 +2,77 @@
     <h3 class="card-header">{{'sync' | i18n}}</h3>
     <div class="card-body">
         <p>
-            Last group sync:
+            {{'lastGroupSync' | i18n}}:
             <span *ngIf="!lastGroupSync">-</span>
             {{lastGroupSync | date:'medium'}}
-            <br /> Last user sync:
+            <br /> {{'lastUserSync' | i18n}}:
             <span *ngIf="!lastUserSync">-</span>
             {{lastUserSync | date:'medium'}}
         </p>
         <p>
-            Sync status:
+            {{'syncStatus' | i18n}}:
-            <strong *ngIf="syncRunning" class="text-success">Running</strong>
+            <strong *ngIf="syncRunning" class="text-success">{{'running' | i18n}}</strong>
-            <strong *ngIf="!syncRunning" class="text-danger">Stopped</strong>
+            <strong *ngIf="!syncRunning" class="text-danger">{{'stopped' | i18n}}</strong>
         </p>
         <button #startBtn (click)="start()" [appApiAction]="startPromise" class="btn btn-primary" [disabled]="startBtn.loading">
             <i class="fa fa-play fa-fw" [hidden]="startBtn.loading"></i>
             <i class="fa fa-spinner fa-fw fa-spin" [hidden]="!startBtn.loading"></i>
-            Start Sync
+            {{'startSync' | i18n}}
         </button>
         <button (click)="stop()" class="btn btn-primary">
             <i class="fa fa-stop fa-fw"></i>
-            Stop Sync
+            {{'stopSync' | i18n}}
         </button>
         <button #syncBtn (click)="sync()" [appApiAction]="syncPromise" class="btn btn-primary" [disabled]="syncBtn.loading">
             <i class="fa fa-refresh fa-fw" [ngClass]="{'fa-spin': syncBtn.loading}"></i>
-            Sync Now
+            {{'syncNow' | i18n}}
         </button>
     </div>
 </div>
 <div class="card">
-    <h3 class="card-header">Testing</h3>
+    <h3 class="card-header">{{'testing' | i18n}}</h3>
     <div class="card-body">
-        <p>You can run tests to see how your directory and sync settings are working. Tests will not sync to your Bitwarden organization.</p>
+        <p>{{'testingDesc' | i18n}}</p>
         <button #simBtn (click)="simulate()" [appApiAction]="simPromise" class="btn btn-primary" [disabled]="simBtn.loading">
             <i class="fa fa-spinner fa-fw fa-spin" [hidden]="!simBtn.loading"></i>
             <i class="fa fa-bug fa-fw" [hidden]="simBtn.loading"></i>
-            Test Now
+            {{'testNow' | i18n}}
         </button>
         <div class="form-check mt-2">
             <input class="form-check-input" type="checkbox" id="simSinceLast" [(ngModel)]="simSinceLast">
-            <label class="form-check-label" for="simSinceLast">Since the last successful sync</label>
+            <label class="form-check-label" for="simSinceLast">{{'testLastSync' | i18n}}</label>
         </div>
         <ng-container *ngIf="!simBtn.loading && (simUsers || simGroups)">
             <hr />
             <div class="row">
                 <div class="col-lg">
-                    <h4>Users</h4>
+                    <h4>{{'users' | i18n}}</h4>
                     <ul class="fa-ul testing-list" *ngIf="simEnabledUsers && simEnabledUsers.length">
                         <li *ngFor="let u of simEnabledUsers" title="{{u.referenceId}}">
                             <i class="fa-li fa fa-user"></i>
                             {{u.displayName}}
                         </li>
                     </ul>
-                    <p *ngIf="!simEnabledUsers || !simEnabledUsers.length">No users to list.</p>
+                    <p *ngIf="!simEnabledUsers || !simEnabledUsers.length">{{'noUsers' | i18n}}</p>
-                    <h4>Disabled Users</h4>
+                    <h4>{{'disabledUsers' | i18n}}</h4>
                     <ul class="fa-ul testing-list" *ngIf="simDisabledUsers && simDisabledUsers.length">
                         <li *ngFor="let u of simDisabledUsers" title="{{u.referenceId}}">
                             <i class="fa-li fa fa-user"></i>
                             {{u.displayName}}
                         </li>
                     </ul>
-                    <p *ngIf="!simDisabledUsers || !simDisabledUsers.length">No users to list.</p>
+                    <p *ngIf="!simDisabledUsers || !simDisabledUsers.length">{{'noUsers' | i18n}}</p>
-                    <h4>Deleted Users</h4>
+                    <h4>{{'deletedUsers' | i18n}}</h4>
                     <ul class="fa-ul testing-list" *ngIf="simDeletedUsers && simDeletedUsers.length">
                         <li *ngFor="let u of simDeletedUsers" title="{{u.referenceId}}">
                             <i class="fa-li fa fa-user"></i>
                             {{u.displayName}}
                         </li>
                     </ul>
-                    <p *ngIf="!simDeletedUsers || !simDeletedUsers.length">No users to list.</p>
+                    <p *ngIf="!simDeletedUsers || !simDeletedUsers.length">{{'noUsers' | i18n}}</p>
                 </div>
                 <div class="col-lg">
-                    <h4>Groups</h4>
+                    <h4>{{'groups' | i18n}}</h4>
                     <ul class="fa-ul testing-list" *ngIf="simGroups && simGroups.length">
                         <li *ngFor="let g of simGroups" title="{{g.referenceId}}">
                             <i class="fa-li fa fa-sitemap"></i>
@@ -82,7 +82,7 @@
                             </ul>
                         </li>
                     </ul>
-                    <p *ngIf="!simGroups || !simGroups.length">No groups to list.</p>
+                    <p *ngIf="!simGroups || !simGroups.length">{{'noGroups' | i18n}}</p>
                 </div>
             </div>
         </ng-container>

src/app/tabs/dashboard.component.ts

@@ -78,13 +78,13 @@ export class DashboardComponent implements OnInit, OnDestroy {
         await this.startPromise;
         this.messagingService.send('scheduleNextDirSync');
         this.syncRunning = true;
-        this.toasterService.popAsync('success', null, 'Syncing started.');
+        this.toasterService.popAsync('success', null, this.i18nService.t('syncingStarted'));
     }
 
     async stop() {
         this.messagingService.send('cancelDirSync');
         this.syncRunning = false;
-        this.toasterService.popAsync('success', null, 'Syncing stopped.');
+        this.toasterService.popAsync('success', null, this.i18nService.t('syncingStopped'));
     }
 
     async sync() {
@@ -92,7 +92,8 @@ export class DashboardComponent implements OnInit, OnDestroy {
         const result = await this.syncPromise;
         const groupCount = result[0] != null ? result[0].length : 0;
         const userCount = result[1] != null ? result[1].length : 0;
-        this.toasterService.popAsync('success', null, 'Synced ' + groupCount + ' groups and ' + userCount + ' users.');
+        this.toasterService.popAsync('success', null,
+            this.i18nService.t('syncCounts', groupCount.toString(), userCount.toString()));
     }
 
     async simulate() {
@@ -108,7 +109,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
                 this.simUsers = result[1];
                 this.simGroups = result[0];
             } catch (e) {
-                reject(e || 'Sync error.');
+                reject(e || this.i18nService.t('syncError'));
             }
 
             const userMap = new Map<string, UserEntry>();

src/app/tabs/settings.component.html

@@ -116,7 +116,7 @@
         </div>
 
         <div class="card mb-3">
-            <h3 class="card-header">{{'organization' | i18n}}</h3>
+            <h3 class="card-header">{{'account' | i18n}}</h3>
             <div class="card-body">
                 <div class="form-group">
                     <label for="organizationId">{{'organization' | i18n}}</label>

src/locales/en/messages.json

@@ -446,5 +446,84 @@
     },
     "syncCacheCleared": {
         "message": "The sync cache has been cleared."
+    },
+    "lastGroupSync": {
+        "message": "Last group sync"
+    },
+    "lastUserSync": {
+        "message": "Last user sync"
+    },
+    "syncStatus": {
+        "message": "Sync status"
+    },
+    "running": {
+        "message": "Running"
+    },
+    "stopped": {
+        "message": "Stopped"
+    },
+    "startSync": {
+        "message": "Start Sync"
+    },
+    "stopSync": {
+        "message": "Stop Sync"
+    },
+    "syncNow": {
+        "message": "Sync Now"
+    },
+    "testing": {
+        "message": "Testing"
+    },
+    "testingDesc": {
+        "message": "You can run tests to see how your directory and sync settings are working. Tests will not sync to your Bitwarden organization."
+    },
+    "testNow": {
+        "message": "Test Now"
+    },
+    "testLastSync": {
+        "message": "Test since the last successful sync"
+    },
+    "users": {
+        "message": "Users"
+    },
+    "disabledUsers": {
+        "message": "Disabled Users"
+    },
+    "deletedUsers": {
+        "message": "Deleted Users"
+    },
+    "noUsers": {
+        "message": "No users to list."
+    },
+    "groups": {
+        "message": "Groups"
+    },
+    "noGroups": {
+        "message": "No groups to list."
+    },
+    "syncingStarted": {
+        "message": "Syncing started."
+    },
+    "syncingStopped": {
+        "message": "Syncing stopped."
+    },
+    "syncCounts": {
+        "message": "Synced $GROUP_COUNT$ group(s) and $USER_COUNT$ user(s).",
+        "placeholders": {
+            "group_count": {
+                "content": "$1",
+                "example": "10"
+            },
+            "user_count": {
+                "content": "$1",
+                "example": "55"
+            }
+        }
+    },
+    "syncError": {
+        "message": "Sync error."
+    },
+    "account": {
+        "message": "Account"
     }
 }