From c975fc859f343650499d18175e3a7ed99acf4e44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Thu, 16 Sep 2021 00:49:15 +0300
Subject: [PATCH] RED-2114: sort & disable old files in trash

---
 ...it-dossier-deleted-documents.component.html |  9 ++++++---
 ...edit-dossier-deleted-documents.component.ts | 18 +++++++++++++++++-
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.html b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.html
index fc5b1acfe..019278fc4 100644
--- a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.html
+++ b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.html
@@ -4,6 +4,7 @@
     [itemSize]="50"
     [noDataText]="'edit-dossier-dialog.deleted-documents.no-data.title' | translate"
     [selectionEnabled]="true"
+    [tableItemClasses]="{ disabled: disabledFn }"
     noDataIcon="red:document"
 ></iqser-table>
 
@@ -40,8 +41,8 @@
 </ng-template>
 
 <ng-template #pagesTemplate let-file="entity">
-    <div class="cell small-label stats-subtitle">
-        <div>
+    <div class="cell stats-subtitle">
+        <div class="small-label">
             <mat-icon svgIcon="red:pages"></mat-icon>
             {{ file.numberOfPages }}
         </div>
@@ -49,7 +50,9 @@
 </ng-template>
 
 <ng-template #deletedDateTemplate let-file="entity">
-    <div class="cell small-label">{{ file.softDeleted | date: 'exactDate' }}</div>
+    <div class="cell">
+        <span class="small-label">{{ file.softDeleted | date: 'exactDate' }}</span>
+    </div>
 </ng-template>
 
 <ng-template #restoreDateTemplate let-file="entity">
diff --git a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.ts b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.ts
index 9738be0f8..cce960008 100644
--- a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.ts
+++ b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.ts
@@ -1,7 +1,15 @@
 import { Component, EventEmitter, forwardRef, Injector, Input, OnInit, Output, TemplateRef, ViewChild } from '@angular/core';
 import { EditDossierSectionInterface } from '../edit-dossier-section.interface';
 import { DossierWrapper } from '@state/model/dossier.wrapper';
-import { CircleButtonTypes, DefaultListingServices, Listable, ListingComponent, LoadingService, TableColumnConfig } from '@iqser/common-ui';
+import {
+    CircleButtonTypes,
+    DefaultListingServices,
+    Listable,
+    ListingComponent,
+    LoadingService,
+    SortingOrders,
+    TableColumnConfig
+} from '@iqser/common-ui';
 import { FileManagementControllerService, FileStatus, StatusControllerService } from '@redaction/red-ui-http';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import * as moment from 'moment';
@@ -85,6 +93,10 @@ export class EditDossierDeletedDocumentsComponent extends ListingComponent<FileL
         this._loadingService.start();
         const files = await this._statusController.getDeletedFileStatus(this.dossierWrapper.dossierId).toPromise();
         this.entitiesService.setEntities(this._toListItems(files));
+        this.sortingService.setSortingOption({
+            column: 'softDeleted',
+            order: SortingOrders.desc
+        });
         this._loadingService.stop();
     }
 
@@ -96,6 +108,8 @@ export class EditDossierDeletedDocumentsComponent extends ListingComponent<FileL
         this._loadingService.loadWhile(this._restore(files));
     }
 
+    disabledFn = (file: FileListItem) => !file.canRestore;
+
     private _configureTableColumns() {
         this.tableColumnConfigs = [
             {
@@ -110,11 +124,13 @@ export class EditDossierDeletedDocumentsComponent extends ListingComponent<FileL
             {
                 label: _('edit-dossier-dialog.deleted-documents.table-col-names.deleted-on'),
                 template: this.deletedDateTemplate,
+                sortByKey: 'softDeleted',
                 width: '2fr'
             },
             {
                 label: _('edit-dossier-dialog.deleted-documents.table-col-names.time-to-restore'),
                 template: this.restoreDateTemplate,
+                sortByKey: 'softDeleted',
                 width: '2fr'
             }
         ];