Merge branch 'master' into unfurler-optional-puppeteer

frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/block-fees-graph/block-fees-graph.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 1130px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 1130px) {
     position: relative;

frontend/src/app/components/hashrate-chart/hashrate-chart.component.scss

@@ -61,7 +61,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss

@@ -55,7 +55,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/pool-ranking/pool-ranking.component.scss

@@ -39,7 +39,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/components/statistics/statistics.component.html

@@ -11,7 +11,7 @@
           </div>  
 
           <form [formGroup]="radioGroupForm" class="formRadioGroup"
-            [class]="stateService.env.MINING_DASHBOARD ? 'mining' : ''" (click)="saveGraphPreference()">
+            [class]="(stateService.env.MINING_DASHBOARD || stateService.env.LIGHTNING) ? 'mining' : 'no-menu'" (click)="saveGraphPreference()">
             <div *ngIf="!isMobile()" class="btn-group btn-group-toggle">
               <label ngbButtonLabel class="btn-primary btn-sm mr-2">
                 <a [routerLink]="['/tv' | relativeUrl]" style="color: white" id="btn-tv">

frontend/src/app/components/statistics/statistics.component.scss

@@ -55,13 +55,19 @@
 .formRadioGroup.mining {
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;
     top: 0px;
   }
 }
+.formRadioGroup.no-menu {
+  @media (min-width: 991px) {
+    position: relative;
+    top: -33px;
+  }
+}
 
 .loading{
   display: flex;

frontend/src/app/lightning/channels-list/channels-list.component.html

@@ -10,7 +10,7 @@
     </div>
   </form>
 
-  <table class="table table-borderless" *ngIf="response.channels.length > 0">
+  <table class="table table-borderless" *ngIf="response.channels.length > 0" [style]="isLoading ? 'opacity: 0.75' : ''">
     <ng-container *ngTemplateOutlet="tableHeader"></ng-container>
     <tbody>
       <tr *ngFor="let channel of response.channels; let i = index;">

frontend/src/app/lightning/channels-list/channels-list.component.ts

@@ -14,6 +14,7 @@ import { LightningApiService } from '../lightning-api.service';
 export class ChannelsListComponent implements OnInit, OnChanges {
   @Input() publicKey: string;
   @Output() channelsStatusChangedEvent = new EventEmitter<string>();
+  @Output() loadingEvent = new EventEmitter<boolean>(false);
   channels$: Observable<any>;
 
   // @ts-ignore
@@ -26,6 +27,7 @@ export class ChannelsListComponent implements OnInit, OnChanges {
   defaultStatus = 'open';
   status = 'open';
   publicKeySize = 25;
+  isLoading = false;
 
   constructor(
     private lightningApiService: LightningApiService,
@@ -56,6 +58,8 @@ export class ChannelsListComponent implements OnInit, OnChanges {
     )
     .pipe(
       tap((val) => {
+        this.isLoading = true;
+        this.loadingEvent.emit(true);
         if (typeof val === 'string') {
           this.status = val;
           this.page = 1;
@@ -64,10 +68,12 @@ export class ChannelsListComponent implements OnInit, OnChanges {
         }
       }),
       switchMap(() => {
-          this.channelsStatusChangedEvent.emit(this.status);
+        this.channelsStatusChangedEvent.emit(this.status);
-          return this.lightningApiService.getChannelsByNodeId$(this.publicKey, (this.page - 1) * this.itemsPerPage, this.status);
+        return this.lightningApiService.getChannelsByNodeId$(this.publicKey, (this.page - 1) * this.itemsPerPage, this.status);
       }),
       map((response) => {
+        this.isLoading = false;
+        this.loadingEvent.emit(false);
         return {
           channels: response.body,
           totalItems: parseInt(response.headers.get('x-total-count'), 10)

frontend/src/app/lightning/node/node.component.html

@@ -133,7 +133,7 @@
 
     <app-node-channels style="display:block;margin-bottom: 40px" [publicKey]="node.public_key"></app-node-channels>
 
-    <div class="d-flex justify-content-between">
+    <div class="d-flex">
       <h2 *ngIf="channelsListStatus === 'open'">
         <span i18n="lightning.open-channels">Open channels</span>
         <span> ({{ node.opened_channel_count }})</span>
@@ -142,10 +142,13 @@
         <span i18n="lightning.open-channels">Closed channels</span>
         <span> ({{ node.closed_channel_count }})</span>
       </h2>
+      <div *ngIf="channelListLoading" class="spinner-border ml-3" role="status"></div>
     </div>
 
     <app-channels-list [publicKey]="node.public_key"
-      (channelsStatusChangedEvent)="onChannelsListStatusChanged($event)"></app-channels-list>
+      (channelsStatusChangedEvent)="onChannelsListStatusChanged($event)"
+      (loadingEvent)="onLoadingEvent($event)"
+    ></app-channels-list>
   </div>
     
 </div>

frontend/src/app/lightning/node/node.component.scss

@@ -57,3 +57,16 @@ app-fiat {
     margin-left: 10px;
   }
 }
+
+.spinner-border {
+  @media (min-width: 768px) {
+    margin-top: 6.5px;
+    width: 1.75rem;
+    height: 1.75rem;
+  }
+  @media (max-width: 768px) {
+    margin-top: 2.3px;
+    width: 1.5rem;
+    height: 1.5rem;
+  }
+}

frontend/src/app/lightning/node/node.component.ts

@@ -22,7 +22,7 @@ export class NodeComponent implements OnInit {
   channelsListStatus: string;
   error: Error;
   publicKey: string;
-
+  channelListLoading = false;
   publicKeySize = 99;
 
   constructor(
@@ -97,4 +97,8 @@ export class NodeComponent implements OnInit {
   onChannelsListStatusChanged(e) {
     this.channelsListStatus = e;
   }
+
+  onLoadingEvent(e) {
+    this.channelListLoading = e;
+  }
 }

frontend/src/app/lightning/nodes-channels/node-channels.component.ts

@@ -44,13 +44,13 @@ export class NodeChannels implements OnChanges {
         switchMap((response) => {
           this.isLoading = true;
           if ((response.body?.length ?? 0) <= 0) {
-            return [];
+            this.isLoading = false;
+            return [''];
           }
           return [response.body];
         }),
         tap((body: any[]) => {
-          if (body.length === 0) {
+          if (body.length === 0 || body[0].length === 0) {
-            this.isLoading = false;
             return;
           }
           const biggestCapacity = body[0].capacity;

frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.scss

@@ -60,7 +60,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.scss

@@ -40,7 +40,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss

@@ -60,7 +60,7 @@
   flex-direction: column;
   @media (min-width: 991px) {
     position: relative;
-    top: -65px;
+    top: -100px;
   }
   @media (min-width: 830px) and (max-width: 991px) {
     position: relative;

production/mempool-build-all

@@ -145,7 +145,7 @@ for repo in $backend_repos;do
 done
 
 # build unfurlers
-for repo in mainnet liquid;do
+for repo in mainnet liquid bisq;do
     build_unfurler "${repo}"
 done
 

production/mempool-start-all

@@ -9,18 +9,20 @@ for site in mainnet mainnet-lightning testnet testnet-lightning signet signet-li
     screen -dmS "${site}" sh -c 'while true;do npm run start-production;sleep 1;done'
 done
 
-# only start unfurler if GPU present
+# only start xorg if GPU present
 if pciconf -lv|grep -i nvidia >/dev/null 2>&1;then
     export DISPLAY=:0
     screen -dmS x startx
     sleep 3
-    for site in mainnet liquid;do
-        cd "$HOME/${site}/unfurler" && \
-        echo "starting mempool unfurler: ${site}" && \
-        screen -dmS "unfurler-${site}" sh -c 'while true;do npm run unfurler;sleep 2;done'
-    done
 fi
 
+# start unfurlers for each frontend
+for site in mainnet liquid bisq;do
+    cd "$HOME/${site}/unfurler" && \
+    echo "starting mempool unfurler: ${site}" && \
+    screen -dmS "unfurler-${site}" sh -c 'while true;do npm run unfurler;sleep 2;done'
+done
+
 # start nginx warm cacher
 for site in mainnet;do
     echo "starting mempool cache warmer: ${site}"

production/unfurler-config.bisq.json

@@ -0,0 +1,17 @@
+{
+  "SERVER": {
+    "HOST": "https://bisq.fra.mempool.space",
+    "HTTP_PORT": 8002
+  },
+  "MEMPOOL": {
+    "HTTP_HOST": "http://127.0.0.1",
+    "HTTP_PORT": 82,
+    "NETWORK": "bisq"
+  },
+  "PUPPETEER": {
+    "CLUSTER_SIZE": 8,
+    "EXEC_PATH": "/usr/local/bin/chrome",
+    "MAX_PAGE_AGE": 86400,
+    "RENDER_TIMEOUT": 3000
+  }
+}

production/unfurler-config.liquid.json

@@ -1,12 +1,12 @@
 {
   "SERVER": {
-    "HOST": "https://liquid.network",
+    "HOST": "https://liquid.fra.mempool.space",
-    "HTTP_PORT": 8002
+    "HTTP_PORT": 8003
   },
   "MEMPOOL": {
-    "HTTP_HOST": "https://liquid.network",
+    "HTTP_HOST": "http://127.0.0.1",
-    "HTTP_PORT": 443,
+    "HTTP_PORT": 83,
-    "NETWORK": "liquid"
+    "NETWORK": "bitcoin"
   },
   "PUPPETEER": {
     "CLUSTER_SIZE": 8,

production/unfurler-config.mainnet.json

@@ -1,11 +1,11 @@
 {
   "SERVER": {
-    "HOST": "https://mempool.space",
+    "HOST": "https://mempool.fra.mempool.space",
     "HTTP_PORT": 8001
   },
   "MEMPOOL": {
-    "HTTP_HOST": "https://mempool.space",
+    "HTTP_HOST": "http://127.0.0.1",
-    "HTTP_PORT": 443,
+    "HTTP_PORT": 81,
     "NETWORK": "bitcoin"
   },
   "PUPPETEER": {