DataSet - createdBy & createdAt

Frontend/src/app/modules/data-sets/data-set-detail/data-set-detail.component.ts

@@ -1,10 +1,11 @@
 import { DataSource } from '@angular/cdk/collections';
+import { DatePipe, DecimalPipe } from '@angular/common';
 import { HttpClient } from '@angular/common/http';
 import { Component, ViewChild } from '@angular/core';
 import { UntypedFormGroup, UntypedFormBuilder } from '@angular/forms';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSnackBar } from '@angular/material/snack-bar';
-import { MatSort } from '@angular/material/sort';
+import { MatSort, MatSortable } from '@angular/material/sort';
 import { MatTableDataSource } from '@angular/material/table';
 import { Router, ActivatedRoute } from '@angular/router';
 import moment from 'moment';
@@ -20,9 +21,9 @@ import { DataSet } from 'src/app/models/dataSet.model';
 export class DataSetDetailComponent {
 
   public form!: UntypedFormGroup;
-  private document!: DataSet;
+  public document!: DataSet;
 
-  displayedColumns = ['code', 'value', 'desc1'];
+  displayedColumns = ['code', 'value'];
   dataSource!: MatTableDataSource<DataRow>;
 
   @ViewChild(MatPaginator) paginator!: MatPaginator;
@@ -34,7 +35,8 @@ export class DataSetDetailComponent {
     private http$: HttpClient,
     private route$: ActivatedRoute,
     private auth$: AuthService,
-    private snackBar: MatSnackBar
+    private snackBar: MatSnackBar,
+    private datePipe: DatePipe
   ) { }
 
   async ngOnInit() {
@@ -45,6 +47,8 @@ export class DataSetDetailComponent {
     this.dataSource.sort = this.sort;
     this.document.fillForm(this.form);
     this.form.disable();
+    this.document.created = `${this.datePipe.transform(this.document.createdAt?.toDate(), 'short')}, ${this.document.createdBy?.userName}`;
+    this.dataSource.sort.sort({ id: 'code', start: 'desc' } as MatSortable);
   }
   private async load(): Promise<DataSet> {
       return await DataSet.getById(this.route$.snapshot.paramMap.get('id') || "", this.http$);