From a4c49d42af5590f5061f2843f3c182ed60bac5fc Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Tue, 21 Jul 2020 13:20:17 +0700
Subject: [PATCH] Display "stack of X blocks" instead of "8th block" on the
 mempool block stack.

---
 .../mempool-block.component.html              |  2 +-
 .../mempool-block/mempool-block.component.ts  | 21 ++++++++++++-------
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/frontend/src/app/components/mempool-block/mempool-block.component.html b/frontend/src/app/components/mempool-block/mempool-block.component.html
index fb324f5e7..91406c593 100644
--- a/frontend/src/app/components/mempool-block/mempool-block.component.html
+++ b/frontend/src/app/components/mempool-block/mempool-block.component.html
@@ -1,7 +1,7 @@
 <div class="container-xl" *ngIf="mempoolBlock$ | async as mempoolBlock">
 
   <div class="title-block">
-    <h1 class="float-left">{{ getGetOrdinal() }}</h1>
+    <h1 class="float-left">{{ ordinal }}</h1>
     <button [routerLink]="['/' | relativeUrl]" class="btn btn-sm float-right mr-2 mt-2">&#10005;</button>
   </div>
 
diff --git a/frontend/src/app/components/mempool-block/mempool-block.component.ts b/frontend/src/app/components/mempool-block/mempool-block.component.ts
index 897e091b3..1e78145ff 100644
--- a/frontend/src/app/components/mempool-block/mempool-block.component.ts
+++ b/frontend/src/app/components/mempool-block/mempool-block.component.ts
@@ -5,6 +5,7 @@ import { switchMap, map, tap, filter } from 'rxjs/operators';
 import { MempoolBlock } from 'src/app/interfaces/websocket.interface';
 import { Observable } from 'rxjs';
 import { SeoService } from 'src/app/services/seo.service';
+import { env } from 'src/app/app.constants';
 
 @Component({
   selector: 'app-mempool-block',
@@ -15,6 +16,7 @@ export class MempoolBlockComponent implements OnInit, OnDestroy {
   network = '';
   mempoolBlockIndex: number;
   mempoolBlock$: Observable<MempoolBlock>;
+  ordinal: string;
 
   constructor(
     private route: ActivatedRoute,
@@ -34,7 +36,8 @@ export class MempoolBlockComponent implements OnInit, OnDestroy {
               while (!mempoolBlocks[this.mempoolBlockIndex]) {
                 this.mempoolBlockIndex--;
               }
-              this.seoService.setTitle(this.getGetOrdinal());
+              this.setOrdinal(mempoolBlocks[this.mempoolBlockIndex]);
+              this.seoService.setTitle(this.ordinal);
               return mempoolBlocks[this.mempoolBlockIndex];
             })
           );
@@ -52,14 +55,16 @@ export class MempoolBlockComponent implements OnInit, OnDestroy {
     this.stateService.markBlock$.next({});
   }
 
-  getGetOrdinal() {
+  setOrdinal(mempoolBlock: MempoolBlock) {
+    const blocksInBlock = Math.ceil(mempoolBlock.blockVSize / 1000000);
     if (this.mempoolBlockIndex === 0) {
-      return 'Next block';
+      this.ordinal = 'Next block';
+    } else if (this.mempoolBlockIndex === env.KEEP_BLOCKS_AMOUNT - 1 && blocksInBlock > 1 ) {
+      this.ordinal = `Stack of ${blocksInBlock} blocks`;
+    } else {
+      const s = ['th', 'st', 'nd', 'rd'];
+      const v = this.mempoolBlockIndex + 1 % 100;
+      this.ordinal = this.mempoolBlockIndex + 1 + (s[(v - 20) % 10] || s[v] || s[0]) + ' next block';
     }
-
-    const s = ['th', 'st', 'nd', 'rd'];
-    const v = this.mempoolBlockIndex + 1 % 100;
-    return this.mempoolBlockIndex + 1 + (s[(v - 20) % 10] || s[v] || s[0]) + ' next block';
  }
-
 }