Merge pull request #5030 from tsiegleauq/date-pipe

Add custom date pipe

client/src/app/shared/components/sort-filter-bar/sort-filter-bar.component.html

@@ -23,8 +23,8 @@
     <div class="action-buttons">
         <!-- Filter button -->
         <button mat-button *ngIf="hasFilters" (click)="filterMenu.opened ? filterMenu.close() : filterMenu.open()">
-            <span class="upper" [matBadge]="filterAmount" matBadgeColor="accent" [matBadgeOverlap]="false" translate>
-                Filter
+            <span class="upper" [matBadge]="filterAmount" matBadgeColor="accent" [matBadgeOverlap]="false">
+                {{ 'Filter' | translate }}
             </span>
         </button>
 

client/src/app/shared/pipes/localized-date.pipe.spec.ts

@@ -0,0 +1,20 @@
+import { inject, TestBed } from '@angular/core/testing';
+
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
+
+import { LocalizedDatePipe } from './localized-date.pipe';
+
+describe('LocalizedDatePipe', () => {
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [TranslateModule.forRoot()],
+            declarations: [LocalizedDatePipe]
+        });
+        TestBed.compileComponents();
+    });
+
+    it('create an instance', inject([TranslateService], (translate: TranslateService) => {
+        const pipe = new LocalizedDatePipe(translate);
+        expect(pipe).toBeTruthy();
+    }));
+});

client/src/app/shared/pipes/localized-date.pipe.ts

@@ -0,0 +1,25 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+import { TranslateService } from '@ngx-translate/core';
+import * as moment from 'moment';
+
+/**
+ * pipe to convert and translate dates
+ */
+@Pipe({
+    name: 'localizedDate',
+    pure: false
+})
+export class LocalizedDatePipe implements PipeTransform {
+    public constructor(private translate: TranslateService) {}
+
+    public transform(value: any, dateFormat: string = 'lll'): any {
+        const lang = this.translate.currentLang ? this.translate.currentLang : this.translate.defaultLang;
+        if (!value) {
+            return '';
+        }
+        moment.locale(lang);
+        const dateLocale = moment.unix(value).local();
+        return dateLocale.format(dateFormat);
+    }
+}

client/src/app/shared/shared.module.ts

@@ -108,6 +108,7 @@ import { PdfViewerModule } from 'ng2-pdf-viewer';
 import { GlobalSpinnerComponent } from 'app/site/common/components/global-spinner/global-spinner.component';
 import { HeightResizingDirective } from './directives/height-resizing.directive';
 import { TrustPipe } from './pipes/trust.pipe';
+import { LocalizedDatePipe } from './pipes/localized-date.pipe';
 
 /**
  * Share Module for all "dumb" components and pipes.
@@ -256,7 +257,8 @@ import { TrustPipe } from './pipes/trust.pipe';
         OverlayComponent,
         PreviewComponent,
         NgxMaterialTimepickerModule,
-        TrustPipe
+        TrustPipe,
+        LocalizedDatePipe
     ],
     declarations: [
         PermsDirective,
@@ -302,7 +304,8 @@ import { TrustPipe } from './pipes/trust.pipe';
         OverlayComponent,
         PreviewComponent,
         HeightResizingDirective,
-        TrustPipe
+        TrustPipe,
+        LocalizedDatePipe
     ],
     providers: [
         {
@@ -317,7 +320,8 @@ import { TrustPipe } from './pipes/trust.pipe';
         SortBottomSheetComponent,
         DecimalPipe,
         ProgressSnackBarComponent,
-        TrustPipe
+        TrustPipe,
+        LocalizedDatePipe
     ],
     entryComponents: [
         SortBottomSheetComponent,