Merge branch 'master' into docker-bugfix

2024-01-04 12:10:31 -05:00
parent 3f305207f9 f7e7072dbc
commit 5f1180118a
25 changed files with 304 additions and 734 deletions
--- a/frontend/src/app/components/about/about.component.html
+++ b/frontend/src/app/components/about/about.component.html
@@ -422,7 +422,7 @@
      Trademark Notice<br>
    </div>
    <p>
-      The Mempool Open Source Project&reg;, Mempool Accelerator&trade;, Mempool Enterprise&reg;, Mempool Liquidity&trade;, mempool.space&reg;, Be your own explorer&trade;, Explore the full Bitcoin ecosystem&trade;, the mempool logo;, the mempool Square logo;, the mempool Blocks logo;, the mempool Blocks 3 | 2 logo;, the mempool.space Vertical Logo;, and the mempool.space Horizontal logo are either registered trademarks or trademarks of Mempool Space K.K in Japan, the United States, and/or other countries.
+      The Mempool Open Source Project&reg;, Mempool Accelerator&trade;, Mempool Enterprise&reg;, Mempool Liquidity&trade;, mempool.space&reg;, Be your own explorer&trade;, Explore the full Bitcoin ecosystem&trade;, Mempool Goggles&trade;, the mempool logo, the mempool Square logo, the mempool Blocks logo, the mempool Blocks 3 | 2 logo, the mempool.space Vertical Logo, and the mempool.space Horizontal logo are either registered trademarks or trademarks of Mempool Space K.K in Japan, the United States, and/or other countries.
    </p>
    <p>
      While our software is available under an open source software license, the copyright license does not include an implied right or license to use our trademarks. See our <a href="https://mempool.space/trademark-policy">Trademark Policy and Guidelines</a> for more details, published on &lt;https://mempool.space/trademark-policy&gt;.
--- a/frontend/src/app/components/accelerate-preview/accelerate-preview.component.ts
+++ b/frontend/src/app/components/accelerate-preview/accelerate-preview.component.ts
@@ -4,6 +4,7 @@ import { Subscription, catchError, of, tap } from 'rxjs';
 import { StorageService } from '../../services/storage.service';
 import { Transaction } from '../../interfaces/electrs.interface';
 import { nextRoundNumber } from '../../shared/common.utils';
+import { AudioService } from '../../services/audio.service';

 export type AccelerationEstimate = {
  txSummary: TxSummary;
@@ -63,6 +64,7 @@ export class AcceleratePreviewComponent implements OnInit, OnDestroy, OnChanges
  constructor(
    private apiService: ApiService,
    private storageService: StorageService,
+    private audioService: AudioService,
    private cd: ChangeDetectorRef
  ) { }

@@ -186,6 +188,7 @@ export class AcceleratePreviewComponent implements OnInit, OnDestroy, OnChanges
      this.userBid
    ).subscribe({
      next: () => {
+        this.audioService.playSound('ascend-chime-cartoon');
        this.showSuccess = true;
        this.scrollToPreviewWithTimeout('successAlert', 'center');
        this.estimateSubscription.unsubscribe();
--- a/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.html
+++ b/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.html
@@ -1,10 +1,10 @@
-<div class="container-xl" style="min-height: 335px" [class.widget]="widget" [class.full-height]="!widget">
+<div class="container-xl widget-container" [class.widget]="widget" [class.full-height]="!widget">
  <h1 *ngIf="!widget" class="float-left" i18n="master-page.blocks">Accelerations</h1>
  <div *ngIf="!widget && isLoading" class="spinner-border ml-3" role="status"></div>

  <div class="clearfix"></div>

-  <div style="min-height: 295px" *ngIf="accelerationList$ | async as accelerations">
+  <div class="acceleration-list" *ngIf="accelerationList$ | async as accelerations">
    <table *ngIf="!accelerations || accelerations.length; else noData" class="table table-borderless table-fixed">
      <thead>
        <th class="txid text-left" i18n="dashboard.latest-transactions.txid">TXID</th>
--- a/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.scss
+++ b/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.scss
@@ -14,11 +14,24 @@
 .container-xl.legacy {
  max-width: 1140px;
 }
+.container-xl.widget-container {
+  min-height: 335px;
+  @media (max-width: 767px) {
+    min-height: auto;
+  }
+}

 .container {
  max-width: 100%;
 }

+.acceleration-list {
+  min-height: 295px;
+  @media (max-width: 767px) {
+    min-height: auto;
+  }
+}
+
 tr, td, th {
  border: 0px;
  padding-top: 0.65rem !important;
@@ -51,34 +64,63 @@ tr, td, th {

 .txid {
  width: 25%;
-  @media (max-width: 1100px) {
-    padding-right: 10px;
-  }
-  @media (max-width: 875px) {
-    display: none;
-  }
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 30%;
+  @media (max-width: 1060px) and (min-width: 768px) {
+    display: none;
+  }
+  @media (max-width: 500px) {
+    display: none;
+  }
 }

-.fee {
-  width: 35%;
-}
-
-.block {
+.fee-rate {
  width: 20%;
+  @media (max-width: 1060px) and (min-width: 768px) {
+    text-align: start !important;
+  }
+  @media (max-width: 500px) {
+    text-align: start !important;
+  }
+  @media (max-width: 840px) and (min-width: 768px) {
+    display: none;
+  }
+  @media (max-width: 410px) {
+    display: none;
+  }
 }

 .bid {
  width: 30%;
+  min-width: 150px;
+  @media (max-width: 840px) and (min-width: 768px) {
+    text-align: start !important;
+  }
+  @media (max-width: 410px) {
+    text-align: start !important;
+  }
 }

 .time {
  width: 25%;
 }

+.fee {
+  width: 35%;
+  @media (max-width: 1060px) and (min-width: 768px) {
+    text-align: start !important;
+  }
+  @media (max-width: 500px) {
+    text-align: start !important;
+  }
+}
+
+.block {
+  width: 20%;
+}
+
 .status {
  width: 20%
 }
@@ -122,4 +164,7 @@ tr, td, th {
  flex-direction: row;
  align-items: center;
  justify-content: center;
+  @media (max-width: 767px) {
+    height: 100px;
+  }
 }
--- a/frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.scss
+++ b/frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.scss
@@ -139,6 +139,9 @@
 }
 .list-card {
  height: 410px;
+  @media (max-width: 767px) {
+    height: auto;
+  }
 }

 .mempool-block-wrapper {
--- a/frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.html
+++ b/frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.html
@@ -58,6 +58,10 @@
          <td *ngSwitchCase="'accelerated'"><span class="badge badge-accelerated" i18n="transaction.audit.accelerated">Accelerated</span></td>
        </ng-container>
      </tr>
+      <tr *ngIf="!auditEnabled && tx && tx.status === 'accelerated'">
+        <td class="td-width"></td>
+        <td><span class="badge badge-accelerated" i18n="transaction.audit.accelerated">Accelerated</span></td>
+      </tr>
    </tbody>
  </table>
 </div>
--- a/frontend/src/app/components/block/block-preview.component.ts
+++ b/frontend/src/app/components/block/block-preview.component.ts
@@ -2,7 +2,7 @@ import { Component, OnInit, OnDestroy, ViewChild, ElementRef } from '@angular/co
 import { ActivatedRoute, ParamMap } from '@angular/router';
 import { ElectrsApiService } from '../../services/electrs-api.service';
 import { switchMap, tap, throttleTime, catchError, shareReplay, startWith, pairwise, filter } from 'rxjs/operators';
-import { of, Subscription, asyncScheduler } from 'rxjs';
+import { of, Subscription, asyncScheduler, forkJoin } from 'rxjs';
 import { StateService } from '../../services/state.service';
 import { SeoService } from '../../services/seo.service';
 import { OpenGraphService } from '../../services/opengraph.service';
@@ -121,21 +121,37 @@ export class BlockPreviewComponent implements OnInit, OnDestroy {
    this.overviewSubscription = block$.pipe(
      startWith(null),
      pairwise(),
-      switchMap(([prevBlock, block]) => this.apiService.getStrippedBlockTransactions$(block.id)
-        .pipe(
-          catchError((err) => {
-            this.overviewError = err;
-            this.openGraphService.fail('block-viz-' + this.rawId);
-            return of([]);
-          }),
-          switchMap((transactions) => {
-            return of({ transactions, direction: 'down' });
-          })
-        )
+      switchMap(([prevBlock, block]) => {
+          return forkJoin([
+            this.apiService.getStrippedBlockTransactions$(block.id)
+              .pipe(
+                catchError((err) => {
+                  this.overviewError = err;
+                  this.openGraphService.fail('block-viz-' + this.rawId);
+                  return of([]);
+                }),
+                switchMap((transactions) => {
+                  return of(transactions);
+                })
+              ),
+            this.stateService.env.ACCELERATOR === true && block.height > 819500 ? this.apiService.getAccelerationHistory$({ blockHash: block.id }) : of([])
+          ]);
+        }
      ),
    )
-    .subscribe(({transactions, direction}: {transactions: TransactionStripped[], direction: string}) => {
+    .subscribe(([transactions, accelerations]) => {
      this.strippedTransactions = transactions;
+
+      const acceleratedInBlock = {};
+      for (const acc of accelerations) {
+        acceleratedInBlock[acc.txid] = acc;
+      }
+      for (const tx of transactions) {
+        if (acceleratedInBlock[tx.txid]) {
+          tx.acc = true;
+        }
+      }
+
      this.isLoadingOverview = false;
      if (this.blockGraph) {
        this.blockGraph.destroy();
--- a/frontend/src/app/components/block/block.component.ts
+++ b/frontend/src/app/components/block/block.component.ts
@@ -328,17 +328,28 @@ export class BlockComponent implements OnInit, OnDestroy {
                this.overviewError = err;
                return of(null);
              })
-            )
+            ),
+          this.stateService.env.ACCELERATOR === true && block.height > 819500 ? this.apiService.getAccelerationHistory$({ blockHash: block.id }) : of([])
        ]);
      })
    )
-    .subscribe(([transactions, blockAudit]) => {
+    .subscribe(([transactions, blockAudit, accelerations]) => {
      if (transactions) {
        this.strippedTransactions = transactions;
      } else {
        this.strippedTransactions = [];
      }

+      const acceleratedInBlock = {};
+      for (const acc of accelerations) {
+        acceleratedInBlock[acc.txid] = acc;
+      }
+      for (const tx of transactions) {
+        if (acceleratedInBlock[tx.txid]) {
+          tx.acc = true;
+        }
+      }
+
      this.blockAudit = null;
      if (transactions && blockAudit) {
        const inTemplate = {};
--- a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
+++ b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
@@ -53,7 +53,7 @@
      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + (networkPaths['signet'] || '/signet')" ngbDropdownItem *ngIf="env.SIGNET_ENABLED" class="signet"><app-svg-images name="signet" width="22" height="22" viewBox="0 0 65 65" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Signet</a>
      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + (networkPaths['testnet'] || '/testnet')" ngbDropdownItem *ngIf="env.TESTNET_ENABLED" class="testnet"><app-svg-images name="testnet" width="22" height="22" viewBox="0 0 65 65" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Testnet</a>
      <h6 class="dropdown-header" i18n="master-page.layer2-networks-header">Layer 2 Networks</h6>
-      <a [href]="env.BISQ_WEBSITE_URL + urlLanguage + (networkPaths['bisq'] || '')" ngbDropdownItem class="mainnet"><app-svg-images name="bisq" width="22" height="22" viewBox="0 0 75 75" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Bisq</a>
+      <a ngbDropdownItem *ngIf="env.BISQ_ENABLED" [href]="env.BISQ_WEBSITE_URL + urlLanguage + (networkPaths['bisq'] || '')" class="mainnet"><app-svg-images name="bisq" width="22" height="22" viewBox="0 0 75 75" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Bisq</a>
      <a ngbDropdownItem class="liquid mr-1" [class.active]="network.val === 'liquid'" [routerLink]="networkPaths['liquid'] || '/'"><app-svg-images name="liquid" width="22" height="22" viewBox="0 0 125 125" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Liquid</a>
      <a ngbDropdownItem *ngIf="env.LIQUID_TESTNET_ENABLED" class="liquidtestnet" [class.active]="network.val === 'liquidtestnet'" [routerLink]="networkPaths['liquidtestnet'] || '/testnet'"><app-svg-images name="liquidtestnet" width="22" height="22" viewBox="0 0 125 125" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Liquid Testnet</a>
    </div>
@@ -98,4 +98,4 @@

 <app-global-footer *ngIf="footerVisible"></app-global-footer>

-</ng-container>
+</ng-container>
--- a/frontend/src/app/components/mempool-block-overview/mempool-block-overview.component.ts
+++ b/frontend/src/app/components/mempool-block-overview/mempool-block-overview.component.ts
@@ -35,6 +35,8 @@ export class MempoolBlockOverviewComponent implements OnInit, OnDestroy, OnChang
  blockSub: Subscription;
  deltaSub: Subscription;

+  firstLoad: boolean = true;
+
  constructor(
    public stateService: StateService,
    private websocketService: WebsocketService,
@@ -58,7 +60,40 @@ export class MempoolBlockOverviewComponent implements OnInit, OnDestroy, OnChang
      )
      .pipe(switchMap(() => this.stateService.mempoolBlockTransactions$))
      .subscribe((transactionsStripped) => {
-        this.replaceBlock(transactionsStripped);
+        if (this.firstLoad) {
+          this.replaceBlock(transactionsStripped);
+        } else {
+          const inOldBlock = {};
+          const inNewBlock = {};
+          const added: TransactionStripped[] = [];
+          const changed: { txid: string, rate: number | undefined, acc: boolean | undefined }[] = [];
+          const removed: string[] = [];
+          for (const tx of transactionsStripped) {
+            inNewBlock[tx.txid] = true;
+          }
+          for (const txid of Object.keys(this.blockGraph?.scene?.txs || {})) {
+            inOldBlock[txid] = true;
+            if (!inNewBlock[txid]) {
+              removed.push(txid);
+            }
+          }
+          for (const tx of transactionsStripped) {
+            if (!inOldBlock[tx.txid]) {
+              added.push(tx);
+            } else {
+              changed.push({
+                txid: tx.txid,
+                rate: tx.rate,
+                acc: tx.acc
+              });
+            }
+          }
+          this.updateBlock({
+            removed,
+            changed,
+            added
+          });
+        }
      });
    this.deltaSub = this.stateService.mempoolBlockDelta$.subscribe((delta) => {
      this.updateBlock(delta);
@@ -67,6 +102,7 @@ export class MempoolBlockOverviewComponent implements OnInit, OnDestroy, OnChang

  ngOnChanges(changes): void {
    if (changes.index) {
+      this.firstLoad = true;
      if (this.blockGraph) {
        this.blockGraph.clear(changes.index.currentValue > changes.index.previousValue ? this.chainDirection : this.poolDirection);
      }
--- a/frontend/src/app/components/mempool-block/mempool-block.component.ts
+++ b/frontend/src/app/components/mempool-block/mempool-block.component.ts
@@ -64,6 +64,7 @@ export class MempoolBlockComponent implements OnInit, OnDestroy {
        }),
        tap(() => {
          this.stateService.markBlock$.next({ mempoolBlockIndex: this.mempoolBlockIndex });
+          this.websocketService.startTrackMempoolBlock(this.mempoolBlockIndex);
        })
      );

--- a/frontend/src/app/components/trademark-policy/trademark-policy.component.html
+++ b/frontend/src/app/components/trademark-policy/trademark-policy.component.html
@@ -62,6 +62,7 @@
                <tr><td>mempool.space</td></tr>
                <tr><td>Be your own explorer</td></tr>
                <tr><td>Explore the full Bitcoin ecosystem</td></tr>
+                <tr><td>Mempool Goggles</td></tr>
              </tbody>
            </table>
          </div>
@@ -314,7 +315,7 @@

          <p>Also, if you are using our Marks in a way described in the sections "Uses for Which We Are Granting a License," you must include the following trademark attribution at the foot of the webpage where you have used the Mark (or, if in a book, on the credits page), on any packaging or labeling, and on advertising or marketing materials:</p>

-          <p>"The Mempool Open Source Project&reg;, Mempool Accelerator&trade;, Mempool Enterprise&reg;, Mempool Liquidity&trade;, mempool.space&reg;, Be your own explorer&trade;, Explore the full Bitcoin ecosystem&trade;, the mempool logo;, the mempool Square logo;, the mempool Blocks logo;, the mempool Blocks 3 | 2 logo;, the mempool.space Vertical Logo;, and the mempool.space Horizontal logo are either registered trademarks or trademarks of Mempool Space K.K in Japan, the United States, and/or other countries, and are used with permission. Mempool Space K.K. has no affiliation with and does not sponsor or endorse the information provided herein."</p>  
+          <p>"The Mempool Open Source Project&reg;, Mempool Accelerator&trade;, Mempool Enterprise&reg;, Mempool Liquidity&trade;, mempool.space&reg;, Be your own explorer&trade;, Explore the full Bitcoin ecosystem&trade;, Mempool Goggles&trade;, the mempool logo;, the mempool Square logo;, the mempool Blocks logo;, the mempool Blocks 3 | 2 logo;, the mempool.space Vertical Logo;, and the mempool.space Horizontal logo are either registered trademarks or trademarks of Mempool Space K.K in Japan, the United States, and/or other countries, and are used with permission. Mempool Space K.K. has no affiliation with and does not sponsor or endorse the information provided herein."</p>  
          <li>What to Do When You See Abuse</li>

          <br>
--- a/frontend/src/app/components/transaction/transaction.component.ts
+++ b/frontend/src/app/components/transaction/transaction.component.ts
@@ -242,6 +242,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
    });

    this.fetchAccelerationSubscription = this.fetchAcceleration$.pipe(
+      filter(() => this.stateService.env.ACCELERATOR === true),
      tap(() => {
        this.accelerationInfo = null;
      }),
@@ -439,7 +440,11 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
          block_time: block.timestamp,
        };
        this.stateService.markBlock$.next({ blockHeight: block.height });
-        this.audioService.playSound('magic');
+        if (this.tx.acceleration || (this.accelerationInfo && ['accelerating', 'mined', 'completed'].includes(this.accelerationInfo.status))) {
+          this.audioService.playSound('wind-chimes-harp-ascend');
+        } else {
+          this.audioService.playSound('magic');
+        }
        this.fetchAcceleration$.next(block.id);
      }
    });
--- a/frontend/src/app/docs/api-docs/api-docs.component.scss
+++ b/frontend/src/app/docs/api-docs/api-docs.component.scss
@@ -157,7 +157,7 @@ ul.no-bull.block-audit code{
  position: fixed;
  top: 80px;
  overflow-y: auto;
-  height: calc(100vh - 50px);
+  height: calc(100vh - 75px);
  scrollbar-color: #2d3348 #11131f;
  scrollbar-width: thin;
 }
--- a/frontend/src/app/liquid/liquid-master-page.module.ts
+++ b/frontend/src/app/liquid/liquid-master-page.module.ts
@@ -10,6 +10,7 @@ import { PushTransactionComponent } from '../components/push-transaction/push-tr
 import { BlocksList } from '../components/blocks-list/blocks-list.component';
 import { AssetGroupComponent } from '../components/assets/asset-group/asset-group.component';
 import { AssetsComponent } from '../components/assets/assets.component';
+import { AssetsFeaturedComponent } from '../components/assets/assets-featured/assets-featured.component'
 import { AssetComponent } from '../components/asset/asset.component';
 import { AssetsNavComponent } from '../components/assets/assets-nav/assets-nav.component';

@@ -73,6 +74,11 @@ const routes: Routes = [
            data: { networks: ['liquid'] },
            component: AssetsComponent,
          },
+          {
+            path: 'featured',
+            data: { networks: ['liquid'] },
+            component: AssetsFeaturedComponent,
+          },
          {
            path: 'asset/:id',
            data: { networkSpecific: true },
--- a/frontend/src/app/services/audio.service.ts
+++ b/frontend/src/app/services/audio.service.ts
@@ -13,7 +13,7 @@ export class AudioService {
    } catch (e) {}
  }

-  public playSound(name: 'magic' | 'chime' | 'cha-ching' | 'bright-harmony') {
+  public playSound(name: 'magic' | 'chime' | 'cha-ching' | 'bright-harmony' | 'wind-chimes-harp-ascend' | 'ascend-chime-cartoon') {
    if (this.isPlaying || !this.audio) {
      return;
    }
--- a/frontend/src/app/services/websocket.service.ts
+++ b/frontend/src/app/services/websocket.service.ts
@@ -183,14 +183,18 @@ export class WebsocketService {
  }

  startTrackMempoolBlock(block: number) {
-    this.websocketSubject.next({ 'track-mempool-block': block });
-    this.isTrackingMempoolBlock = true
-    this.trackingMempoolBlock = block
+    // skip duplicate tracking requests
+    if (this.trackingMempoolBlock !== block) {
+      this.websocketSubject.next({ 'track-mempool-block': block });
+      this.isTrackingMempoolBlock = true;
+      this.trackingMempoolBlock = block;
+    }
  }

  stopTrackMempoolBlock() {
    this.websocketSubject.next({ 'track-mempool-block': -1 });
-    this.isTrackingMempoolBlock = false
+    this.isTrackingMempoolBlock = false;
+    this.trackingMempoolBlock = null;
  }

  startTrackRbf(mode: 'all' | 'fullRbf') {
--- a/frontend/src/resources/sounds/ascend-chime-cartoon.mp3
+++ b/frontend/src/resources/sounds/ascend-chime-cartoon.mp3
--- a/frontend/src/resources/sounds/wind-chimes-harp-ascend.mp3
+++ b/frontend/src/resources/sounds/wind-chimes-harp-ascend.mp3