improving duplicate page

backend/middlewares/thumbnail/ThumbnailGeneratorMWs.ts

@@ -65,7 +65,7 @@ export class ThumbnailGeneratorMWs {
       }
 
     } catch (error) {
-      return next(new ErrorDTO(ErrorCodes.SERVER_ERROR, 'error during postprocessing result', error.toString()));
+      return next(new ErrorDTO(ErrorCodes.SERVER_ERROR, 'error during postprocessing result (adding thumbnail info)', error.toString()));
 
     }
 

frontend/app/duplicates/duplicates.component.css

@@ -1,6 +1,3 @@
-.same-data {
-  font-weight: bold;
-}
 .card{
   margin: 8px 0;
 }
@@ -13,3 +10,7 @@
 .row:hover{
   background-color: #f8f9fa;
 }
+
+a{
+  color: #212529;
+}

frontend/app/duplicates/duplicates.component.html

@@ -2,28 +2,31 @@
 
   <div body class="container">
     <ng-template [ngIf]="renderedDirGroups">
+      <div class="alert alert-secondary" role="alert" *ngIf=" duplicateCount.photos >0" i18n>
+        Listing <strong>{{duplicateCount.pairs}}</strong> duplicates ({{duplicateCount.photos}} photos).
+      </div>
+      <div class="alert alert-secondary" role="alert" *ngIf=" duplicateCount.photos ==0" i18n>
+        No duplicates found
+      </div>
       <div *ngFor="let group of renderedDirGroups">
         <strong>{{group.name}}</strong>
         <div *ngFor="let pairs of group.duplicates" class="card">
           <div class="card-body">
-            <div *ngFor="let media of pairs.media"
+            <a *ngFor="let media of pairs.media"
                class="row"
                [routerLink]="['/gallery', getDirectoryPath(media.directory)]"
                [queryParams]="queryService.getParams()">
               <app-duplicates-photo class="col-1" [media]="media"></app-duplicates-photo>
-              <div class="col-5">
+              <div class="col-6">
-                /{{getDirectoryPath(media.directory)}}/<span class="same-data">{{media.name}}</span>
+                /{{getDirectoryPath(media.directory)}}/<strong>{{media.name}}</strong>
               </div>
               <div class="col-2">
-                <span class="same-data">{{media.metadata.fileSize | fileSize}}</span>
+                {{media.metadata.fileSize | fileSize}}
-              </div>
-              <div class="col-2" [title]="media.metadata.creationDate">
-                {{media.metadata.creationDate | date}}
-              </div>
-              <div class="col-2">
-                {{media.metadata.size.width}}x{{media.metadata.size.height}}
               </div>
+              <div class="col-3" [title]="media.metadata.creationDate">
+                {{media.metadata.creationDate | date}}, {{media.metadata.creationDate | date:'mediumTime'}}
               </div>
+            </a>
           </div>
         </div>
       </div>

frontend/app/duplicates/duplicates.component.ts

@@ -28,6 +28,10 @@ export class DuplicateComponent implements OnDestroy {
   };
   subscription: Subscription;
   renderTimer: number = null;
+  duplicateCount = {
+    pairs: 0,
+    photos: 0
+  };
 
   constructor(public _duplicateService: DuplicateService,
               public queryService: QueryService) {
@@ -36,9 +40,16 @@ export class DuplicateComponent implements OnDestroy {
       this.directoryGroups = [];
       this.renderedIndex = {group: -1, pairs: 0};
       this.renderedDirGroups = [];
+      this.duplicateCount = {
+        pairs: 0,
+        photos: 0
+      };
       if (duplicates === null) {
         return;
       }
+      this.duplicateCount.photos = duplicates.reduce((prev: number, curr) => prev + curr.media.length, 0);
+      this.duplicateCount.pairs = duplicates.length;
+
       const getMostFrequentDir = (dupls: DuplicatesDTO[]) => {
         if (dupls.length === 0) {
           return null;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pigallery2",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "This is a photo gallery optimised for running low resource servers (especially on raspberry pi)",
   "author": "Patrik J. Braun",
   "homepage": "https://github.com/bpatrik/PiGallery2",