From 2235d6305fc10c332d501eac350fb3aefc0831db Mon Sep 17 00:00:00 2001
From: Mononaut <github@monospace.live>
Date: Wed, 2 Apr 2025 00:28:17 +0000
Subject: [PATCH] Fix loose screws on the blockchain bar

---
 .../blockchain/blockchain.component.html      |  4 +-
 .../blockchain/blockchain.component.scss      |  8 ----
 .../blockchain/blockchain.component.ts        | 38 +++----------------
 frontend/src/app/services/state.service.ts    |  4 --
 4 files changed, 7 insertions(+), 47 deletions(-)

diff --git a/frontend/src/app/components/blockchain/blockchain.component.html b/frontend/src/app/components/blockchain/blockchain.component.html
index 6ff92f523..af3bf52b1 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.html
+++ b/frontend/src/app/components/blockchain/blockchain.component.html
@@ -1,4 +1,4 @@
-<div class="text-center" class="blockchain-wrapper" [class.time-ltr]="timeLtr" [class.ltr-transition]="ltrTransitionEnabled" [class.flipped]="flipped" [class.ready-to-flip]="readyToFlip" #container>
+<div class="text-center" class="blockchain-wrapper" [class.time-ltr]="timeLtr" [class.ltr-transition]="ltrTransitionEnabled" #container>
   <div #positionContainer class="position-container" [ngClass]="network ? network : ''" [style]="positionStyle">
     <span>
       <div class="blocks-wrapper">
@@ -10,7 +10,7 @@
         </ng-container>
       </div>
       <div id="divider" [hidden]="pageIndex > 0">
-        <button class="block-display-toggle" (click)="toggleBlockDisplayMode()"><fa-icon [icon]="['fas', isA1() ? 'arrows-rotate' : 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
+        <button class="block-display-toggle" (click)="toggleBlockDisplayMode()"><fa-icon [icon]="['fas', 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
         <button class="time-toggle" (click)="toggleTimeDirection()"><fa-icon [icon]="['fas', 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
       </div>
     </span>
diff --git a/frontend/src/app/components/blockchain/blockchain.component.scss b/frontend/src/app/components/blockchain/blockchain.component.scss
index 4f1d466a4..32225598a 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.scss
+++ b/frontend/src/app/components/blockchain/blockchain.component.scss
@@ -19,14 +19,6 @@
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* IE10+/Edge */
   user-select: none; /* Standard */
-
-
-  &.flipped {
-    transform: rotate(180deg);
-  }
-  &.ready-to-flip {
-    transition: transform 2s;
-  }
 }
 
 .position-container {
diff --git a/frontend/src/app/components/blockchain/blockchain.component.ts b/frontend/src/app/components/blockchain/blockchain.component.ts
index b24ef728d..2e3224a9c 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.ts
+++ b/frontend/src/app/components/blockchain/blockchain.component.ts
@@ -29,9 +29,6 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
   connected: boolean = true;
   blockDisplayMode: 'size' | 'fees';
 
-  flipped: boolean = true;
-  readyToFlip: boolean = false;
-
   dividerOffset: number | null = null;
   mempoolOffset: number | null = null;
   positionStyle = {
@@ -43,22 +40,7 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
     public stateService: StateService,
     public StorageService: StorageService,
     private cd: ChangeDetectorRef,
-  ) {
-    if (this.StorageService.getValue('ap-flipped') !== null) {
-      this.flipped = false;
-    } else {
-      this.flipped = this.stateService.apFlipped;
-      if (this.flipped) {
-        setTimeout(() => {
-          this.flipped = false;
-          this.stateService.apFlipped = false;
-        }, 5000);
-      }
-      setTimeout(() => {
-        this.readyToFlip = true;
-      }, 500);
-    }
-  }
+  ) {}
 
   ngOnInit(): void {
     this.onResize();
@@ -108,15 +90,10 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   toggleBlockDisplayMode(): void {
-    if (this.isA1()) {
-      this.flipped = !this.flipped;
-      this.StorageService.setValue('ap-flipped', this.flipped ? 'true' : 'false');
-    } else {
-      if (this.blockDisplayMode === 'size') this.blockDisplayMode = 'fees';
-      else this.blockDisplayMode = 'size';
-      this.StorageService.setValue('block-display-mode-preference', this.blockDisplayMode);
-      this.stateService.blockDisplayMode$.next(this.blockDisplayMode);
-    }
+    if (this.blockDisplayMode === 'size') this.blockDisplayMode = 'fees';
+    else this.blockDisplayMode = 'size';
+    this.StorageService.setValue('block-display-mode-preference', this.blockDisplayMode);
+    this.stateService.blockDisplayMode$.next(this.blockDisplayMode);
   }
 
   onMempoolWidthChange(width): void {
@@ -149,11 +126,6 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
     }
   }
 
-  isA1(): boolean {
-    const now = new Date();
-    return now.getMonth() === 3 && now.getDate() === 1;
-  }
-
   onResize(): void {
     const width = this.containerWidth || window.innerWidth;
     if (width >= 768) {
diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts
index b1e8480c8..7f8f81744 100644
--- a/frontend/src/app/services/state.service.ts
+++ b/frontend/src/app/services/state.service.ts
@@ -147,8 +147,6 @@ export class StateService {
   mempoolSequence: number;
   mempoolBlockState: { block: number, transactions: { [txid: string]: TransactionStripped} };
 
-  apFlipped = false;
-
   backend$ = new BehaviorSubject<'esplora' | 'electrum' | 'none'>('esplora');
   networkChanged$ = new ReplaySubject<string>(1);
   lightningChanged$ = new ReplaySubject<boolean>(1);
@@ -256,8 +254,6 @@ export class StateService {
       }
     });
 
-    this.apFlipped = true;
-
     this.liveMempoolBlockTransactions$ = this.mempoolBlockUpdate$.pipe(scan((acc: { block: number, transactions: { [txid: string]: TransactionStripped } }, change: MempoolBlockUpdate): { block: number, transactions: { [txid: string]: TransactionStripped } } => {
       if (isMempoolState(change)) {
         const txMap = {};