SHIBUI-814 Converted text to use new directives

backend/src/main/resources/i18n/messages_en.properties

@@ -3,11 +3,27 @@ action.logout=Logout
 action.add-new=Add New
 action.clear=Clear
 
+action.use-mine=Use My Changes
+action.use-theirs=Use Their Changes
+
 heading.shibboleth=Shibboleth { foo }
 
-label.metadata-sources=Metadata Sources
 label.metadata-source=Metadata Source
-label.metadata-providers=Metadata Providers
+label.metadata-sources=Metadata Sources
 label.metadata-provider=Metadata Provider
+label.metadata-providers=Metadata Providers
 label.source-management=Source Management
 label.search-files=Search Files
+
+label.service-provider-entity-id=Service Provider Entity ID
+
+label.my-changes=My Changes
+label.their-changes=Their Changes
+
+label.service-provider-name-dashboard-display-only=Service Provider Name (Dashboard Display Only)
+
+
+message.data-version-contention=Data Version Contention
+message.contention-new-version=A newer version of this metadata source has been saved. Below are a list of changes. You can use your changes or their changes.
+
+tooltip.service-provider-name-dashboard-display-only=Service Provider Name (Dashboard Display Only) popover

ui/src/app/app.component.html

@@ -1,10 +1,9 @@
-<!--The content below is only a placeholder and can be replaced.-->
 <nav class="navbar navbar-expand-md fixed-top">
     <a class="navbar-brand" [href]="brand.logo.link.url" target="_blank" [title]="brand.logo.link.description">
         <img [src]="brand.logo.small" width="30" height="30" class="d-inline-block align-top" [alt]="brand.logo.alt">
         <span class="d-lg-inline d-none">{{ brand.logo.link.label }}</span>
     </a>
-    <span class="navbar-text" i18n="@@label--app">{{ brand.header.title }}</span>
+    <span class="navbar-text">{{ brand.header.title }}</span>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbar"
             aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
@@ -30,7 +29,7 @@
                         role="button">
                         <i class="fa fa-cube fa-fw" aria-hidden="true"></i>
                         &nbsp;
-                        <ng-container i18n="@@action--add-source">Metadata Source</ng-container>
+                        <translate key="label.metadata-source">Metadata Source</translate>
                     </a>
                     <a class="nav-link"
                         routerLink="/metadata/provider/wizard"
@@ -39,20 +38,20 @@
                         role="button">
                         <i class="fa fa-cubes fa-fw" aria-hidden="true"></i>
                         &nbsp;
-                        <ng-container i18n="@@action--add-filter">Metadata Provider</ng-container>
+                        <translate key="label.metadata-provider">Metadata Provider</translate>
                     </a>
                 </div>
             </li>
             <li class="nav-item">
                 <a class="nav-link" routerLink="/metadata" routerLinkActive="active" aria-label="Metadata Dashboard">
                     <i class="fa fa-th fa-fw" aria-hidden="true"></i>
-                    <ng-container i18n="@@action--dashboard">Dashboard</ng-container>
+                    <translate key="action.dashboard">Dashboard</translate>
                 </a>
             </li>
             <li>
                 <a class="nav-link" href="/logout" target="_self" aria-label="Log out of Shibboleth UI">
                     <i class="fa fa-sign-out fa-fw" aria-hidden="true"></i>
-                    <ng-container i18n="@@action--logout">Logout</ng-container>
+                    <translate key="action.logout">Logout</translate>
                 </a>
             </li>
         </ul>
@@ -78,7 +77,7 @@
                 {{ formatted$ | async }}
                 &nbsp;|&nbsp;
                 </ng-container>
-                <ng-container i18n="@@label--copyright">Copyright</ng-container> &copy; {{ today | date:'yyyy' }} Internet2
+                <translate key="label.copyright" [params]="{ year: year }">Copyright &copy; Internet2</translate>
             </p>
         </div>
         <div class="col-md-4 logo">

ui/src/app/contention/component/change-item.component.html

@@ -2,7 +2,7 @@
     <h5 class="mb-1"><i18n-text [key]="item.label"></i18n-text></h5>
     <small *ngIf="item.conflict">
         <i class="fa fa-exclamation-triangle text-danger" aria-hidden="true"></i>
-        <span class="sr-only">Conflict</span>
+        <span class="sr-only" translate="message.conflict">Conflict</span>
     </small>
 </div>
 <ng-container [ngSwitch]="type">

ui/src/app/contention/component/contention-dialog.component.html

@@ -1,16 +1,17 @@
-<div i18n-aria-label="@@message--data-version-contention" aria-label="Data Version Contention" role="region" tabindex="0">
+<div i18n-aria-label="@@message.data-version-contention" aria-label="Data Version Contention" role="region" tabindex="0">
     <div class="modal-header">
-        <h4 class="modal-title" i18n="@@message--data-version-contention">Data Version Contention</h4>
+        <h4 class="modal-title" translate="message.data-version-contention">Data Version Contention</h4>
     </div>
     <div class="modal-body">
         <div class="d-flex w-100 justify-content-between">
             <i class="fa fa-fw fa-exclamation-triangle fa-3x text-warning"></i>
-            <p class="ml-2" i18n="@message--contention-new-version">A newer version of this metadata source has been saved. Below are a list of changes. You can use your changes or their changes.</p>
+            <p class="ml-2" translate="message.contention-new-version">A newer version of this metadata source has been saved. Below are a list of changes. You can use your changes or their
+            changes.</p>
         </div>
         <div class="row">
             <div class="col col-6">
                 <div class="card">
-                    <div class="card-header bg-info text-white">
+                    <div class="card-header bg-info text-white" translate="label.my-changes">
                         My Changes
                     </div>
                     <div class="list-group list-group-flush">
@@ -20,7 +21,7 @@ <h4 class="modal-title" i18n="@@message--data-version-contention">Data Version C
             </div>
             <div class="col col-6">
                 <div class="card">
-                    <div class="card-header bg-danger text-white">
+                    <div class="card-header bg-danger text-white" translate="label.their-changes">
                         Their Changes
                     </div>
                     <div class="list-group list-group-flush">
@@ -32,12 +33,12 @@ <h4 class="modal-title" i18n="@@message--data-version-contention">Data Version C
     </div>
     <div class="modal-footer">
         <button
-            i18n="@@action--use-mine"
+            translate="action.use-mine"
             class="btn btn-info"
             (click)="activeModal.close(resolutionObj)"
             [disabled]="!resolutionObj">Use My Changes</button>
         <button
-            i18n="@@action--use-theirs"
+            translate="action.use-theirs"
             class="btn btn-danger"
             (click)="activeModal.dismiss(rejectionObj)"
             [disabled]="!rejectionObj">Use Their Changes</button>

ui/src/app/contention/contention.module.ts

@@ -9,6 +9,7 @@ import { ContentionDialogComponent } from './component/contention-dialog.compone
 import { ChangeItemComponent } from './component/change-item.component';
 import { ContentionService } from './service/contention.service';
 import { SharedModule } from '../shared/shared.module';
+import { I18nModule } from '../i18n/i18n.module';
 
 export const COMPONENTS = [
     ContentionDialogComponent,
@@ -20,7 +21,8 @@ export const COMPONENTS = [
         CommonModule,
         SharedModule,
         StoreModule.forFeature('contention', reducers),
-        EffectsModule.forFeature([ContentionEffects])
+        EffectsModule.forFeature([ContentionEffects]),
+        I18nModule
     ],
     providers: [
         ContentionService