Merge branch 'master' into knorrium/dependabot_frontend_groups

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

@@ -181,21 +181,6 @@
         </svg>
         <span>Exodus</span>
       </a>
-      <a href="https://www.luminex.io" target="_blank" title="Luminex">
-        <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="66.95" height="80" viewBox="0 0 300.43 385" style="padding-top: 10px;">
-          <defs>
-            <style>
-              .lum-cls-1 {
-                fill: #f2ea25;
-              }
-            </style>
-          </defs>
-          <path class="lum-cls-1" d="m309.02,90.04c0,49.65-38.73,90.04-95.34,90.04s-95.34-40.39-95.34-90.04S153.77,0,213.69,0c56.28,0,95.34,40.39,95.34,90.04Zm-63.56,0c0-20.52-14.23-37.07-31.78-37.07s-31.78,16.55-31.78,37.07,14.23,37.07,31.78,37.07,31.78-16.55,31.78-37.07Z"/>
-          <path class="lum-cls-1" d="m311.87,372.67h-66.34l-31.84-47.76-31.84,47.76h-66.34l58.38-90.22-53.07-79.61h66.34l26.54,42.46,26.53-42.46h66.34l-53.07,79.61,58.38,90.22Z"/>
-          <rect class="lum-cls-1" width="60.69" height="372.67"/>
-        </svg>
-        <span>Luminex</span>
-      </a>
     </div>
   </div>
 

frontend/src/app/components/fiat-selector/fiat-selector.component.html

@@ -1,5 +1,5 @@
 <div [formGroup]="fiatForm" class="text-small text-center">
-    <select formControlName="fiat" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 200px;" (change)="changeFiat()">
+    <select formControlName="fiat" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 150px;" (change)="changeFiat()">
         <option *ngFor="let currency of currencies" [value]="currency[1].code">{{ currency[1].name + " (" + currency[1].code + ")" }}</option>
     </select>
 </div>

frontend/src/app/components/language-selector/language-selector.component.html

@@ -1,5 +1,5 @@
 <div [formGroup]="languageForm" class="text-small text-center">
-    <select formControlName="language" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 200px;" (change)="changeLanguage()">
+    <select formControlName="language" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 100px;" (change)="changeLanguage()">
         <option *ngFor="let lang of languages" [value]="lang.code">{{ lang.name }}</option>
     </select>
 </div>

frontend/src/app/components/rate-unit-selector/rate-unit-selector.component.html

@@ -1,5 +1,5 @@
 <div [formGroup]="rateUnitForm" class="text-small text-center">
-    <select formControlName="rateUnits" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 200px;" (change)="changeUnits()">
+    <select formControlName="rateUnits" class="custom-select custom-select-sm form-control-secondary form-control mx-auto" style="width: 100px;" (change)="changeUnits()">
         <option *ngFor="let unit of units" [value]="unit.name">{{ unit.label }}</option>
     </select>
 </div>

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

@@ -101,7 +101,7 @@
                       <ng-template [ngIf]="this.mempoolPosition.block >= 7" [ngIfElse]="belowBlockLimit">
                         <span class="eta d-flex">
                           <span i18n="transaction.eta.in-several-hours|Transaction ETA in several hours or more">In several hours (or more)</span>
-                          <span class="ml-2"></span><a *ngIf="stateService.env.OFFICIAL_MEMPOOL_SPACE && stateService.env.ACCELERATOR" [href]="'/services/accelerator/accelerate?txid=' + tx.txid" class="btn badge badge-primary accelerate ml-auto" i18n="transaction.accelerate|Accelerate button label">Accelerate</a>
+                          <span class="ml-2"></span><a *ngIf="stateService.env.OFFICIAL_MEMPOOL_SPACE && stateService.env.ACCELERATOR && stateService.network === ''" [href]="'/services/accelerator/accelerate?txid=' + tx.txid" class="btn badge badge-primary accelerate ml-auto" i18n="transaction.accelerate|Accelerate button label">Accelerate</a>
                         </span>
                       </ng-template>
                       <ng-template #belowBlockLimit>
@@ -111,7 +111,7 @@
                         <ng-template #timeEstimateDefault>
                           <span class="d-flex">
                             <app-time kind="until" *ngIf="(da$ | async) as da;" [time]="da.timeAvg * (this.mempoolPosition.block + 1) + now + da.timeOffset" [fastRender]="false" [fixedRender]="true"></app-time>
-                            <span class="ml-2"></span><a *ngIf="stateService.env.OFFICIAL_MEMPOOL_SPACE && stateService.env.ACCELERATOR" [href]="'/services/accelerator/accelerate?txid=' + tx.txid" class="btn badge badge-primary accelerate ml-auto" i18n="transaction.accelerate|Accelerate button label">Accelerate</a>
+                            <span class="ml-2"></span><a *ngIf="stateService.env.OFFICIAL_MEMPOOL_SPACE && stateService.env.ACCELERATOR && stateService.network === ''" [href]="'/services/accelerator/accelerate?txid=' + tx.txid" class="btn badge badge-primary accelerate ml-auto" i18n="transaction.accelerate|Accelerate button label">Accelerate</a>
                           </span>
                         </ng-template>
                       </ng-template>

frontend/src/app/services/seo.service.ts

@@ -72,11 +72,9 @@ export class SeoService {
 
   clearSoft404() {
     window['soft404'] = false;
-    console.log('cleared soft 404');
   }
 
   logSoft404() {
     window['soft404'] = true;
-    console.log('set soft 404');
   }
 }

frontend/src/app/shared/components/global-footer/global-footer.component.html

@@ -1,12 +1,12 @@
 <footer>
     <div class="container-fluid">
     <div class="row main">
-      <div class="offset-lg-1 col-lg-4 col align-self-center branding mt-2">
+      <div class="col-md-12 branding mt-2">
         <div class="main-logo">
           <app-svg-images *ngIf="officialMempoolSpace" name="officialMempoolSpace" viewBox="0 0 500 126"></app-svg-images>
           <app-svg-images *ngIf="!officialMempoolSpace" name="mempoolSpace" viewBox="0 0 500 126"></app-svg-images>
         </div>
-        <p><ng-container i18n="@@7deec1c1520f06170e1f8e8ddfbe4532312f638f">Explore the full Bitcoin ecosystem</ng-container><ng-template [ngIf]="locale.substr(0, 2) === 'en'"> &trade;</ng-template></p>
+        <div class="site-options">
           <div class="selector">
             <app-language-selector></app-language-selector>
           </div>
@@ -16,6 +16,7 @@
           <div class="selector">
             <app-rate-unit-selector></app-rate-unit-selector>
           </div>
+        </div>
         <div *ngIf="officialMempoolSpace && stateService.env.ACCELERATOR" class="cta">
           <a class="btn btn-purple sponsor" [routerLink]="['/login' | relativeUrl]">
             <span *ngIf="loggedIn" i18n="shared.my-account">My Account</span>
@@ -23,9 +24,9 @@
           </a>
         </div>
       </div>
-      <div class="col-lg-6 col-md-10 offset-md-1 links outer">
+    </div>
-        <div class="row">
+    <div class="row col-md-12 link-tree">
-          <div class="col-lg-6">
+        <div class="links">
           <p class="category">Explore</p>
           <p><a [routerLink]="['/mining' | relativeUrl]">Mining Dashboard</a></p>
           <p><a *ngIf="env.LIGHTNING" [routerLink]="['/lightning' | relativeUrl]">Lightning Dashboard</a></p>
@@ -34,7 +35,7 @@
           <p *ngIf="officialMempoolSpace"><a [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]" i18n="footer.connect-to-our-nodes">Connect to our Nodes</a></p>
           <p><a [routerLink]="['/docs/api' | relativeUrl]">API Documentation</a></p>
         </div>
-          <div class="col-lg-6 links">
+        <div class="links">
           <p class="category">Learn</p>
           <p><a [routerLink]="['/docs/faq']" fragment="what-is-a-mempool">What is a mempool?</a></p>
           <p><a [routerLink]="['/docs/faq']" fragment="what-is-a-block-explorer">What is a block explorer?</a></p>
@@ -42,9 +43,8 @@
           <p><a [routerLink]="['/docs/faq']" fragment="why-is-transaction-stuck-in-mempool">Why isn't my transaction confirming?</a></p>
           <p><a [routerLink]="['/docs/faq' | relativeUrl]">More FAQs ›</a></p>
         </div>
-        </div>
+
-        <div class="row">
+        <div class="links" *ngIf="officialMempoolSpace || env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.LIQUID_TESTNET_ENABLED else toolBox" >
-          <div class="col-lg-6 links" *ngIf="officialMempoolSpace || env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.LIQUID_TESTNET_ENABLED else toolBox" >
           <p class="category">Networks</p>
           <p *ngIf="(officialMempoolSpace || (env.BASE_MODULE === 'mempool')) && (currentNetwork !== '') && (currentNetwork !== 'mainnet')"><a [href]="networkLink('mainnet')">Mainnet Explorer</a></p>
           <p *ngIf="(officialMempoolSpace || (env.BASE_MODULE === 'mempool')) && (currentNetwork !== 'testnet') && env.TESTNET_ENABLED"><a [href]="networkLink('testnet')">Testnet Explorer</a></p>
@@ -54,21 +54,20 @@
           <p *ngIf="(officialMempoolSpace && (currentNetwork !== 'bisq'))"><a [href]="networkLink('bisq')">Bisq Explorer</a></p>
         </div>
         <ng-template #toolBox>
-          <div class="col-lg-6 links">
+        <div class="links">
           <p class="category">Tools</p>
           <p><a [routerLink]="['/clock/mempool/0']">Clock (Mempool)</a></p>
           <p><a [routerLink]="['/clock/mined/0']">Clock (Mined)</a></p>
           <p><a [routerLink]="['/tools/calculator']">BTC/Fiat Converter</a></p>
         </div>
         </ng-template>
-          <div class="col-lg-6 links">
+        <div class="links">
           <p class="category">Legal</p>
           <p><a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a></p>
           <p><a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a></p>
           <p><a [routerLink]="['/trademark-policy']">Trademark Policy</a></p>
         </div>
-        </div>
+
-      </div>
     </div>
     <div class="row social-links">
       <div class="col-sm-12">

frontend/src/app/shared/components/global-footer/global-footer.component.scss

@@ -12,15 +12,11 @@ footer p {
 }
 
 footer .row.main {
-  padding: 40px 0;
+  padding: 40px 0 24px 0;
-  max-width: 1200px;
+  max-width: 1140px;
   margin: 0 auto;
 }
 
-footer .row.main .branding {
-  text-align: center;
-}
-
 footer .row.main .branding > p {
   margin-bottom: 45px;
 }
@@ -38,16 +34,20 @@ footer .row.main .branding .cta {
   margin: 25px auto 25px auto;
 }
 
-footer .row.main .links.outer {
+footer .link-tree .links:nth-child(1), footer .link-tree .links:nth-child(4) {
-  padding-left: 24px;
+  padding-left: 0;
-  padding-top: 10px;
+  padding-right: 0;
+}
+
+footer .link-tree .links p {
+  padding-right: 5px;
 }
 
 footer .row.main .links > div:first-child {
   margin-bottom: 20px;
 }
 
-footer .row.main .links .category {
+footer .links .category {
   color: #4a68b9;
   font-weight: 700;
 }
@@ -56,13 +56,27 @@ footer .row.main .links .category:not(:first-child) {
   margin-top: 1rem;
 }
 
+footer .site-options {
+  float: right;
+  margin-top: -8px;
+}
+
 footer .selector {
-  margin: 20px 0;
+  margin: 20px 5px;
+  display: inline-block;
+}
+
+footer .row.link-tree {
+  max-width: 1140px;
+  margin: 0 auto;
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: nowrap;
 }
 
 footer .row.social-links {
   text-align: center;
-  margin-bottom: 24px;
+  margin: 24px 0;
 }
 
 footer .row.social-links a {
@@ -90,22 +104,79 @@ footer .row.version p a {
 }
 
 .main-logo {
-  max-width: 220px;
+  width: 220px;
-  margin: 0 auto 20px auto;
+  margin: 0;
+  display: inline-block;
 }
 
-@media (max-width: 992px) {
+@media (max-width: 1200px) {
 
-  footer .row.main .links.outer {
+  .main-logo {
+    width: 200px;
+  }
+
+  footer .row.main {
+    max-width: 90%;
+  }
+
+  footer .row.link-tree {
+    max-width: 90%;
+    font-size: 13px;
+    gap: 20px;
+  }
+
+  footer .row.social-links svg {
+    width: 18px;
+  }
+
+}
+
+@media (max-width: 900px) {
+
+  .main-logo {
+    width: 220px;
+  }
+
+  footer .row.link-tree {
+    font-size: 16px;
+  }
+
+  footer .row.social-links svg {
+    width: 20px;
+  }
+
+  footer .row.link-tree {
+    display: block;
     text-align: center;
   }
 
-  footer .row.main .links.outer > .row {
+  footer .link-tree .links {
-    margin-top: 20px;
-  }
-
-  footer .row.main .links.outer > .row > div:first-child {
     margin-bottom: 20px;
   }
 
+  footer .row.main .branding {
+    text-align: center;
+  }
+
+  .main-logo {
+    display: block;
+    margin: 0 auto;
+  }
+
+  footer .site-options {
+    float: none;
+    margin-top: 30px;
+  }
+
+  footer .row.social-links {
+    margin: 48px 0 24px 0;
+  }
+
+  footer .selector {
+    margin: 10px 0 0 0;
+  }
+
+  footer .selector:not(:last-child) {
+    margin-right: 10px;
+  }
 }

unfurler/package.json

@@ -9,7 +9,7 @@
   "main": "index.ts",
   "scripts": {
     "tsc": "./node_modules/typescript/bin/tsc",
-    "build": "npm run tsc",
+    "build": "npm run tsc && cp -r src/resources dist/resources",
     "start": "node --max-old-space-size=2048 dist/index.js",
     "unfurler": "node --max-old-space-size=4096 dist/index.js",
     "lint": "./node_modules/.bin/eslint . --ext .ts",

unfurler/src/index.ts

@@ -8,6 +8,7 @@ import ReusablePage from './concurrency/ReusablePage';
 import ReusableSSRPage from './concurrency/ReusablePage';
 import { parseLanguageUrl } from './language/lang';
 import { matchRoute } from './routes';
+import nodejsPath from 'path';
 import logger from './logger';
 import { TimeoutError } from "puppeteer";
 const puppeteerConfig = require('../puppeteer.config.json');
@@ -50,6 +51,12 @@ class Server {
     this.canonicalHost = canonical;
 
     this.startServer();
+
+    setTimeout(async () => {
+      logger.info(`killing myself now`);
+      await this.stopServer();
+      process.exit(0);
+    }, 3600_000 * (1 + Math.random()))
   }
 
   async startServer() {
@@ -222,11 +229,7 @@ class Server {
 
       if (!img) {
         // proxy fallback image from the frontend
-        if (this.secureHost) {
+        res.sendFile(nodejsPath.join(__dirname, matchedRoute.fallbackImg));
-          https.get(config.SERVER.HOST + matchedRoute.fallbackImg, (got) => got.pipe(res));
-        } else {
-          http.get(config.SERVER.HOST + matchedRoute.fallbackImg, (got) => got.pipe(res));
-        }
       } else {
         res.contentType('image/png');
         res.send(img);

unfurler/src/routes.ts

@@ -30,7 +30,7 @@ const routes = {
   },
   lightning: {
     title: "Lightning",
-    fallbackImg: '/resources/previews/lightning.png',
+    fallbackImg: '/resources/img/lightning.png',
     routes: {
       node: {
         render: true,
@@ -68,7 +68,7 @@ const routes = {
   },
   mining: {
     title: "Mining",
-    fallbackImg: '/resources/previews/mining.png',
+    fallbackImg: '/resources/img/mining.png',
     routes: {
       pool: {
         render: true,
@@ -83,13 +83,13 @@ const routes = {
 
 const networks = {
   bitcoin: {
-    fallbackImg: '/resources/previews/dashboard.png',
+    fallbackImg: '/resources/img/dashboard.png',
     routes: {
       ...routes // all routes supported
     }
   },
   liquid: {
-    fallbackImg: '/resources/liquid/liquid-network-preview.png',
+    fallbackImg: '/resources/img/liquid.png',
     routes: { // only block, address & tx routes supported
       block: routes.block,
       address: routes.address,
@@ -97,7 +97,7 @@ const networks = {
     }
   },
   bisq: {
-    fallbackImg: '/resources/bisq/bisq-markets-preview.png',
+    fallbackImg: '/resources/img/bisq.png',
     routes: {} // no routes supported
   }
 };