show captures without dates

numbersprotocol · Sep 5, 2022 · 2bca65b · 2bca65b
1 parent 33ed41b
commit 2bca65b
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 34 deletions.
diff --git a/src/app/features/home/capture-tab/capture-tab.component.html b/src/app/features/home/capture-tab/capture-tab.component.html
@@ -27,42 +27,28 @@
 
   <div *ngSwitchCase="'captured'">
     <div class="capture-container" *transloco="let t">
-      <ng-container
-        *ngFor="
-          let group of capturesByDate$
-            | ngrxPush
-            | keyvalue: keyDescendingOrder;
-          first as isFirstGroup;
-          trackBy: trackCaptureGroupByDate
-        "
-      >
-        <div class="mat-title">{{ group.key | date: 'longDate' }}</div>
-        <mat-grid-list cols="2" gutterSize="8px">
-          <mat-grid-tile
-            *ngFor="
-              let proof of group.value;
-              first as isFirstProof;
-              trackBy: trackCaptureItem
-            "
-            class="capture-item"
-            [joyrideStep]="
-              isFirstGroup && isFirstProof
-                ? 'highlightFirstCapture'
-                : 'notFirst'
-            "
-            [title]="t('userGuide.capturedItem')"
-            [text]="t('userGuide.openToSeeDetailsAndMoreActionItems')"
-          >
-            <app-capture-item [proof]="proof"></app-capture-item>
-          </mat-grid-tile>
-        </mat-grid-list>
-      </ng-container>
+      <mat-grid-list cols="2" gutterSize="16px">
+        <mat-grid-tile
+          *ngFor="
+            let proof of captures$ | ngrxPush;
+            first as isFirstProof;
+            trackBy: trackCaptureItem
+          "
+          class="capture-item"
+          [joyrideStep]="isFirstProof ? 'highlightFirstCapture' : 'notFirst'"
+          [title]="t('userGuide.capturedItem')"
+          [text]="t('userGuide.openToSeeDetailsAndMoreActionItems')"
+        >
+          <app-capture-item [proof]="proof"></app-capture-item>
+        </mat-grid-tile>
+      </mat-grid-list>
     </div>
   </div>
 
   <div class="post-captures" *ngSwitchCase="'collected'">
-    <mat-grid-list cols="2" gutterSize="8px">
+    <mat-grid-list cols="2" gutterSize="16px">
       <mat-grid-tile
+        class="capture-item"
         *ngFor="
           let postCapture of postCaptures$ | ngrxPush;
           trackBy: trackPostCapture

diff --git a/src/app/features/home/capture-tab/capture-tab.component.scss b/src/app/features/home/capture-tab/capture-tab.component.scss
@@ -62,8 +62,7 @@ app-avatar {
 }
 
 .capture-container {
-  padding-left: 16px;
-  padding-right: 16px;
+  padding: 16px;
 }
 
 app-capture-item {
@@ -84,7 +83,7 @@ app-capture-item {
       object-fit: cover;
       object-position: center;
       overflow: hidden;
-      border-radius: 4px;
+      border-radius: 16px;
     }
 
     ion-icon {

diff --git a/src/app/features/home/capture-tab/capture-tab.component.ts b/src/app/features/home/capture-tab/capture-tab.component.ts
@@ -43,6 +43,10 @@ export class CaptureTabComponent {
     )
   );
 
+  readonly captures$ = this.proofs$.pipe(
+    map(proofs => proofs.sort((a, b) => b.timestamp - a.timestamp))
+  );
+
   readonly networkConnected$ = this.networkService.connected$;
 
   readonly postCaptures$ = this.networkConnected$.pipe(