Merge remote-tracking branch 'mempooljs/main' into wiz/subtree-merge-mempool.js-repo

Let backend set its own HTTP cache time headers for APIs

.github/ISSUE_TEMPLATE/00-bug-issue.md

@@ -1,7 +1,14 @@
+---
+name: 🐛 Bug Report
+about: Report bugs or other issues to us on GitHub
+---
+
 <!--
-   SUPPORT REQUESTS: This is for reporting bugs in Mempool.
-   If you have a support request, please join our Keybase group:
+   SUPPORT REQUESTS:
+   This is for reporting bugs in Mempool, not for support requests. 
+   If you have a support request, please join our Keybase or Matrix:
    https://keybase.io/team/mempool
+   https://matrix.to/#/#mempool:bitcoin.kyoto
 -->
 
 ### Description
@@ -14,11 +21,11 @@
 
 ### Steps to reproduce
 
-<!--if you can reliably reproduce the bug, list the steps here  -->
+<!-- if you can reliably reproduce the bug, list the steps here -->
 
 ### Expected behaviour
 
-<!--description of the expected behavior -->
+<!-- description of the expected behavior -->
 
 ### Actual behaviour
 
@@ -26,7 +33,7 @@
 
 ### Screenshots
 
-<!--Screenshots if gui related, drag and drop to add to the issue -->
+<!-- Screenshots if gui related, drag and drop to add to the issue -->
 
 #### Device or machine
 

.github/ISSUE_TEMPLATE/30-feature-request.md

@@ -0,0 +1,28 @@
+---
+name: ✨ Feature Request
+about: Request a feature or suggest other enhancements 💡
+---
+
+<!--
+   SUPPORT REQUESTS:
+   This is for requesting features in Mempool, not for support requests. 
+   If you have a support request, please join our Keybase or Matrix:
+   https://keybase.io/team/mempool
+   https://matrix.to/#/#mempool:bitcoin.kyoto
+-->
+
+### Description
+
+<!-- brief description of the feature request -->
+
+### Problem to be solved
+
+<!-- description of the the problem you're having -->
+
+### Proposed solution
+
+<!-- explain how you think we should solve the problem -->
+
+#### Additional info
+
+<!-- Additional information useful for implementing (e.g. docs, links, etc.) -->

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,8 @@
+blank_issues_enabled: false
+contact_links:
+  - name: 💬 Need help? Chat with us on Matrix
+    url: https://matrix.to/#/#mempool:bitcoin.kyoto
+    about: For support requests or general questions
+  - name: 💬 Need help? Chat with us on Keybase
+    url: https://keybase.io/team/mempool
+    about: For support requests or general questions

.github/workflows/cypress.yml

@@ -31,6 +31,10 @@ jobs:
           wait-on-timeout: 120
           record: true
           parallel: true
+          spec: |
+            cypress/integration/mainnet/*.spec.ts
+            cypress/integration/signet/*.spec.ts
+            cypress/integration/testnet/*.spec.ts
           group: Tests on ${{ matrix.browser }} (Mempool)
           browser: ${{ matrix.browser }}
           ci-build-id: '${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}'
@@ -50,7 +54,9 @@ jobs:
           wait-on-timeout: 120
           record: true
           parallel: true
-          spec: cypress/integration/liquid/liquid.spec.ts
+          spec: |
+            cypress/integration/liquid/liquid.spec.ts
+            cypress/integration/liquidtestnet/liquidtestnet.spec.ts
           group: Tests on ${{ matrix.browser }} (Liquid)
           browser: ${{ matrix.browser }}
           ci-build-id: '${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}'

CONTRIBUTING.md

@@ -0,0 +1,49 @@
+# Contributing to The Mempool Open Source Project
+
+Thank you for contributing to The Mempool Open Source Project managed by Mempool Space K.K. (“Mempool”).
+
+In order to clarify the intellectual property license granted with Contributions from any person or entity, Mempool must have a statement on file from each Contributor indicating their agreement to the Contributor License Agreement (“Agreement”). This license is for your protection as a Contributor as well as the protection of Mempool and its other contributors and users; it does not change your rights to use your own Contributions for any other purpose.
+
+When submitting a pull request for the first time, please create a file with a name like `/contributors/{github_username}.txt`, and in the content of that file indicate your agreement to the Contributor License Agreement terms below. An example of what that file should contain can be seen in wiz's agreement file. (This method of CLA "signing" is borrowed from Medium's open source project.)
+
+# Contributor License Agreement
+
+Last Updated: January 25, 2022
+
+By accepting this Agreement, You agree to the following terms and conditions for Your present and future Contributions submitted to Mempool. Except for the license granted herein to Mempool and recipients of software distributed by Mempool, You reserve all right, title, and interest in and to Your Contributions.
+
+### 1. Definitions
+
+“You” (or “Your”) shall mean the copyright owner or legal entity authorized by the copyright owner that is making this Agreement with Mempool. For legal entities, the entity making a Contribution and all other entities that control, are controlled by, or are under common control with that entity are considered to be a single Contributor. For the purposes of this definition, “control” means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity.
+
+“Contribution” shall mean any original work of authorship, including any modifications or additions to an existing work, that is intentionally submitted by You to Mempool for inclusion in, or documentation of, any of the products owned or managed by Mempool (“Work”). For the purposes of this definition, “submitted” means any form of electronic, verbal, or written communication sent to Mempool or its representatives, including but not limited to communication on electronic mailing lists, source code control systems, and issue tracking systems that are managed by, or on behalf of, Mempool for the purpose of discussing and improving the Work, but excluding communication that is conspicuously marked or otherwise designated in writing by You as “Not a Contribution.”
+
+### 2. Grant of Copyright License
+
+Subject to the terms and conditions of this Agreement, You hereby grant to Mempool and to recipients of software distributed by Mempool a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable copyright license to reproduce, prepare derivative works of, publicly display, publicly perform, sublicense, and distribute Your Contributions and such derivative works.
+
+### 3. Grant of Patent License
+
+Subject to the terms and conditions of this Agreement, You hereby grant to Mempool and to recipients of software distributed by Mempool a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable (except as stated in this section) patent license to make, have made, use, offer to sell, sell, import, and otherwise transfer the Work, where such license applies only to those patent claims licensable by You that are necessarily infringed by Your Contribution(s) alone or by combination of Your Contribution(s) with the Work to which such Contribution(s) was submitted. If any entity institutes patent litigation against You or any other entity (including a cross-claim or counterclaim in a lawsuit) alleging that your Contribution, or the Work to which you have contributed, constitutes direct or contributory patent infringement, then any patent licenses granted to that entity under this Agreement for that Contribution or Work shall terminate as of the date such litigation is filed.
+
+### 4. Authority
+
+You represent that you are legally entitled to grant the above license. If your employer(s) has rights to intellectual property that you create that includes your Contributions, you represent that you have received permission to make Contributions on behalf of that employer, that your employer has waived such rights for your Contributions to Mempool, or that your employer has executed a separate Corporate Contributor License Agreement with Mempool.
+
+### 5. Originality
+
+You represent that each of Your Contributions is Your original creation (see section 7 for submissions on behalf of others). You represent that Your Contribution submissions include complete details of any third-party license or other restriction (including, but not limited to, related patents and trademarks) of which you are personally aware, and which are associated with any part of Your Contributions.
+
+### 6. Support
+
+You are not expected to provide support for Your Contributions, except to the extent You desire to provide support. You may provide support for free, for a fee, or not at all. Unless required by applicable law or agreed to in writing, You provide Your Contributions on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied, including, without limitation, any warranties or conditions of TITLE, NON- INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE.
+
+### 7. Third Party Contributions
+
+Should You wish to submit work that is not Your original creation, You may submit it to Mempool separately from any Contribution, identifying the complete details of its source and of any license or other restriction (including, but not limited to, related patents, trademarks, and license agreements) of which you are personally aware, and conspicuously marking the work as “Submitted on behalf of a third-party: [named here]”.
+
+### 8. Notifications
+
+You agree to notify Mempool of any facts or circumstances of which you become aware that would make these representations inaccurate in any respect.
+
+EOF

GNUmakefile

@@ -25,8 +25,7 @@ help:
 .PHONY: init
 init:
 	@echo ''
-	mkdir -p   $(DATA) $(DATA)/mysql $(DATA)/mysql/db-scripts $(DATA)/mysql/data 
-	install -v mariadb-structure.sql $(DATA)/mysql/db-scripts
+	mkdir -p   $(DATA) $(DATA)/mysql $(DATA)/mysql/data 
 	#REF: https://github.com/mempool/mempool/blob/master/docker/README.md
 	cat docker/docker-compose.yml > docker-compose.yml
 	cat backend/mempool-config.sample.json > backend/mempool-config.json

LICENSE

@@ -1,5 +1,5 @@
 The Mempool Open Source Project
-Copyright (c) 2019-2021 The Mempool Open Source Project Developers
+Copyright (c) 2019-2022 The Mempool Open Source Project Developers
 
 This program is free software; you can redistribute it and/or modify it under
 the terms of (at your option) either:

README.md

@@ -14,6 +14,238 @@ Mempool can be self-hosted on a wide variety of your own hardware, ranging from
 4) [Production installation on a powerful FreeBSD server](https://github.com/mempool/mempool/tree/master/production)
 5) [High Availability cluster using powerful FreeBSD servers](https://github.com/mempool/mempool/tree/master/production#high-availability)
 
+# Docker Installation
+
+The `docker` directory contains the Dockerfiles used to build and release the official images and a `docker-compose.yml` file that is intended for end users to run a Mempool instance with minimal effort.
+
+## bitcoind only configuration
+
+To run an instance with the default settings, use the following command:
+
+```bash
+$ docker-compose up
+```
+
+The default configuration will allow you to run Mempool using `bitcoind` as the backend, so address lookups will be disabled. It assumes you have added RPC credentials for the `mempool` user with a `mempool` password in your `bitcoin.conf` file:
+
+```
+rpcuser=mempool
+rpcpassword=mempool
+```
+
+If you want to use your current credentials, update them in the `docker-compose.yml` file:
+
+```
+  api:
+    environment:
+      MEMPOOL_BACKEND: "none"
+      RPC_HOST: "172.27.0.1"
+      RPC_PORT: "8332"
+      RPC_USER: "mempool"
+      RPC_PASS: "mempool"
+```
+
+Note: the IP in the example above refers to Docker's default gateway IP address so the container can hit the `bitcoind` instance running on the host machine. If your setup is different, update it accordingly.
+
+You can check if the instance is running by visiting http://localhost - the graphs will be populated as new transactions are detected.
+
+## bitcoind+electrum configuration
+
+In order to run with a `electrum` compatible server as the backend, in addition to the settings required for running with `bitcoind` above, you will need to make the following changes to the `docker-compose.yml` file:
+
+- Under the `api` service, change the value of the `MEMPOOL_BACKEND` key from `none` to `electrum`:
+
+```
+  api:
+    environment:
+      MEMPOOL_BACKEND: "none"
+```
+
+- Under the `api` service, set the `ELECTRUM_HOST` and `ELECTRUM_PORT` keys to your Docker host IP address and set `ELECTRUM_TLS_ENABLED` to `false`:
+
+```
+  api:
+    environment:
+      ELECTRUM_HOST: "172.27.0.1"
+      ELECTRUM_PORT: "50002"
+      ELECTRUM_TLS_ENABLED: "false"
+```
+
+You can update any of the backend settings in the `mempool-config.json` file using the following environment variables to override them under the same `api` `environment` section.
+
+JSON:
+```
+  "MEMPOOL": {
+    "NETWORK": "mainnet",
+    "BACKEND": "electrum",
+    "HTTP_PORT": 8999,
+    "SPAWN_CLUSTER_PROCS": 0,
+    "API_URL_PREFIX": "/api/v1/",
+    "POLL_RATE_MS": 2000,
+    "CACHE_DIR": "./cache",
+    "CLEAR_PROTECTION_MINUTES": 20,
+    "RECOMMENDED_FEE_PERCENTILE": 50,
+    "BLOCK_WEIGHT_UNITS": 4000000,
+    "INITIAL_BLOCKS_AMOUNT": 8,
+    "MEMPOOL_BLOCKS_AMOUNT": 8,
+    "PRICE_FEED_UPDATE_INTERVAL": 3600,
+    "USE_SECOND_NODE_FOR_MINFEE": false,
+    "EXTERNAL_ASSETS": []
+  },
+```
+
+docker-compose overrides::
+```
+      MEMPOOL_NETWORK: ""
+      MEMPOOL_BACKEND: ""
+      MEMPOOL_HTTP_PORT: ""
+      MEMPOOL_SPAWN_CLUSTER_PROCS: ""
+      MEMPOOL_API_URL_PREFIX: ""
+      MEMPOOL_POLL_RATE_MS: ""
+      MEMPOOL_CACHE_DIR: ""
+      MEMPOOL_CLEAR_PROTECTION_MINUTES: ""
+      MEMPOOL_RECOMMENDED_FEE_PERCENTILE: ""
+      MEMPOOL_BLOCK_WEIGHT_UNITS: ""
+      MEMPOOL_INITIAL_BLOCKS_AMOUNT: ""
+      MEMPOOL_MEMPOOL_BLOCKS_AMOUNT: ""
+      MEMPOOL_PRICE_FEED_UPDATE_INTERVAL: ""
+      MEMPOOL_USE_SECOND_NODE_FOR_MINFEE: ""
+      MEMPOOL_EXTERNAL_ASSETS: ""
+```
+
+JSON:
+```
+"CORE_RPC": {
+    "HOST": "127.0.0.1",
+    "PORT": 8332,
+    "USERNAME": "mempool",
+    "PASSWORD": "mempool"
+  },
+```
+docker-compose overrides:
+```
+      CORE_RPC_HOST: ""
+      CORE_RPC_PORT: ""
+      CORE_RPC_USERNAME: ""
+      CORE_RPC_PASSWORD: ""
+```
+
+JSON:
+```
+  "ELECTRUM": {
+    "HOST": "127.0.0.1",
+    "PORT": 50002,
+    "TLS_ENABLED": true
+  },
+```
+
+docker-compose overrides:
+```
+      ELECTRUM_HOST: ""
+      ELECTRUM_PORT: ""
+      ELECTRUM_TLS: ""
+```
+
+JSON:
+```
+  "ESPLORA": {
+    "REST_API_URL": "http://127.0.0.1:3000"
+  },
+```
+docker-compose overrides:
+```
+      ESPLORA_REST_API_URL: ""
+```
+
+JSON:
+```
+  "SECOND_CORE_RPC": {
+    "HOST": "127.0.0.1",
+    "PORT": 8332,
+    "USERNAME": "mempool",
+    "PASSWORD": "mempool"
+  },
+```
+
+docker-compose overrides:
+```
+      SECOND_CORE_RPC_HOST: ""
+      SECOND_CORE_RPC_PORT: ""
+      SECOND_CORE_RPC_USERNAME: ""
+      SECOND_CORE_RPC_PASSWORD: ""
+```
+
+JSON:
+```
+  "DATABASE": {
+    "ENABLED": true,
+    "HOST": "127.0.0.1",
+    "PORT": 3306,
+    "DATABASE": "mempool",
+    "USERNAME": "mempool",
+    "PASSWORD": "mempool"
+  },
+```
+
+docker-compose overrides:
+```
+      DATABASE_ENABLED: ""
+      DATABASE_HOST: ""
+      DATABASE_PORT: ""
+      DATABASE_DATABASE: ""
+      DATABASE_USERAME: ""
+      DATABASE_PASSWORD: ""
+```
+
+JSON:
+```
+  "SYSLOG": {
+    "ENABLED": true,
+    "HOST": "127.0.0.1",
+    "PORT": 514,
+    "MIN_PRIORITY": "info",
+    "FACILITY": "local7"
+  },
+```
+
+docker-compose overrides:
+```
+      SYSLOG_ENABLED: ""
+      SYSLOG_HOST: ""
+      SYSLOG_PORT: ""
+      SYSLOG_MIN_PRIORITY: ""
+      SYSLOG_FACILITY: ""
+```
+
+JSON:
+```
+  "STATISTICS": {
+    "ENABLED": true,
+    "TX_PER_SECOND_SAMPLE_PERIOD": 150
+  },
+```
+
+docker-compose overrides:
+```
+      STATISTICS_ENABLED: ""
+      STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD: ""
+```
+
+JSON:
+```
+  "BISQ": {
+    "ENABLED": false,
+    "DATA_PATH": "/bisq/statsnode-data/btc_mainnet/db"
+  }
+```
+
+docker-compose overrides:
+```
+      BISQ_ENABLED: ""
+      BISQ_DATA_PATH: ""
+```
+
+
 # Manual Installation
 
 The following instructions are for a manual installation on Linux or FreeBSD. The file and directory paths may need to be changed to match your OS.
@@ -69,11 +301,6 @@ Create database and grant privileges:
   Query OK, 0 rows affected (0.00 sec)
 ```
 
-From the mempool repo's top-level folder, import the database structure:
-```bash
-  mysql -u mempool -p mempool < mariadb-structure.sql
-```
-
 ## Mempool Backend
 Install mempool dependencies from npm and build the backend:
 
@@ -163,7 +390,7 @@ Install mempool dependencies from npm and build the frontend static HTML/CSS/JS:
 Install the output into nginx webroot folder:
 
 ```bash
-  sudo rsync -av --delete dist/mempool/ /var/www/
+  sudo rsync -av --delete dist/ /var/www/
 ```
 
 ## nginx + certbot

backend/.gitignore

@@ -1,7 +1,10 @@
 # See http://help.github.com/ignore-files/ for more about ignoring files.
 
-# production config
-mempool-config.json
+# production config and external assets
+*.json
+!mempool-config.sample.json
+
+icons.json
 
 # compiled output
 /dist

backend/README.md

@@ -0,0 +1,22 @@
+# Setup backend watchers
+
+The backend is static. Typescript scripts are compiled into the `dist` folder and served through a node web server.
+
+You can avoid the manual shutdown/recompile/restart command line cycle by using a watcher.
+
+Make sure you are in the `backend` directory `cd backend`.
+
+1. Install nodemon and ts-node
+
+```
+sudo npm install -g ts-node nodemon
+```
+
+2. Run the watcher
+
+> Note: You can find your npm global binary folder using `npm -g bin`, where nodemon will be installed.
+
+```
+nodemon src/index.ts --ignore cache/ --ignore pools.json
+```
+

backend/mempool-config.sample.json

@@ -12,8 +12,12 @@
     "BLOCK_WEIGHT_UNITS": 4000000,
     "INITIAL_BLOCKS_AMOUNT": 8,
     "MEMPOOL_BLOCKS_AMOUNT": 8,
+    "INDEXING_BLOCKS_AMOUNT": 1100,
     "PRICE_FEED_UPDATE_INTERVAL": 3600,
-    "USE_SECOND_NODE_FOR_MINFEE": false
+    "USE_SECOND_NODE_FOR_MINFEE": false,
+    "EXTERNAL_ASSETS": [
+      "https://mempool.space/resources/pools.json"
+    ]
   },
   "CORE_RPC": {
     "HOST": "127.0.0.1",

backend/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "mempool-backend",
-  "version": "2.3.0-dev",
+  "version": "2.4.0-dev",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "mempool-backend",
-      "version": "2.3.0-dev",
+      "version": "2.4.0-dev",
       "license": "GNU Affero General Public License v3.0",
       "dependencies": {
         "@mempool/bitcoin": "^3.0.3",
@@ -577,9 +577,9 @@
       }
     },
     "node_modules/follow-redirects": {
-      "version": "1.14.6",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
-      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A==",
+      "version": "1.14.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz",
+      "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==",
       "funding": [
         {
           "type": "individual",
@@ -1877,9 +1877,9 @@
       }
     },
     "follow-redirects": {
-      "version": "1.14.6",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
-      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A=="
+      "version": "1.14.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz",
+      "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ=="
     },
     "forwarded": {
       "version": "0.1.2",

backend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mempool-backend",
-  "version": "2.3.0-dev",
+  "version": "2.4.0-dev",
   "description": "Bitcoin mempool visualizer and blockchain explorer backend",
   "license": "GNU Affero General Public License v3.0",
   "homepage": "https://mempool.space",

backend/src/api/bitcoin/bitcoin-api-abstract-factory.ts

@@ -12,6 +12,7 @@ export interface AbstractBitcoinApi {
   $getAddressTransactions(address: string, lastSeenTxId: string): Promise<IEsploraApi.Transaction[]>;
   $getAddressPrefix(prefix: string): string[];
   $sendRawTransaction(rawTransaction: string): Promise<string>;
+  $getOutspends(txId: string): Promise<IEsploraApi.Outspend[]>;
 }
 export interface BitcoinRpcCredentials {
   host: string;

backend/src/api/bitcoin/bitcoin-api.ts

@@ -21,11 +21,6 @@ class BitcoinApi implements AbstractBitcoinApi {
       return this.$addPrevouts(txInMempool);
     }
 
-    // Special case to fetch the Coinbase transaction
-    if (txId === '4a5e1e4baab89f3a32518a88c31bc87f618f76673e2cc77ab2127b7afdeda33b') {
-      return this.$returnCoinbaseTransaction();
-    }
-
     return this.bitcoindClient.getRawTransaction(txId, true)
       .then((transaction: IBitcoinApi.Transaction) => {
         if (skipConversion) {
@@ -35,6 +30,12 @@ class BitcoinApi implements AbstractBitcoinApi {
           return transaction;
         }
         return this.$convertTransaction(transaction, addPrevout);
+      })
+      .catch((e: Error) => {
+        if (e.message.startsWith('The genesis block coinbase')) {
+          return this.$returnCoinbaseTransaction();
+        }
+        throw e;
       });
   }
 
@@ -102,6 +103,23 @@ class BitcoinApi implements AbstractBitcoinApi {
     return this.bitcoindClient.sendRawTransaction(rawTransaction);
   }
 
+  async $getOutspends(txId: string): Promise<IEsploraApi.Outspend[]> {
+    const outSpends: IEsploraApi.Outspend[] = [];
+    const tx = await this.$getRawTransaction(txId, true, false);
+    for (let i = 0; i < tx.vout.length; i++) {
+      const txOut = await this.bitcoindClient.getTxOut(txId, i);
+      outSpends.push({
+        spent: txOut === null,
+      });
+    }
+    return outSpends;
+  }
+
+  $getEstimatedHashrate(blockHeight: number): Promise<number> {
+    // 120 is the default block span in Core
+    return this.bitcoindClient.getNetworkHashPs(120, blockHeight);
+  }
+
   protected async $convertTransaction(transaction: IBitcoinApi.Transaction, addPrevout: boolean): Promise<IEsploraApi.Transaction> {
     let esploraTransaction: IEsploraApi.Transaction = {
       txid: transaction.txid,
@@ -226,12 +244,14 @@ class BitcoinApi implements AbstractBitcoinApi {
   }
 
   protected $returnCoinbaseTransaction(): Promise<IEsploraApi.Transaction> {
-    return this.bitcoindClient.getBlock('000000000019d6689c085ae165831e934ff763ae46a2a6c172b3f1b60a8ce26f', 2)
-      .then((block: IBitcoinApi.Block) => {
-        return this.$convertTransaction(Object.assign(block.tx[0], {
-          confirmations: blocks.getCurrentBlockHeight() + 1,
-          blocktime: 1231006505 }), false);
-      });
+    return this.bitcoindClient.getBlockHash(0).then((hash: string) =>
+      this.bitcoindClient.getBlock(hash, 2)
+        .then((block: IBitcoinApi.Block) => {
+          return this.$convertTransaction(Object.assign(block.tx[0], {
+            confirmations: blocks.getCurrentBlockHeight() + 1,
+            blocktime: block.time }), false);
+        })
+    );
   }
 
   private $getMempoolEntry(txid: string): Promise<IBitcoinApi.MempoolEntry> {

backend/src/api/bitcoin/esplora-api.interface.ts

@@ -113,9 +113,9 @@ export namespace IEsploraApi {
 
   export interface Outspend {
     spent: boolean;
-    txid: string;
-    vin: number;
-    status: Status;
+    txid?: string;
+    vin?: number;
+    status?: Status;
   }
 
   export interface Asset {

backend/src/api/bitcoin/esplora-api.ts

@@ -60,6 +60,10 @@ class ElectrsApi implements AbstractBitcoinApi {
   $sendRawTransaction(rawTransaction: string): Promise<string> {
     throw new Error('Method not implemented.');
   }
+
+  $getOutspends(): Promise<IEsploraApi.Outspend[]> {
+    throw new Error('Method not implemented.');
+  }
 }
 
 export default ElectrsApi;

backend/src/api/blocks.ts

@@ -2,11 +2,14 @@ import config from '../config';
 import bitcoinApi from './bitcoin/bitcoin-api-factory';
 import logger from '../logger';
 import memPool from './mempool';
-import { BlockExtended, TransactionExtended } from '../mempool.interfaces';
+import { BlockExtended, PoolTag, TransactionExtended, TransactionMinerInfo } from '../mempool.interfaces';
 import { Common } from './common';
 import diskCache from './disk-cache';
 import transactionUtils from './transaction-utils';
 import bitcoinClient from './bitcoin/bitcoin-client';
+import { IEsploraApi } from './bitcoin/esplora-api.interface';
+import poolsRepository from '../repositories/PoolsRepository';
+import blocksRepository from '../repositories/BlocksRepository';
 
 class Blocks {
   private blocks: BlockExtended[] = [];
@@ -15,6 +18,7 @@ class Blocks {
   private lastDifficultyAdjustmentTime = 0;
   private previousDifficultyRetarget = 0;
   private newBlockCallbacks: ((block: BlockExtended, txIds: string[], transactions: TransactionExtended[]) => void)[] = [];
+  private blockIndexingStarted = false;
 
   constructor() { }
 
@@ -30,6 +34,186 @@ class Blocks {
     this.newBlockCallbacks.push(fn);
   }
 
+  /**
+   * Return the list of transaction for a block
+   * @param blockHash
+   * @param blockHeight
+   * @param onlyCoinbase - Set to true if you only need the coinbase transaction
+   * @returns Promise<TransactionExtended[]>
+   */
+  private async $getTransactionsExtended(blockHash: string, blockHeight: number, onlyCoinbase: boolean): Promise<TransactionExtended[]> {
+    const transactions: TransactionExtended[] = [];
+    const txIds: string[] = await bitcoinApi.$getTxIdsForBlock(blockHash);
+
+    const mempool = memPool.getMempool();
+    let transactionsFound = 0;
+    let transactionsFetched = 0;
+
+    for (let i = 0; i < txIds.length; i++) {
+      if (mempool[txIds[i]]) {
+        // We update blocks before the mempool (index.ts), therefore we can
+        // optimize here by directly fetching txs in the "outdated" mempool
+        transactions.push(mempool[txIds[i]]);
+        transactionsFound++;
+      } else if (config.MEMPOOL.BACKEND === 'esplora' || memPool.isInSync() || i === 0) {
+        // Otherwise we fetch the tx data through backend services (esplora, electrum, core rpc...)
+        if (i % (Math.round((txIds.length) / 10)) === 0 || i + 1 === txIds.length) { // Avoid log spam
+          logger.debug(`Indexing tx ${i + 1} of ${txIds.length} in block #${blockHeight}`);
+        }
+        try {
+          const tx = await transactionUtils.$getTransactionExtended(txIds[i]);
+          transactions.push(tx);
+          transactionsFetched++;
+        } catch (e) {
+          logger.debug('Error fetching block tx: ' + (e instanceof Error ? e.message : e));
+          if (i === 0) {
+            throw new Error('Failed to fetch Coinbase transaction: ' + txIds[i]);
+          }
+        }
+      }
+
+      if (onlyCoinbase === true) {
+        break; // Fetch the first transaction and exit
+      }
+    }
+
+    transactions.forEach((tx) => {
+      if (!tx.cpfpChecked) {
+        Common.setRelativesAndGetCpfpInfo(tx, mempool); // Child Pay For Parent
+      }
+    });
+
+    logger.debug(`${transactionsFound} of ${txIds.length} found in mempool. ${transactionsFetched} fetched through backend service.`);
+
+    return transactions;
+  }
+
+  /**
+   * Return a block with additional data (reward, coinbase, fees...)
+   * @param block
+   * @param transactions
+   * @returns BlockExtended
+   */
+  private getBlockExtended(block: IEsploraApi.Block, transactions: TransactionExtended[]): BlockExtended {
+    const blockExtended: BlockExtended = Object.assign({}, block);
+    blockExtended.reward = transactions[0].vout.reduce((acc, curr) => acc + curr.value, 0);
+    blockExtended.coinbaseTx = transactionUtils.stripCoinbaseTransaction(transactions[0]);
+
+    const transactionsTmp = [...transactions];
+    transactionsTmp.shift();
+    transactionsTmp.sort((a, b) => b.effectiveFeePerVsize - a.effectiveFeePerVsize);
+    blockExtended.medianFee = transactionsTmp.length > 0 ? Common.median(transactionsTmp.map((tx) => tx.effectiveFeePerVsize)) : 0;
+    blockExtended.feeRange = transactionsTmp.length > 0 ? Common.getFeesInRange(transactionsTmp, 8) : [0, 0];
+
+    return blockExtended;
+  }
+
+  /**
+   * Try to find which miner found the block
+   * @param txMinerInfo
+   * @returns
+   */
+  private async $findBlockMiner(txMinerInfo: TransactionMinerInfo | undefined): Promise<PoolTag> {
+    if (txMinerInfo === undefined || txMinerInfo.vout.length < 1) {
+      return await poolsRepository.$getUnknownPool();
+    }
+
+    const asciiScriptSig = transactionUtils.hex2ascii(txMinerInfo.vin[0].scriptsig);
+    const address = txMinerInfo.vout[0].scriptpubkey_address;
+
+    const pools: PoolTag[] = await poolsRepository.$getPools();
+    for (let i = 0; i < pools.length; ++i) {
+      if (address !== undefined) {
+        const addresses: string[] = JSON.parse(pools[i].addresses);
+        if (addresses.indexOf(address) !== -1) {
+          return pools[i];
+        }
+      }
+
+      const regexes: string[] = JSON.parse(pools[i].regexes);
+      for (let y = 0; y < regexes.length; ++y) {
+        const match = asciiScriptSig.match(regexes[y]);
+        if (match !== null) {
+          return pools[i];
+        }
+      }
+    }
+
+    return await poolsRepository.$getUnknownPool();
+  }
+
+  /**
+   * Index all blocks metadata for the mining dashboard
+   */
+  public async $generateBlockDatabase() {
+    if (['mainnet', 'testnet', 'signet'].includes(config.MEMPOOL.NETWORK) === false || // Bitcoin only
+      config.MEMPOOL.INDEXING_BLOCKS_AMOUNT === 0 || // Indexing must be enabled
+      !memPool.isInSync() || // We sync the mempool first
+      this.blockIndexingStarted === true // Indexing must not already be in progress
+    ) {
+      return;
+    }
+
+    const blockchainInfo = await bitcoinClient.getBlockchainInfo();
+    if (blockchainInfo.blocks !== blockchainInfo.headers) {
+      return;
+    }
+
+    this.blockIndexingStarted = true;
+
+    try {
+      let currentBlockHeight = blockchainInfo.blocks;
+
+      let indexingBlockAmount = config.MEMPOOL.INDEXING_BLOCKS_AMOUNT;
+      if (indexingBlockAmount <= -1) {
+        indexingBlockAmount = currentBlockHeight + 1;
+      }
+
+      const lastBlockToIndex = Math.max(0, currentBlockHeight - indexingBlockAmount + 1);
+
+      logger.info(`Indexing blocks from #${currentBlockHeight} to #${lastBlockToIndex}`);
+
+      const chunkSize = 10000;
+      while (currentBlockHeight >= lastBlockToIndex) {
+        const endBlock = Math.max(0, lastBlockToIndex, currentBlockHeight - chunkSize + 1);
+
+        const missingBlockHeights: number[] = await blocksRepository.$getMissingBlocksBetweenHeights(
+          currentBlockHeight, endBlock);
+        if (missingBlockHeights.length <= 0) {
+          logger.debug(`No missing blocks between #${currentBlockHeight} to #${endBlock}`);
+          currentBlockHeight -= chunkSize;
+          continue;
+        }
+
+        logger.debug(`Indexing ${missingBlockHeights.length} blocks from #${currentBlockHeight} to #${endBlock}`);
+
+        for (const blockHeight of missingBlockHeights) {
+          if (blockHeight < lastBlockToIndex) {
+            break;
+          }
+          try {
+            logger.debug(`Indexing block #${blockHeight}`);
+            const blockHash = await bitcoinApi.$getBlockHash(blockHeight);
+            const block = await bitcoinApi.$getBlock(blockHash);
+            const transactions = await this.$getTransactionsExtended(blockHash, block.height, true);
+            const blockExtended = this.getBlockExtended(block, transactions);
+            const miner = await this.$findBlockMiner(blockExtended.coinbaseTx);
+            const coinbase: IEsploraApi.Transaction = await bitcoinApi.$getRawTransaction(transactions[0].txid, true);
+            await blocksRepository.$saveBlockInDatabase(blockExtended, blockHash, coinbase.hex, miner);
+          } catch (e) {
+            logger.err(`Something went wrong while indexing blocks.` + e);
+          }
+        }
+
+        currentBlockHeight -= chunkSize;
+      }
+      logger.info('Block indexing completed');
+    } catch (e) {
+      logger.err('An error occured in $generateBlockDatabase(). Skipping block indexing. ' + e);
+      console.log(e);
+    }
+  }
+
   public async $updateBlocks() {
     const blockHeightTip = await bitcoinApi.$getBlockHeightTip();
 
@@ -70,49 +254,18 @@ class Blocks {
         logger.debug(`New block found (#${this.currentBlockHeight})!`);
       }
 
-      const transactions: TransactionExtended[] = [];
-
       const blockHash = await bitcoinApi.$getBlockHash(this.currentBlockHeight);
       const block = await bitcoinApi.$getBlock(blockHash);
       const txIds: string[] = await bitcoinApi.$getTxIdsForBlock(blockHash);
+      const transactions = await this.$getTransactionsExtended(blockHash, block.height, false);
+      const blockExtended: BlockExtended = this.getBlockExtended(block, transactions);
+      const coinbase: IEsploraApi.Transaction = await bitcoinApi.$getRawTransaction(transactions[0].txid, true);
 
-      const mempool = memPool.getMempool();
-      let transactionsFound = 0;
-
-      for (let i = 0; i < txIds.length; i++) {
-        if (mempool[txIds[i]]) {
-          transactions.push(mempool[txIds[i]]);
-          transactionsFound++;
-        } else if (config.MEMPOOL.BACKEND === 'esplora' || memPool.isInSync() || i === 0) {
-          logger.debug(`Fetching block tx ${i} of ${txIds.length}`);
-          try {
-            const tx = await transactionUtils.$getTransactionExtended(txIds[i]);
-            transactions.push(tx);
-          } catch (e) {
-            logger.debug('Error fetching block tx: ' + (e instanceof Error ? e.message : e));
-            if (i === 0) {
-              throw new Error('Failed to fetch Coinbase transaction: ' + txIds[i]);
-            }
-          }
-        }
+      if (['mainnet', 'testnet', 'signet'].includes(config.MEMPOOL.NETWORK) === true) {
+        const miner = await this.$findBlockMiner(blockExtended.coinbaseTx);
+        await blocksRepository.$saveBlockInDatabase(blockExtended, blockHash, coinbase.hex, miner);
       }
 
-      transactions.forEach((tx) => {
-        if (!tx.cpfpChecked) {
-          Common.setRelativesAndGetCpfpInfo(tx, mempool);
-        }
-      });
-
-      logger.debug(`${transactionsFound} of ${txIds.length} found in mempool. ${txIds.length - transactionsFound} not found.`);
-
-      const blockExtended: BlockExtended = Object.assign({}, block);
-      blockExtended.reward = transactions[0].vout.reduce((acc, curr) => acc + curr.value, 0);
-      blockExtended.coinbaseTx = transactionUtils.stripCoinbaseTransaction(transactions[0]);
-      transactions.shift();
-      transactions.sort((a, b) => b.effectiveFeePerVsize - a.effectiveFeePerVsize);
-      blockExtended.medianFee = transactions.length > 0 ? Common.median(transactions.map((tx) => tx.effectiveFeePerVsize)) : 0;
-      blockExtended.feeRange = transactions.length > 0 ? Common.getFeesInRange(transactions, 8) : [0, 0];
-
       if (block.height % 2016 === 0) {
         this.previousDifficultyRetarget = (block.difficulty - this.currentDifficulty) / this.currentDifficulty * 100;
         this.lastDifficultyAdjustmentTime = block.timestamp;
@@ -130,6 +283,8 @@ class Blocks {
       if (memPool.isInSync()) {
         diskCache.$saveCacheToDisk();
       }
+
+      return;
     }
   }
 

backend/src/api/common.ts

@@ -1,7 +1,14 @@
 import { CpfpInfo, TransactionExtended, TransactionStripped } from '../mempool.interfaces';
 import config from '../config';
 export class Common {
-  static nativeAssetId = '6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d';
+  static nativeAssetId = config.MEMPOOL.NETWORK === 'liquidtestnet' ?
+    '144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49'
+  : '6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d';
+  static _isLiquid = config.MEMPOOL.NETWORK === 'liquid' || config.MEMPOOL.NETWORK === 'liquidtestnet';
+
+  static isLiquid(): boolean {
+    return this._isLiquid;
+  }
 
   static median(numbers: number[]) {
     let medianNr = 0;
@@ -107,7 +114,7 @@ export class Common {
       totalFees += tx.bestDescendant.fee;
     }
 
-    tx.effectiveFeePerVsize = Math.max(config.MEMPOOL.NETWORK === 'liquid' ? 0.1 : 1, totalFees / (totalWeight / 4));
+    tx.effectiveFeePerVsize = Math.max(Common.isLiquid() ? 0.1 : 1, totalFees / (totalWeight / 4));
     tx.cpfpChecked = true;
 
     return {

backend/src/api/database-migration.ts

@@ -1,62 +1,151 @@
+import { PoolConnection } from 'mysql2/promise';
 import config from '../config';
 import { DB } from '../database';
 import logger from '../logger';
 
+const sleep = (ms: number) => new Promise(res => setTimeout(res, ms));
+
 class DatabaseMigration {
-  private static currentVersion = 1;
+  private static currentVersion = 4;
   private queryTimeout = 120000;
+  private statisticsAddedIndexed = false;
 
   constructor() { }
-
+  /**
+   * Entry point
+   */
   public async $initializeOrMigrateDatabase(): Promise<void> {
-    if (!await this.$checkIfTableExists('statistics')) {
-      await this.$initializeDatabaseTables();
-    }
+    logger.info('MIGRATIONS: Running migrations');
 
-    if (await this.$checkIfTableExists('state')) {
-      const databaseSchemaVersion = await this.$getSchemaVersionFromDatabase();
-      if (DatabaseMigration.currentVersion > databaseSchemaVersion) {
-        await this.$migrateTableSchemaFromVersion(databaseSchemaVersion);
+    await this.$printDatabaseVersion();
+
+    // First of all, if the `state` database does not exist, create it so we can track migration version
+    if (!await this.$checkIfTableExists('state')) {
+      logger.info('MIGRATIONS: `state` table does not exist. Creating it.');
+      try {
+        await this.$createMigrationStateTable();
+      } catch (e) {
+        logger.err('MIGRATIONS: Unable to create `state` table, aborting in 10 seconds. ' + e);
+        await sleep(10000);
+        process.exit(-1);
       }
-    } else {
-      await this.$migrateTableSchemaFromVersion(0);
+      logger.info('MIGRATIONS: `state` table initialized.');
+    }
+
+    let databaseSchemaVersion = 0;
+    try {
+      databaseSchemaVersion = await this.$getSchemaVersionFromDatabase();
+    } catch (e) {
+      logger.err('MIGRATIONS: Unable to get current database migration version, aborting in 10 seconds. ' + e);
+      await sleep(10000);
+      process.exit(-1);
+    }
+
+    logger.info('MIGRATIONS: Current state.schema_version ' + databaseSchemaVersion);
+    logger.info('MIGRATIONS: Latest DatabaseMigration.version is ' + DatabaseMigration.currentVersion);
+    if (databaseSchemaVersion >= DatabaseMigration.currentVersion) {
+      logger.info('MIGRATIONS: Nothing to do.');
+      return;
+    }
+
+    // Now, create missing tables. Those queries cannot be wrapped into a transaction unfortunately
+    try {
+      await this.$createMissingTablesAndIndexes(databaseSchemaVersion);
+    } catch (e) {
+      logger.err('MIGRATIONS: Unable to create required tables, aborting in 10 seconds. ' + e);
+      await sleep(10000);
+      process.exit(-1);
+    }
+
+    if (DatabaseMigration.currentVersion > databaseSchemaVersion) {
+      logger.info('MIGRATIONS: Upgrading datababse schema');
+      try {
+        await this.$migrateTableSchemaFromVersion(databaseSchemaVersion);
+        logger.info(`MIGRATIONS: OK. Database schema have been migrated from version ${databaseSchemaVersion} to ${DatabaseMigration.currentVersion} (latest version)`);
+      } catch (e) {
+        logger.err('MIGRATIONS: Unable to migrate database, aborting. ' + e);
+      }
+    }
+
+    return;
+  }
+
+  /**
+   * Create all missing tables
+   */
+  private async $createMissingTablesAndIndexes(databaseSchemaVersion: number) {
+    await this.$setStatisticsAddedIndexedFlag(databaseSchemaVersion);
+
+    const connection = await DB.pool.getConnection();
+    try {
+      await this.$executeQuery(connection, this.getCreateElementsTableQuery(), await this.$checkIfTableExists('elements_pegs'));
+      await this.$executeQuery(connection, this.getCreateStatisticsQuery(), await this.$checkIfTableExists('statistics'));
+      if (databaseSchemaVersion < 2 && this.statisticsAddedIndexed === false) {
+        await this.$executeQuery(connection, `CREATE INDEX added ON statistics (added);`);
+      }
+      if (databaseSchemaVersion < 3) {
+        await this.$executeQuery(connection, this.getCreatePoolsTableQuery(), await this.$checkIfTableExists('pools'));
+      }
+      if (databaseSchemaVersion < 4) {
+        await this.$executeQuery(connection, 'DROP table IF EXISTS blocks;');
+        await this.$executeQuery(connection, this.getCreateBlocksTableQuery(), await this.$checkIfTableExists('blocks'));
+      }
+      connection.release();
+    } catch (e) {
+      connection.release();
+      throw e;
     }
   }
 
-  private async $initializeDatabaseTables(): Promise<void> {
-    const connection = await DB.pool.getConnection();
-    for (const query of this.getInitializeTableQueries()) {
-      await connection.query<any>({ sql: query, timeout: this.queryTimeout });
+  /**
+   * Special case here for the `statistics` table - It appeared that somehow some dbs already had the `added` field indexed
+   * while it does not appear in previous schemas. The mariadb command "CREATE INDEX IF NOT EXISTS" is not supported on
+   * older mariadb version. Therefore we set a flag here in order to know if the index needs to be created or not before
+   * running the migration process
+   */
+  private async $setStatisticsAddedIndexedFlag(databaseSchemaVersion: number) {
+    if (databaseSchemaVersion >= 2) {
+      this.statisticsAddedIndexed = true;
+      return;
     }
-    connection.release();
-    logger.info(`Initial database tables have been created`);
-  }
 
-  private async $migrateTableSchemaFromVersion(version: number): Promise<void> {
     const connection = await DB.pool.getConnection();
-    for (const query of this.getMigrationQueriesFromVersion(version)) {
-      await connection.query<any>({ sql: query, timeout: this.queryTimeout });
+
+    try {
+      // We don't use "CREATE INDEX IF NOT EXISTS" because it is not supported on old mariadb version 5.X
+      const query = `SELECT COUNT(1) hasIndex FROM INFORMATION_SCHEMA.STATISTICS
+        WHERE table_schema=DATABASE() AND table_name='statistics' AND index_name='added';`;
+      const [rows] = await this.$executeQuery(connection, query, true);
+      if (rows[0].hasIndex === 0) {
+        logger.info('MIGRATIONS: `statistics.added` is not indexed');
+        this.statisticsAddedIndexed = false;
+      } else if (rows[0].hasIndex === 1) {
+        logger.info('MIGRATIONS: `statistics.added` is already indexed');
+        this.statisticsAddedIndexed = true;
+      }
+    } catch (e) {
+      // Should really never happen but just in case it fails, we just don't execute
+      // any query related to this indexing so it won't fail if the index actually already exists
+      logger.err('MIGRATIONS: Unable to check if `statistics.added` INDEX exist or not.');
+      this.statisticsAddedIndexed = true;
     }
-    connection.release();
-    await this.$updateToLatestSchemaVersion();
-    logger.info(`Database schema have been migrated from version ${version} to ${DatabaseMigration.currentVersion} (latest version)`);
-  }
 
-  private async $getSchemaVersionFromDatabase(): Promise<number> {
-    const connection = await DB.pool.getConnection();
-    const query = `SELECT number FROM state WHERE name = 'schema_version';`;
-    const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
-    connection.release();
-    return rows[0]['number'];
-  }
-
-  private async $updateToLatestSchemaVersion(): Promise<void> {
-    const connection = await DB.pool.getConnection();
-    const query = `UPDATE state SET number = ${DatabaseMigration.currentVersion} WHERE name = 'schema_version'`;
-    const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
     connection.release();
   }
 
+  /**
+   * Small query execution wrapper to log all executed queries
+   */
+  private async $executeQuery(connection: PoolConnection, query: string, silent: boolean = false): Promise<any> {
+    if (!silent) {
+      logger.info('MIGRATIONS: Execute query:\n' + query);
+    }
+    return connection.query<any>({ sql: query, timeout: this.queryTimeout });
+  }
+
+  /**
+   * Check if 'table' exists in the database
+   */
   private async $checkIfTableExists(table: string): Promise<boolean> {
     const connection = await DB.pool.getConnection();
     const query = `SELECT COUNT(*) FROM information_schema.tables WHERE table_schema = '${config.DATABASE.DATABASE}' AND TABLE_NAME = '${table}'`;
@@ -65,11 +154,131 @@ class DatabaseMigration {
     return rows[0]['COUNT(*)'] === 1;
   }
 
-  private getInitializeTableQueries(): string[] {
+  /**
+   * Get current database version
+   */
+  private async $getSchemaVersionFromDatabase(): Promise<number> {
+    const connection = await DB.pool.getConnection();
+    const query = `SELECT number FROM state WHERE name = 'schema_version';`;
+    const [rows] = await this.$executeQuery(connection, query, true);
+    connection.release();
+    return rows[0]['number'];
+  }
+
+  /**
+   * Create the `state` table
+   */
+  private async $createMigrationStateTable(): Promise<void> {
+    const connection = await DB.pool.getConnection();
+
+    try {
+      const query = `CREATE TABLE IF NOT EXISTS state (
+        name varchar(25) NOT NULL,
+        number int(11) NULL,
+        string varchar(100) NULL,
+        CONSTRAINT name_unique UNIQUE (name)
+      ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`;
+      await this.$executeQuery(connection, query);
+
+      // Set initial values
+      await this.$executeQuery(connection, `INSERT INTO state VALUES('schema_version', 0, NULL);`);
+      await this.$executeQuery(connection, `INSERT INTO state VALUES('last_elements_block', 0, NULL);`);
+
+      connection.release();
+    } catch (e) {
+      connection.release();
+      throw e;
+    }
+  }
+
+  /**
+   * We actually execute the migrations queries here
+   */
+  private async $migrateTableSchemaFromVersion(version: number): Promise<void> {
+    const transactionQueries: string[] = [];
+    for (const query of this.getMigrationQueriesFromVersion(version)) {
+      transactionQueries.push(query);
+    }
+    transactionQueries.push(this.getUpdateToLatestSchemaVersionQuery());
+
+    const connection = await DB.pool.getConnection();
+    try {
+      await this.$executeQuery(connection, 'START TRANSACTION;');
+      for (const query of transactionQueries) {
+        await this.$executeQuery(connection, query);
+      }
+      await this.$executeQuery(connection, 'COMMIT;');
+
+      connection.release();
+    } catch (e) {
+      await this.$executeQuery(connection, 'ROLLBACK;');
+      connection.release();
+      throw e;
+    }
+  }
+
+  /**
+   * Generate migration queries based on schema version
+   */
+  private getMigrationQueriesFromVersion(version: number): string[] {
     const queries: string[] = [];
 
-    queries.push(`CREATE TABLE IF NOT EXISTS statistics (
-      id int(11) NOT NULL,
+    if (version < 1) {
+      if (config.MEMPOOL.NETWORK !== 'liquid' && config.MEMPOOL.NETWORK !== 'liquidtestnet') {
+        queries.push(this.getShiftStatisticsQuery());
+      }
+    }
+
+    return queries;
+  }
+
+  /**
+   * Save the schema version in the database
+   */
+  private getUpdateToLatestSchemaVersionQuery(): string {
+    return `UPDATE state SET number = ${DatabaseMigration.currentVersion} WHERE name = 'schema_version';`;
+  }
+
+  /**
+   * Print current database version
+   */
+  private async $printDatabaseVersion() {
+    const connection = await DB.pool.getConnection();
+    try {
+      const [rows] = await this.$executeQuery(connection, 'SELECT VERSION() as version;', true);
+      logger.info(`MIGRATIONS: Database engine version '${rows[0].version}'`);
+    } catch (e) {
+      logger.info(`MIGRATIONS: Could not fetch database engine version. ` + e);
+    }
+    connection.release();
+  }
+
+  // Couple of wrappers to clean the main logic
+  private getShiftStatisticsQuery(): string {
+    return `UPDATE statistics SET
+      vsize_1 = vsize_1 + vsize_2, vsize_2 = vsize_3,
+      vsize_3 = vsize_4, vsize_4 = vsize_5,
+      vsize_5 = vsize_6, vsize_6 = vsize_8,
+      vsize_8 = vsize_10, vsize_10 = vsize_12,
+      vsize_12 = vsize_15, vsize_15 = vsize_20,
+      vsize_20 = vsize_30, vsize_30 = vsize_40,
+      vsize_40 = vsize_50, vsize_50 = vsize_60,
+      vsize_60 = vsize_70, vsize_70 = vsize_80,
+      vsize_80 = vsize_90, vsize_90 = vsize_100,
+      vsize_100 = vsize_125, vsize_125 = vsize_150,
+      vsize_150 = vsize_175, vsize_175 = vsize_200,
+      vsize_200 = vsize_250, vsize_250 = vsize_300,
+      vsize_300 = vsize_350, vsize_350 = vsize_400,
+      vsize_400 = vsize_500, vsize_500 = vsize_600,
+      vsize_600 = vsize_700, vsize_700 = vsize_800,
+      vsize_800 = vsize_900, vsize_900 = vsize_1000,
+      vsize_1000 = vsize_1200, vsize_1200 = vsize_1400,
+      vsize_1400 = vsize_1800, vsize_1800 = vsize_2000, vsize_2000 = 0;`;
+  }
+
+  private getCreateStatisticsQuery(): string {
+    return `CREATE TABLE IF NOT EXISTS statistics (
+      id int(11) NOT NULL AUTO_INCREMENT,
       added datetime NOT NULL,
       unconfirmed_transactions int(11) UNSIGNED NOT NULL,
       tx_per_second float UNSIGNED NOT NULL,
@@ -114,64 +323,54 @@ class DatabaseMigration {
       vsize_1400 int(11) NOT NULL,
       vsize_1600 int(11) NOT NULL,
       vsize_1800 int(11) NOT NULL,
-      vsize_2000 int(11) NOT NULL
-    ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`);
-
-    queries.push(`ALTER TABLE statistics ADD PRIMARY KEY (id);`);
-    queries.push(`ALTER TABLE statistics MODIFY id int(11) NOT NULL AUTO_INCREMENT;`);
-
-    return queries;
+      vsize_2000 int(11) NOT NULL,
+      CONSTRAINT PRIMARY KEY (id)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`;
   }
 
-  private getMigrationQueriesFromVersion(version: number): string[] {
-    const queries: string[] = [];
+  private getCreateElementsTableQuery(): string {
+    return `CREATE TABLE IF NOT EXISTS elements_pegs (
+      block int(11) NOT NULL,
+      datetime int(11) NOT NULL,
+      amount bigint(20) NOT NULL,
+      txid varchar(65) NOT NULL,
+      txindex int(11) NOT NULL,
+      bitcoinaddress varchar(100) NOT NULL,
+      bitcointxid varchar(65) NOT NULL,
+      bitcoinindex int(11) NOT NULL,
+      final_tx int(11) NOT NULL
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`;
+  }
 
-    if (version < 1) {
-      if (config.MEMPOOL.NETWORK !== 'liquid') {
-        queries.push(`UPDATE statistics SET
-          vsize_1 = vsize_1 + vsize_2, vsize_2 = vsize_3,
-          vsize_3 = vsize_4, vsize_4 = vsize_5,
-          vsize_5 = vsize_6, vsize_6 = vsize_8,
-          vsize_8 = vsize_10, vsize_10 = vsize_12,
-          vsize_12 = vsize_15, vsize_15 = vsize_20,
-          vsize_20 = vsize_30, vsize_30 = vsize_40,
-          vsize_40 = vsize_50, vsize_50 = vsize_60,
-          vsize_60 = vsize_70, vsize_70 = vsize_80,
-          vsize_80 = vsize_90, vsize_90 = vsize_100,
-          vsize_100 = vsize_125, vsize_125 = vsize_150,
-          vsize_150 = vsize_175, vsize_175 = vsize_200,
-          vsize_200 = vsize_250, vsize_250 = vsize_300,
-          vsize_300 = vsize_350, vsize_350 = vsize_400,
-          vsize_400 = vsize_500, vsize_500 = vsize_600,
-          vsize_600 = vsize_700, vsize_700 = vsize_800,
-          vsize_800 = vsize_900, vsize_900 = vsize_1000,
-          vsize_1000 = vsize_1200, vsize_1200 = vsize_1400,
-          vsize_1400 = vsize_1800, vsize_1800 = vsize_2000, vsize_2000 = 0`);
-      }
+  private getCreatePoolsTableQuery(): string {
+    return `CREATE TABLE IF NOT EXISTS pools (
+      id int(11) NOT NULL AUTO_INCREMENT,
+      name varchar(50) NOT NULL,
+      link varchar(255) NOT NULL,
+      addresses text NOT NULL,
+      regexes text NOT NULL,
+      PRIMARY KEY (id)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;`;
+  }
 
-      queries.push(`CREATE TABLE IF NOT EXISTS elements_pegs (
-        block int(11) NOT NULL,
-        datetime int(11) NOT NULL,
-        amount bigint(20) NOT NULL,
-        txid varchar(65) NOT NULL,
-        txindex int(11) NOT NULL,
-        bitcoinaddress varchar(100) NOT NULL,
-        bitcointxid varchar(65) NOT NULL,
-        bitcoinindex int(11) NOT NULL,
-        final_tx int(11) NOT NULL
-      ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`);
-
-      queries.push(`CREATE TABLE IF NOT EXISTS state (
-        name varchar(25) NOT NULL,
-        number int(11) NULL,
-        string varchar(100) NULL
-      ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`);
-
-      queries.push(`INSERT INTO state VALUES('schema_version', 0, NULL);`);
-      queries.push(`INSERT INTO state VALUES('last_elements_block', 0, NULL);`);
-    }
-
-    return queries;
+  private getCreateBlocksTableQuery(): string {
+    return `CREATE TABLE IF NOT EXISTS blocks (
+      height int(11) unsigned NOT NULL,
+      hash varchar(65) NOT NULL,
+      blockTimestamp timestamp NOT NULL,
+      size int(11) unsigned NOT NULL,
+      weight int(11) unsigned NOT NULL,
+      tx_count int(11) unsigned NOT NULL,
+      coinbase_raw text,
+      difficulty bigint(20) unsigned NOT NULL,
+      pool_id int(11) DEFAULT -1,
+      fees double unsigned NOT NULL,
+      fee_span json NOT NULL,
+      median_fee double unsigned NOT NULL,
+      PRIMARY KEY (height),
+      INDEX (pool_id),
+      FOREIGN KEY (pool_id) REFERENCES pools (id)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8;`;
   }
 }
 

backend/src/api/fee-api.ts

@@ -1,12 +1,13 @@
 import config from '../config';
 import { MempoolBlock } from '../mempool.interfaces';
+import { Common } from './common';
 import mempool from './mempool';
 import projectedBlocks from './mempool-blocks';
 
 class FeeApi {
   constructor() { }
 
-  defaultFee = config.MEMPOOL.NETWORK === 'liquid' ? 0.1 : 1;
+  defaultFee = Common.isLiquid() ? 0.1 : 1;
 
   public getRecommendedFee() {
     const pBlocks = projectedBlocks.getMempoolBlocks();

backend/src/api/liquid/icons.ts

@@ -0,0 +1,39 @@
+import * as fs from 'fs';
+import config from '../../config';
+import logger from '../../logger';
+
+class Icons {
+  private static FILE_NAME = './icons.json';
+  private iconIds: string[] = [];
+  private icons: { [assetId: string]: string; } = {};
+
+  constructor() {}
+
+  public loadIcons() {
+    if (!fs.existsSync(Icons.FILE_NAME)) {
+      logger.warn(`${Icons.FILE_NAME} does not exist. No Liquid icons loaded.`);
+      return;
+    }
+    const cacheData = fs.readFileSync(Icons.FILE_NAME, 'utf8');
+    this.icons = JSON.parse(cacheData);
+
+    for (const i in this.icons) {
+      this.iconIds.push(i);
+    }
+    logger.debug(`Liquid icons has been loaded.`);
+  }
+
+  public getIconByAssetId(assetId: string): Buffer | undefined {
+    const icon = this.icons[assetId];
+    if (icon) {
+      return Buffer.from(icon, 'base64');
+    }
+  }
+
+  public getAllIconIds() {
+    return this.iconIds;
+  }
+
+}
+
+export default new Icons();

backend/src/api/mining.ts

@@ -0,0 +1,69 @@
+import { PoolInfo, PoolStats } from '../mempool.interfaces';
+import BlocksRepository, { EmptyBlocks } from '../repositories/BlocksRepository';
+import PoolsRepository from '../repositories/PoolsRepository';
+import bitcoinClient from './bitcoin/bitcoin-client';
+
+class Mining {
+  constructor() {
+  }
+
+  /**
+   * Generate high level overview of the pool ranks and general stats
+   */
+  public async $getPoolsStats(interval: string | null) : Promise<object> {
+    let sqlInterval: string | null = null;
+    switch (interval) {
+      case '24h': sqlInterval = '1 DAY'; break;
+      case '3d': sqlInterval = '3 DAY'; break;
+      case '1w': sqlInterval = '1 WEEK'; break;
+      case '1m': sqlInterval = '1 MONTH'; break;
+      case '3m': sqlInterval = '3 MONTH'; break;
+      case '6m': sqlInterval = '6 MONTH'; break;
+      case '1y': sqlInterval = '1 YEAR'; break;
+      case '2y': sqlInterval = '2 YEAR'; break;
+      case '3y': sqlInterval = '3 YEAR'; break;
+      default: sqlInterval = null; break;
+    }
+
+    const poolsStatistics = {};
+
+    const poolsInfo: PoolInfo[] = await PoolsRepository.$getPoolsInfo(sqlInterval);
+    const emptyBlocks: EmptyBlocks[] = await BlocksRepository.$countEmptyBlocks(sqlInterval);
+
+    const poolsStats: PoolStats[] = [];
+    let rank = 1;
+
+    poolsInfo.forEach((poolInfo: PoolInfo) => {
+      const poolStat: PoolStats = {
+        poolId: poolInfo.poolId, // mysql row id
+        name: poolInfo.name,
+        link: poolInfo.link,
+        blockCount: poolInfo.blockCount,
+        rank: rank++,
+        emptyBlocks: 0, 
+      }
+      for (let i = 0; i < emptyBlocks.length; ++i) {
+        if (emptyBlocks[i].poolId === poolInfo.poolId) {
+          poolStat.emptyBlocks++;
+        }
+      }
+      poolsStats.push(poolStat);
+    });
+
+    poolsStatistics['pools'] = poolsStats;
+
+    const oldestBlock = new Date(await BlocksRepository.$oldestBlockTimestamp());
+    poolsStatistics['oldestIndexedBlockTimestamp'] = oldestBlock.getTime();
+
+    const blockCount: number = await BlocksRepository.$blockCount(sqlInterval);
+    poolsStatistics['blockCount'] = blockCount;
+
+    const blockHeightTip = await bitcoinClient.getBlockCount();
+    const lastBlockHashrate = await bitcoinClient.getNetworkHashPs(120, blockHeightTip);
+    poolsStatistics['lastEstimatedHashrate'] = lastBlockHashrate;
+
+    return poolsStatistics;
+  }
+}
+
+export default new Mining();

backend/src/api/pools-parser.ts

@@ -0,0 +1,173 @@
+import { readFileSync } from 'fs';
+import { DB } from '../database';
+import logger from '../logger';
+import config from '../config';
+
+interface Pool {
+  name: string;
+  link: string;
+  regexes: string[];
+  addresses: string[];
+}
+
+class PoolsParser {
+  /**
+   * Parse the pools.json file, consolidate the data and dump it into the database
+   */
+  public async migratePoolsJson() {
+    if (['mainnet', 'testnet', 'signet'].includes(config.MEMPOOL.NETWORK) === false) {
+      return;
+    }
+
+    logger.debug('Importing pools.json to the database, open ./pools.json');
+
+    let poolsJson: object = {};
+    try {
+      const fileContent: string = readFileSync('./pools.json', 'utf8');
+      poolsJson = JSON.parse(fileContent);
+    } catch (e) {
+      logger.err('Unable to open ./pools.json, does the file exist?');
+      await this.insertUnknownPool();
+      return;
+    }
+
+    // First we save every entries without paying attention to pool duplication
+    const poolsDuplicated: Pool[] = [];
+
+    logger.debug('Parse coinbase_tags');
+    const coinbaseTags = Object.entries(poolsJson['coinbase_tags']);
+    for (let i = 0; i < coinbaseTags.length; ++i) {
+      poolsDuplicated.push({
+        'name': (<Pool>coinbaseTags[i][1]).name,
+        'link': (<Pool>coinbaseTags[i][1]).link,
+        'regexes': [coinbaseTags[i][0]],
+        'addresses': [],
+      });
+    }
+    logger.debug('Parse payout_addresses');
+    const addressesTags = Object.entries(poolsJson['payout_addresses']);
+    for (let i = 0; i < addressesTags.length; ++i) {
+      poolsDuplicated.push({
+        'name': (<Pool>addressesTags[i][1]).name,
+        'link': (<Pool>addressesTags[i][1]).link,
+        'regexes': [],
+        'addresses': [addressesTags[i][0]],
+      });
+    }
+
+    // Then, we find unique mining pool names
+    logger.debug('Identify unique mining pools');
+    const poolNames: string[] = [];
+    for (let i = 0; i < poolsDuplicated.length; ++i) {
+      if (poolNames.indexOf(poolsDuplicated[i].name) === -1) {
+        poolNames.push(poolsDuplicated[i].name);
+      }
+    }
+    logger.debug(`Found ${poolNames.length} unique mining pools`);
+
+    // Get existing pools from the db
+    const connection = await DB.pool.getConnection();
+    let existingPools;
+    try {
+      [existingPools] = await connection.query<any>({ sql: 'SELECT * FROM pools;', timeout: 120000 });
+    } catch (e) {
+      logger.err('Unable to get existing pools from the database, skipping pools.json import');
+      connection.release();
+      return;
+    }
+
+    // Finally, we generate the final consolidated pools data
+    const finalPoolDataAdd: Pool[] = [];
+    const finalPoolDataUpdate: Pool[] = [];
+    for (let i = 0; i < poolNames.length; ++i) {
+      let allAddresses: string[] = [];
+      let allRegexes: string[] = [];
+      const match = poolsDuplicated.filter((pool: Pool) => pool.name === poolNames[i]);
+
+      for (let y = 0; y < match.length; ++y) {
+        allAddresses = allAddresses.concat(match[y].addresses);
+        allRegexes = allRegexes.concat(match[y].regexes);
+      }
+
+      const finalPoolName = poolNames[i].replace(`'`, `''`); // To support single quote in names when doing db queries
+
+      if (existingPools.find((pool) => pool.name === poolNames[i]) !== undefined) {
+        logger.debug(`Update '${finalPoolName}' mining pool`);
+        finalPoolDataUpdate.push({
+          'name': finalPoolName,
+          'link': match[0].link,
+          'regexes': allRegexes,
+          'addresses': allAddresses,
+        });
+      } else {
+        logger.debug(`Add '${finalPoolName}' mining pool`);
+        finalPoolDataAdd.push({
+          'name': finalPoolName,
+          'link': match[0].link,
+          'regexes': allRegexes,
+          'addresses': allAddresses,
+        });
+      }
+    }
+
+    logger.debug(`Update pools table now`);
+
+    // Add new mining pools into the database
+    let queryAdd: string = 'INSERT INTO pools(name, link, regexes, addresses) VALUES ';
+    for (let i = 0; i < finalPoolDataAdd.length; ++i) {
+      queryAdd += `('${finalPoolDataAdd[i].name}', '${finalPoolDataAdd[i].link}',
+      '${JSON.stringify(finalPoolDataAdd[i].regexes)}', '${JSON.stringify(finalPoolDataAdd[i].addresses)}'),`;
+    }
+    queryAdd = queryAdd.slice(0, -1) + ';';
+
+    // Add new mining pools into the database
+    const updateQueries: string[] = [];
+    for (let i = 0; i < finalPoolDataUpdate.length; ++i) {
+      updateQueries.push(`
+        UPDATE pools
+        SET name='${finalPoolDataUpdate[i].name}', link='${finalPoolDataUpdate[i].link}',
+        regexes='${JSON.stringify(finalPoolDataUpdate[i].regexes)}', addresses='${JSON.stringify(finalPoolDataUpdate[i].addresses)}'
+        WHERE name='${finalPoolDataUpdate[i].name}'
+      ;`);
+    }
+
+    try {
+      if (finalPoolDataAdd.length > 0) {
+        await connection.query<any>({ sql: queryAdd, timeout: 120000 });
+      }
+      for (const query of updateQueries) {
+        await connection.query<any>({ sql: query, timeout: 120000 });
+      }
+      await this.insertUnknownPool();
+      connection.release();
+      logger.info('Mining pools.json import completed');
+    } catch (e) {
+      connection.release();
+      logger.err(`Unable to import pools in the database!`);
+      throw e;
+    }
+  }
+
+  /**
+   * Manually add the 'unknown pool'
+   */
+  private async insertUnknownPool() {
+    const connection = await DB.pool.getConnection();
+    try {
+      const [rows]: any[] = await connection.query({ sql: 'SELECT name from pools where name="Unknown"', timeout: 120000 });
+      if (rows.length === 0) {
+        logger.debug('Manually inserting "Unknown" mining pool into the databse');
+        await connection.query({
+          sql: `INSERT INTO pools(name, link, regexes, addresses)
+          VALUES("Unknown", "https://learnmeabitcoin.com/technical/coinbase-transaction", "[]", "[]");
+        `});
+      }
+    } catch (e) {
+      logger.err('Unable to insert "Unknown" mining pool');
+    }
+
+    connection.release();
+  }
+}
+
+export default new PoolsParser();

backend/src/api/statistics.ts

@@ -4,14 +4,12 @@ import logger from '../logger';
 
 import { Statistic, TransactionExtended, OptimizedStatistic } from '../mempool.interfaces';
 import config from '../config';
+import { Common } from './common';
 
 class Statistics {
   protected intervalTimer: NodeJS.Timer | undefined;
   protected newStatisticsEntryCallback: ((stats: OptimizedStatistic) => void) | undefined;
   protected queryTimeout = 120000;
-  protected cache: { [date: string]: OptimizedStatistic[] } = {
-    '24h': [], '1w': [], '1m': [], '3m': [], '6m': [], '1y': [], '2y': [], '3y': []
-  };
 
   public setNewStatisticsEntryCallback(fn: (stats: OptimizedStatistic) => void) {
     this.newStatisticsEntryCallback = fn;
@@ -33,25 +31,6 @@ class Statistics {
         this.runStatistics();
       }, 1 * 60 * 1000);
     }, difference);
-
-    this.createCache();
-    setInterval(this.createCache.bind(this), 600000);
-  }
-
-  public getCache() {
-    return this.cache;
-  }
-
-  private async createCache() {
-    this.cache['24h'] = await this.$list24H();
-    this.cache['1w'] = await this.$list1W();
-    this.cache['1m'] = await this.$list1M();
-    this.cache['3m'] = await this.$list3M();
-    this.cache['6m'] = await this.$list6M();
-    this.cache['1y'] = await this.$list1Y();
-    this.cache['2y'] = await this.$list2Y();
-    this.cache['3y'] = await this.$list3Y();
-    logger.debug('Statistics cache created');
   }
 
   private async runStatistics(): Promise<void> {
@@ -74,6 +53,17 @@ class Statistics {
     memPoolArray = memPoolArray.filter((tx) => tx.effectiveFeePerVsize);
 
     if (!memPoolArray.length) {
+      try {
+        const insertIdZeroed = await this.$createZeroedStatistic();
+        if (this.newStatisticsEntryCallback && insertIdZeroed) {
+          const newStats = await this.$get(insertIdZeroed);
+          if (newStats) {
+            this.newStatisticsEntryCallback(newStats);
+          }
+        }
+      } catch (e) {
+        logger.err('Unable to insert zeroed statistics. ' + e);
+      }
       return;
     }
 
@@ -90,9 +80,9 @@ class Statistics {
     memPoolArray.forEach((transaction) => {
       for (let i = 0; i < logFees.length; i++) {
         if (
-          (config.MEMPOOL.NETWORK === 'liquid' && (i === lastItem || transaction.effectiveFeePerVsize * 10 < logFees[i + 1]))
+          (Common.isLiquid() && (i === lastItem || transaction.effectiveFeePerVsize * 10 < logFees[i + 1]))
           ||
-          (config.MEMPOOL.NETWORK !== 'liquid' && (i === lastItem || transaction.effectiveFeePerVsize < logFees[i + 1]))
+          (!Common.isLiquid() && (i === lastItem || transaction.effectiveFeePerVsize < logFees[i + 1]))
         ) {
           if (weightVsizeFees[logFees[i]]) {
             weightVsizeFees[logFees[i]] += transaction.vsize;
@@ -104,65 +94,130 @@ class Statistics {
       }
     });
 
-    const insertId = await this.$create({
-      added: 'NOW()',
-      unconfirmed_transactions: memPoolArray.length,
-      tx_per_second: txPerSecond,
-      vbytes_per_second: Math.round(vBytesPerSecond),
-      mempool_byte_weight: totalWeight,
-      total_fee: totalFee,
-      fee_data: '',
-      vsize_1: weightVsizeFees['1'] || 0,
-      vsize_2: weightVsizeFees['2'] || 0,
-      vsize_3: weightVsizeFees['3'] || 0,
-      vsize_4: weightVsizeFees['4'] || 0,
-      vsize_5: weightVsizeFees['5'] || 0,
-      vsize_6: weightVsizeFees['6'] || 0,
-      vsize_8: weightVsizeFees['8'] || 0,
-      vsize_10: weightVsizeFees['10'] || 0,
-      vsize_12: weightVsizeFees['12'] || 0,
-      vsize_15: weightVsizeFees['15'] || 0,
-      vsize_20: weightVsizeFees['20'] || 0,
-      vsize_30: weightVsizeFees['30'] || 0,
-      vsize_40: weightVsizeFees['40'] || 0,
-      vsize_50: weightVsizeFees['50'] || 0,
-      vsize_60: weightVsizeFees['60'] || 0,
-      vsize_70: weightVsizeFees['70'] || 0,
-      vsize_80: weightVsizeFees['80'] || 0,
-      vsize_90: weightVsizeFees['90'] || 0,
-      vsize_100: weightVsizeFees['100'] || 0,
-      vsize_125: weightVsizeFees['125'] || 0,
-      vsize_150: weightVsizeFees['150'] || 0,
-      vsize_175: weightVsizeFees['175'] || 0,
-      vsize_200: weightVsizeFees['200'] || 0,
-      vsize_250: weightVsizeFees['250'] || 0,
-      vsize_300: weightVsizeFees['300'] || 0,
-      vsize_350: weightVsizeFees['350'] || 0,
-      vsize_400: weightVsizeFees['400'] || 0,
-      vsize_500: weightVsizeFees['500'] || 0,
-      vsize_600: weightVsizeFees['600'] || 0,
-      vsize_700: weightVsizeFees['700'] || 0,
-      vsize_800: weightVsizeFees['800'] || 0,
-      vsize_900: weightVsizeFees['900'] || 0,
-      vsize_1000: weightVsizeFees['1000'] || 0,
-      vsize_1200: weightVsizeFees['1200'] || 0,
-      vsize_1400: weightVsizeFees['1400'] || 0,
-      vsize_1600: weightVsizeFees['1600'] || 0,
-      vsize_1800: weightVsizeFees['1800'] || 0,
-      vsize_2000: weightVsizeFees['2000'] || 0,
-    });
+    try {
+      const insertId = await this.$create({
+        added: 'NOW()',
+        unconfirmed_transactions: memPoolArray.length,
+        tx_per_second: txPerSecond,
+        vbytes_per_second: Math.round(vBytesPerSecond),
+        mempool_byte_weight: totalWeight,
+        total_fee: totalFee,
+        fee_data: '',
+        vsize_1: weightVsizeFees['1'] || 0,
+        vsize_2: weightVsizeFees['2'] || 0,
+        vsize_3: weightVsizeFees['3'] || 0,
+        vsize_4: weightVsizeFees['4'] || 0,
+        vsize_5: weightVsizeFees['5'] || 0,
+        vsize_6: weightVsizeFees['6'] || 0,
+        vsize_8: weightVsizeFees['8'] || 0,
+        vsize_10: weightVsizeFees['10'] || 0,
+        vsize_12: weightVsizeFees['12'] || 0,
+        vsize_15: weightVsizeFees['15'] || 0,
+        vsize_20: weightVsizeFees['20'] || 0,
+        vsize_30: weightVsizeFees['30'] || 0,
+        vsize_40: weightVsizeFees['40'] || 0,
+        vsize_50: weightVsizeFees['50'] || 0,
+        vsize_60: weightVsizeFees['60'] || 0,
+        vsize_70: weightVsizeFees['70'] || 0,
+        vsize_80: weightVsizeFees['80'] || 0,
+        vsize_90: weightVsizeFees['90'] || 0,
+        vsize_100: weightVsizeFees['100'] || 0,
+        vsize_125: weightVsizeFees['125'] || 0,
+        vsize_150: weightVsizeFees['150'] || 0,
+        vsize_175: weightVsizeFees['175'] || 0,
+        vsize_200: weightVsizeFees['200'] || 0,
+        vsize_250: weightVsizeFees['250'] || 0,
+        vsize_300: weightVsizeFees['300'] || 0,
+        vsize_350: weightVsizeFees['350'] || 0,
+        vsize_400: weightVsizeFees['400'] || 0,
+        vsize_500: weightVsizeFees['500'] || 0,
+        vsize_600: weightVsizeFees['600'] || 0,
+        vsize_700: weightVsizeFees['700'] || 0,
+        vsize_800: weightVsizeFees['800'] || 0,
+        vsize_900: weightVsizeFees['900'] || 0,
+        vsize_1000: weightVsizeFees['1000'] || 0,
+        vsize_1200: weightVsizeFees['1200'] || 0,
+        vsize_1400: weightVsizeFees['1400'] || 0,
+        vsize_1600: weightVsizeFees['1600'] || 0,
+        vsize_1800: weightVsizeFees['1800'] || 0,
+        vsize_2000: weightVsizeFees['2000'] || 0,
+      });
 
-    if (this.newStatisticsEntryCallback && insertId) {
-      const newStats = await this.$get(insertId);
-      if (newStats) {
-        this.newStatisticsEntryCallback(newStats);
+      if (this.newStatisticsEntryCallback && insertId) {
+        const newStats = await this.$get(insertId);
+        if (newStats) {
+          this.newStatisticsEntryCallback(newStats);
+        }
       }
+    } catch (e) {
+      logger.err('Unable to insert statistics. ' + e);
+    }
+  }
+
+  private async $createZeroedStatistic(): Promise<number | undefined> {
+    const connection = await DB.pool.getConnection();
+    try {
+      const query = `INSERT INTO statistics(
+              added,
+              unconfirmed_transactions,
+              tx_per_second,
+              vbytes_per_second,
+              mempool_byte_weight,
+              fee_data,
+              total_fee,
+              vsize_1,
+              vsize_2,
+              vsize_3,
+              vsize_4,
+              vsize_5,
+              vsize_6,
+              vsize_8,
+              vsize_10,
+              vsize_12,
+              vsize_15,
+              vsize_20,
+              vsize_30,
+              vsize_40,
+              vsize_50,
+              vsize_60,
+              vsize_70,
+              vsize_80,
+              vsize_90,
+              vsize_100,
+              vsize_125,
+              vsize_150,
+              vsize_175,
+              vsize_200,
+              vsize_250,
+              vsize_300,
+              vsize_350,
+              vsize_400,
+              vsize_500,
+              vsize_600,
+              vsize_700,
+              vsize_800,
+              vsize_900,
+              vsize_1000,
+              vsize_1200,
+              vsize_1400,
+              vsize_1600,
+              vsize_1800,
+              vsize_2000
+            )
+            VALUES (NOW(), 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+               0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0)`;
+      const [result]: any = await connection.query(query);
+      connection.release();
+      return result.insertId;
+    } catch (e) {
+      connection.release();
+      logger.err('$create() error' + (e instanceof Error ? e.message : e));
     }
   }
 
   private async $create(statistics: Statistic): Promise<number | undefined> {
+    const connection = await DB.pool.getConnection();
     try {
-      const connection = await DB.pool.getConnection();
       const query = `INSERT INTO statistics(
               added,
               unconfirmed_transactions,
@@ -263,63 +318,63 @@ class Statistics {
       connection.release();
       return result.insertId;
     } catch (e) {
+      connection.release();
       logger.err('$create() error' + (e instanceof Error ? e.message : e));
     }
   }
 
   private getQueryForDaysAvg(div: number, interval: string) {
-    return `SELECT id, UNIX_TIMESTAMP(added) as added,
-      CAST(avg(unconfirmed_transactions) as FLOAT) as unconfirmed_transactions,
-      CAST(avg(tx_per_second) as FLOAT) as tx_per_second,
-      CAST(avg(vbytes_per_second) as FLOAT) as vbytes_per_second,
-      CAST(avg(vsize_1) as FLOAT) as vsize_1,
-      CAST(avg(vsize_2) as FLOAT) as vsize_2,
-      CAST(avg(vsize_3) as FLOAT) as vsize_3,
-      CAST(avg(vsize_4) as FLOAT) as vsize_4,
-      CAST(avg(vsize_5) as FLOAT) as vsize_5,
-      CAST(avg(vsize_6) as FLOAT) as vsize_6,
-      CAST(avg(vsize_8) as FLOAT) as vsize_8,
-      CAST(avg(vsize_10) as FLOAT) as vsize_10,
-      CAST(avg(vsize_12) as FLOAT) as vsize_12,
-      CAST(avg(vsize_15) as FLOAT) as vsize_15,
-      CAST(avg(vsize_20) as FLOAT) as vsize_20,
-      CAST(avg(vsize_30) as FLOAT) as vsize_30,
-      CAST(avg(vsize_40) as FLOAT) as vsize_40,
-      CAST(avg(vsize_50) as FLOAT) as vsize_50,
-      CAST(avg(vsize_60) as FLOAT) as vsize_60,
-      CAST(avg(vsize_70) as FLOAT) as vsize_70,
-      CAST(avg(vsize_80) as FLOAT) as vsize_80,
-      CAST(avg(vsize_90) as FLOAT) as vsize_90,
-      CAST(avg(vsize_100) as FLOAT) as vsize_100,
-      CAST(avg(vsize_125) as FLOAT) as vsize_125,
-      CAST(avg(vsize_150) as FLOAT) as vsize_150,
-      CAST(avg(vsize_175) as FLOAT) as vsize_175,
-      CAST(avg(vsize_200) as FLOAT) as vsize_200,
-      CAST(avg(vsize_250) as FLOAT) as vsize_250,
-      CAST(avg(vsize_300) as FLOAT) as vsize_300,
-      CAST(avg(vsize_350) as FLOAT) as vsize_350,
-      CAST(avg(vsize_400) as FLOAT) as vsize_400,
-      CAST(avg(vsize_500) as FLOAT) as vsize_500,
-      CAST(avg(vsize_600) as FLOAT) as vsize_600,
-      CAST(avg(vsize_700) as FLOAT) as vsize_700,
-      CAST(avg(vsize_800) as FLOAT) as vsize_800,
-      CAST(avg(vsize_900) as FLOAT) as vsize_900,
-      CAST(avg(vsize_1000) as FLOAT) as vsize_1000,
-      CAST(avg(vsize_1200) as FLOAT) as vsize_1200,
-      CAST(avg(vsize_1400) as FLOAT) as vsize_1400,
-      CAST(avg(vsize_1600) as FLOAT) as vsize_1600,
-      CAST(avg(vsize_1800) as FLOAT) as vsize_1800,
-      CAST(avg(vsize_2000) as FLOAT) as vsize_2000 \
+    return `SELECT
+      UNIX_TIMESTAMP(added) as added,
+      CAST(avg(vbytes_per_second) as DOUBLE) as vbytes_per_second,
+      CAST(avg(vsize_1) as DOUBLE) as vsize_1,
+      CAST(avg(vsize_2) as DOUBLE) as vsize_2,
+      CAST(avg(vsize_3) as DOUBLE) as vsize_3,
+      CAST(avg(vsize_4) as DOUBLE) as vsize_4,
+      CAST(avg(vsize_5) as DOUBLE) as vsize_5,
+      CAST(avg(vsize_6) as DOUBLE) as vsize_6,
+      CAST(avg(vsize_8) as DOUBLE) as vsize_8,
+      CAST(avg(vsize_10) as DOUBLE) as vsize_10,
+      CAST(avg(vsize_12) as DOUBLE) as vsize_12,
+      CAST(avg(vsize_15) as DOUBLE) as vsize_15,
+      CAST(avg(vsize_20) as DOUBLE) as vsize_20,
+      CAST(avg(vsize_30) as DOUBLE) as vsize_30,
+      CAST(avg(vsize_40) as DOUBLE) as vsize_40,
+      CAST(avg(vsize_50) as DOUBLE) as vsize_50,
+      CAST(avg(vsize_60) as DOUBLE) as vsize_60,
+      CAST(avg(vsize_70) as DOUBLE) as vsize_70,
+      CAST(avg(vsize_80) as DOUBLE) as vsize_80,
+      CAST(avg(vsize_90) as DOUBLE) as vsize_90,
+      CAST(avg(vsize_100) as DOUBLE) as vsize_100,
+      CAST(avg(vsize_125) as DOUBLE) as vsize_125,
+      CAST(avg(vsize_150) as DOUBLE) as vsize_150,
+      CAST(avg(vsize_175) as DOUBLE) as vsize_175,
+      CAST(avg(vsize_200) as DOUBLE) as vsize_200,
+      CAST(avg(vsize_250) as DOUBLE) as vsize_250,
+      CAST(avg(vsize_300) as DOUBLE) as vsize_300,
+      CAST(avg(vsize_350) as DOUBLE) as vsize_350,
+      CAST(avg(vsize_400) as DOUBLE) as vsize_400,
+      CAST(avg(vsize_500) as DOUBLE) as vsize_500,
+      CAST(avg(vsize_600) as DOUBLE) as vsize_600,
+      CAST(avg(vsize_700) as DOUBLE) as vsize_700,
+      CAST(avg(vsize_800) as DOUBLE) as vsize_800,
+      CAST(avg(vsize_900) as DOUBLE) as vsize_900,
+      CAST(avg(vsize_1000) as DOUBLE) as vsize_1000,
+      CAST(avg(vsize_1200) as DOUBLE) as vsize_1200,
+      CAST(avg(vsize_1400) as DOUBLE) as vsize_1400,
+      CAST(avg(vsize_1600) as DOUBLE) as vsize_1600,
+      CAST(avg(vsize_1800) as DOUBLE) as vsize_1800,
+      CAST(avg(vsize_2000) as DOUBLE) as vsize_2000 \
       FROM statistics \
       WHERE added BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW() \
       GROUP BY UNIX_TIMESTAMP(added) DIV ${div} \
-      ORDER BY id DESC;`;
+      ORDER BY statistics.added DESC;`;
   }
 
   private getQueryForDays(div: number, interval: string) {
-    return `SELECT id, UNIX_TIMESTAMP(added) as added, unconfirmed_transactions,
-      tx_per_second,
-      vbytes_per_second,
+    return `SELECT
+      UNIX_TIMESTAMP(added) as added,
+      CAST(avg(vbytes_per_second) as DOUBLE) as vbytes_per_second,
       vsize_1,
       vsize_2,
       vsize_3,
@@ -361,10 +416,10 @@ class Statistics {
       FROM statistics \
       WHERE added BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW() \
       GROUP BY UNIX_TIMESTAMP(added) DIV ${div} \
-      ORDER BY id DESC;`;
+      ORDER BY statistics.added DESC;`;
   }
 
-  public async $get(id: number): Promise<OptimizedStatistic | undefined> {
+  private async $get(id: number): Promise<OptimizedStatistic | undefined> {
     try {
       const connection = await DB.pool.getConnection();
       const query = `SELECT *, UNIX_TIMESTAMP(added) as added FROM statistics WHERE id = ?`;
@@ -381,7 +436,7 @@ class Statistics {
   public async $list2H(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = `SELECT *, UNIX_TIMESTAMP(added) as added FROM statistics ORDER BY id DESC LIMIT 120`;
+      const query = `SELECT *, UNIX_TIMESTAMP(added) as added FROM statistics ORDER BY statistics.added DESC LIMIT 120`;
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -394,7 +449,7 @@ class Statistics {
   public async $list24H(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDaysAvg(120, '1 DAY'); // 2m interval
+      const query = `SELECT *, UNIX_TIMESTAMP(added) as added FROM statistics ORDER BY statistics.added DESC LIMIT 1440`;
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -407,7 +462,7 @@ class Statistics {
   public async $list1W(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDaysAvg(600, '1 WEEK'); // 10m interval
+      const query = this.getQueryForDaysAvg(300, '1 WEEK'); // 5m interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -420,7 +475,7 @@ class Statistics {
   public async $list1M(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDaysAvg(3600, '1 MONTH'); // 1h interval
+      const query = this.getQueryForDaysAvg(1800, '1 MONTH'); // 30m interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -433,7 +488,7 @@ class Statistics {
   public async $list3M(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDaysAvg(14400, '3 MONTH'); // 4h interval
+      const query = this.getQueryForDaysAvg(7200, '3 MONTH'); // 2h interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -446,7 +501,7 @@ class Statistics {
   public async $list6M(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDaysAvg(21600, '6 MONTH'); // 6h interval 
+      const query = this.getQueryForDaysAvg(10800, '6 MONTH'); // 3h interval 
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -459,7 +514,7 @@ class Statistics {
   public async $list1Y(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDays(43200, '1 YEAR'); // 12h interval
+      const query = this.getQueryForDays(28800, '1 YEAR'); // 8h interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -472,7 +527,7 @@ class Statistics {
   public async $list2Y(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDays(86400, "2 YEAR"); // 1d interval
+      const query = this.getQueryForDays(28800, "2 YEAR"); // 8h interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -485,7 +540,7 @@ class Statistics {
   public async $list3Y(): Promise<OptimizedStatistic[]> {
     try {
       const connection = await DB.pool.getConnection();
-      const query = this.getQueryForDays(86400, "3 YEAR"); // 1d interval
+      const query = this.getQueryForDays(43200, "3 YEAR"); // 12h interval
       const [rows] = await connection.query<any>({ sql: query, timeout: this.queryTimeout });
       connection.release();
       return this.mapStatisticToOptimizedStatistic(rows);
@@ -498,10 +553,7 @@ class Statistics {
   private mapStatisticToOptimizedStatistic(statistic: Statistic[]): OptimizedStatistic[] {
     return statistic.map((s) => {
       return {
-        id: s.id || 0,
         added: s.added,
-        unconfirmed_transactions: s.unconfirmed_transactions,
-        tx_per_second: s.tx_per_second,
         vbytes_per_second: s.vbytes_per_second,
         mempool_byte_weight: s.mempool_byte_weight,
         total_fee: s.total_fee,

backend/src/api/transaction-utils.ts

@@ -2,6 +2,7 @@ import bitcoinApi from './bitcoin/bitcoin-api-factory';
 import { TransactionExtended, TransactionMinerInfo } from '../mempool.interfaces';
 import { IEsploraApi } from './bitcoin/esplora-api.interface';
 import config from '../config';
+import { Common } from './common';
 
 class TransactionUtils {
   constructor() { }
@@ -31,7 +32,8 @@ class TransactionUtils {
       // @ts-ignore
       return transaction;
     }
-    const feePerVbytes = Math.max(config.MEMPOOL.NETWORK === 'liquid' ? 0.1 : 1, (transaction.fee || 0) / (transaction.weight / 4));
+    const feePerVbytes = Math.max(Common.isLiquid() ? 0.1 : 1,
+      (transaction.fee || 0) / (transaction.weight / 4));
     const transactionExtended: TransactionExtended = Object.assign({
       vsize: Math.round(transaction.weight / 4),
       feePerVsize: feePerVbytes,
@@ -42,6 +44,14 @@ class TransactionUtils {
     }
     return transactionExtended;
   }
+
+  public hex2ascii(hex: string) {
+    let str = '';
+    for (let i = 0; i < hex.length; i += 2) {
+      str += String.fromCharCode(parseInt(hex.substr(i, 2), 16));
+    }
+    return str;
+  }
 }
 
 export default new TransactionUtils();

backend/src/config.ts

@@ -2,7 +2,7 @@ const configFile = require('../mempool-config.json');
 
 interface IConfig {
   MEMPOOL: {
-    NETWORK: 'mainnet' | 'testnet' | 'signet' | 'liquid';
+    NETWORK: 'mainnet' | 'testnet' | 'signet' | 'liquid' | 'liquidtestnet';
     BACKEND: 'esplora' | 'electrum' | 'none';
     HTTP_PORT: number;
     SPAWN_CLUSTER_PROCS: number;
@@ -14,8 +14,10 @@ interface IConfig {
     BLOCK_WEIGHT_UNITS: number;
     INITIAL_BLOCKS_AMOUNT: number;
     MEMPOOL_BLOCKS_AMOUNT: number;
+    INDEXING_BLOCKS_AMOUNT: number;
     PRICE_FEED_UPDATE_INTERVAL: number;
     USE_SECOND_NODE_FOR_MINFEE: boolean;
+    EXTERNAL_ASSETS: string[];
   };
   ESPLORA: {
     REST_API_URL: string;
@@ -76,8 +78,12 @@ const defaults: IConfig = {
     'BLOCK_WEIGHT_UNITS': 4000000,
     'INITIAL_BLOCKS_AMOUNT': 8,
     'MEMPOOL_BLOCKS_AMOUNT': 8,
+    'INDEXING_BLOCKS_AMOUNT': 1100, // 0 = disable indexing, -1 = index all blocks
     'PRICE_FEED_UPDATE_INTERVAL': 3600,
     'USE_SECOND_NODE_FOR_MINFEE': false,
+    'EXTERNAL_ASSETS': [
+      'https://mempool.space/resources/pools.json'
+    ]
   },
   'ESPLORA': {
     'REST_API_URL': 'http://127.0.0.1:3000',

backend/src/index.ts

@@ -22,6 +22,10 @@ import loadingIndicators from './api/loading-indicators';
 import mempool from './api/mempool';
 import elementsParser from './api/liquid/elements-parser';
 import databaseMigration from './api/database-migration';
+import poolsParser from './api/pools-parser';
+import syncAssets from './sync-assets';
+import icons from './api/liquid/icons';
+import { Common } from './api/common';
 
 class Server {
   private wss: WebSocket.Server | undefined;
@@ -78,12 +82,14 @@ class Server {
 
     this.setUpWebsocketHandling();
 
+    await syncAssets.syncAssets();
     diskCache.loadMempoolCache();
 
     if (config.DATABASE.ENABLED) {
       await checkDbConnection();
       try {
         await databaseMigration.$initializeOrMigrateDatabase();
+        await poolsParser.migratePoolsJson();
       } catch (e) {
         throw new Error(e instanceof Error ? e.message : 'Error');
       }
@@ -93,6 +99,10 @@ class Server {
       statistics.startStatistics();
     }
 
+    if (Common.isLiquid()) {
+      icons.loadIcons();
+    }
+
     fiatConversion.startService();
 
     this.setUpHttpApiRoutes();
@@ -128,6 +138,8 @@ class Server {
       }
       await blocks.$updateBlocks();
       await memPool.$updateMempool();
+      blocks.$generateBlockDatabase();
+
       setTimeout(this.runMainUpdateLoop.bind(this), config.MEMPOOL.POLL_RATE_MS);
       this.currentBackendRetryInterval = 5;
     } catch (e) {
@@ -149,7 +161,7 @@ class Server {
     if (this.wss) {
       websocketHandler.setWebsocketServer(this.wss);
     }
-    if (config.MEMPOOL.NETWORK === 'liquid' && config.DATABASE.ENABLED) {
+    if (Common.isLiquid() && config.DATABASE.ENABLED) {
       blocks.setNewBlockCallback(async () => {
         try {
           await elementsParser.$parse();
@@ -213,19 +225,38 @@ class Server {
           res.status(500).end();
         }
       })
+      .get(config.MEMPOOL.API_URL_PREFIX + 'translators', async (req, res) => {
+        try {
+          const response = await axios.get('https://mempool.space/api/v1/translators', { responseType: 'stream', timeout: 10000 });
+          response.data.pipe(res);
+        } catch (e) {
+          res.status(500).end();
+        }
+      })
+      .get(config.MEMPOOL.API_URL_PREFIX + 'translators/images/:id', async (req, res) => {
+        try {
+          const response = await axios.get('https://mempool.space/api/v1/translators/images/' + req.params.id, {
+            responseType: 'stream', timeout: 10000
+          });
+          response.data.pipe(res);
+        } catch (e) {
+          res.status(500).end();
+        }
+      })
     ;
 
     if (config.STATISTICS.ENABLED && config.DATABASE.ENABLED) {
       this.app
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/2h', routes.get2HStatistics)
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/24h', routes.get24HStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1w', routes.get1WHStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1m', routes.get1MStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/3m', routes.get3MStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/6m', routes.get6MStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1y', routes.get1YStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/2y', routes.get2YStatistics.bind(routes))
-        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/3y', routes.get3YStatistics.bind(routes))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/2h', routes.$getStatisticsByTime.bind(routes, '2h'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/24h', routes.$getStatisticsByTime.bind(routes, '24h'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1w', routes.$getStatisticsByTime.bind(routes, '1w'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1m', routes.$getStatisticsByTime.bind(routes, '1m'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/3m', routes.$getStatisticsByTime.bind(routes, '3m'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/6m', routes.$getStatisticsByTime.bind(routes, '6m'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/1y', routes.$getStatisticsByTime.bind(routes, '1y'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/2y', routes.$getStatisticsByTime.bind(routes, '2y'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'statistics/3y', routes.$getStatisticsByTime.bind(routes, '3y'))
+        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/pools', routes.$getPools)
         ;
     }
 
@@ -276,7 +307,14 @@ class Server {
       ;
     }
 
-    if (config.MEMPOOL.NETWORK === 'liquid' && config.DATABASE.ENABLED) {
+    if (Common.isLiquid()) {
+      this.app
+        .get(config.MEMPOOL.API_URL_PREFIX + 'assets/icons', routes.getAllLiquidIcon)
+        .get(config.MEMPOOL.API_URL_PREFIX + 'asset/:assetId/icon', routes.getLiquidIcon)
+      ;
+    }
+
+    if (Common.isLiquid() && config.DATABASE.ENABLED) {
       this.app
         .get(config.MEMPOOL.API_URL_PREFIX + 'liquid/pegs/month', routes.$getElementsPegsByMonth)
       ;

backend/src/mempool.interfaces.ts

@@ -1,5 +1,25 @@
 import { IEsploraApi } from './api/bitcoin/esplora-api.interface';
 
+export interface PoolTag {
+  id: number | null, // mysql row id
+  name: string,
+  link: string,
+  regexes: string, // JSON array
+  addresses: string, // JSON array
+}
+
+export interface PoolInfo {
+  poolId: number, // mysql row id
+  name: string,
+  link: string,
+  blockCount: number,
+}
+
+export interface PoolStats extends PoolInfo {
+  rank: number,
+  emptyBlocks: number,
+}
+
 export interface MempoolBlock {
   blockSize: number;
   blockVSize: number;
@@ -128,10 +148,7 @@ export interface Statistic {
 }
 
 export interface OptimizedStatistic {
-  id: number;
   added: string;
-  unconfirmed_transactions: number;
-  tx_per_second: number;
   vbytes_per_second: number;
   total_fee: number;
   mempool_byte_weight: number;

backend/src/repositories/BlocksRepository.ts

@@ -0,0 +1,128 @@
+import { BlockExtended, PoolTag } from '../mempool.interfaces';
+import { DB } from '../database';
+import logger from '../logger';
+
+export interface EmptyBlocks {
+  emptyBlocks: number;
+  poolId: number;
+}
+
+class BlocksRepository {
+  /**
+   * Save indexed block data in the database
+   */
+  public async $saveBlockInDatabase(
+    block: BlockExtended,
+    blockHash: string,
+    coinbaseHex: string | undefined,
+    poolTag: PoolTag
+  ) {
+    const connection = await DB.pool.getConnection();
+
+    try {
+      const query = `INSERT INTO blocks(
+        height,  hash,     blockTimestamp, size,
+        weight,  tx_count, coinbase_raw,   difficulty,
+        pool_id, fees,     fee_span,       median_fee
+      ) VALUE (
+        ?, ?, FROM_UNIXTIME(?), ?,
+        ?, ?, ?, ?,
+        ?, ?, ?, ?
+      )`;
+
+      const params: any[] = [
+        block.height, blockHash, block.timestamp, block.size,
+        block.weight, block.tx_count, coinbaseHex ? coinbaseHex : '', block.difficulty,
+        poolTag.id, 0, '[]', block.medianFee,
+      ];
+
+      await connection.query(query, params);
+    } catch (e) {
+      logger.err('$saveBlockInDatabase() error' + (e instanceof Error ? e.message : e));
+    }
+
+    connection.release();
+  }
+
+  /**
+   * Get all block height that have not been indexed between [startHeight, endHeight]
+   */
+  public async $getMissingBlocksBetweenHeights(startHeight: number, endHeight: number): Promise<number[]> {
+    if (startHeight < endHeight) {
+      return [];
+    }
+
+    const connection = await DB.pool.getConnection();
+    const [rows] : any[] = await connection.query(`
+      SELECT height
+      FROM blocks
+      WHERE height <= ${startHeight} AND height >= ${endHeight}
+      ORDER BY height DESC;
+    `);
+    connection.release();
+
+    const indexedBlockHeights: number[] = [];
+    rows.forEach((row: any) => { indexedBlockHeights.push(row.height); });
+    const seekedBlocks: number[] = Array.from(Array(startHeight - endHeight + 1).keys(), n => n + endHeight).reverse();
+    const missingBlocksHeights =  seekedBlocks.filter(x => indexedBlockHeights.indexOf(x) === -1);
+
+    return missingBlocksHeights;
+  }
+
+  /**
+   * Count empty blocks for all pools
+   */
+  public async $countEmptyBlocks(interval: string | null): Promise<EmptyBlocks[]> {
+    const query = `
+      SELECT pool_id as poolId
+      FROM blocks
+      WHERE tx_count = 1` +
+      (interval != null ? ` AND blockTimestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()` : ``)
+    ;
+
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query(query);
+    connection.release();
+
+    return <EmptyBlocks[]>rows;
+  }
+
+  /**
+   * Get blocks count for a period
+   */
+   public async $blockCount(interval: string | null): Promise<number> {
+    const query = `
+      SELECT count(height) as blockCount
+      FROM blocks` +
+      (interval != null ? ` WHERE blockTimestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()` : ``)
+    ;
+
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query(query);
+    connection.release();
+
+    return <number>rows[0].blockCount;
+  }
+
+  /**
+   * Get the oldest indexed block
+   */
+  public async $oldestBlockTimestamp(): Promise<number> {
+    const connection = await DB.pool.getConnection();
+    const [rows]: any[] = await connection.query(`
+      SELECT blockTimestamp
+      FROM blocks
+      ORDER BY height
+      LIMIT 1;
+    `);
+    connection.release();
+
+    if (rows.length <= 0) {
+      return -1;
+    }
+
+    return <number>rows[0].blockTimestamp;
+  }
+}
+
+export default new BlocksRepository();

backend/src/repositories/PoolsRepository.ts

@@ -0,0 +1,46 @@
+import { DB } from '../database';
+import { PoolInfo, PoolTag } from '../mempool.interfaces';
+
+class PoolsRepository {
+  /**
+   * Get all pools tagging info
+   */
+  public async $getPools(): Promise<PoolTag[]> {
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query('SELECT * FROM pools;');
+    connection.release();
+    return <PoolTag[]>rows;
+  }
+
+  /**
+   * Get unknown pool tagging info
+   */
+  public async $getUnknownPool(): Promise<PoolTag> {
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query('SELECT * FROM pools where name = "Unknown"');
+    connection.release();
+    return <PoolTag>rows[0];
+  }
+
+  /**
+   * Get basic pool info and block count
+   */
+  public async $getPoolsInfo(interval: string | null): Promise<PoolInfo[]> {
+    const query = `
+      SELECT COUNT(height) as blockCount, pool_id as poolId, pools.name as name, pools.link as link
+      FROM blocks
+      JOIN pools on pools.id = pool_id` +
+      (interval != null ? ` WHERE blocks.blockTimestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()` : ``) +
+      ` GROUP BY pool_id
+      ORDER BY COUNT(height) DESC
+    `;
+
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query(query);
+    connection.release();
+
+    return <PoolInfo[]>rows;
+  }
+}
+
+export default new PoolsRepository();

backend/src/routes.ts

@@ -19,45 +19,56 @@ import loadingIndicators from './api/loading-indicators';
 import { Common } from './api/common';
 import bitcoinClient from './api/bitcoin/bitcoin-client';
 import elementsParser from './api/liquid/elements-parser';
+import icons from './api/liquid/icons';
+import miningStats from './api/mining';
 
 class Routes {
   constructor() {}
 
-  public async get2HStatistics(req: Request, res: Response) {
-    const result = await statistics.$list2H();
-    res.json(result);
-  }
+  public async $getStatisticsByTime(time: '2h' | '24h' | '1w' | '1m' | '3m' | '6m' | '1y' | '2y' | '3y', req: Request, res: Response) {
+    res.header('Pragma', 'public');
+    res.header('Cache-control', 'public');
+    res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
 
-  public get24HStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['24h']);
-  }
-
-  public get1WHStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['1w']);
-  }
-
-  public get1MStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['1m']);
-  }
-
-  public get3MStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['3m']);
-  }
-
-  public get6MStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['6m']);
-  }
-
-  public get1YStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['1y']);
-  }
-
-  public get2YStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['2y']);
-  }
-  
-  public get3YStatistics(req: Request, res: Response) {
-    res.json(statistics.getCache()['3y']);
+    try {
+      let result;
+      switch (time as string) {
+        case '2h':
+          result = await statistics.$list2H();
+          res.setHeader('Expires', new Date(Date.now() + 1000 * 30).toUTCString());
+          break;
+        case '24h':
+          result = await statistics.$list24H();
+          res.setHeader('Expires', new Date(Date.now() + 1000 * 60).toUTCString());
+          break;
+        case '1w':
+          result = await statistics.$list1W();
+          break;
+        case '1m':
+          result = await statistics.$list1M();
+          break;
+        case '3m':
+          result = await statistics.$list3M();
+          break;
+        case '6m':
+          result = await statistics.$list6M();
+          break;
+        case '1y':
+          result = await statistics.$list1Y();
+          break;
+        case '2y':
+          result = await statistics.$list2Y();
+          break;
+        case '3y':
+          result = await statistics.$list3Y();
+          break;
+        default:
+          result = await statistics.$list2H();
+      }
+      res.json(result);
+    } catch (e) {
+      res.status(500).send(e instanceof Error ? e.message : e);
+    }
   }
 
   public getInitData(req: Request, res: Response) {
@@ -69,7 +80,7 @@ class Routes {
     }
   }
 
-  public async getRecommendedFees(req: Request, res: Response) {
+  public getRecommendedFees(req: Request, res: Response) {
     if (!mempool.isInSync()) {
       res.statusCode = 503;
       res.send('Service Unavailable');
@@ -521,6 +532,18 @@ class Routes {
     }
   }
 
+  public async $getPools(req: Request, res: Response) {
+    try {
+      let stats = await miningStats.$getPoolsStats(req.query.interval as string);
+      res.header('Pragma', 'public');
+      res.header('Cache-control', 'public');
+      res.setHeader('Expires', new Date(Date.now() + 1000 * 60).toUTCString());
+      res.json(stats);
+    } catch (e) {
+      res.status(500).send(e instanceof Error ? e.message : e);
+    }
+  }
+
   public async getBlock(req: Request, res: Response) {
     try {
       const result = await bitcoinApi.$getBlock(req.params.hash);
@@ -706,8 +729,13 @@ class Routes {
     }
   }
 
-  public getTransactionOutspends(req: Request, res: Response) {
-    res.status(501).send('Not implemented');
+  public async getTransactionOutspends(req: Request, res: Response) {
+    try {
+      const result = await bitcoinApi.$getOutspends(req.params.txId);
+      res.json(result);
+    } catch (e) {
+      res.status(500).send(e instanceof Error ? e.message : e);
+    }
   }
 
   public getDifficultyChange(req: Request, res: Response) {
@@ -807,6 +835,26 @@ class Routes {
         : (e.message || 'Error'));
     }
   }
+
+  public getLiquidIcon(req: Request, res: Response) {
+    const result = icons.getIconByAssetId(req.params.assetId);
+    if (result) {
+      res.setHeader('content-type', 'image/png');
+      res.setHeader('content-length', result.length);
+      res.send(result);
+    } else {
+      res.status(404).send('Asset icon not found');
+    }
+  }
+
+  public getAllLiquidIcon(req: Request, res: Response) {
+    const result = icons.getAllIconIds();
+    if (result) {
+      res.json(result);
+    } else {
+      res.status(404).send('Asset icons not found');
+    }
+  }
 }
 
 export default new Routes();

backend/src/sync-assets.ts

@@ -0,0 +1,32 @@
+import axios from 'axios';
+import * as fs from 'fs';
+const fsPromises = fs.promises;
+import config from './config';
+import logger from './logger';
+
+const PATH = './';
+
+class SyncAssets {
+  constructor() { }
+
+  public async syncAssets() {
+    for (const url of config.MEMPOOL.EXTERNAL_ASSETS) {
+      await this.downloadFile(url);
+    }
+  }
+
+  private async downloadFile(url: string) {
+    const fileName = url.split('/').slice(-1)[0];
+    logger.info(`Downloading external asset: ${fileName}...`);
+    try {
+      const response = await axios.get(url, {
+        responseType: 'stream', timeout: 30000
+      });
+      await fsPromises.writeFile(PATH + fileName, response.data);
+    } catch (e: any) {
+      throw new Error(`Failed to download external asset. ` + e);
+    }
+  }
+}
+
+export default new SyncAssets();

contributors/softsimon.txt

@@ -0,0 +1,3 @@
+I hereby accept the terms of the Contributor License Agreement in the CONTRIBUTING.md file of the mempool/mempool git repository as of January 25, 2022.
+
+Signed: softsimon

contributors/wiz.txt

@@ -0,0 +1,3 @@
+I hereby accept the terms of the Contributor License Agreement in the CONTRIBUTING.md file of the mempool/mempool git repository as of January 25, 2022.
+
+Signed: wiz

docker/README.md

@@ -1,101 +0,0 @@
-# Docker
-
-## Initialization
-
-In an empty dir create 2 sub-dirs
-
-```bash
-mkdir -p data mysql/data mysql/db-scripts
-```
-
-In the `mysql/db-scripts` sub-dir add the `mariadb-structure.sql` file from the mempool repo
-
-Your dir should now look like that:
-
-```bash
-$ls -R
-.:
-data mysql
-
-./data:
-
-./mysql:
-data  db-scripts
-
-./mysql/data:
-
-./mysql/db-scripts:
-mariadb-structure.sql
-```
-
-In the main dir add the following `docker-compose.yml`
-
-```bash
-version: "3.7"
-
-services:
-  web:
-    image: mempool/frontend:latest
-    user: "1000:1000"
-    restart: on-failure
-    stop_grace_period: 1m
-    command: "./wait-for db:3306 --timeout=720 -- nginx -g 'daemon off;'"
-    ports:
-      - 80:8080
-    environment:
-      FRONTEND_HTTP_PORT: "8080"
-      BACKEND_MAINNET_HTTP_HOST: "api"
-  api:
-    image: mempool/backend:latest
-    user: "1000:1000"
-    restart: on-failure
-    stop_grace_period: 1m
-    command: "./wait-for-it.sh db:3306 --timeout=720 --strict -- ./start.sh"
-    volumes:
-      - ./data:/backend/cache
-    environment:
-      RPC_HOST: "127.0.0.1"
-      RPC_PORT: "8332"
-      RPC_USER: "mempool"
-      RPC_PASS: "mempool"
-      ELECTRUM_HOST: "127.0.0.1"
-      ELECTRUM_PORT: "50002"
-      ELECTRUM_TLS: "false"
-      MYSQL_HOST: "db"
-      MYSQL_PORT: "3306"
-      MYSQL_DATABASE: "mempool"
-      MYSQL_USER: "mempool"
-      MYSQL_PASS: "mempool"
-      BACKEND_MAINNET_HTTP_PORT: "8999"
-      CACHE_DIR: "/backend/cache"
-      MEMPOOL_CLEAR_PROTECTION_MINUTES: "20"
-  db:
-    image: mariadb:10.5.8
-    user: "1000:1000"
-    restart: on-failure
-    stop_grace_period: 1m
-    volumes:
-      - ./mysql/data:/var/lib/mysql
-      - ./mysql/db-scripts:/docker-entrypoint-initdb.d
-    environment:
-      MYSQL_DATABASE: "mempool"
-      MYSQL_USER: "mempool"
-      MYSQL_PASSWORD: "mempool"
-      MYSQL_ROOT_PASSWORD: "admin"
-
-```
-
-You can update all the environment variables inside the API container, especially the RPC and ELECTRUM ones
-
-## Run it
-
-To run our docker-compose use the following cmd:
-
-```bash
-docker-compose up
-```
-
-If everything went okay you should see the beautiful mempool :grin:
-
-If you get stuck on "loading blocks", this means the websocket can't connect.
-Check your nginx proxy setup, firewalls, etc. and open an issue if you need help.

docker/backend/mempool-config.json

@@ -1,38 +1,62 @@
 {
   "MEMPOOL": {
-    "NETWORK": "mainnet",
-    "BACKEND": "electrum",
-    "HTTP_PORT": __MEMPOOL_BACKEND_MAINNET_HTTP_PORT__,
-    "SPAWN_CLUSTER_PROCS": 0,
-    "API_URL_PREFIX": "/api/v1/",
-    "POLL_RATE_MS": 2000,
-    "CACHE_DIR": "__MEMPOOL_BACKEND_MAINNET_CACHE_DIR__",
-    "CLEAR_PROTECTION_MINUTES": __MEMPOOL_BACKEND_CLEAR_PROTECTION_MINUTES__
+    "NETWORK": "__MEMPOOL_NETWORK__",
+    "BACKEND": "__MEMPOOL_BACKEND__",
+    "HTTP_PORT": __MEMPOOL_HTTP_PORT__,
+    "SPAWN_CLUSTER_PROCS": __MEMPOOL_SPAWN_CLUSTER_PROCS__,
+    "API_URL_PREFIX": "__MEMPOOL_API_URL_PREFIX__",
+    "POLL_RATE_MS": __MEMPOOL_POLL_RATE_MS__,
+    "CACHE_DIR": "__MEMPOOL_CACHE_DIR__",
+    "CLEAR_PROTECTION_MINUTES": __MEMPOOL_CLEAR_PROTECTION_MINUTES__,
+    "RECOMMENDED_FEE_PERCENTILE": __MEMPOOL_RECOMMENDED_FEE_PERCENTILE__,
+    "BLOCK_WEIGHT_UNITS": __MEMPOOL_BLOCK_WEIGHT_UNITS__,
+    "INITIAL_BLOCKS_AMOUNT": __MEMPOOL_INITIAL_BLOCKS_AMOUNT__,
+    "MEMPOOL_BLOCKS_AMOUNT": __MEMPOOL_MEMPOOL_BLOCKS_AMOUNT__,
+    "PRICE_FEED_UPDATE_INTERVAL": __MEMPOOL_PRICE_FEED_UPDATE_INTERVAL__,
+    "USE_SECOND_NODE_FOR_MINFEE": __MEMPOOL_USE_SECOND_NODE_FOR_MINFEE__,
+    "EXTERNAL_ASSETS": __MEMPOOL_EXTERNAL_ASSETS__
   },
   "CORE_RPC": {
-    "HOST": "__BITCOIN_MAINNET_RPC_HOST__",
-    "PORT": __BITCOIN_MAINNET_RPC_PORT__,
-    "USERNAME": "__BITCOIN_MAINNET_RPC_USER__",
-    "PASSWORD": "__BITCOIN_MAINNET_RPC_PASS__"
+    "HOST": "__CORE_RPC_HOST__",
+    "PORT": __CORE_RPC_PORT__,
+    "USERNAME": "__CORE_RPC_USERNAME__",
+    "PASSWORD": "__CORE_RPC_PASSWORD__"
   },
   "ELECTRUM": {
-    "HOST": "__ELECTRUM_MAINNET_HTTP_HOST__",
-    "PORT": __ELECTRUM_MAINNET_HTTP_PORT__,
-    "TLS_ENABLED": __ELECTRUM_MAINNET_TLS_ENABLED__
+    "HOST": "__ELECTRUM_HOST__",
+    "PORT": __ELECTRUM_PORT__,
+    "TLS_ENABLED": __ELECTRUM_TLS_ENABLED__
   },
   "ESPLORA": {
-    "REST_API_URL": "http://127.0.0.1:3000"
+    "REST_API_URL": "__ESPLORA_REST_API_URL__"
+  },
+  "SECOND_CORE_RPC": {
+    "HOST": "__SECOND_CORE_RPC_HOST__",
+    "PORT": __SECOND_CORE_RPC_PORT__,
+    "USERNAME": "__SECOND_CORE_RPC_USERNAME__",
+    "PASSWORD": "__SECOND_CORE_RPC_PASSWORD__"
   },
   "DATABASE": {
-    "ENABLED": true,
-    "HOST": "__MYSQL_HOST__",
-    "PORT": __MYSQL_PORT__,
-    "DATABASE": "__MYSQL_DATABASE__",
-    "USERNAME": "__MYSQL_USERNAME__",
-    "PASSWORD": "__MYSQL_PASSWORD__"
+    "ENABLED": __DATABASE_ENABLED__,
+    "HOST": "__DATABASE_HOST__",
+    "PORT": __DATABASE_PORT__,
+    "DATABASE": "__DATABASE_DATABASE__",
+    "USERNAME": "__DATABASE_USERNAME__",
+    "PASSWORD": "__DATABASE_PASSWORD__"
+  },
+  "SYSLOG": {
+    "ENABLED": __SYSLOG_ENABLED__,
+    "HOST": "__SYSLOG_HOST__",
+    "PORT": __SYSLOG_PORT__,
+    "MIN_PRIORITY": "__SYSLOG_MIN_PRIORITY__",
+    "FACILITY": "__SYSLOG_FACILITY__"
   },
   "STATISTICS": {
-    "ENABLED": true,
-    "TX_PER_SECOND_SAMPLE_PERIOD": 150
+    "ENABLED": __STATISTICS_ENABLED__,
+    "TX_PER_SECOND_SAMPLE_PERIOD": __STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD__
+  },
+  "BISQ": {
+    "ENABLED": __BISQ_ENABLED__,
+    "DATA_PATH": "__BISQ_DATA_PATH__"
   }
 }

docker/backend/start.sh

@@ -1,41 +1,118 @@
 #!/bin/sh
 
-#MEMPOOL
-__MEMPOOL_BACKEND_MAINNET_HTTP_PORT__=${BACKEND_MAINNET_HTTP_PORT:=8999}
-__MEMPOOL_BACKEND_MAINNET_CACHE_DIR__=${CACHE_DIR:=./cache}
-__MEMPOOL_BACKEND_CLEAR_PROTECTION_MINUTES__=${MEMPOOL_CLEAR_PROTECTION_MINUTES:=20}
-# BITCOIN
-__BITCOIN_MAINNET_RPC_HOST__=${RPC_HOST:=127.0.0.1}
-__BITCOIN_MAINNET_RPC_PORT__=${RPC_PORT:=8332}
-__BITCOIN_MAINNET_RPC_USER__=${RPC_USER:=mempool}
-__BITCOIN_MAINNET_RPC_PASS__=${RPC_PASS:=mempool}
+# MEMPOOL
+__MEMPOOL_NETWORK__=${MEMPOOL_NETWORK:=mainnet}
+__MEMPOOL_BACKEND__=${MEMPOOL_BACKEND:=electrum}
+__MEMPOOL_HTTP_PORT__=${BACKEND_HTTP_PORT:=8999}
+__MEMPOOL_SPAWN_CLUSTER_PROCS__=${MEMPOOL_SPAWN_CLUSTER_PROCS:=0}
+__MEMPOOL_API_URL_PREFIX__=${MEMPOOL_API_URL_PREFIX:=/api/v1/}
+__MEMPOOL_POLL_RATE_MS__=${MEMPOOL_POLL_RATE_MS:=2000}
+__MEMPOOL_CACHE_DIR__=${MEMPOOL_CACHE_DIR:=./cache}
+__MEMPOOL_CLEAR_PROTECTION_MINUTES__=${MEMPOOL_CLEAR_PROTECTION_MINUTES:=20}
+__MEMPOOL_RECOMMENDED_FEE_PERCENTILE__=${MEMPOOL_RECOMMENDED_FEE_PERCENTILE:=50}
+__MEMPOOL_BLOCK_WEIGHT_UNITS__=${MEMPOOL_BLOCK_WEIGHT_UNITS:=4000000}
+__MEMPOOL_INITIAL_BLOCKS_AMOUNT__=${MEMPOOL_INITIAL_BLOCKS_AMOUNT:=8}
+__MEMPOOL_MEMPOOL_BLOCKS_AMOUNT__=${MEMPOOL_MEMPOOL_BLOCKS_AMOUNT:=8}
+__MEMPOOL_INDEXING_BLOCKS_AMOUNT__=${MEMPOOL_INDEXING_BLOCKS_AMOUNT:=1100}
+__MEMPOOL_PRICE_FEED_UPDATE_INTERVAL__=${MEMPOOL_PRICE_FEED_UPDATE_INTERVAL:=3600}
+__MEMPOOL_USE_SECOND_NODE_FOR_MINFEE__=${MEMPOOL_USE_SECOND_NODE_FOR_MINFEE:=false}
+__MEMPOOL_EXTERNAL_ASSETS__=${MEMPOOL_EXTERNAL_ASSETS:=[]}
+
+# CORE_RPC
+__CORE_RPC_HOST__=${CORE_RPC_HOST:=127.0.0.1}
+__CORE_RPC_PORT__=${CORE_RPC_PORT:=8332}
+__CORE_RPC_USERNAME__=${CORE_RPC_USERNAME:=mempool}
+__CORE_RPC_PASSWORD__=${CORE_RPC_PASSWORD:=mempool}
+
 # ELECTRUM
-__ELECTRUM_MAINNET_HTTP_HOST__=${ELECTRUM_HOST:=127.0.0.1}
-__ELECTRUM_MAINNET_HTTP_PORT__=${ELECTRUM_PORT:=50002} # 50001?
-__ELECTRUM_MAINNET_TLS_ENABLED__=${ELECTRUM_TLS:=false}
-# MYSQL
-__MYSQL_HOST__=${MYSQL_HOST:=127.0.0.1}
-__MYSQL_PORT__=${MYSQL_PORT:=3306}
-__MYSQL_DATABASE__=${MYSQL_DATABASE:=mempool}
-__MYSQL_USERNAME__=${MYSQL_USER:=mempool}
-__MYSQL_PASSWORD__=${MYSQL_PASS:=mempool}
+__ELECTRUM_HOST__=${ELECTRUM_HOST:=127.0.0.1}
+__ELECTRUM_PORT__=${ELECTRUM_PORT:=50002}
+__ELECTRUM_TLS_ENABLED__=${ELECTRUM_TLS:=false}
 
-mkdir -p "${__MEMPOOL_BACKEND_MAINNET_CACHE_DIR__}"
+# ESPLORA
+__ESPLORA_REST_API_URL__=${ESPLORA_REST_API_URL:=http://127.0.0.1:3000}
 
-sed -i "s/__BITCOIN_MAINNET_RPC_HOST__/${__BITCOIN_MAINNET_RPC_HOST__}/g" mempool-config.json
-sed -i "s/__BITCOIN_MAINNET_RPC_PORT__/${__BITCOIN_MAINNET_RPC_PORT__}/g" mempool-config.json
-sed -i "s/__BITCOIN_MAINNET_RPC_USER__/${__BITCOIN_MAINNET_RPC_USER__}/g" mempool-config.json
-sed -i "s/__BITCOIN_MAINNET_RPC_PASS__/${__BITCOIN_MAINNET_RPC_PASS__}/g" mempool-config.json
-sed -i "s/__ELECTRUM_MAINNET_HTTP_HOST__/${__ELECTRUM_MAINNET_HTTP_HOST__}/g" mempool-config.json
-sed -i "s/__ELECTRUM_MAINNET_HTTP_PORT__/${__ELECTRUM_MAINNET_HTTP_PORT__}/g" mempool-config.json
-sed -i "s/__ELECTRUM_MAINNET_TLS_ENABLED__/${__ELECTRUM_MAINNET_TLS_ENABLED__}/g" mempool-config.json
-sed -i "s/__MYSQL_HOST__/${__MYSQL_HOST__}/g" mempool-config.json
-sed -i "s/__MYSQL_PORT__/${__MYSQL_PORT__}/g" mempool-config.json
-sed -i "s/__MYSQL_DATABASE__/${__MYSQL_DATABASE__}/g" mempool-config.json
-sed -i "s/__MYSQL_USERNAME__/${__MYSQL_USERNAME__}/g" mempool-config.json
-sed -i "s/__MYSQL_PASSWORD__/${__MYSQL_PASSWORD__}/g" mempool-config.json
-sed -i "s!__MEMPOOL_BACKEND_MAINNET_CACHE_DIR__!${__MEMPOOL_BACKEND_MAINNET_CACHE_DIR__}!g" mempool-config.json
-sed -i "s/__MEMPOOL_BACKEND_MAINNET_HTTP_PORT__/${__MEMPOOL_BACKEND_MAINNET_HTTP_PORT__}/g" mempool-config.json
-sed -i "s/__MEMPOOL_BACKEND_CLEAR_PROTECTION_MINUTES__/${__MEMPOOL_BACKEND_CLEAR_PROTECTION_MINUTES__}/g" mempool-config.json
+# SECOND_CORE_RPC
+__SECOND_CORE_RPC_HOST__=${SECOND_CORE_RPC_HOST:=127.0.0.1}
+__SECOND_CORE_RPC_PORT__=${SECOND_CORE_RPC_PORT:=8332}
+__SECOND_CORE_RPC_USERNAME__=${SECOND_CORE_RPC_USERNAME:=mempool}
+__SECOND_CORE_RPC_PASSWORD__=${SECOND_CORE_RPC_PASSWORD:=mempool}
+
+# DATABASE
+__DATABASE_ENABLED__=${DATABASE_ENABLED:=true}
+__DATABASE_HOST__=${DATABASE_HOST:=127.0.0.1}
+__DATABASE_PORT__=${DATABASE_PORT:=3306}
+__DATABASE_DATABASE__=${DATABASE_DATABASE:=mempool}
+__DATABASE_USERNAME__=${DATABASE_USERNAME:=mempool}
+__DATABASE_PASSWORD__=${DATABASE_PASSWORD:=mempool}
+
+# SYSLOG
+__SYSLOG_ENABLED__=${SYSLOG_ENABLED:=false}
+__SYSLOG_HOST__=${SYSLOG_HOST:=127.0.0.1}
+__SYSLOG_PORT__=${SYSLOG_PORT:=514}
+__SYSLOG_MIN_PRIORITY__=${SYSLOG_MIN_PRIORITY:=info}
+__SYSLOG_FACILITY__=${SYSLOG_FACILITY:=local7}
+
+# STATISTICS
+__STATISTICS_ENABLED__=${STATISTICS_ENABLED:=true}
+__STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD__=${STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD:=150}
+
+# BISQ
+__BISQ_ENABLED__=${BISQ_ENABLED:=false}
+__BISQ_DATA_PATH__=${BISQ_DATA_PATH:=/bisq/statsnode-data/btc_mainnet/db}
+
+mkdir -p "${__MEMPOOL_CACHE_DIR__}"
+
+sed -i "s/__MEMPOOL_NETWORK__/${__MEMPOOL_NETWORK__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_BACKEND__/${__MEMPOOL_BACKEND__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_HTTP_PORT__/${__MEMPOOL_HTTP_PORT__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_SPAWN_CLUSTER_PROCS__/${__MEMPOOL_SPAWN_CLUSTER_PROCS__}/g" mempool-config.json
+sed -i "s!__MEMPOOL_API_URL_PREFIX__!${__MEMPOOL_API_URL_PREFIX__}!g" mempool-config.json
+sed -i "s/__MEMPOOL_POLL_RATE_MS__/${__MEMPOOL_POLL_RATE_MS__}/g" mempool-config.json
+sed -i "s!__MEMPOOL_CACHE_DIR__!${__MEMPOOL_CACHE_DIR__}!g" mempool-config.json
+sed -i "s/__MEMPOOL_CLEAR_PROTECTION_MINUTES__/${__MEMPOOL_CLEAR_PROTECTION_MINUTES__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_RECOMMENDED_FEE_PERCENTILE__/${__MEMPOOL_RECOMMENDED_FEE_PERCENTILE__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_BLOCK_WEIGHT_UNITS__/${__MEMPOOL_BLOCK_WEIGHT_UNITS__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_INITIAL_BLOCKS_AMOUNT__/${__MEMPOOL_INITIAL_BLOCKS_AMOUNT__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_MEMPOOL_BLOCKS_AMOUNT__/${__MEMPOOL_MEMPOOL_BLOCKS_AMOUNT__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_INDEXING_BLOCKS_AMOUNT__/${__MEMPOOL_INDEXING_BLOCKS_AMOUNT__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_PRICE_FEED_UPDATE_INTERVAL__/${__MEMPOOL_PRICE_FEED_UPDATE_INTERVAL__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_USE_SECOND_NODE_FOR_MINFEE__/${__MEMPOOL_USE_SECOND_NODE_FOR_MINFEE__}/g" mempool-config.json
+sed -i "s/__MEMPOOL_EXTERNAL_ASSETS__/${__MEMPOOL_EXTERNAL_ASSETS__}/g" mempool-config.json
+
+sed -i "s/__CORE_RPC_HOST__/${__CORE_RPC_HOST__}/g" mempool-config.json
+sed -i "s/__CORE_RPC_PORT__/${__CORE_RPC_PORT__}/g" mempool-config.json
+sed -i "s/__CORE_RPC_USERNAME__/${__CORE_RPC_USERNAME__}/g" mempool-config.json
+sed -i "s/__CORE_RPC_PASSWORD__/${__CORE_RPC_PASSWORD__}/g" mempool-config.json
+
+sed -i "s/__ELECTRUM_HOST__/${__ELECTRUM_HOST__}/g" mempool-config.json
+sed -i "s/__ELECTRUM_PORT__/${__ELECTRUM_PORT__}/g" mempool-config.json
+sed -i "s/__ELECTRUM_TLS_ENABLED__/${__ELECTRUM_TLS_ENABLED__}/g" mempool-config.json
+
+sed -i "s!__ESPLORA_REST_API_URL__!${__ESPLORA_REST_API_URL__}!g" mempool-config.json
+
+sed -i "s/__SECOND_CORE_RPC_HOST__/${__SECOND_CORE_RPC_HOST__}/g" mempool-config.json
+sed -i "s/__SECOND_CORE_RPC_PORT__/${__SECOND_CORE_RPC_PORT__}/g" mempool-config.json
+sed -i "s/__SECOND_CORE_RPC_USERNAME__/${__SECOND_CORE_RPC_USERNAME__}/g" mempool-config.json
+sed -i "s/__SECOND_CORE_RPC_PASSWORD__/${__SECOND_CORE_RPC_PASSWORD__}/g" mempool-config.json
+
+sed -i "s/__DATABASE_ENABLED__/${__DATABASE_ENABLED__}/g" mempool-config.json
+sed -i "s/__DATABASE_HOST__/${__DATABASE_HOST__}/g" mempool-config.json
+sed -i "s/__DATABASE_PORT__/${__DATABASE_PORT__}/g" mempool-config.json
+sed -i "s/__DATABASE_DATABASE__/${__DATABASE_DATABASE__}/g" mempool-config.json
+sed -i "s/__DATABASE_USERNAME__/${__DATABASE_USERNAME__}/g" mempool-config.json
+sed -i "s/__DATABASE_PASSWORD__/${__DATABASE_PASSWORD__}/g" mempool-config.json
+
+sed -i "s/__SYSLOG_ENABLED__/${__SYSLOG_ENABLED__}/g" mempool-config.json
+sed -i "s/__SYSLOG_HOST__/${__SYSLOG_HOST__}/g" mempool-config.json
+sed -i "s/__SYSLOG_PORT__/${__SYSLOG_PORT__}/g" mempool-config.json
+sed -i "s/__SYSLOG_MIN_PRIORITY__/${__SYSLOG_MIN_PRIORITY__}/g" mempool-config.json
+sed -i "s/__SYSLOG_FACILITY__/${__SYSLOG_FACILITY__}/g" mempool-config.json
+
+sed -i "s/__STATISTICS_ENABLED__/${__STATISTICS_ENABLED__}/g" mempool-config.json
+sed -i "s/__STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD__/${__STATISTICS_TX_PER_SECOND_SAMPLE_PERIOD__}/g" mempool-config.json
+
+sed -i "s/__BISQ_ENABLED__/${__BISQ_ENABLED__}/g" mempool-config.json
+sed -i "s!__BISQ_DATA_PATH__!${__BISQ_DATA_PATH__}!g" mempool-config.json
 
 node /backend/dist/index.js

docker/docker-compose.yml

@@ -1,23 +1,10 @@
 version: "3.7"
 
 services:
-
-  electrum:
-    build:
-      context: .
-      dockerfile: docker/electrum/Dockerfile
-    user: "1000:1000"
-    restart: on-failure
-    command: ""
-    ports:
-      - 50001:50001
-      - 50002:50002
-      - 4224:4224
-      - 8332:8332
-    environment:
-      ELECTRUM: "electrum"
-      # add electrs configs
   web:
+    environment:
+      FRONTEND_HTTP_PORT: "8080"
+      BACKEND_MAINNET_HTTP_HOST: "api"
     image: mempool/frontend:latest
     user: "1000:1000"
     restart: on-failure
@@ -25,10 +12,19 @@ services:
     command: "./wait-for db:3306 --timeout=720 -- nginx -g 'daemon off;'"
     ports:
       - 80:8080
-    environment:
-      FRONTEND_HTTP_PORT: "8080"
-      BACKEND_MAINNET_HTTP_HOST: "api"
   api:
+    environment:
+      MEMPOOL_BACKEND: "none"
+      CORE_RPC_HOST: "172.27.0.1"
+      CORE_RPC_PORT: "8332"
+      CORE_RPC_USERNAME: "mempool"
+      CORE_RPC_PASSWORD: "mempool"
+      DATABASE_ENABLED: "true"
+      DATABASE_HOST: "db"
+      DATABASE_DATABASE: "mempool"
+      DATABASE_USERNAME: "mempool"
+      DATABASE_PASSWORD: "mempool"
+      STATISTICS_ENABLED: "true"
     image: mempool/backend:latest
     user: "1000:1000"
     restart: on-failure
@@ -36,32 +32,15 @@ services:
     command: "./wait-for-it.sh db:3306 --timeout=720 --strict -- ./start.sh"
     volumes:
       - ./data:/backend/cache
+  db:
     environment:
-      RPC_HOST: "127.0.0.1"
-      RPC_PORT: "8332"
-      RPC_USER: "mempool"
-      RPC_PASS: "mempool"
-      ELECTRUM_HOST: "127.0.0.1"
-      ELECTRUM_PORT: "50002"
-      ELECTRUM_TLS: "false"
-      MYSQL_HOST: "db"
-      MYSQL_PORT: "3306"
       MYSQL_DATABASE: "mempool"
       MYSQL_USER: "mempool"
-      MYSQL_PASS: "mempool"
-      BACKEND_MAINNET_HTTP_PORT: "8999"
-      CACHE_DIR: "/backend/cache"
-      MEMPOOL_CLEAR_PROTECTION_MINUTES: "20"
-  db:
+      MYSQL_PASSWORD: "mempool"
+      MYSQL_ROOT_PASSWORD: "admin"
     image: mariadb:10.5.8
     user: "1000:1000"
     restart: on-failure
     stop_grace_period: 1m
     volumes:
       - ./mysql/data:/var/lib/mysql
-      - ./mysql/db-scripts:/docker-entrypoint-initdb.d
-    environment:
-      MYSQL_DATABASE: "mempool"
-      MYSQL_USER: "mempool"
-      MYSQL_PASSWORD: "mempool"
-      MYSQL_ROOT_PASSWORD: "admin"

docker/init.sh

@@ -2,7 +2,7 @@
 
 #backend
 gitMaster="\.\.\/\.git\/refs\/heads\/master"
-git ls-remote https://github.com/mempool/mempool.git $1 | awk '{ print $1}' > ./backend/master
+git ls-remote https://github.com/mempool/mempool.git "$1^{}" | awk '{ print $1}' > ./backend/master
 cp ./docker/backend/* ./backend/
 sed -i "s/${gitMaster}/master/g" ./backend/src/api/backend-info.ts
 

frontend/.gitignore

@@ -50,6 +50,8 @@ Thumbs.db
 
 src/resources/assets.json
 src/resources/assets.minimal.json
+src/resources/assets-testnet.json
+src/resources/assets-testnet.minimal.json
 src/resources/pools.json
 
 # environment config

frontend/cypress/fixtures/pools.json

@@ -421,7 +421,7 @@
             "link" : "http://www.dpool.top/"
         },
         "/Rawpool.com/": {
-            "name" : "Rawpool.com",
+            "name" : "Rawpool",
             "link" : "https://www.rawpool.com/"
         },
         "/haominer/": {
@@ -488,10 +488,14 @@
             "name" : "Binance Pool",
             "link" : "https://pool.binance.com/"
         },
-        "/Minerium.com/" : {
+        "/Mined in the USA by: /Minerium.com/" : {
             "name" : "Minerium",
             "link" : "https://www.minerium.com/"
         },
+        "/Minerium.com/" : {
+            "name" : "Minerium",
+            "link" : "https://www.minerium.com/"
+        },        
         "/Buffett/": {
             "name" : "Lubian.com",
             "link" : ""
@@ -504,15 +508,15 @@
             "name" : "OKKONG",
             "link" : "https://hash.okkong.com"
         },
-        "/TMSPOOL/" : {
-            "name" : "TMSPool",
+        "/AAOPOOL/" : {
+            "name" : "AAO Pool",
             "link" : "https://btc.tmspool.top"
         },
         "/one_more_mcd/" : {
             "name" : "EMCDPool",
             "link" : "https://pool.emcd.io"
         },
-        "/Foundry USA Pool #dropgold/" : {
+        "Foundry USA Pool" : {
             "name" : "Foundry USA",
             "link" : "https://foundrydigital.com/"
         },
@@ -539,9 +543,29 @@
         "/PureBTC.COM/": {
             "name": "PureBTC.COM",
             "link": "https://purebtc.com"
+        },
+        "MARA Pool": {
+            "name": "MARA Pool",
+            "link": "https://marapool.com"
+        },
+        "KuCoinPool": {
+            "name": "KuCoinPool",
+            "link": "https://www.kucoin.com/mining-pool/"
+        },
+        "Entrustus" : {
+            "name": "Entrust Charity Pool",
+            "link": "pool.entustus.org"
         }
     },
     "payout_addresses" : {
+        "1MkCDCzHpBsYQivp8MxjY5AkTGG1f2baoe": {
+            "name": "Luxor",
+            "link": "https://mining.luxor.tech"
+        },
+        "1ArTPjj6pV3aNRhLPjJVPYoxB98VLBzUmb": {
+            "name" : "KuCoinPool",
+            "link" : "https://www.kucoin.com/mining-pool/"
+         },
         "3Bmb9Jig8A5kHdDSxvDZ6eryj3AXd3swuJ": {
             "name" : "NovaBlock",
             "link" : "https://novablock.com"
@@ -606,7 +630,7 @@
             "name" : "BitMinter",
             "link" : "http://bitminter.com/"
         },
-        "15xiShqUqerfjFdyfgBH1K7Gwp6cbYmsTW " : {
+        "15xiShqUqerfjFdyfgBH1K7Gwp6cbYmsTW" : {
             "name" : "EclipseMC",
             "link" : "https://eclipsemc.com/"
         },
@@ -634,6 +658,14 @@
             "name" : "Huobi.pool",
             "link" : "https://www.hpt.com/"
         },
+        "1BDbsWi3Mrcjp1wdop3PWFNCNZtu4R7Hjy" : {
+            "name" : "EMCDPool",
+            "link" : "https://pool.emcd.io"
+        },
+        "12QVFmJH2b4455YUHkMpEnWLeRY3eJ4Jb5" : {
+            "name" : "AAO Pool",
+            "link" : "https://btc.tmspool.top "
+        },
         "1ALA5v7h49QT7WYLcRsxcXqXUqEqaWmkvw" : {
             "name" : "CloudHashing",
             "link" : "https://cloudhashing.com/"
@@ -915,7 +947,7 @@
             "link" : "http://www.dpool.top/"
         },
         "1FbBbv5oYqFKwiPm4CAqvAy8345n8AQ74b" : {
-            "name" : "Rawpool.com",
+            "name" : "Rawpool",
             "link" : "https://www.rawpool.com/"
         },
         "1LsFmhnne74EmU4q4aobfxfrWY4wfMVd8w" : {
@@ -934,6 +966,22 @@
             "name" : "Poolin",
             "link" : "https://www.poolin.com/"
         },
+        "1E8CZo2S3CqWg1VZSJNFCTbtT8hZPuQ2kB" : {
+            "name" : "Poolin",
+            "link" : "https://www.poolin.com/"
+        },
+        "14sA8jqYQgMRQV9zUtGFvpeMEw7YDn77SK" : {
+            "name" : "Poolin",
+            "link" : "https://www.poolin.com/"
+        },
+        "1GNgwA8JfG7Kc8akJ8opdNWJUihqUztfPe" : {
+            "name" : "Poolin",
+            "link" : "https://www.poolin.com/"
+        },
+        "17tUZLvy3X2557JGhceXRiij2TNYuhRr4r" : {
+            "name" : "Poolin",
+            "link" : "https://www.poolin.com/"
+        },
         "12Taz8FFXQ3E2AGn3ZW1SZM5bLnYGX4xR6" : {
             "name" : "Tangpool",
             "link" : "http://www.tangpool.com/"
@@ -1126,6 +1174,10 @@
             "name" : "Binance Pool",
             "link" : "https://pool.binance.com/"
         },
+        "1JvXhnHCi6XqcanvrZJ5s2Qiv4tsmm2UMy": {
+            "name" : "Binance Pool",
+            "link" : "https://pool.binance.com/"
+        },
         "34Jpa4Eu3ApoPVUKNTN2WeuXVVq1jzxgPi": {
             "name" : "Lubian.com",
             "link" : "http://www.lubian.com/"
@@ -1173,6 +1225,14 @@
         "3CLigLYNkrtoNgNcUwTaKoUSHCwr9W851W": {
             "name": "Rawpool",
             "link": "https://www.rawpool.com"
+        },
+        "bc1qf274x7penhcd8hsv3jcmwa5xxzjl2a6pa9pxwm": {
+            "name" : "F2Pool",
+            "link" : "https://www.f2pool.com/"
+        },
+        "1A32KFEX7JNPmU1PVjrtiXRrTQcesT3Nf1": {
+            "name": "MARA Pool",
+            "link": "https://marapool.com"
         }
     }
-}
+}

frontend/cypress/integration/bisq/bisq.spec.ts

@@ -1,88 +1,163 @@
 describe('Bisq', () => {
-    const baseModule = Cypress.env("BASE_MODULE");
-    const basePath = (baseModule === 'bisq') ? '' : '/bisq';
-    
-    beforeEach(() => {
-        cy.intercept('/sockjs-node/info*').as('socket');
-        cy.intercept('/bisq/api/markets/hloc?market=btc_usd&interval=day').as('hloc');
-        cy.intercept('/bisq/api/markets/ticker').as('ticker');
-        cy.intercept('/bisq/api/markets/markets').as('markets');
-        cy.intercept('/bisq/api/markets/volumes/7d').as('7d');
-        cy.intercept('/bisq/api/markets/trades?market=all').as('trades');
-        cy.intercept('/bisq/api/txs/*/*').as('txs');
-        cy.intercept('/bisq/api/blocks/*/*').as('blocks');
-        cy.intercept('/bisq/api/stats').as('stats');
-        
-        Cypress.Commands.add('waitForDashboard', () => {
-            cy.wait('@socket');
-            cy.wait('@hloc');
-            cy.wait('@ticker');
-            cy.wait('@markets');
-            cy.wait('@7d');
-            cy.wait('@trades');
-          });
+  const baseModule = Cypress.env("BASE_MODULE");
+  const basePath = '';
+
+  beforeEach(() => {
+    cy.intercept('/sockjs-node/info*').as('socket');
+    cy.intercept('/bisq/api/markets/hloc?market=btc_usd&interval=day').as('hloc');
+    cy.intercept('/bisq/api/markets/ticker').as('ticker');
+    cy.intercept('/bisq/api/markets/markets').as('markets');
+    cy.intercept('/bisq/api/markets/volumes/7d').as('7d');
+    cy.intercept('/bisq/api/markets/trades?market=all').as('trades');
+    cy.intercept('/bisq/api/txs/*/*').as('txs');
+    cy.intercept('/bisq/api/blocks/*/*').as('blocks');
+    cy.intercept('/bisq/api/stats').as('stats');
+  });
+
+  if (baseModule === 'bisq') {
+    it('loads the dashboard', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
     });
 
-    if (baseModule === 'mempool' || baseModule === 'bisq') {
-
-        it('loads the dashboard', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
+    describe("transactions", () => {
+      it('loads the transactions screen', () => {
+        cy.visit(`${basePath}`);
+        cy.waitForSkeletonGone();
+        cy.get('#btn-transactions').click().then(() => {
+          cy.get('.table > tr').should('have.length', 50);
         });
+      });
 
-        it('loads the transactions screen', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(2) > a').click().then(() => {
-                cy.get('.table > tr').should('have.length', 50);
-            });
+      const filters = [
+        "Asset listing fee", "Blind vote", "Compensation request",
+        "Genesis", "Irregular", "Lockup", "Pay trade fee", "Proof of burn",
+        "Proposal", "Reimbursement request", "Transfer BSQ", "Unlock", "Vote reveal"
+      ];
+      filters.forEach((filter) => {
+        it(`filters the transaction screen by ${filter}`, () => {
+          cy.visit(`${basePath}/transactions`);
+          cy.waitForSkeletonGone();
+          cy.get('#filter').click();
+          cy.contains(filter).find('input').click();
+          //TODO: change this waiter
+          cy.wait(1000);
+          cy.get('td:nth-of-type(2)').each(($td) => {
+            expect($td.text().trim()).to.eq(filter);
+          });
         });
+      });
 
-        it('loads the blocks screen', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(3) > a').click().then(() => {
-                cy.wait('@blocks');
-                cy.get('tbody tr').should('have.length', 10);
-            });
+      it("filters using multiple criteria", () => {
+        const filters = ['Proposal', 'Lockup', 'Unlock'];
+        cy.visit(`${basePath}/transactions`);
+        cy.waitForSkeletonGone();
+        cy.get('#filter').click();
+        filters.forEach((filter) => {
+          cy.contains(filter).find('input').click();
+          //TODO: change this waiter
+          cy.wait(1000);
         });
+        cy.get('td:nth-of-type(2)').each(($td) => {
+          const regex = new RegExp(`${filters.join('|')}`, 'g');
+          expect($td.text().trim()).to.match(regex);
+        });
+      });
 
-        it('loads the stats screen', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(4) > a').click().then(() => {
-                cy.wait('@stats');
-            });
-        });
+      const transactions = [
+        { type: 'Asset listing fee', txid: '3548aa0c002b015ea700072b7d7d76d45d4f10a3573804d0d2f624c0bb255b6b' },
+        { type: 'Blind vote', txid: 'f8fabb95efa1bb81325e4c961b9fc7e3508a9b9ecd4eddf1400e58867eff8d92' },
+        { type: 'Compensation request', txid: 'a8cdc65fe6bb8730f5f89f99f779d0469b0a493e1ae570e20eb7afda696a18a9' },
+        { type: 'Genesis', txid: '4b5417ec5ab6112bedf539c3b4f5a806ed539542d8b717e1c4470aa3180edce5' },
+        { type: 'Irregular', txid: '90b06684a517388fec2237e2362a29810dc82f0e13e019c84747ec27051e6c53' },
+        { type: 'Lockup', txid: '365425b3b7487229e2ba598fb8f2a9e359e3351620383e5018548649a28b78c4' },
+        { type: 'Pay trade fee', txid: 'a66b30e9777e16572ab36723539df8f45bd5d8130d810b2c3d75b8c02a191eaf' },
+        { type: 'Proof of burn', txid: '8325ccb87065fb9243ed9ff1cbb431fc2ac5060a60433bcde474ccbd97b76dcb' },
+        { type: 'Proposal', txid: '34e2a20f045c82fbcf7cb191b42dea6fba45641777e1751ffb29d3981c4bf413' },
+        { type: 'Reimbursement request', txid: '04c16c79ca6b9ec9978880024b0d0ad3100020f33286b63c85ca7b1a319421ae' },
+        { type: 'Transfer BSQ', txid: '64500bd9220675ad30d5ace27de95a341a498d7eda08162ee0ce7feb8c56cb14' },
+        { type: 'Unlock', txid: '5a756841bbb11137d15b0082a3fcadbe102791f41a95d661d3bd0c5ad0b3b1a3' },
+        { type: 'Vote reveal', txid: 'bd7daae1d4af8837db5e47d7bd9d8b9f83dcfd35d112f85e90728b9be45191f7' }
+      ];
 
-        it('loads the api screen', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(5) > a').click().then(() => {
-                cy.get('.card').should('have.length.at.least', 1);
-                cy.get('.card').first().click();
-                cy.get('.card-body');
-            });
+      transactions.forEach((transaction) => {
+        it(`loads a "${transaction.type}" transaction`, () => {
+          cy.visit(`${basePath}/tx/${transaction.txid}`);
+          cy.waitForSkeletonGone();
         });
+      });
+    });
 
-        it('shows blocks pagination with 5 pages (desktop)', () => {
-            cy.viewport(760, 800);
-            cy.visit(`${basePath}/blocks`);
-            cy.waitForSkeletonGone();
-            cy.get('tbody tr').should('have.length', 10);
-            // 5 pages + 4 buttons = 9 buttons
-            cy.get('.pagination-container ul.pagination').first().children().should('have.length', 9);
+    describe('blocks', () => {
+      it('loads the blocks screen', () => {
+        cy.visit(`${basePath}`);
+        cy.waitForSkeletonGone();
+        cy.get('#btn-blocks').click().then(() => {
+          cy.wait('@blocks');
+          cy.get('tbody tr').should('have.length', 10);
         });
+      });
 
-        it('shows blocks pagination with 3 pages (mobile)', () => {
-            cy.viewport(669, 800);
-            cy.visit(`${basePath}/blocks`);
-            cy.waitForSkeletonGone();
-            cy.get('tbody tr').should('have.length', 10);
-            // 3 pages + 4 buttons = 7 buttons
-            cy.get('.pagination-container ul.pagination').first().children().should('have.length', 7);
-        });
-    } else {
-        it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
-    }
-  });
+      it('loads a specific block', () => {
+        cy.visit(`${basePath}/block/0000000000000000000137ef33faa63bc6e809ab30932cf77d454fb36d2bd83a`);
+        cy.waitForSkeletonGone();
+      });
+
+    });
+
+    describe('markets', () => {
+      it('loads the markets screen', () => {
+        cy.visit(`${basePath}/markets`);
+        cy.waitForSkeletonGone();
+      });
+
+      it('loads a specific market', () => {
+        cy.visit(`${basePath}/market/btc_eur`);
+        cy.waitForSkeletonGone();
+        //Buy Offers
+        cy.get('.row > :nth-child(1) td').should('have.length.at.least', 1);
+        //Sell offers
+        cy.get('.row > :nth-child(1) td').should('have.length.at.least', 1);
+        //Trades
+        cy.get('app-bisq-trades > .table-container td').should('have.length.at.least', 1);
+      });
+    });
+
+    it('loads the stats screen', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+      cy.get('#btn-stats').click().then(() => {
+        cy.wait('@stats');
+      });
+    });
+
+    it('loads the api screen', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+      cy.get('#btn-docs').click().then(() => {
+        cy.get('.section-header').should('have.length.at.least', 1);
+        cy.get('.endpoint-container').should('have.length.at.least', 1);
+      });
+    });
+
+    it('shows blocks pagination with 5 pages (desktop)', () => {
+      cy.viewport(760, 800);
+      cy.visit(`${basePath}/blocks`);
+      cy.waitForSkeletonGone();
+      cy.get('tbody tr').should('have.length', 10);
+      // 5 pages + 4 buttons = 9 buttons
+      cy.get('.pagination-container ul.pagination').first().children().should('have.length', 9);
+    });
+
+    it('shows blocks pagination with 3 pages (mobile)', () => {
+      cy.viewport(669, 800);
+      cy.visit(`${basePath}/blocks`);
+      cy.waitForSkeletonGone();
+      cy.get('tbody tr').should('have.length', 10);
+      // 3 pages + 4 buttons = 7 buttons
+      cy.get('.pagination-container ul.pagination').first().children().should('have.length', 7);
+    });
+  } else {
+    it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
+  }
+});

frontend/cypress/integration/liquid/liquid.spec.ts

@@ -1,201 +1,214 @@
 describe('Liquid', () => {
-    const baseModule = Cypress.env("BASE_MODULE");
-    const basePath = (baseModule === 'liquid') ? '' : '/liquid';
+  const baseModule = Cypress.env("BASE_MODULE");
+  const basePath = '';
 
-    beforeEach(() => {
-        cy.intercept('/liquid/api/block/**').as('block');
-        cy.intercept('/liquid/api/blocks/').as('blocks');
-        cy.intercept('/liquid/api/tx/**/outspends').as('outspends');
-        cy.intercept('/liquid/api/block/**/txs/**').as('block-txs');
-        cy.intercept('/resources/pools.json').as('pools');
+  beforeEach(() => {
+    cy.intercept('/liquid/api/block/**').as('block');
+    cy.intercept('/liquid/api/blocks/').as('blocks');
+    cy.intercept('/liquid/api/tx/**/outspends').as('outspends');
+    cy.intercept('/liquid/api/block/**/txs/**').as('block-txs');
+    cy.intercept('/resources/pools.json').as('pools');
 
-        Cypress.Commands.add('waitForBlockData', () => {
-            cy.wait('@socket');
-            cy.wait('@block');
-            cy.wait('@outspends');
-          });
+    Cypress.Commands.add('waitForBlockData', () => {
+      cy.wait('@socket');
+      cy.wait('@block');
+      cy.wait('@outspends');
+    });
+  });
+
+  if (baseModule === 'liquid') {
+
+    it('check first mempool block after skeleton loads', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+      cy.get('#mempool-block-0 > .blockLink').should('exist');
     });
 
-    if (baseModule === 'mempool' || baseModule === 'liquid') {
+    it('loads the dashboard', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+    });
 
-        it('check first mempool block after skeleton loads', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('#mempool-block-0 > .blockLink').should('exist');
+    it('loads the blocks page', () => {
+      cy.visit(`${basePath}`);
+      cy.get('#btn-blocks').click().then(() => {
+        cy.wait(1000);
+      });
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads a specific block page', () => {
+      cy.visit(`${basePath}/block/7e1369a23a5ab861e7bdede2aadcccae4ea873ffd9caf11c7c5541eb5bcdff54`);
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the graphs page', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+      cy.get('#btn-graphs').click().then(() => {
+        cy.wait(1000);
+      });
+    });
+
+    it('loads the tv page - desktop', () => {
+      cy.visit(`${basePath}/tv`);
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the graphs page - mobile', () => {
+      cy.visit(`${basePath}`)
+      cy.waitForSkeletonGone();
+      cy.get('#btn-graphs').click().then(() => {
+        cy.viewport('iphone-6');
+        cy.wait(1000);
+        cy.get('.tv-only').should('not.exist');
+      });
+    });
+
+    it('renders unconfidential addresses correctly on mobile', () => {
+      cy.viewport('iphone-6');
+      cy.visit(`${basePath}/address/ex1qqmmjdwrlg59c8q4l75sj6wedjx57tj5grt8pat`);
+      cy.waitForSkeletonGone();
+      //TODO: Add proper IDs for these selectors
+      const firstRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(1) > .table > tbody';
+      const thirdRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(3)';
+      cy.get(firstRowSelector).invoke('css', 'width').then(firstRowWidth => {
+        cy.get(thirdRowSelector).invoke('css', 'width').then(thirdRowWidth => {
+          expect(parseInt(firstRowWidth)).to.be.lessThan(parseInt(thirdRowWidth));
         });
+      });
+    });
 
-        it('loads the dashboard', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
+    describe('peg in/peg out', () => {
+      it('loads peg in addresses', () => {
+        cy.visit(`${basePath}/tx/fe764f7bedfc2a37b29d9c8aef67d64a57d253a6b11c5a55555cfd5826483a58`);
+        cy.waitForSkeletonGone();
+        //TODO: Change to an element id so we don't assert on a string
+        cy.get('#table-tx-vin').should('contain', 'Peg-in');
+        cy.get('#table-tx-vin a').click().then(() => {
+          cy.waitForSkeletonGone();
+          if (baseModule === 'liquid') {
+            cy.url().should('eq', 'https://mempool.space/tx/f148c0d854db4174ea420655235f910543f0ec3680566dcfdf84fb0a1697b592');
+          } else {
+            //TODO: Use an environment variable to get the hostname
+            cy.url().should('eq', 'http://localhost:4200/tx/f148c0d854db4174ea420655235f910543f0ec3680566dcfdf84fb0a1697b592');
+          }
         });
+      });
 
-        it('loads the blocks page', () => {
-            cy.visit(`${basePath}/blocks`);
-            cy.waitForSkeletonGone();
+      it('loads peg out addresses', () => {
+        cy.visit(`${basePath}/tx/ecf6eba04ffb3946faa172343c87162df76f1a57b07b0d6dc6ad956b13376dc8`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout a').first().click().then(() => {
+          cy.waitForSkeletonGone();
+          if (baseModule === 'liquid') {
+            cy.url().should('eq', 'https://mempool.space/address/1BxoGcMg14oaH3CwHD2hF4gU9VcfgX5yoR');
+          } else {
+            //TODO: Use an environment variable to get the hostname
+            cy.url().should('eq', 'http://localhost:4200/address/1BxoGcMg14oaH3CwHD2hF4gU9VcfgX5yoR');
+          }
+          //TODO: Add a custom class so we don't assert on a string
+          cy.get('.badge').should('contain', 'Liquid Peg Out');
         });
+      });
+    });
 
-        it('loads a specific block page', () => {
-            cy.visit(`${basePath}/block/7e1369a23a5ab861e7bdede2aadcccae4ea873ffd9caf11c7c5541eb5bcdff54`);
-            cy.waitForSkeletonGone();
+    describe('assets', () => {
+      it('shows the assets screen', () => {
+        cy.visit(`${basePath}`);
+        cy.get('#btn-assets');
+        cy.waitForSkeletonGone();
+        cy.get('table tr').should('have.length.at.least', 5);
+      });
+
+      it('allows searching assets', () => {
+        cy.visit(`${basePath}/assets`);
+        cy.waitForSkeletonGone();
+        cy.get('.container-xl input').click().type('Liquid Bitcoin').then(() => {
+          cy.get('table tr').should('have.length', 1);
         });
+      });
 
-        it('loads the graphs page', () => {
-            cy.visit(`${basePath}/graphs`);
-            cy.waitForSkeletonGone();
-        });
-
-        it('loads the tv page - desktop', () => {
-            cy.visit(`${basePath}`);
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(3) > a').click().then(() => {
-                cy.wait(1000);
-            });
-        });
-
-        it('loads the graphs page - mobile', () => {
-            cy.visit(`${basePath}`)
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(3) > a').click().then(() => {
-                cy.viewport('iphone-6');
-                cy.wait(1000);
-                cy.get('.tv-only').should('not.exist');
-            });
-        });
-
-        it('renders unconfidential addresses correctly on mobile', () => {
-            cy.viewport('iphone-6');
-            cy.visit(`${basePath}/address/ex1qqmmjdwrlg59c8q4l75sj6wedjx57tj5grt8pat`);
-            cy.waitForSkeletonGone();
-            //TODO: Add proper IDs for these selectors
-            const firstRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(1) > .table > tbody';
-            const thirdRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(3)';
-            cy.get(firstRowSelector).invoke('css', 'width').then(firstRowWidth => {
-                cy.get(thirdRowSelector).invoke('css', 'width').then(thirdRowWidth => {
-                    expect(parseInt(firstRowWidth)).to.be.lessThan(parseInt(thirdRowWidth));
-                });
-            });
-        });
-
-        describe('peg in/peg out', () => {
-            it('loads peg in addresses', () => {
-                cy.visit(`${basePath}/tx/fe764f7bedfc2a37b29d9c8aef67d64a57d253a6b11c5a55555cfd5826483a58`);
-                cy.waitForSkeletonGone();
-                //TODO: Change to an element id so we don't assert on a string
-                cy.get('#table-tx-vin').should('contain', 'Peg-in');
-                cy.get('#table-tx-vin a').click().then(() => {
-                    cy.waitForSkeletonGone();
-                    if (baseModule === 'liquid') {
-                        cy.url().should('eq', 'https://mempool.space/tx/f148c0d854db4174ea420655235f910543f0ec3680566dcfdf84fb0a1697b592');
-                    } else {
-                        //TODO: Use an environment variable to get the hostname
-                        cy.url().should('eq', 'http://localhost:4200/tx/f148c0d854db4174ea420655235f910543f0ec3680566dcfdf84fb0a1697b592');
-                    }
-                });
-            });
-
-            it('loads peg out addresses', () => {
-                cy.visit(`${basePath}/tx/ecf6eba04ffb3946faa172343c87162df76f1a57b07b0d6dc6ad956b13376dc8`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vout a').first().click().then(() => {
-                    cy.waitForSkeletonGone();
-                    if (baseModule === 'liquid') {
-                        cy.url().should('eq', 'https://mempool.space/address/1BxoGcMg14oaH3CwHD2hF4gU9VcfgX5yoR');
-                    } else {
-                        //TODO: Use an environment variable to get the hostname
-                        cy.url().should('eq', 'http://localhost:4200/address/1BxoGcMg14oaH3CwHD2hF4gU9VcfgX5yoR');
-                    }
-                    //TODO: Add a custom class so we don't assert on a string
-                    cy.get('.badge').should('contain','Liquid Peg Out');
-                });
-            });
-        });
-
-        describe('assets', () => {
-            it('shows the assets screen', () => {
-                cy.visit(`${basePath}/assets`);
-                cy.waitForSkeletonGone();
-                cy.get('table tr').should('have.length.at.least', 5);
-            });
-
-            it('allows searching assets', () => {
-                cy.visit(`${basePath}/assets`);
-                cy.waitForSkeletonGone();
-                cy.get('.container-xl input').click().type('Liquid Bitcoin').then(() => {
-                    cy.get('table tr').should('have.length', 1);
-                });
-            });
-
-            it('shows a specific asset ID', () => {
-                cy.visit(`${basePath}/assets`);
-                cy.waitForSkeletonGone();
-                cy.get('.container-xl input').click().type('Liquid AUD').then(() => {
-                    cy.get('table tr td:nth-of-type(1) a').click();
-                });
-            });
+      it('shows a specific asset ID', () => {
+        cy.visit(`${basePath}/assets`);
+        cy.waitForSkeletonGone();
+        cy.get('.container-xl input').click().type('Liquid AUD').then(() => {
+          cy.get('table tr td:nth-of-type(1) a').click();
         });
+      });
+    });
 
 
-        describe('unblinded TX', () => {
+    describe('unblinded TX', () => {
 
-            it('should not show an unblinding error message for regular txs', () => {
-                cy.visit(`${basePath}/tx/82a479043ec3841e0d3f829afc8df4f0e2bbd675a13f013ea611b2fde0027d45`);
-                cy.waitForSkeletonGone();
-                cy.get('.error-unblinded' ).should('not.exist');
-            });
+      it('should not show an unblinding error message for regular txs', () => {
+        cy.visit(`${basePath}/tx/82a479043ec3841e0d3f829afc8df4f0e2bbd675a13f013ea611b2fde0027d45`);
+        cy.waitForSkeletonGone();
+        cy.get('.error-unblinded').should('not.exist');
+      });
 
-            it('show unblinded TX', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc,2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3a`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vin tr').should('have.class', 'assetBox');
-                cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
-            });
+      it('show unblinded TX', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc,2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3a`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr:nth-child(1) .amount').should('contain.text', '0.02465000 L-BTC');
+        cy.get('#table-tx-vin tr').should('have.class', 'assetBox');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', '0.00100000 L-BTC');
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', '0.02364760 L-BTC');
+        cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
+      });
 
-            it('show empty unblinded TX', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vin tr').should('have.class', '');
-                cy.get('#table-tx-vout tr').should('have.class', '');
-            });
+      it('show empty unblinded TX', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr:nth-child(1)').should('have.class', '');
+        cy.get('#table-tx-vin tr:nth-child(1) .amount').should('contain.text', 'Confidential');
+        cy.get('#table-tx-vout tr:nth-child(1)').should('have.class', '');
+        cy.get('#table-tx-vout tr:nth-child(2)').should('have.class', '');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', 'Confidential');
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', 'Confidential');
+      });
 
-            it('show invalid unblinded TX hex', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=123`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vin tr').should('have.class', '');
-                cy.get('#table-tx-vout tr').should('have.class', '');
-                cy.get('.error-unblinded' ).contains('Error: Invalid blinding data (invalid hex)');
-            });
+      it('show invalid unblinded TX hex', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=123`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr').should('have.class', '');
+        cy.get('#table-tx-vout tr').should('have.class', '');
+        cy.get('.error-unblinded').contains('Error: Invalid blinding data (invalid hex)');
+      });
 
-            it('show first unblinded vout', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vout tr:first-child()').should('have.class', 'assetBox');
-            });
+      it('show first unblinded vout', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout tr:nth-child(1)').should('have.class', 'assetBox');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', '0.00100000 L-BTC');
+      });
 
-            it('show second unblinded vout', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3a`);
-                cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
-            });
+      it('show second unblinded vout', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3a`);
+        cy.get('#table-tx-vout tr:nth-child(2').should('have.class', 'assetBox');
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', '0.02364760 L-BTC');
+      });
 
-            it('show invalid error unblinded TX', () => {
-                cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc,2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3c`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
-                cy.get('.error-unblinded' ).contains('Error: Invalid blinding data.');
-            });
+      it('show invalid error unblinded TX', () => {
+        cy.visit(`${basePath}/tx/f2f41c0850e8e7e3f1af233161fd596662e67c11ef10ed15943884186fbb7f46#blinded=100000,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,0ab9f70650f16b1db8dfada05237f7d0d65191c3a13183da8a2ddddfbde9a2ad,fd98b2edc5530d76acd553f206a431f4c1fab27e10e290ad719582af878e98fc,2364760,6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d,90c7a43b15b905bca045ca42a01271cfe71d2efe3133f4197792c24505cb32ed,12eb5959d9293b8842e7dd8bc9aa9639fd3fd031c5de3ba911adeca94eb57a3c`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
+        cy.get('.error-unblinded').contains('Error: Invalid blinding data.');
+      });
 
-            it('shows asset peg in/out and burn transactions', () => {
-                cy.visit(`${basePath}/asset/6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d`);
-                cy.waitForSkeletonGone();
-                cy.get('#table-tx-vout tr').not('.assetBox');
-                cy.get('#table-tx-vin tr').not('.assetBox');
-            });
+      it('shows asset peg in/out and burn transactions', () => {
+        cy.visit(`${basePath}/asset/6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout tr').not('.assetBox');
+        cy.get('#table-tx-vin tr').not('.assetBox');
+      });
 
-            it('prevents regressing issue #644', () => {
-                cy.visit(`${basePath}/tx/393b890966f305e7c440fcfb12a13f51a7a9011cc59ff5f14f6f93214261bd82`);
-                cy.waitForSkeletonGone();
-            });
-        });
-    } else {
-        it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
-    }
+      it('prevents regressing issue #644', () => {
+        cy.visit(`${basePath}/tx/393b890966f305e7c440fcfb12a13f51a7a9011cc59ff5f14f6f93214261bd82`);
+        cy.waitForSkeletonGone();
+      });
+    });
+  } else {
+    it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
+  }
 });

frontend/cypress/integration/liquidtestnet/liquidtestnet.spec.ts

@@ -0,0 +1,175 @@
+describe('Liquid Testnet', () => {
+  const baseModule = Cypress.env("BASE_MODULE");
+  const basePath = '/testnet';
+
+  beforeEach(() => {
+    cy.intercept('/liquidtestnet/api/block/**').as('block');
+    cy.intercept('/liquidtestnet/api/blocks/').as('blocks');
+    cy.intercept('/liquidtestnet/api/tx/**/outspends').as('outspends');
+    cy.intercept('/liquidtestnet/api/block/**/txs/**').as('block-txs');
+    cy.intercept('/resources/pools.json').as('pools');
+
+    Cypress.Commands.add('waitForBlockData', () => {
+      cy.wait('@socket');
+      cy.wait('@block');
+      cy.wait('@outspends');
+    });
+  });
+
+  if (baseModule === 'liquid') {
+
+    it('check first mempool block after skeleton loads', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+      cy.get('#mempool-block-0 > .blockLink').should('exist');
+    });
+
+    it('loads the dashboard', () => {
+      cy.visit(`${basePath}`);
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the blocks page', () => {
+      cy.visit(`${basePath}`)
+      cy.get('#btn-blocks');
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads a specific block page', () => {
+      cy.visit(`${basePath}/block/7e1369a23a5ab861e7bdede2aadcccae4ea873ffd9caf11c7c5541eb5bcdff54`);
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the graphs page', () => {
+      cy.visit(`${basePath}`);
+      cy.get('#btn-graphs');
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the tv page - desktop', () => {
+      cy.visit(`${basePath}/tv`);
+      cy.waitForSkeletonGone();
+    });
+
+    it('loads the graphs page - mobile', () => {
+      cy.visit(`${basePath}`)
+      cy.waitForSkeletonGone();
+      cy.viewport('iphone-6');
+      cy.get('.tv-only').should('not.exist');
+    });
+
+    it.skip('renders unconfidential addresses correctly on mobile', () => {
+      cy.viewport('iphone-6');
+      cy.visit(`${basePath}/address/__TODO__`);
+      cy.waitForSkeletonGone();
+      //TODO: Add proper IDs for these selectors
+      const firstRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(1) > .table > tbody';
+      const thirdRowSelector = '.container-xl > :nth-child(3) > div > :nth-child(3)';
+      cy.get(firstRowSelector).invoke('css', 'width').then(firstRowWidth => {
+        cy.get(thirdRowSelector).invoke('css', 'width').then(thirdRowWidth => {
+          expect(parseInt(firstRowWidth)).to.be.lessThan(parseInt(thirdRowWidth));
+        });
+      });
+    });
+
+    describe('assets', () => {
+      it('shows the assets screen', () => {
+        cy.visit(`${basePath}/assets`);
+        cy.waitForSkeletonGone();
+        cy.get('table tr').should('have.length.at.least', 5);
+      });
+
+      it('allows searching assets', () => {
+        cy.visit(`${basePath}/assets`);
+        cy.waitForSkeletonGone();
+        cy.get('.container-xl input').click().type('Liquid Bitcoin').then(() => {
+          cy.get('table tr').should('have.length', 1);
+        });
+      });
+
+      it('shows a specific asset ID', () => {
+        cy.visit(`${basePath}/assets`);
+        cy.waitForSkeletonGone();
+        cy.get('.container-xl input').click().type('Liquid CAD').then(() => {
+          cy.get('table tr td:nth-of-type(1) a').click();
+        });
+      });
+    });
+
+    describe('unblinded TX', () => {
+      it('should not show an unblinding error message for regular txs', () => {
+        cy.visit(`${basePath}/tx/82a479043ec3841e0d3f829afc8df4f0e2bbd675a13f013ea611b2fde0027d45`);
+        cy.waitForSkeletonGone();
+        cy.get('.error-unblinded').should('not.exist');
+      });
+
+      it('show unblinded TX', () => {
+        cy.visit(`${basePath}/tx/c3d908ab77891e4c569b0df71aae90f4720b157019ebb20db176f4f9c4d626b8#blinded=100000,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,df290ead654d7d110ebc5aaf0bcf11d5b5d360431a467f1cde0a856fde986893,33cb3a2fd2e76643843691cf44a78c5cd28ec652a414da752160ad63fbd37bc9,49741,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,edb0713bcbfcb3daabf601cb50978439667d208e15fed8a5ebbfea5696cda1d5,4de70115501e8c7d6bd763e229bf42781edeacf6e75e1d7bdfa4c63104bc508a`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr:nth-child(1) .amount').should('contain.text', '0.00100000 tL-BTC');
+        cy.get('#table-tx-vin tr').should('have.class', 'assetBox');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', '0.00050000 tL-BTC');
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', '0.00049741 tL-BTC');
+        cy.get('#table-tx-vout tr').should('have.class', 'assetBox');
+      });
+
+      it('show empty unblinded TX', () => {
+        cy.visit(`${basePath}/tx/c3d908ab77891e4c569b0df71aae90f4720b157019ebb20db176f4f9c4d626b8#blinded=`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr:nth-child(1)').should('have.class', '');
+        cy.get('#table-tx-vin tr:nth-child(1) .amount').should('contain.text', 'Confidential');
+        cy.get('#table-tx-vout tr:nth-child(1)').should('have.class', '');
+        cy.get('#table-tx-vout tr:nth-child(2)').should('have.class', '');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', 'Confidential');
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', 'Confidential');
+      });
+
+      it('show invalid unblinded TX hex', () => {
+        cy.visit(`${basePath}/tx/2477f220eef1d03f8ffa4a2861c275d155c3562adf0d79523aeeb0c59ee611ba#blinded=5000`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr').should('have.class', '');
+        cy.get('#table-tx-vout tr').should('have.class', '');
+        cy.get('.error-unblinded').contains('Error: Invalid blinding data (invalid hex)');
+      });
+
+      it('show first unblinded vout', () => {
+        cy.visit(`${basePath}/tx/0877bc0c7aa5c2b8d0e4b15450425879b8783c40e341806037a605ef836fb886#blinded=5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,328de54e90e867a9154b4f1eb7fcab86267e880fa2ee9e53b41a91e61dab86e6,8885831e6b089eaf06889d53a24843f0da533d300a7b1527b136883a6819f3ae,5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,aca78b953615d69ae0ae68c4c5c3c0ee077c10bc20ad3f0c5960706004e6cb56,d2ec175afe5f761e2dbd443faf46abbb7091f341deb3387e5787d812bdb2df9f,100000,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,4b54a4ca809b3844f34dd88b68617c4c866d92a02211f02ba355755bac20a1c6,eddd02e92b0cfbad8cab89828570a50f2c643bb2a54d886c86e25ce47e818685,99729,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,8b86d565c9549eb0352bb81ee576d01d064435b64fddcc045decebeb1d9913ce,b082ce3448d40d47b5b39f15d72b285f4a1046b636b56c25f32f498ece29d062,10000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,62b04ee86198d6b41681cdd0acb450ab366af727a010aaee8ba0b9e69ff43896,3f98429bca9b538dc943c22111f25d9c4448d45a63ff0f4e58b22fd434c0365e`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout tr:nth-child(1)').should('have.class', 'assetBox');
+        cy.get('#table-tx-vout tr:nth-child(1) .amount').should('contain.text', '0.00099729 tL-BTC');
+      });
+
+      it('show second unblinded vout (asset)', () => {
+        cy.visit(`${basePath}/tx/0877bc0c7aa5c2b8d0e4b15450425879b8783c40e341806037a605ef836fb886#blinded=5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,328de54e90e867a9154b4f1eb7fcab86267e880fa2ee9e53b41a91e61dab86e6,8885831e6b089eaf06889d53a24843f0da533d300a7b1527b136883a6819f3ae,5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,aca78b953615d69ae0ae68c4c5c3c0ee077c10bc20ad3f0c5960706004e6cb56,d2ec175afe5f761e2dbd443faf46abbb7091f341deb3387e5787d812bdb2df9f,100000,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,4b54a4ca809b3844f34dd88b68617c4c866d92a02211f02ba355755bac20a1c6,eddd02e92b0cfbad8cab89828570a50f2c643bb2a54d886c86e25ce47e818685,99729,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,8b86d565c9549eb0352bb81ee576d01d064435b64fddcc045decebeb1d9913ce,b082ce3448d40d47b5b39f15d72b285f4a1046b636b56c25f32f498ece29d062,10000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,62b04ee86198d6b41681cdd0acb450ab366af727a010aaee8ba0b9e69ff43896,3f98429bca9b538dc943c22111f25d9c4448d45a63ff0f4e58b22fd434c0365e`);
+        cy.get('#table-tx-vout tr:nth-child(2)').should('have.class', 'assetBox');
+        //TODO Update after the precision bug fix is merged
+        cy.get('#table-tx-vout tr:nth-child(2) .amount').should('contain.text', '0 TEST');
+      });
+
+      it('should link to the asset page from the unblinded tx', () => {
+        cy.visit(`${basePath}/tx/0877bc0c7aa5c2b8d0e4b15450425879b8783c40e341806037a605ef836fb886#blinded=5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,328de54e90e867a9154b4f1eb7fcab86267e880fa2ee9e53b41a91e61dab86e6,8885831e6b089eaf06889d53a24843f0da533d300a7b1527b136883a6819f3ae,5000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,aca78b953615d69ae0ae68c4c5c3c0ee077c10bc20ad3f0c5960706004e6cb56,d2ec175afe5f761e2dbd443faf46abbb7091f341deb3387e5787d812bdb2df9f,100000,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,4b54a4ca809b3844f34dd88b68617c4c866d92a02211f02ba355755bac20a1c6,eddd02e92b0cfbad8cab89828570a50f2c643bb2a54d886c86e25ce47e818685,99729,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,8b86d565c9549eb0352bb81ee576d01d064435b64fddcc045decebeb1d9913ce,b082ce3448d40d47b5b39f15d72b285f4a1046b636b56c25f32f498ece29d062,10000,38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5,62b04ee86198d6b41681cdd0acb450ab366af727a010aaee8ba0b9e69ff43896,3f98429bca9b538dc943c22111f25d9c4448d45a63ff0f4e58b22fd434c0365e`);
+        cy.get('#table-tx-vout tr:nth-child(2) .amount a').click().then(() => {
+          cy.waitForSkeletonGone();
+          cy.url().should('contain', '/asset/38fca2d939696061a8f76d4e6b5eecd54e3b4221c846f24a6b279e79952850a5');
+        });
+      });
+
+      it('show invalid error unblinded TX', () => {
+        cy.visit(`${basePath}/tx/c3d908ab77891e4c569b0df71aae90f4720b157019ebb20db176f4f9c4d626b8#blinded=100000,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,df290ead654d7d110ebc5aaf0bcf11d5b5d360431a467f1cde0a856fde986893,33cb3a2fd2e76643843691cf44a78c5cd28ec652a414da752160ad63fbd37bc9,49741,144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49,edb0713bcbfcb3daabf601cb50978439667d208e15fed8a5ebbfea5696cda1d5,4de70115501e8c7d6bd763e229bf42781edeacf6e75e1d7bdfa4c63104bc508c`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vin tr').should('have.class', 'assetBox');
+        cy.get('.error-unblinded').contains('Error: Invalid blinding data.');
+      });
+
+      it('shows asset peg in/out and burn transactions', () => {
+        cy.visit(`${basePath}/asset/ac3e0ff248c5051ffd61e00155b7122e5ebc04fd397a0ecbdd4f4e4a56232926`);
+        cy.waitForSkeletonGone();
+        cy.get('#table-tx-vout tr').not('.assetBox');
+        cy.get('#table-tx-vin tr').not('.assetBox');
+      });
+
+    });
+  } else {
+    it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
+  }
+});

frontend/cypress/integration/signet/signet.spec.ts

@@ -13,8 +13,8 @@ describe('Signet', () => {
 
   if (baseModule === 'mempool') {
     it('loads the dashboard', () => {
-        cy.visit('/signet');
-        cy.waitForSkeletonGone();
+      cy.visit('/signet');
+      cy.waitForSkeletonGone();
     });
 
     it('check first mempool block after skeleton loads', () => {
@@ -24,116 +24,116 @@ describe('Signet', () => {
     });
 
     it.skip('loads the dashboard with the skeleton blocks', () => {
-        cy.mockMempoolSocket();
-        cy.visit("/signet");
-        cy.get(':nth-child(1) > #bitcoin-block-0').should('be.visible');
-        cy.get(':nth-child(2) > #bitcoin-block-0').should('be.visible');
-        cy.get(':nth-child(3) > #bitcoin-block-0').should('be.visible');
-        cy.get('#mempool-block-0').should('be.visible');
-        cy.get('#mempool-block-1').should('be.visible');
-        cy.get('#mempool-block-2').should('be.visible');
+      cy.mockMempoolSocket();
+      cy.visit("/signet");
+      cy.get(':nth-child(1) > #bitcoin-block-0').should('be.visible');
+      cy.get(':nth-child(2) > #bitcoin-block-0').should('be.visible');
+      cy.get(':nth-child(3) > #bitcoin-block-0').should('be.visible');
+      cy.get('#mempool-block-0').should('be.visible');
+      cy.get('#mempool-block-1').should('be.visible');
+      cy.get('#mempool-block-2').should('be.visible');
 
-        emitMempoolInfo({
-            'params': {
-            "network": "signet"
-            }
-        });
+      emitMempoolInfo({
+        'params': {
+          "network": "signet"
+        }
+      });
 
-        cy.get(':nth-child(1) > #bitcoin-block-0').should('not.exist');
-        cy.get(':nth-child(2) > #bitcoin-block-0').should('not.exist');
-        cy.get(':nth-child(3) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(1) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(2) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(3) > #bitcoin-block-0').should('not.exist');
     });
 
-    it('loads the blocks screen', () => {
-        cy.visit('/signet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(2) > a').click().then(() => {
-            cy.wait(1000);
-        });
+    it('loads the pools screen', () => {
+      cy.visit('/signet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-pools').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     it('loads the graphs screen', () => {
-        cy.visit('/signet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(3) > a').click().then(() => {
-            cy.wait(1000);
-        });
+      cy.visit('/signet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-graphs').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     describe('tv mode', () => {
-        it('loads the tv screen - desktop', () => {
-            cy.viewport('macbook-16');
-            cy.visit('/signet');
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(4) > a').click().then(() => {
-                cy.get('.chart-holder').should('be.visible');
-                cy.get('#mempool-block-0').should('be.visible');
-                cy.get('.tv-only').should('not.exist');
-            });
+      it('loads the tv screen - desktop', () => {
+        cy.viewport('macbook-16');
+        cy.visit('/signet');
+        cy.waitForSkeletonGone();
+        cy.get('#btn-tv').click().then(() => {
+          cy.get('.chart-holder').should('be.visible');
+          cy.get('#mempool-block-0').should('be.visible');
+          cy.get('.tv-only').should('not.exist');
         });
+      });
 
-        it('loads the tv screen - mobile', () => {
-            cy.visit('/signet');
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(4) > a').click().then(() => {
-                cy.viewport('iphone-8');
-                cy.get('.chart-holder').should('be.visible');
-                //TODO: Remove comment when the bug is fixed
-                //cy.get('#mempool-block-0').should('be.visible');
-                cy.get('.tv-only').should('not.exist');
-            });
+      it('loads the tv screen - mobile', () => {
+        cy.visit('/signet');
+        cy.waitForSkeletonGone();
+        cy.get('#btn-tv').click().then(() => {
+          cy.viewport('iphone-8');
+          cy.get('.chart-holder').should('be.visible');
+          cy.get('.tv-only').should('not.exist');
+          //TODO: Remove comment when the bug is fixed
+          //cy.get('#mempool-block-0').should('be.visible');
         });
+      });
     });
 
 
     it('loads the api screen', () => {
-        cy.visit('/signet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(5) > a').click().then(() => {
-            cy.wait(1000);
-        });
+      cy.visit('/signet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-docs').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     describe('blocks', () => {
-        it('shows empty blocks properly', () => {
-            cy.visit('/signet/block/00000133d54e4589f6436703b067ec23209e0a21b8a9b12f57d0592fd85f7a42');
-            cy.waitForSkeletonGone();
-            cy.get('h2').invoke('text').should('equal', '1 transaction');
+      it('shows empty blocks properly', () => {
+        cy.visit('/signet/block/00000133d54e4589f6436703b067ec23209e0a21b8a9b12f57d0592fd85f7a42');
+        cy.waitForSkeletonGone();
+        cy.get('h2').invoke('text').should('equal', '1 transaction');
+      });
+
+      it('expands and collapses the block details', () => {
+        cy.visit('/signet/block/0');
+        cy.waitForSkeletonGone();
+        cy.get('.btn.btn-outline-info').click().then(() => {
+          cy.get('#details').should('be.visible');
         });
 
-        it('expands and collapses the block details', () => {
-            cy.visit('/signet/block/0');
-            cy.waitForSkeletonGone();
-            cy.get('.btn.btn-outline-info').click().then(() => {
-                cy.get('#details').should('be.visible');
-            });
-
-            cy.get('.btn.btn-outline-info').click().then(() => {
-                cy.get('#details').should('not.be.visible');
-            });
-        });
-
-        it('shows blocks with no pagination', () => {
-            cy.visit('/signet/block/00000078f920a96a69089877b934ce7fd009ab55e3170920a021262cb258e7cc');
-            cy.waitForSkeletonGone();
-            cy.get('h2').invoke('text').should('equal', '13 transactions');
-            cy.get('ul.pagination').first().children().should('have.length', 5);
-        });
-
-        it('supports pagination on the block screen', () => {
-            // 43 txs
-            cy.visit('/signet/block/00000094bd52f73bdbfc4bece3a94c21fec2dc968cd54210496e69e4059d66a6');
-            cy.waitForSkeletonGone();
-            cy.get('.header-bg.box > a').invoke('text').then((text1) => {
-                cy.get('.active + li').first().click().then(() => {
-                    cy.get('.header-bg.box > a').invoke('text').then((text2) => {
-                        expect(text1).not.to.eq(text2);
-                    });
-                });
+        cy.get('.btn.btn-outline-info').click().then(() => {
+          cy.get('#details').should('not.be.visible');
+        });
+      });
+
+      it('shows blocks with no pagination', () => {
+        cy.visit('/signet/block/00000078f920a96a69089877b934ce7fd009ab55e3170920a021262cb258e7cc');
+        cy.waitForSkeletonGone();
+        cy.get('h2').invoke('text').should('equal', '13 transactions');
+        cy.get('ul.pagination').first().children().should('have.length', 5);
+      });
+
+      it('supports pagination on the block screen', () => {
+        // 43 txs
+        cy.visit('/signet/block/00000094bd52f73bdbfc4bece3a94c21fec2dc968cd54210496e69e4059d66a6');
+        cy.waitForSkeletonGone();
+        cy.get('.header-bg.box > a').invoke('text').then((text1) => {
+          cy.get('.active + li').first().click().then(() => {
+            cy.get('.header-bg.box > a').invoke('text').then((text2) => {
+              expect(text1).not.to.eq(text2);
             });
+          });
         });
+      });
     });
-    } else {
-        it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
-    }
-  });
+  } else {
+    it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
+  }
+});

frontend/cypress/integration/testnet/testnet.spec.ts

@@ -13,8 +13,8 @@ describe('Testnet', () => {
   if (baseModule === 'mempool') {
 
     it('loads the dashboard', () => {
-        cy.visit('/testnet');
-        cy.waitForSkeletonGone();
+      cy.visit('/testnet');
+      cy.waitForSkeletonGone();
     });
 
     it('check first mempool block after skeleton loads', () => {
@@ -24,113 +24,115 @@ describe('Testnet', () => {
     });
 
     it.skip('loads the dashboard with the skeleton blocks', () => {
-        cy.mockMempoolSocket();
-        cy.visit("/testnet");
-        cy.get(':nth-child(1) > #bitcoin-block-0').should('be.visible');
-        cy.get(':nth-child(2) > #bitcoin-block-0').should('be.visible');
-        cy.get(':nth-child(3) > #bitcoin-block-0').should('be.visible');
-        cy.get('#mempool-block-0').should('be.visible');
-        cy.get('#mempool-block-1').should('be.visible');
-        cy.get('#mempool-block-2').should('be.visible');
+      cy.mockMempoolSocket();
+      cy.visit("/testnet");
+      cy.get(':nth-child(1) > #bitcoin-block-0').should('be.visible');
+      cy.get(':nth-child(2) > #bitcoin-block-0').should('be.visible');
+      cy.get(':nth-child(3) > #bitcoin-block-0').should('be.visible');
+      cy.get('#mempool-block-0').should('be.visible');
+      cy.get('#mempool-block-1').should('be.visible');
+      cy.get('#mempool-block-2').should('be.visible');
 
-        emitMempoolInfo({
-            'params': {
-            loaded: true
-            }
-        });
+      emitMempoolInfo({
+        'params': {
+          loaded: true
+        }
+      });
 
-        cy.get(':nth-child(1) > #bitcoin-block-0').should('not.exist');
-        cy.get(':nth-child(2) > #bitcoin-block-0').should('not.exist');
-        cy.get(':nth-child(3) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(1) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(2) > #bitcoin-block-0').should('not.exist');
+      cy.get(':nth-child(3) > #bitcoin-block-0').should('not.exist');
     });
 
-    it('loads the blocks screen', () => {
-        cy.visit('/testnet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(2) > a').click().then(() => {
-            cy.wait(1000);
-        });
+    it('loads the pools screen', () => {
+      cy.visit('/testnet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-pools').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     it('loads the graphs screen', () => {
-        cy.visit('/testnet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(3) > a').click().then(() => {
-            cy.wait(1000);
-        });
+      cy.visit('/testnet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-graphs').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     describe('tv mode', () => {
-        it('loads the tv screen - desktop', () => {
-            cy.viewport('macbook-16');
-            cy.visit('/testnet');
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(4) > a').click().then(() => {
-                cy.wait(1000);
-                cy.get('.tv-only').should('not.exist');
-            });
+      it('loads the tv screen - desktop', () => {
+        cy.viewport('macbook-16');
+        cy.visit('/testnet');
+        cy.waitForSkeletonGone();
+        cy.get('#btn-tv').click().then(() => {
+          cy.wait(1000);
+          cy.get('.tv-only').should('not.exist');
+          //TODO: Remove comment when the bug is fixed
+          //cy.get('#mempool-block-0').should('be.visible');
         });
+      });
 
-        it('loads the tv screen - mobile', () => {
-            cy.visit('/testnet');
-            cy.waitForSkeletonGone();
-            cy.get('li:nth-of-type(4) > a').click().then(() => {
-                cy.viewport('iphone-6');
-                cy.wait(1000);
-                cy.get('.tv-only').should('not.exist');
-            });
+      it('loads the tv screen - mobile', () => {
+        cy.visit('/testnet');
+        cy.waitForSkeletonGone();
+        cy.get('#btn-tv').click().then(() => {
+          cy.viewport('iphone-6');
+          cy.wait(1000);
+          cy.get('.tv-only').should('not.exist');
         });
+      });
     });
 
 
     it('loads the api screen', () => {
-        cy.visit('/testnet');
-        cy.waitForSkeletonGone();
-        cy.get('li:nth-of-type(5) > a').click().then(() => {
-            cy.wait(1000);
-        });
+      cy.visit('/testnet');
+      cy.waitForSkeletonGone();
+      cy.get('#btn-docs').click().then(() => {
+        cy.wait(1000);
+      });
     });
 
     describe('blocks', () => {
-        it('shows empty blocks properly', () => {
-            cy.visit('/testnet/block/0');
-            cy.waitForSkeletonGone();
-            cy.get('h2').invoke('text').should('equal', '1 transaction');
+      it('shows empty blocks properly', () => {
+        cy.visit('/testnet/block/0');
+        cy.waitForSkeletonGone();
+        cy.get('h2').invoke('text').should('equal', '1 transaction');
+      });
+
+      it('expands and collapses the block details', () => {
+        cy.visit('/testnet/block/0');
+        cy.waitForSkeletonGone();
+        cy.get('.btn.btn-outline-info').click().then(() => {
+          cy.get('#details').should('be.visible');
         });
 
-        it('expands and collapses the block details', () => {
-            cy.visit('/testnet/block/0');
-            cy.waitForSkeletonGone();
-            cy.get('.btn.btn-outline-info').click().then(() => {
-                cy.get('#details').should('be.visible');
-            });
-
-            cy.get('.btn.btn-outline-info').click().then(() => {
-                cy.get('#details').should('not.be.visible');
-            });
-        });
-
-        it('shows blocks with no pagination', () => {
-            cy.visit('/testnet/block/000000000000002f8ce27716e74ecc7ad9f7b5101fed12d09e28bb721b9460ea');
-            cy.waitForSkeletonGone();
-            cy.get('h2').invoke('text').should('equal', '11 transactions');
-            cy.get('ul.pagination').first().children().should('have.length', 5);
-        });
-
-        it('supports pagination on the block screen', () => {
-            // 48 txs
-            cy.visit('/testnet/block/000000000000002ca3878ebd98b313a1c2d531f2e70a6575d232ca7564dea7a9');
-            cy.waitForSkeletonGone();
-            cy.get('.header-bg.box > a').invoke('text').then((text1) => {
-                cy.get('.active + li').first().click().then(() => {
-                    cy.get('.header-bg.box > a').invoke('text').then((text2) => {
-                        expect(text1).not.to.eq(text2);
-                    });
-                });
+        cy.get('.btn.btn-outline-info').click().then(() => {
+          cy.get('#details').should('not.be.visible');
+        });
+      });
+
+      it('shows blocks with no pagination', () => {
+        cy.visit('/testnet/block/000000000000002f8ce27716e74ecc7ad9f7b5101fed12d09e28bb721b9460ea');
+        cy.waitForSkeletonGone();
+        cy.get('h2').invoke('text').should('equal', '11 transactions');
+        cy.get('ul.pagination').first().children().should('have.length', 5);
+      });
+
+      it('supports pagination on the block screen', () => {
+        // 48 txs
+        cy.visit('/testnet/block/000000000000002ca3878ebd98b313a1c2d531f2e70a6575d232ca7564dea7a9');
+        cy.waitForSkeletonGone();
+        cy.get('.header-bg.box > a').invoke('text').then((text1) => {
+          cy.get('.active + li').first().click().then(() => {
+            cy.get('.header-bg.box > a').invoke('text').then((text2) => {
+              expect(text1).not.to.eq(text2);
             });
+          });
         });
+      });
     });
-    } else {
-        it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
-    }
-  });
+  } else {
+    it.skip(`Tests cannot be run on the selected BASE_MODULE ${baseModule}`);
+  }
+});

frontend/mempool-frontend-config.sample.json

@@ -2,6 +2,7 @@
   "TESTNET_ENABLED": false,
   "SIGNET_ENABLED": false,
   "LIQUID_ENABLED": false,
+  "LIQUID_TESTNET_ENABLED": false,
   "BISQ_ENABLED": false,
   "BISQ_SEPARATE_BACKEND": false,
   "ITEMS_PER_PAGE": 10,
@@ -9,7 +10,10 @@
   "NGINX_PROTOCOL": "http",
   "NGINX_HOSTNAME": "127.0.0.1",
   "NGINX_PORT": "80",
-  "MEMPOOL_BLOCKS_AMOUNT": 8,
   "BLOCK_WEIGHT_UNITS": 4000000,
-  "BASE_MODULE": "mempool"
+  "MEMPOOL_BLOCKS_AMOUNT": 8,
+  "BASE_MODULE": "mempool",
+  "MEMPOOL_WEBSITE_URL": "https://mempool.space",
+  "LIQUID_WEBSITE_URL": "https://liquid.network",
+  "BISQ_WEBSITE_URL": "https://bisq.markets"
 }

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mempool-frontend",
-  "version": "2.3.0-dev",
+  "version": "2.4.0-dev",
   "description": "Bitcoin mempool visualizer and blockchain explorer backend",
   "license": "GNU Affero General Public License v3.0",
   "homepage": "https://mempool.space",
@@ -34,14 +34,17 @@
     "sync-assets": "node sync-assets.js && rsync -av ./dist/mempool/browser/en-US/resources ./dist/mempool/browser/resources",
     "sync-assets-dev": "node sync-assets.js dev",
     "generate-config": "node generate-config.js",
-    "build-mempool.js": "tsc | browserify -p tinyify ./node_modules/@mempool/mempool.js/lib/index.js --standalone mempoolJS > ./dist/mempool/browser/en-US/mempool.js",
+    "build-mempool.js": "npm run build-mempool-js && npm run build-mempool-liquid-js && npm run build-mempool-bisq-js",
+    "build-mempool-js": "browserify -p tinyify ./node_modules/@mempool/mempool.js/lib/index.js --standalone mempoolJS > ./dist/mempool/browser/en-US/mempool.js",
+    "build-mempool-bisq-js": "browserify -p tinyify ./node_modules/@mempool/mempool.js/lib/index-bisq.js --standalone bisqJS > ./dist/mempool/browser/en-US/bisq.js",
+    "build-mempool-liquid-js": "browserify -p tinyify ./node_modules/@mempool/mempool.js/lib/index-liquid.js --standalone liquidJS > ./dist/mempool/browser/en-US/liquid.js",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "npm run generate-config && ng e2e",
     "e2e:ci": "npm run cypress:run:ci",
-    "config:defaults:mempool": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=mempool && npm run generate-config",
-    "config:defaults:liquid": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=liquid && npm run generate-config",
-    "config:defaults:bisq": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=bisq && npm run generate-config",
+    "config:defaults:mempool": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true LIQUID_TESTNET_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=mempool BLOCK_WEIGHT_UNITS=4000000 && npm run generate-config",
+    "config:defaults:liquid": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true LIQUID_TESTNET_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=liquid BLOCK_WEIGHT_UNITS=300000 && npm run generate-config",
+    "config:defaults:bisq": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 BASE_MODULE=bisq BLOCK_WEIGHT_UNITS=4000000 && npm run generate-config",
     "dev:ssr": "npm run generate-config && ng run mempool:serve-ssr",
     "serve:ssr": "node server.run.js",
     "build:ssr": "npm run build && ng run mempool:server:production && ./node_modules/typescript/bin/tsc server.run.ts",
@@ -53,25 +56,25 @@
     "cypress:run:ci": "node update-config.js TESTNET_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true BISQ_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:local-prod 4200 cypress:run:record"
   },
   "dependencies": {
-    "@angular-devkit/build-angular": "^13.0.4",
-    "@angular/animations": "~13.0.3",
+    "@angular-devkit/build-angular": "^13.1.2",
+    "@angular/animations": "~13.1.1",
     "@angular/cli": "~13.0.4",
-    "@angular/common": "~13.0.3",
-    "@angular/compiler": "~13.0.3",
-    "@angular/core": "~13.0.3",
-    "@angular/forms": "~13.0.3",
-    "@angular/localize": "^13.0.3",
-    "@angular/platform-browser": "~13.0.3",
-    "@angular/platform-browser-dynamic": "~13.0.3",
-    "@angular/platform-server": "~13.0.3",
-    "@angular/router": "~13.0.3",
+    "@angular/common": "~13.1.1",
+    "@angular/compiler": "~13.1.1",
+    "@angular/core": "~13.1.1",
+    "@angular/forms": "~13.1.1",
+    "@angular/localize": "^13.1.1",
+    "@angular/platform-browser": "~13.1.1",
+    "@angular/platform-browser-dynamic": "~13.1.1",
+    "@angular/platform-server": "~13.1.1",
+    "@angular/router": "~13.1.1",
     "@fortawesome/angular-fontawesome": "^0.8.2",
     "@fortawesome/fontawesome-common-types": "^0.2.35",
     "@fortawesome/fontawesome-svg-core": "^1.2.35",
     "@fortawesome/free-solid-svg-icons": "^5.15.3",
     "@juggle/resize-observer": "^3.3.1",
-    "@mempool/mempool.js": "^2.2.4",
-    "@ng-bootstrap/ng-bootstrap": "^10.0.0",
+    "@mempool/mempool.js": "2.3.0",
+    "@ng-bootstrap/ng-bootstrap": "^11.0.0",
     "@nguniversal/express-engine": "11.2.1",
     "@types/qrcode": "1.4.1",
     "bootstrap": "4.5.0",
@@ -92,8 +95,8 @@
     "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "~13.0.3",
-    "@angular/language-service": "~13.0.3",
+    "@angular/compiler-cli": "~13.1.1",
+    "@angular/language-service": "~13.1.1",
     "@nguniversal/builders": "^11.2.1",
     "@types/express": "^4.17.0",
     "@types/jasmine": "~3.6.0",
@@ -114,10 +117,10 @@
   },
   "optionalDependencies": {
     "@cypress/schematic": "^1.3.0",
-    "cypress": "^9.1.1",
+    "cypress": "^9.3.1",
     "cypress-fail-on-console-error": "^2.1.3",
     "cypress-wait-until": "^1.7.1",
     "mock-socket": "^9.0.3",
     "start-server-and-test": "^1.12.6"
   }
-}
+}

frontend/proxy.conf.js

@@ -24,6 +24,7 @@ PROXY_CONFIG = [
         '/api/**', '!/api/v1/ws', 
         '!/bisq', '!/bisq/**', '!/bisq/',
         '!/liquid', '!/liquid/**', '!/liquid/',
+        '!/liquidtestnet', '!/liquidtestnet/**', '!/liquidtestnet/',
         '/testnet/api/**', '/signet/api/**'
         ],
         target: "https://mempool.space",
@@ -57,12 +58,21 @@ PROXY_CONFIG = [
         ws: true,
         secure: false,
         changeOrigin: true
+    },
+    {
+        context: ['/api/liquidtestnet**', '/liquidtestnet/api/**'],
+        target: "https://liquid.network",
+        ws: true,
+        secure: false,
+        changeOrigin: true
     }
 ];
 
 if (configContent && configContent.BASE_MODULE == "liquid") {
     PROXY_CONFIG.push({
-        context: ['/resources/pools.json', '/resources/assets.json', '/resources/assets.minimal.json'],
+        context: ['/resources/pools.json',
+            '/resources/assets.json', '/resources/assets.minimal.json',
+            '/resources/assets-testnet.json', '/resources/assets-testnet.minimal.json'],
         target: "https://liquid.network",
         secure: false,
         changeOrigin: true,

frontend/server.ts

@@ -6,7 +6,6 @@ import * as express from 'express';
 import * as fs from 'fs';
 import * as path from 'path';
 import * as domino from 'domino';
-import { createProxyMiddleware } from 'http-proxy-middleware';
 
 import { join } from 'path';
 import { AppServerModule } from './src/main.server';
@@ -66,6 +65,7 @@ export function app(locale: string): express.Express {
   server.get('/mempool-block/*', getLocalizedSSR(indexHtml));
   server.get('/address/*', getLocalizedSSR(indexHtml));
   server.get('/blocks', getLocalizedSSR(indexHtml));
+  server.get('/mining/pools', getLocalizedSSR(indexHtml));
   server.get('/graphs', getLocalizedSSR(indexHtml));
   server.get('/liquid', getLocalizedSSR(indexHtml));
   server.get('/liquid/tx/*', getLocalizedSSR(indexHtml));
@@ -86,6 +86,7 @@ export function app(locale: string): express.Express {
   server.get('/testnet/mempool-block/*', getLocalizedSSR(indexHtml));
   server.get('/testnet/address/*', getLocalizedSSR(indexHtml));
   server.get('/testnet/blocks', getLocalizedSSR(indexHtml));
+  server.get('/testnet/mining/pools', getLocalizedSSR(indexHtml));
   server.get('/testnet/graphs', getLocalizedSSR(indexHtml));
   server.get('/testnet/api', getLocalizedSSR(indexHtml));
   server.get('/testnet/tv', getLocalizedSSR(indexHtml));
@@ -97,6 +98,7 @@ export function app(locale: string): express.Express {
   server.get('/signet/mempool-block/*', getLocalizedSSR(indexHtml));
   server.get('/signet/address/*', getLocalizedSSR(indexHtml));
   server.get('/signet/blocks', getLocalizedSSR(indexHtml));
+  server.get('/signet/mining/pools', getLocalizedSSR(indexHtml));
   server.get('/signet/graphs', getLocalizedSSR(indexHtml));
   server.get('/signet/api', getLocalizedSSR(indexHtml));
   server.get('/signet/tv', getLocalizedSSR(indexHtml));

frontend/src/app/app-routing.module.ts

@@ -22,6 +22,7 @@ import { BisqMasterPageComponent } from './components/bisq-master-page/bisq-mast
 import { SponsorComponent } from './components/sponsor/sponsor.component';
 import { LiquidMasterPageComponent } from './components/liquid-master-page/liquid-master-page.component';
 import { PushTransactionComponent } from './components/push-transaction/push-transaction.component';
+import { PoolRankingComponent } from './components/pool-ranking/pool-ranking.component';
 
 let routes: Routes = [
   {
@@ -58,6 +59,10 @@ let routes: Routes = [
         path: 'blocks',
         component: LatestBlocksComponent,
       },
+      {
+        path: 'mining/pools',
+        component: PoolRankingComponent,
+      },
       {
         path: 'graphs',
         component: StatisticsComponent,
@@ -105,91 +110,6 @@ let routes: Routes = [
       },
     ],
   },
-  {
-    path: 'liquid',
-    children: [
-      {
-        path: '',
-        component: MasterPageComponent,
-        children: [
-          {
-            path: 'tx/push',
-            component: PushTransactionComponent,
-          },
-          {
-            path: '',
-            component: StartComponent,
-            children: [
-              {
-                path: '',
-                component: DashboardComponent
-              },
-              {
-                path: 'tx/:id',
-                component: TransactionComponent
-              },
-              {
-                path: 'block/:id',
-                component: BlockComponent
-              },
-              {
-                path: 'mempool-block/:id',
-                component: MempoolBlockComponent
-              },
-            ],
-          },
-          {
-            path: 'blocks',
-            component: LatestBlocksComponent,
-          },
-          {
-            path: 'graphs',
-            component: StatisticsComponent,
-          },
-          {
-            path: 'address/:id',
-            component: AddressComponent
-          },
-          {
-            path: 'asset/:id',
-            component: AssetComponent
-          },
-          {
-            path: 'assets',
-            component: AssetsComponent,
-          },
-          {
-            path: 'docs/api/:type',
-            component: DocsComponent
-          },
-          {
-            path: 'docs/api',
-            redirectTo: 'docs/api/rest'
-          },
-          {
-            path: 'docs',
-            redirectTo: 'docs/api/rest'
-          },
-          {
-            path: 'api',
-            redirectTo: 'docs/api/rest'
-          },
-        ],
-      },
-      {
-        path: 'tv',
-        component: TelevisionComponent
-      },
-      {
-        path: 'status',
-        component: StatusViewComponent
-      },
-      {
-        path: '**',
-        redirectTo: ''
-      },
-    ]
-  },
   {
     path: 'testnet',
     children: [
@@ -227,6 +147,10 @@ let routes: Routes = [
             path: 'blocks',
             component: LatestBlocksComponent,
           },
+          {
+            path: 'mining/pools',
+            component: PoolRankingComponent,
+          },
           {
             path: 'graphs',
             component: StatisticsComponent,
@@ -305,6 +229,10 @@ let routes: Routes = [
             path: 'blocks',
             component: LatestBlocksComponent,
           },
+          {
+            path: 'mining/pools',
+            component: PoolRankingComponent,
+          },
           {
             path: 'graphs',
             component: StatisticsComponent,
@@ -346,11 +274,6 @@ let routes: Routes = [
       },
     ]
   },
-  {
-    path: 'bisq',
-    component: MasterPageComponent,
-    loadChildren: () => import('./bisq/bisq.module').then(m => m.BisqModule)
-  },
   {
     path: 'tv',
     component: TelevisionComponent,
@@ -466,6 +389,107 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
       },
     ],
   },
+  {
+    path: 'testnet',
+    children: [
+      {
+        path: '',
+        component: LiquidMasterPageComponent,
+        children: [
+          {
+            path: '',
+            component: StartComponent,
+            children: [
+              {
+                path: '',
+                component: DashboardComponent
+              },
+              {
+                path: 'tx/push',
+                component: PushTransactionComponent,
+              },
+              {
+                path: 'tx/:id',
+                component: TransactionComponent
+              },
+              {
+                path: 'block/:id',
+                component: BlockComponent
+              },
+              {
+                path: 'mempool-block/:id',
+                component: MempoolBlockComponent
+              },
+            ],
+          },
+          {
+            path: 'blocks',
+            component: LatestBlocksComponent,
+          },
+          {
+            path: 'graphs',
+            component: StatisticsComponent,
+          },
+          {
+            path: 'address/:id',
+            component: AddressComponent
+          },
+          {
+            path: 'asset/:id',
+            component: AssetComponent
+          },
+          {
+            path: 'assets',
+            component: AssetsComponent,
+          },
+          {
+            path: 'docs/api/:type',
+            component: DocsComponent
+          },
+          {
+            path: 'docs/api',
+            redirectTo: 'docs/api/rest'
+          },
+          {
+            path: 'docs',
+            redirectTo: 'docs/api/rest'
+          },
+          {
+            path: 'api',
+            redirectTo: 'docs/api/rest'
+          },
+          {
+            path: 'about',
+            component: AboutComponent,
+          },
+          {
+            path: 'terms-of-service',
+            component: TermsOfServiceComponent
+          },
+          {
+            path: 'privacy-policy',
+            component: PrivacyPolicyComponent
+          },
+          {
+            path: 'trademark-policy',
+            component: TrademarkPolicyComponent
+          },
+          {
+            path: 'sponsor',
+            component: SponsorComponent,
+          },
+        ],
+      },
+      {
+        path: 'tv',
+        component: TelevisionComponent
+      },
+      {
+        path: 'status',
+        component: StatusViewComponent
+      },
+    ]
+  },
   {
     path: 'tv',
     component: TelevisionComponent

frontend/src/app/app.module.ts

@@ -37,6 +37,7 @@ import { IncomingTransactionsGraphComponent } from './components/incoming-transa
 import { TimeSpanComponent } from './components/time-span/time-span.component';
 import { SeoService } from './services/seo.service';
 import { MempoolGraphComponent } from './components/mempool-graph/mempool-graph.component';
+import { PoolRankingComponent } from './components/pool-ranking/pool-ranking.component';
 import { LbtcPegsGraphComponent } from './components/lbtc-pegs-graph/lbtc-pegs-graph.component';
 import { AssetComponent } from './components/asset/asset.component';
 import { AssetsComponent } from './assets/assets.component';
@@ -46,19 +47,23 @@ import { SharedModule } from './shared/shared.module';
 import { NgbTypeaheadModule } from '@ng-bootstrap/ng-bootstrap';
 import { FeesBoxComponent } from './components/fees-box/fees-box.component';
 import { DashboardComponent } from './dashboard/dashboard.component';
+import { DifficultyComponent } from './components/difficulty/difficulty.component';
 import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
-import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faDatabase, faExchangeAlt, faInfoCircle,
-  faLink, faList, faSearch, faCaretUp, faCaretDown, faTachometerAlt, faThList, faTint, faTv, faAngleDoubleDown, faSortUp, faAngleDoubleUp, faChevronDown, faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook } from '@fortawesome/free-solid-svg-icons';
+import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faHammer, faDatabase, faExchangeAlt, faInfoCircle,
+  faLink, faList, faSearch, faCaretUp, faCaretDown, faTachometerAlt, faThList, faTint, faTv, faAngleDoubleDown, faSortUp, faAngleDoubleUp, faChevronDown, faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook, faListUl } from '@fortawesome/free-solid-svg-icons';
 import { ApiDocsComponent } from './components/docs/api-docs.component';
 import { DocsComponent } from './components/docs/docs.component';
+import { ApiDocsNavComponent } from './components/docs/api-docs-nav.component';
 import { CodeTemplateComponent } from './components/docs/code-template.component';
 import { TermsOfServiceComponent } from './components/terms-of-service/terms-of-service.component';
 import { PrivacyPolicyComponent } from './components/privacy-policy/privacy-policy.component';
 import { TrademarkPolicyComponent } from './components/trademark-policy/trademark-policy.component';
 import { StorageService } from './services/storage.service';
 import { HttpCacheInterceptor } from './services/http-cache.interceptor';
+import { LanguageService } from './services/language.service';
 import { SponsorComponent } from './components/sponsor/sponsor.component';
 import { PushTransactionComponent } from './components/push-transaction/push-transaction.component';
+import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 
 @NgModule({
   declarations: [
@@ -87,6 +92,7 @@ import { PushTransactionComponent } from './components/push-transaction/push-tra
     FeeDistributionGraphComponent,
     IncomingTransactionsGraphComponent,
     MempoolGraphComponent,
+    PoolRankingComponent,
     LbtcPegsGraphComponent,
     AssetComponent,
     AssetsComponent,
@@ -94,6 +100,7 @@ import { PushTransactionComponent } from './components/push-transaction/push-tra
     StatusViewComponent,
     FeesBoxComponent,
     DashboardComponent,
+    DifficultyComponent,
     ApiDocsComponent,
     CodeTemplateComponent,
     TermsOfServiceComponent,
@@ -102,6 +109,7 @@ import { PushTransactionComponent } from './components/push-transaction/push-tra
     SponsorComponent,
     PushTransactionComponent,
     DocsComponent,
+    ApiDocsNavComponent,
   ],
   imports: [
     BrowserModule.withServerTransition({ appId: 'serverApp' }),
@@ -111,6 +119,7 @@ import { PushTransactionComponent } from './components/push-transaction/push-tra
     BrowserAnimationsModule,
     InfiniteScrollModule,
     NgbTypeaheadModule,
+    NgbModule,
     FontAwesomeModule,
     SharedModule,
     NgxEchartsModule.forRoot({
@@ -124,6 +133,7 @@ import { PushTransactionComponent } from './components/push-transaction/push-tra
     AudioService,
     SeoService,
     StorageService,
+    LanguageService,
     { provide: HTTP_INTERCEPTORS, useClass: HttpCacheInterceptor, multi: true }
   ],
   bootstrap: [AppComponent]
@@ -135,6 +145,7 @@ export class AppModule {
     library.addIcons(faTv);
     library.addIcons(faTachometerAlt);
     library.addIcons(faCubes);
+    library.addIcons(faHammer);
     library.addIcons(faCogs);
     library.addIcons(faThList);
     library.addIcons(faList);
@@ -161,5 +172,6 @@ export class AppModule {
     library.addIcons(faAngleRight);
     library.addIcons(faAngleLeft);
     library.addIcons(faBook);
+    library.addIcons(faListUl);
   }
 }

frontend/src/app/assets/assets.component.html

@@ -43,7 +43,7 @@
       <thead>
         <th i18n="Asset name header">Name</th>
         <th i18n="Asset ticker header">Ticker</th>
-        <th i18n="Asset Issuer Domain header">Issuer domain</th>
+        <th class="d-none d-md-block" i18n="Asset Issuer Domain header">Issuer domain</th>
         <th i18n="Asset ID header">Asset ID</th>
       </thead>
       <tbody>

frontend/src/app/assets/assets.component.ts

@@ -7,6 +7,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { merge, combineLatest, Observable } from 'rxjs';
 import { AssetExtended } from '../interfaces/electrs.interface';
 import { SeoService } from '../services/seo.service';
+import { StateService } from '../services/state.service';
 
 @Component({
   selector: 'app-assets',
@@ -15,7 +16,8 @@ import { SeoService } from '../services/seo.service';
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AssetsComponent implements OnInit {
-  nativeAssetId = environment.nativeAssetId;
+  nativeAssetId = this.stateService.network === 'liquidtestnet' ? environment.nativeTestAssetId : environment.nativeAssetId;
+
   assets: AssetExtended[];
   assetsCache: AssetExtended[];
   searchForm: FormGroup;
@@ -34,6 +36,7 @@ export class AssetsComponent implements OnInit {
     private route: ActivatedRoute,
     private router: Router,
     private seoService: SeoService,
+    private stateService: StateService,
   ) { }
 
   ngOnInit() {
@@ -52,12 +55,22 @@ export class AssetsComponent implements OnInit {
       take(1),
       mergeMap(([assets, qp]) => {
         this.assets = Object.values(assets);
-        // @ts-ignore
-        this.assets.push({
-          name: 'Liquid Bitcoin',
-          ticker: 'L-BTC',
-          asset_id: this.nativeAssetId,
-        });
+        if (this.stateService.network === 'liquid') {
+          // @ts-ignore
+          this.assets.push({
+            name: 'Liquid Bitcoin',
+            ticker: 'L-BTC',
+            asset_id: this.nativeAssetId,
+          });
+        } else if (this.stateService.network === 'liquidtestnet') {
+          // @ts-ignore
+          this.assets.push({
+            name: 'Test Liquid Bitcoin',
+            ticker: 'tL-BTC',
+            asset_id: this.nativeAssetId,
+          });
+        }
+
         this.assets = this.assets.sort((a: any, b: any) => a.name.localeCompare(b.name));
         this.assetsCache = this.assets;
         this.searchForm.get('searchText').enable();

frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.html

@@ -105,10 +105,12 @@
   </ng-container>
   </div>
 
-  <app-language-selector *ngIf="stateService.env.BASE_MODULE !== 'bisq'"></app-language-selector>
+  <app-language-selector></app-language-selector>
 
   <div class="text-small text-center mt-3">
     <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
+    |
+    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
   </div>
 
 </div>

frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.ts

@@ -33,7 +33,7 @@ export class BisqMainDashboardComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.seoService.setTitle(`Markets`);
+    this.seoService.resetTitle();
     this.websocketService.want(['blocks']);
 
     this.usdPrice$ = this.stateService.conversions$.asObservable().pipe(

frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html

@@ -7,7 +7,7 @@
       </div>
 
       <span class="tx-link float-left">
-        <a [routerLink]="['/bisq-tx' | relativeUrl, bisqTx.id]">
+        <a [routerLink]="['/tx' | relativeUrl, bisqTx.id]">
           <span class="d-inline d-lg-none">{{ bisqTx.id | shortenString : 24 }}</span>
           <span class="d-none d-lg-inline">{{ bisqTx.id }}</span>
         </a>

frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html

@@ -1,7 +1,7 @@
 <div class="container-xl" (window:resize)="onResize($event)">
   <h1 style="float: left;" i18n>BSQ Transactions</h1>
 
-  <div class="d-block float-right">
+  <div class="d-block float-right" id="filter">
     <form [formGroup]="radioGroupForm">
       <ngx-bootrap-multiselect [options]="txTypeOptions" [settings]="txTypeDropdownSettings" [texts]="txTypeDropdownTexts" formControlName="txTypes"></ngx-bootrap-multiselect>
     </form>
@@ -39,7 +39,7 @@
         </td>
         <td><app-time-since [time]="tx.time / 1000" [fastRender]="true"></app-time-since></td>
         <td class="d-none d-md-block"><a [routerLink]="['/block/' | relativeUrl, tx.blockHash]" [state]="{ data: { blockHeight: tx.blockHeight } }">{{ tx.blockHeight }}</a></td>
-      </tr> 
+      </tr>
     </tbody>
   </table>
 

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

@@ -4,7 +4,7 @@
     <span style="margin-left: auto; margin-right: -20px; margin-bottom: -20px">&trade;</span>
     <img class="logo" src="./resources/mempool-logo-bigger.png" />
     <div class="version">
-      v{{ packetJsonVersion }} [{{ frontendGitCommitHash }}]
+      v{{ packetJsonVersion }} [<a href="https://github.com/mempool/mempool/commit/{{ frontendGitCommitHash }}">{{ frontendGitCommitHash }}</a>]
     </div>
   </div>
 
@@ -23,12 +23,12 @@
     <a target="_blank" href="https://twitter.com/mempool">
       <svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="twitter" class="svg-inline--fa fa-twitter fa-w-16 fa-4x" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg>
     </a>
-    <a target="_blank" href="https://t.me/mempoolspace">
-      <svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="telegram-plane" class="svg-inline--fa fa-telegram-plane fa-w-14 fa-4x" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M446.7 98.6l-67.6 318.8c-5.1 22.5-18.4 28.1-37.3 17.5l-103-75.9-49.7 47.8c-5.5 5.5-10.1 10.1-20.7 10.1l7.4-104.9 190.9-172.5c8.3-7.4-1.8-11.5-12.9-4.1L117.8 284 16.2 252.2c-22.1-6.9-22.5-22.1 4.6-32.7L418.2 66.4c18.4-6.9 34.5 4.1 28.5 32.2z"></path></svg>
-    </a>
     <a target="_blank" href="https://keybase.io/team/mempool">
       <svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="keybase" class="svg-inline--fa fa-keybase fa-w-14 fa-4x" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M286.17 419a18 18 0 1 0 18 18 18 18 0 0 0-18-18zm111.92-147.6c-9.5-14.62-39.37-52.45-87.26-73.71q-9.1-4.06-18.38-7.27a78.43 78.43 0 0 0-47.88-104.13c-12.41-4.1-23.33-6-32.41-5.77-.6-2-1.89-11 9.4-35L198.66 32l-5.48 7.56c-8.69 12.06-16.92 23.55-24.34 34.89a51 51 0 0 0-8.29-1.25c-41.53-2.45-39-2.33-41.06-2.33-50.61 0-50.75 52.12-50.75 45.88l-2.36 36.68c-1.61 27 19.75 50.21 47.63 51.85l8.93.54a214 214 0 0 0-46.29 35.54C14 304.66 14 374 14 429.77v33.64l23.32-29.8a148.6 148.6 0 0 0 14.56 37.56c5.78 10.13 14.87 9.45 19.64 7.33 4.21-1.87 10-6.92 3.75-20.11a178.29 178.29 0 0 1-15.76-53.13l46.82-59.83-24.66 74.11c58.23-42.4 157.38-61.76 236.25-38.59 34.2 10.05 67.45.69 84.74-23.84.72-1 1.2-2.16 1.85-3.22a156.09 156.09 0 0 1 2.8 28.43c0 23.3-3.69 52.93-14.88 81.64-2.52 6.46 1.76 14.5 8.6 15.74 7.42 1.57 15.33-3.1 18.37-11.15C429 443 434 414 434 382.32c0-38.58-13-77.46-35.91-110.92zM142.37 128.58l-15.7-.93-1.39 21.79 13.13.78a93 93 0 0 0 .32 19.57l-22.38-1.34a12.28 12.28 0 0 1-11.76-12.79L107 119c1-12.17 13.87-11.27 13.26-11.32l29.11 1.73a144.35 144.35 0 0 0-7 19.17zm148.42 172.18a10.51 10.51 0 0 1-14.35-1.39l-9.68-11.49-34.42 27a8.09 8.09 0 0 1-11.13-1.08l-15.78-18.64a7.38 7.38 0 0 1 1.34-10.34l34.57-27.18-14.14-16.74-17.09 13.45a7.75 7.75 0 0 1-10.59-1s-3.72-4.42-3.8-4.53a7.38 7.38 0 0 1 1.37-10.34L214 225.19s-18.51-22-18.6-22.14a9.56 9.56 0 0 1 1.74-13.42 10.38 10.38 0 0 1 14.3 1.37l81.09 96.32a9.58 9.58 0 0 1-1.74 13.44zM187.44 419a18 18 0 1 0 18 18 18 18 0 0 0-18-18z"></path></svg>
     </a>
+    <a target="_blank" href="https://matrix.to/#/#mempool:bitcoin.kyoto">
+      <svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="matrix" class="svg-inline--fa fa-matrix fa-w-16 fa-4x" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1536 1792"><path fill="currentColor" d="M40.467 163.152v1465.696H145.92V1664H0V128h145.92v35.152zm450.757 464.64v74.14h2.069c19.79-28.356 43.717-50.215 71.483-65.575 27.765-15.656 59.963-23.336 96-23.336 34.56 0 66.165 6.795 94.818 20.086 28.652 13.293 50.216 37.22 65.28 70.893 16.246-23.926 38.4-45.194 66.166-63.507 27.766-18.314 60.848-27.472 98.954-27.472 28.948 0 55.828 3.545 80.64 10.635 24.812 7.088 45.785 18.314 63.508 33.968 17.722 15.656 31.31 35.742 41.354 60.85 9.747 25.107 14.768 55.236 14.768 90.683v366.573h-150.35V865.28c0-18.314-.59-35.741-2.068-51.987-1.476-16.247-5.316-30.426-11.52-42.24-6.499-12.112-15.656-21.563-28.062-28.653-12.405-7.088-29.242-10.634-50.214-10.634-21.268 0-38.4 4.135-51.397 12.112-12.997 8.27-23.336 18.608-30.72 31.901-7.386 12.997-12.407 27.765-14.77 44.602-2.363 16.542-3.84 33.379-3.84 50.216v305.133H692.971v-307.2c0-16.247-.294-32.197-1.18-48.149-.591-15.95-3.84-30.424-9.157-44.011-5.317-13.293-14.178-24.223-26.585-32.197-12.406-7.976-30.425-12.112-54.646-12.112-7.088 0-16.542 1.478-28.062 4.726-11.52 3.25-23.04 9.157-33.968 18.02-10.93 8.86-20.383 21.563-28.063 38.103-7.68 16.543-11.52 38.4-11.52 65.28v317.834H349.44V627.792zm1004.309 1001.056V163.152H1390.08V128H1536v1536h-145.92v-35.152z"/></svg>
+    </a>
   </div>
 
   <div class="enterprise-sponsor">
@@ -102,6 +102,10 @@
         <img class="image" src="/resources/profile/ronindojo.png" />
         <span>RoninDojo</span>
       </a>
+      <a href="https://github.com/runcitadel/core" target="_blank" title="Citadel">
+        <img class="image" src="/resources/profile/runcitadel.svg" />
+        <span>Citadel</span>
+      </a>
       <a href="https://github.com/spesmilo/electrum" target="_blank" title="Electrum Wallet">
         <img class="image" src="/resources/profile/electrum.jpg" />
         <span>Electrum</span>
@@ -142,10 +146,6 @@
         <img class="image" src="/resources/profile/satpile.jpg" />
         <span>Satpile</span>
       </a>
-      <a href="https://github.com/btcontract/lnwallet" target="_blank" title="Bitcoin Lightning Wallet">
-        <img class="image" src="/resources/profile/blw.png" />
-        <span>BLW</span>
-      </a>
     </div>
   </div>
 
@@ -163,6 +163,20 @@
       </a>
     </div>
   </div>
+
+  <ng-container *ngIf="translators$ | async | keyvalue as translators else loadingSponsors">
+    <div class="community-sponsor">
+      <h3 i18n="about.translators">Project Translators</h3>
+      <div class="wrapper">
+        <ng-template ngFor let-translator [ngForOf]="translators">
+          <a [href]="'https://twitter.com/' + translator.value" target="_blank" [title]="translator.key">
+            <img class="image" [src]="'/api/v1/translators/images/' + translator.value" />
+          </a>
+        </ng-template>
+      </div>
+    </div>
+    <br>
+  </ng-container>
   
   <ng-container *ngIf="allContributors$ | async as contributors else loadingSponsors">
     <div class="contributors">
@@ -178,7 +192,7 @@
     </div>
 
     <div class="maintainers" *ngIf="contributors.core.length">
-      <h3 i18n="about.project_staff">Project Staff</h3>
+      <h3 i18n="about.project_members">Project Members</h3>
       <div class="wrapper">
         <ng-template ngFor let-contributor [ngForOf]="contributors.core">
           <a [href]="'https://github.com/' + contributor.name" target="_blank" [title]="contributor.name">
@@ -206,7 +220,7 @@
 
   <div class="copyright">
     <div class="title">
-      Copyright &copy; 2019-2021<br>
+      Copyright &copy; 2019-2022<br>
       The Mempool Open Source Project
     </div>
     <p>
@@ -240,7 +254,7 @@
   </div>
   
   <div class="footer-version" *ngIf="officialMempoolSpace">
-    {{ (backendInfo$ | async)?.hostname }} (v{{ (backendInfo$ | async )?.version }}) [{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}]
+    {{ (backendInfo$ | async)?.hostname }} (v{{ (backendInfo$ | async )?.version }}) [<a href="https://github.com/mempool/mempool/commit/{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}">{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}</a>]
   </div>
 
 </div>

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

@@ -116,7 +116,7 @@
         &:hover {
           text-decoration: none;
           img {
-            box-shadow: 0px 0px 20px #1bd8f4;
+            transform: scale(1.1);
           }
         }
         img, span{
@@ -180,4 +180,4 @@
 
 .no-about-margin {
   height: 10px;
-}
+}

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

@@ -7,6 +7,7 @@ import { ApiService } from 'src/app/services/api.service';
 import { IBackendInfo } from 'src/app/interfaces/websocket.interface';
 import { Router } from '@angular/router';
 import { map } from 'rxjs/operators';
+import { ITranslators } from 'src/app/interfaces/node-api.interface';
 
 @Component({
   selector: 'app-about',
@@ -17,6 +18,7 @@ import { map } from 'rxjs/operators';
 export class AboutComponent implements OnInit {
   backendInfo$: Observable<IBackendInfo>;
   sponsors$: Observable<any>;
+  translators$: Observable<ITranslators>;
   allContributors$: Observable<any>;
   frontendGitCommitHash = this.stateService.env.GIT_COMMIT_HASH;
   packetJsonVersion = this.stateService.env.PACKAGE_JSON_VERSION;
@@ -38,6 +40,17 @@ export class AboutComponent implements OnInit {
     this.websocketService.want(['blocks']);
 
     this.sponsors$ = this.apiService.getDonation$();
+    this.translators$ = this.apiService.getTranslators$()
+      .pipe(
+        map((translators) => {
+          for (const t in translators) {
+            if (translators[t] === '') {
+              delete translators[t]
+            }
+          }
+          return translators;
+        })
+      );
     this.allContributors$ = this.apiService.getContributor$().pipe(
       map((contributors) => {
         return {

frontend/src/app/components/address/address.component.ts

@@ -99,7 +99,7 @@ export class AddressComponent implements OnInit, OnDestroy {
       .pipe(
         filter((address) => !!address),
         tap((address: Address) => {
-          if (this.stateService.network === 'liquid' && /^([m-zA-HJ-NP-Z1-9]{26,35}|[a-z]{2,5}1[ac-hj-np-z02-9]{8,100}|[a-km-zA-HJ-NP-Z1-9]{80})$/.test(address.address)) {
+          if ((this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet') && /^([m-zA-HJ-NP-Z1-9]{26,35}|[a-z]{2,5}1[ac-hj-np-z02-9]{8,100}|[a-km-zA-HJ-NP-Z1-9]{80})$/.test(address.address)) {
             this.apiService.validateAddress$(address.address)
               .subscribe((addressInfo) => {
                 this.addressInfo = addressInfo;

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

@@ -2,12 +2,13 @@
   <span class="fiat">{{ conversions.USD * (satoshis / 100000000) | currency:'USD':'symbol':'1.2-2' }}</span>
 </ng-container>
 <ng-template #viewFiatVin>
-  <ng-template [ngIf]="network === 'liquid' && (satoshis === undefined || satoshis === null)" [ngIfElse]="default">
+  <ng-template [ngIf]="(network === 'liquid' || network === 'liquidtestnet') && (satoshis === undefined || satoshis === null)" [ngIfElse]="default">
     <span i18n="shared.confidential">Confidential</span>
   </ng-template>
   <ng-template #default>
     &lrm;{{ satoshis / 100000000 | number : digitsInfo }}
     <span class="symbol"><ng-template [ngIf]="network === 'liquid'">L-</ng-template>
+    <ng-template [ngIf]="network === 'liquidtestnet'">tL-</ng-template>
     <ng-template [ngIf]="network === 'testnet'">t</ng-template>
     <ng-template [ngIf]="network === 'signet'">s</ng-template>BTC</span>
   </ng-template>

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

@@ -21,7 +21,7 @@
             <tbody>
               <tr>
                 <td i18n="asset.name|Liquid Asset name">Name</td>
-                <td>{{ assetContract[2] }} ({{ assetContract[1] }})</td>
+                <td class="assetName">{{ assetContract[2] }} ({{ assetContract[1] }})</td>
               </tr>
               <tr>
                 <td i18n="asset.precision|Liquid Asset precision">Precision</td>
@@ -31,26 +31,19 @@
                 <td i18n="asset.issuer|Liquid Asset issuer">Issuer</td>
                 <td><a target="_blank" href="{{ 'http://' + assetContract[0] }}">{{ assetContract[0] }}</a></td>
               </tr>
-              <tr *ngIf="!isNativeAsset">
+              <tr *ngIf="asset.issuance_txin">
                 <td i18n="asset.issuance-tx|Liquid Asset issuance TX">Issuance TX</td>
                 <td><a [routerLink]="['/tx/' | relativeUrl, asset.issuance_txin.txid]">{{ asset.issuance_txin.txid | shortenString : 13 }}</a> <app-clipboard class="d-none d-sm-inline-block" [text]="asset.issuance_txin.txid"></app-clipboard></td>
               </tr>
-            </tbody>
-          </table>
-        </div>
-        <div class="w-100 d-block d-md-none"></div>
-        <div class="col">
-          <table class="table table-borderless table-striped">
-            <tbody>
-              <tr *ngIf="isNativeAsset">
+              <tr *ngIf="isNativeAsset && asset.chain_stats.peg_in_amount">
                 <td i18n="asset.pegged-in|Liquid Asset pegged-in amount">Pegged in</td>
                 <td>{{ formatAmount(asset.chain_stats.peg_in_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
-              <tr *ngIf="isNativeAsset">
+              <tr *ngIf="isNativeAsset && asset.chain_stats.peg_out_amount">
                 <td i18n="asset.pegged-out|Liquid Asset pegged-out amount">Pegged out</td>
                 <td>{{ formatAmount(asset.chain_stats.peg_out_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
-              <tr *ngIf="!isNativeAsset">
+              <tr *ngIf="asset.chain_stats.issued_amount">
                 <td i18n="asset.issued-amount|Liquid Asset issued amount">Issued amount</td>
                 <td *ngIf="!blindedIssuance; else confidentialTd">{{ formatAmount(asset.chain_stats.issued_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
@@ -58,17 +51,24 @@
                 <td i18n="asset.burned-amount|Liquid Asset burned amount">Burned amount</td>
                 <td *ngIf="!blindedIssuance; else confidentialTd">{{ formatAmount(asset.chain_stats.burned_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
-              <tr *ngIf="!isNativeAsset">
+              <tr *ngIf="asset.chain_stats.issued_amount">
                 <td i18n="asset.circulating-amount|Liquid Asset circulating amount">Circulating amount</td>
                 <td *ngIf="!blindedIssuance; else confidentialTd">{{ formatAmount(asset.chain_stats.issued_amount - asset.chain_stats.burned_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
-              <tr *ngIf="isNativeAsset">
+              <tr *ngIf="isNativeAsset && asset.chain_stats.peg_in_amount">
                 <td i18n="asset.circulating-amount|Liquid Asset circulating amount">Circulating amount</td>
                 <td>{{ formatAmount(asset.chain_stats.peg_in_amount - asset.chain_stats.burned_amount - asset.chain_stats.peg_out_amount, assetContract[3]) | number: '1.0-' + assetContract[3] }} {{ assetContract[1] }}</td>
               </tr>
             </tbody>
           </table>
         </div>
+        <div class="w-100 d-block d-md-none"></div>
+        <div class="col icon-holder">
+          <img *ngIf="!imageError; else defaultIcon" class="assetIcon" [src]="'https://liquid.network/api/v1/asset/' + asset.asset_id + '/icon'" (error)="imageError = true">
+          <ng-template #defaultIcon>
+            <fa-icon class="defaultIcon" [icon]="['fas', 'database']" [fixedWidth]="true" size="8x"></fa-icon>
+          </ng-template>
+        </div>
       </div>
 
     </div>
@@ -78,7 +78,7 @@
     <div class="title-tx">
       <h2>
         <ng-template [ngIf]="transactions?.length" i18n="asset.M_of_N">{{ (transactions?.length | number) || '?' }} of {{ txCount | number }}&nbsp;</ng-template>
-        <ng-template [ngIf]="isNativeAsset" [ngIfElse]="defaultAsset" i18n="Liquid native asset transactions title">Peg In/Out and Burn Transactions</ng-template>
+        <ng-template [ngIf]="isNativeAsset && network === 'liquid'" [ngIfElse]="defaultAsset" i18n="Liquid native asset transactions title">Peg In/Out and Burn Transactions</ng-template>
         <ng-template #defaultAsset i18n="Default asset transactions title">Issuance and Burn Transactions</ng-template>
       </h2>
     </div>
@@ -109,28 +109,39 @@
 
   <ng-template [ngIf]="isLoadingAsset && !error">
 
-    <ng-template #loadingTmpl>
-      <div class="col">
-        <table class="table table-borderless table-striped">
-          <tbody>
-            <tr>
-              <td colspan="2"><span class="skeleton-loader"></span></td>
-            </tr>
-            <tr>
-              <td colspan="2"><span class="skeleton-loader"></span></td>
-            </tr>
-            <tr>
-              <td colspan="2"><span class="skeleton-loader"></span></td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </ng-template>
-
     <div class="box">
       <div class="row">
-        <ng-container *ngTemplateOutlet="loadingTmpl"></ng-container>
-        <ng-container *ngTemplateOutlet="loadingTmpl"></ng-container>
+        <div class="col">
+          <table class="table table-borderless table-striped">
+            <tbody>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+              <tr>
+                <td colspan="2"><span class="skeleton-loader"></span></td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+        <div class="w-100 d-block d-md-none"></div>
+        <div class="col icon-holder">
+          <fa-icon class="defaultIcon skeleton" [icon]="['fas', 'database']" [fixedWidth]="true" size="8x"></fa-icon>
+        </div>
       </div>
     </div>
 

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

@@ -50,3 +50,31 @@ h1 {
   }
 }
 
+.assetIcon {
+  height: 150px;
+  margin: 25px;
+  @media (min-width: 768px) {
+    height: 250px;
+    margin: 0;
+  }
+}
+
+.icon-holder {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.defaultIcon {
+  margin: 25px;
+  height: 150px;
+}
+
+.defaultIcon.skeleton {
+  opacity: 0.5;
+}
+
+.assetName {
+  word-break: break-word;
+  white-space: normal;
+}

frontend/src/app/components/asset/asset.component.ts

@@ -20,7 +20,7 @@ import { moveDec } from 'src/app/bitcoin.utils';
 })
 export class AssetComponent implements OnInit, OnDestroy {
   network = '';
-  nativeAssetId = environment.nativeAssetId;
+  nativeAssetId = this.stateService.network === 'liquidtestnet' ? environment.nativeTestAssetId : environment.nativeAssetId;
 
   asset: Asset;
   blindedIssuance: boolean;
@@ -32,6 +32,7 @@ export class AssetComponent implements OnInit, OnDestroy {
   isNativeAsset = false;
   error: any;
   mainSubscription: Subscription;
+  imageError = false;
 
   totalConfirmedTxCount = 0;
   loadedConfirmedTxCount = 0;

frontend/src/app/components/bisq-master-page/bisq-master-page.component.html

@@ -10,38 +10,39 @@
     </ng-container>
   </a>
 
-  <div ngbDropdown (window:resize)="onResize($event)" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED">
+  <div ngbDropdown (window:resize)="onResize($event)" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED || env.LIQUID_TESTNET_ENABLED">
     <button ngbDropdownToggle type="button" class="btn btn-secondary dropdown-toggle-split" aria-haspopup="true">
       <img src="./resources/bisq-logo.png" style="width: 25px; height: 25px;" class="mr-1">
     </button>
     <div ngbDropdownMenu [ngClass]="{'dropdown-menu-right' : isMobile}">
-      <a href="https://mempool.space" ngbDropdownItem class="mainnet"><img src="./resources/bitcoin-logo.png" style="width: 30px;" class="mr-1"> Mainnet</a>
-      <a href="https://mempool.space/signet" ngbDropdownItem *ngIf="env.SIGNET_ENABLED" class="signet"><img src="./resources/signet-logo.png" style="width: 30px;" class="mr-1"> Signet</a>
-      <a href="https://mempool.space/testnet" ngbDropdownItem *ngIf="env.TESTNET_ENABLED" class="testnet"><img src="./resources/testnet-logo.png" style="width: 30px;" class="mr-1"> Testnet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage" ngbDropdownItem class="mainnet"><img src="./resources/bitcoin-logo.png" style="width: 30px;" class="mr-1"> Mainnet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + '/signet'" ngbDropdownItem *ngIf="env.SIGNET_ENABLED" class="signet"><img src="./resources/signet-logo.png" style="width: 30px;" class="mr-1"> Signet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + '/testnet'" ngbDropdownItem *ngIf="env.TESTNET_ENABLED" class="testnet"><img src="./resources/testnet-logo.png" style="width: 30px;" class="mr-1"> Testnet</a>
       <h6 class="dropdown-header" i18n="master-page.layer2-networks-header">Layer 2 Networks</h6>
       <button ngbDropdownItem class="mainnet active" routerLink="/"><img src="./resources/bisq-logo.png" style="width: 30px;" class="mr-1"> Bisq</button>
-      <a href="https://liquid.network" ngbDropdownItem *ngIf="env.LIQUID_ENABLED" class="liquid"><img src="./resources/liquid-logo.png" style="width: 30px;" class="mr-1"> Liquid</a>
+      <a [href]="env.LIQUID_WEBSITE_URL + urlLanguage" ngbDropdownItem *ngIf="env.LIQUID_ENABLED" class="liquid"><img src="./resources/liquid-logo.png" style="width: 30px;" class="mr-1"> Liquid</a>
+      <a [href]="env.LIQUID_WEBSITE_URL + urlLanguage + '/testnet'" ngbDropdownItem *ngIf="env.LIQUID_TESTNET_ENABLED" class="liquidtestnet"><img src="./resources/liquidtestnet-logo.png" style="width: 30px;" class="mr-1"> Liquid Testnet</a>
     </div>
   </div>
 
   <div class="navbar-collapse" id="navbarCollapse">
     <ul class="navbar-nav">
-      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
+      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" id="btn-home">
         <a class="nav-link" [routerLink]="['/' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'tachometer-alt']" [fixedWidth]="true" i18n-title="master-page.dashboard" title="Dashboard"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
+      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" id="btn-transactions">
         <a class="nav-link" [routerLink]="['/transactions']" (click)="collapse()"><fa-icon [icon]="['fas', 'list']" [fixedWidth]="true" i18n-title="master-page.transactions" title="Transactions"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-blocks">
         <a class="nav-link" [routerLink]="['/blocks']" (click)="collapse()"><fa-icon [icon]="['fas', 'cubes']" [fixedWidth]="true" i18n-title="master-page.blocks" title="Blocks"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-stats">
         <a class="nav-link" [routerLink]="['/stats']" (click)="collapse()"><fa-icon [icon]="['fas', 'file-alt']" [fixedWidth]="true"  i18n-title="master-page.stats" title="Stats"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-docs">
         <a class="nav-link" [routerLink]="['/docs']" (click)="collapse()"><fa-icon [icon]="['fas', 'book']" [fixedWidth]="true"  i18n-title="master-page.docs" title="Docs"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-about">
         <a class="nav-link" [routerLink]="['/about']" (click)="collapse()"><fa-icon [icon]="['fas', 'info-circle']" [fixedWidth]="true" i18n-title="master-page.about" title="About"></fa-icon></a>
       </li>
     </ul>

frontend/src/app/components/bisq-master-page/bisq-master-page.component.scss

@@ -102,6 +102,10 @@ nav {
   background-color: #116761;
 }
 
+.liquidtestnet.active {
+  background-color: #494a4a;
+}
+
 .testnet.active {
   background-color: #1d486f;
 }

frontend/src/app/components/bisq-master-page/bisq-master-page.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { Env, StateService } from '../../services/state.service';
 import { Observable } from 'rxjs';
+import { LanguageService } from 'src/app/services/language.service';
 
 @Component({
   selector: 'app-bisq-master-page',
@@ -12,14 +13,17 @@ export class BisqMasterPageComponent implements OnInit {
   navCollapsed = false;
   env: Env;
   isMobile = window.innerWidth <= 767.98;
-  
+  urlLanguage: string;
+
   constructor(
     private stateService: StateService,
+    private languageService: LanguageService,
   ) { }
 
   ngOnInit() {
     this.env = this.stateService.env;
     this.connectionState$ = this.stateService.connectionState$;
+    this.urlLanguage = this.languageService.getLanguageForUrl();
   }
 
   collapse(): void {

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

@@ -81,12 +81,12 @@
               <ng-template [ngIf]="fees !== undefined" [ngIfElse]="loadingFees">
                 <tr>
                   <td i18n="block.total-fees|Total fees in a block">Total fees</td>
-                  <td *ngIf="network !== 'liquid'; else liquidTotalFees"><app-amount [satoshis]="fees * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount> <span class="fiat"><app-fiat [value]="fees * 100000000" digitsInfo="1.0-0"></app-fiat></span></td>
+                  <td *ngIf="network !== 'liquid' && network !== 'liquidtestnet'; else liquidTotalFees"><app-amount [satoshis]="fees * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount> <span class="fiat"><app-fiat [value]="fees * 100000000" digitsInfo="1.0-0"></app-fiat></span></td>
                   <ng-template #liquidTotalFees>
-                    <td>{{ fees * 100000000 | number }} L-sat (<app-fiat [value]="fees * 100000000" digitsInfo="1.2-2"></app-fiat>)</td>
+                    <td><app-amount [satoshis]="fees * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount>&nbsp; <app-fiat [value]="fees * 100000000" digitsInfo="1.2-2"></app-fiat></td>
                   </ng-template>
                 </tr>
-                <tr *ngIf="network !== 'liquid'">
+                <tr *ngIf="network !== 'liquid' && network !== 'liquidtestnet'">
                   <td i18n="block.subsidy-and-fees|Total subsidy and fees in a block">Subsidy + fees:</td>
                   <td>
                     <app-amount [satoshis]="(blockSubsidy + fees) * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount> <span class="fiat"><app-fiat [value]="(blockSubsidy + fees) * 100000000" digitsInfo="1.0-0"></app-fiat></span>
@@ -98,7 +98,7 @@
                   <td i18n="block.total-fees|Total fees in a block">Total fees</td>
                   <td style="width: 75%;"><span class="skeleton-loader"></span></td>
                 </tr>
-                <tr *ngIf="network !== 'liquid'">
+                <tr *ngIf="network !== 'liquid' && network !== 'liquidtestnet'">
                   <td i18n="block.subsidy-and-fees|Total subsidy and fees in a block">Subsidy + fees:</td>
                   <td><span class="skeleton-loader"></span></td>
                 </tr>
@@ -125,7 +125,7 @@
                   <td class="td-width" i18n="transaction.version">Version</td>
                   <td>{{ block.version | decimal2hex }} <span *ngIf="displayTaprootStatus() && hasTaproot(block.version)" class="badge badge-success ml-1" >Taproot</span></td>
                 </tr>
-                <tr *ngIf="network !== 'liquid'">
+                <tr *ngIf="network !== 'liquid' && network !== 'liquidtestnet'">
                   <td i18n="block.bits">Bits</td>
                   <td>{{ block.bits | decimal2hex }}</td>
                 </tr>
@@ -136,7 +136,7 @@
               </tbody>
             </table>
           </div>
-          <div class="col-sm" *ngIf="network !== 'liquid'">
+          <div class="col-sm" *ngIf="network !== 'liquid' && network !== 'liquidtestnet'">
             <table class="table table-borderless table-striped">
               <tbody>
                 <tr>

frontend/src/app/components/block/block.component.ts

@@ -8,6 +8,7 @@ import { Observable, of, Subscription } from 'rxjs';
 import { StateService } from '../../services/state.service';
 import { SeoService } from 'src/app/services/seo.service';
 import { WebsocketService } from 'src/app/services/websocket.service';
+import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe';
 
 @Component({
   selector: 'app-block',
@@ -51,6 +52,7 @@ export class BlockComponent implements OnInit, OnDestroy {
     private stateService: StateService,
     private seoService: SeoService,
     private websocketService: WebsocketService,
+    private relativeUrlPipe: RelativeUrlPipe,
   ) { }
 
   ngOnInit() {
@@ -194,7 +196,7 @@ export class BlockComponent implements OnInit, OnDestroy {
         if (this.showNextBlocklink) {
           this.navigateToNextBlock();
         } else {
-          this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/mempool-block/', '0']);
+          this.router.navigate([this.relativeUrlPipe.transform('/mempool-block'), '0']);
         }
       }
     });
@@ -210,7 +212,7 @@ export class BlockComponent implements OnInit, OnDestroy {
   }
 
   setBlockSubsidy() {
-    if (this.network === 'liquid') {
+    if (this.network === 'liquid' || this.network === 'liquidtestnet') {
       this.blockSubsidy = 0;
       return;
     }
@@ -277,13 +279,13 @@ export class BlockComponent implements OnInit, OnDestroy {
       return;
     }
     const block = this.latestBlocks.find((b) => b.height === this.nextBlockHeight - 2);
-    this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/',
+    this.router.navigate([this.relativeUrlPipe.transform('/block/'),
       block ? block.id : this.block.previousblockhash], { state: { data: { block, blockHeight: this.nextBlockHeight - 2 } } });
   }
 
   navigateToNextBlock() {
     const block = this.latestBlocks.find((b) => b.height === this.nextBlockHeight);
-    this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/',
+    this.router.navigate([this.relativeUrlPipe.transform('/block/'),
       block ? block.id : this.nextBlockHeight], { state: { data: { block, blockHeight: this.nextBlockHeight } } });
   }
 

frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html

@@ -1,7 +1,8 @@
 <div class="blocks-container blockchain-blocks-container" *ngIf="(loadingBlocks$ | async) === false; else loadingBlocksTemplate">
   <div *ngFor="let block of blocks; let i = index; trackBy: trackByBlocksFn" >
     <div class="text-center bitcoin-block mined-block blockchain-blocks-{{ i }}" id="bitcoin-block-{{ block.height }}" [ngStyle]="blockStyles[i]" [class.blink-bg]="(specialBlocks[block.height] !== undefined)">
-      <a [routerLink]="['/block/' | relativeUrl, block.id]" [state]="{ data: { block: block } }" class="blockLink">&nbsp;</a>
+      <a draggable="false" [routerLink]="['/block/' | relativeUrl, block.id]" [state]="{ data: { block: block } }" 
+        class="blockLink" [ngClass]="{'disabled': (this.stateService.blockScrolling$ | async)}">&nbsp;</a>
       <div class="block-height">
         <a [routerLink]="['/block/' | relativeUrl, block.id]" [state]="{ data: { block: block } }">{{ block.height }}</a>
       </div>

frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss

@@ -15,6 +15,10 @@
   text-decoration: none;
 }
 
+.blockLink.disabled {
+  pointer-events: none;
+}
+
 .mined-block {
   position: absolute;
   top: 0px;

frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts

@@ -36,18 +36,19 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
     '': ['#9339f4', '#105fb0'],
     bisq: ['#9339f4', '#105fb0'],
     liquid: ['#116761', '#183550'],
+    'liquidtestnet': ['#494a4a', '#272e46'],
     testnet: ['#1d486f', '#183550'],
     signet: ['#6f1d5d', '#471850'],
   };
 
   constructor(
-    private stateService: StateService,
+    public stateService: StateService,
     private router: Router,
     private cd: ChangeDetectorRef,
   ) { }
 
   ngOnInit() {
-    if (this.stateService.network === 'liquid') {
+    if (this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet') {
       this.feeRounding = '1.0-1';
     }
     this.emptyBlocks.forEach((b) => this.emptyBlockStyles.push(this.getStyleForEmptyBlock(b)));

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

@@ -18,6 +18,11 @@
 .blockchain-wrapper {
   overflow: hidden;
   height: 250px;
+
+  -webkit-user-select: none; /* Safari */        
+  -moz-user-select: none; /* Firefox */
+  -ms-user-select: none; /* IE10+/Edge */
+  user-select: none; /* Standard */
 }
 
 .position-container {
@@ -26,7 +31,7 @@
   top: 75px;
 }
 
-.position-container.liquid {
+.position-container.liquid, .position-container.liquidtestnet {
   left: 420px;
 }
 
@@ -34,7 +39,7 @@
   .position-container {
     left: 95%;
   }
-  .position-container.liquid {
+  .position-container.liquid, .position-container.liquidtestnet {
     left: 50%;
   }
   .position-container.loading {

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

@@ -0,0 +1,87 @@
+<div class="main-title" i18n="dashboard.difficulty-adjustment">Difficulty Adjustment</div>
+<div class="card-wrapper">
+  <div class="card">
+    <div class="card-body more-padding">
+      <div class="difficulty-adjustment-container" *ngIf="(isLoadingWebSocket$ | async) === false && (difficultyEpoch$ | async) as epochData; else loadingDifficulty">
+        <div class="item">
+          <h5 class="card-title" i18n="difficulty-box.remaining">Remaining</h5>
+          <div class="card-text">
+            <ng-container *ngTemplateOutlet="epochData.remainingBlocks === 1 ? blocksSingular : blocksPlural; context: {$implicit: epochData.remainingBlocks }"></ng-container>
+            <ng-template #blocksPlural let-i i18n="shared.blocks">{{ i }} <span class="shared-block">blocks</span></ng-template>
+            <ng-template #blocksSingular let-i i18n="shared.block">{{ i }} <span class="shared-block">block</span></ng-template>
+          </div>
+          <div class="symbol"><app-time-until [time]="epochData.remainingTime" [fastRender]="true"></app-time-until></div>
+        </div>
+        <div class="item">
+          <h5 class="card-title" i18n="difficulty-box.estimate">Estimate</h5>
+          <div *ngIf="epochData.remainingBlocks < 1870; else recentlyAdjusted" class="card-text" [ngStyle]="{'color': epochData.colorAdjustments}">
+            <span *ngIf="epochData.change > 0; else arrowDownDifficulty" >
+              <fa-icon class="retarget-sign" [icon]="['fas', 'caret-up']" [fixedWidth]="true"></fa-icon>
+            </span>
+            <ng-template #arrowDownDifficulty >
+              <fa-icon class="retarget-sign" [icon]="['fas', 'caret-down']" [fixedWidth]="true"></fa-icon>
+            </ng-template>
+            {{ epochData.change | absolute | number: '1.2-2' }}
+            <span class="symbol">%</span>
+          </div>
+          <ng-template #recentlyAdjusted>
+            <div class="card-text">&#8212;</div>
+          </ng-template>
+          <div class="symbol">
+            <span i18n="difficulty-box.previous">Previous</span>:
+            <span [ngStyle]="{'color': epochData.colorPreviousAdjustments}">
+              <span *ngIf="epochData.previousRetarget > 0; else arrowDownPreviousDifficulty" >
+                <fa-icon class="previous-retarget-sign" [icon]="['fas', 'caret-up']" [fixedWidth]="true"></fa-icon>
+              </span>
+              <ng-template #arrowDownPreviousDifficulty >
+                <fa-icon class="previous-retarget-sign" [icon]="['fas', 'caret-down']" [fixedWidth]="true"></fa-icon>
+              </ng-template>
+              {{ epochData.previousRetarget | absolute | number: '1.2-2' }} </span> %
+          </div>
+        </div>
+        <div class="item" *ngIf="showProgress">
+          <h5 class="card-title" i18n="difficulty-box.current-period">Current Period</h5>
+          <div class="card-text">{{ epochData.progress | number: '1.2-2' }} <span class="symbol">%</span></div>
+          <div class="progress small-bar">
+            <div class="progress-bar" role="progressbar" style="width: 15%; background-color: #105fb0" [ngStyle]="{'width': epochData.base}">&nbsp;</div>
+          </div>
+        </div>
+        <div class="item" *ngIf="showHalving">
+          <h5 class="card-title" i18n="difficulty-box.next-halving">Next halving</h5>
+          <div class="card-text">
+            <ng-container *ngTemplateOutlet="epochData.blocksUntilHalving === 1 ? blocksSingular : blocksPlural; context: {$implicit: epochData.blocksUntilHalving }"></ng-container>
+            <ng-template #blocksPlural let-i i18n="shared.blocks">{{ i }} <span class="shared-block">blocks</span></ng-template>
+            <ng-template #blocksSingular let-i i18n="shared.block">{{ i }} <span class="shared-block">block</span></ng-template>
+          </div>
+          <div class="symbol"><app-time-until [time]="epochData.timeUntilHalving" [fastRender]="true"></app-time-until></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<ng-template #loadingDifficulty>
+  <div class="difficulty-skeleton loading-container">
+    <div class="item">
+      <h5 class="card-title" i18n="difficulty-box.remaining">Remaining</h5>
+      <div class="card-text">
+        <div class="skeleton-loader"></div>
+        <div class="skeleton-loader"></div>
+      </div>
+    </div>
+    <div class="item">
+      <h5 class="card-title" i18n="difficulty-box.estimate">Estimate</h5>
+      <div class="card-text">
+        <div class="skeleton-loader"></div>
+        <div class="skeleton-loader"></div>
+      </div>
+    </div>
+    <div class="item">
+      <h5 class="card-title" i18n="difficulty-box.current-period">Current Period</h5>
+      <div class="card-text">
+        <div class="skeleton-loader"></div>
+        <div class="skeleton-loader"></div>
+      </div>
+    </div>
+  </div>
+</ng-template>

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

@@ -0,0 +1,150 @@
+.difficulty-adjustment-container {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  height: 76px;
+  .shared-block {
+    color: #ffffff66;
+    font-size: 12px;
+  }
+  .item {
+    padding: 0 5px;
+    width: 100%;
+    &:nth-child(1) {
+      display: none;
+      @media (min-width: 485px) {
+        display: table-cell;
+      }
+      @media (min-width: 768px) {
+        display: none;
+      }
+      @media (min-width: 992px) {
+        display: table-cell;
+      }
+    }
+  }
+  .card-text {
+    font-size: 22px;
+    margin-top: -9px;
+    position: relative;
+  }
+}
+
+
+.difficulty-skeleton {
+  display: flex;
+  justify-content: space-between;
+  @media (min-width: 376px) {
+    flex-direction: row;
+  }
+  .item {
+    max-width: 150px;
+    margin: 0;
+    width: -webkit-fill-available;
+    @media (min-width: 376px) {
+      margin: 0 auto 0px;
+    }
+    &:first-child{
+      display: none;
+      @media (min-width: 485px) {
+        display: block;
+      }
+      @media (min-width: 768px) {
+        display: none;
+      }
+      @media (min-width: 992px) {
+        display: block;
+      }
+    }
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+  .card-text {
+    .skeleton-loader {
+      width: 100%;
+      display: block;
+      &:first-child {
+        margin: 14px auto 0;
+        max-width: 80px;
+      }
+      &:last-child {
+        margin: 10px auto 0;
+        max-width: 120px;
+      }
+    }
+  }
+}
+
+.card {
+  background-color: #1d1f31;
+  height: 100%;
+}
+
+.card-title {
+  color: #4a68b9;
+  font-size: 1rem;
+}
+
+.progress {
+  display: inline-flex;
+  width: 100%;
+  background-color: #2d3348;
+  height: 1.1rem;
+  max-width: 180px;
+}
+
+.skeleton-loader {
+  max-width: 100%;
+}
+
+.more-padding {
+  padding: 18px;
+}
+
+.small-bar {
+  height: 8px;
+  top: -4px;
+  max-width: 120px;
+}
+
+.loading-container {
+  min-height: 76px;
+}
+
+.main-title {
+  position: relative;
+  color: #ffffff91;
+  margin-top: -13px;
+  font-size: 10px;
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: center;
+  padding-bottom: 3px;
+}
+
+.card-wrapper {
+  .card {
+    height: auto !important;
+  }
+  .card-body {
+    display: flex;
+    flex: inherit;
+    text-align: center;
+    flex-direction: column;
+    justify-content: space-around;
+    padding: 22px 20px;
+  }
+}
+
+.retarget-sign {
+  margin-right: -3px;
+  font-size: 14px;
+  top: -2px;
+  position: relative;
+}
+
+.previous-retarget-sign {
+  margin-right: -2px;
+  font-size: 10px;
+}

frontend/src/app/components/difficulty/difficulty.component.ts

@@ -0,0 +1,121 @@
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
+import { combineLatest, Observable, timer } from 'rxjs';
+import { map, switchMap } from 'rxjs/operators';
+import { StateService } from '../..//services/state.service';
+
+interface EpochProgress {
+  base: string;
+  change: number;
+  progress: string;
+  remainingBlocks: number;
+  newDifficultyHeight: number;
+  colorAdjustments: string;
+  colorPreviousAdjustments: string;
+  timeAvg: string;
+  remainingTime: number;
+  previousRetarget: number;
+  blocksUntilHalving: number;
+  timeUntilHalving: number;
+}
+
+@Component({
+  selector: 'app-difficulty',
+  templateUrl: './difficulty.component.html',
+  styleUrls: ['./difficulty.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class DifficultyComponent implements OnInit {
+  isLoadingWebSocket$: Observable<boolean>;
+  difficultyEpoch$: Observable<EpochProgress>;
+
+  @Input() showProgress: boolean = true;
+  @Input() showHalving: boolean = false;
+
+  constructor(
+    public stateService: StateService,
+  ) { }
+
+  ngOnInit(): void {
+    this.isLoadingWebSocket$ = this.stateService.isLoadingWebSocket$;
+    this.difficultyEpoch$ = timer(0, 1000)
+      .pipe(
+        switchMap(() => combineLatest([
+          this.stateService.blocks$.pipe(map(([block]) => block)),
+          this.stateService.lastDifficultyAdjustment$,
+          this.stateService.previousRetarget$
+        ])),
+        map(([block, DATime, previousRetarget]) => {
+          const now = new Date().getTime() / 1000;
+          const diff = now - DATime;
+          const blocksInEpoch = block.height % 2016;
+          const progress = (blocksInEpoch >= 0) ? (blocksInEpoch / 2016 * 100).toFixed(2) : `100`;
+          const remainingBlocks = 2016 - blocksInEpoch;
+          const newDifficultyHeight = block.height + remainingBlocks;
+
+          let change = 0;
+          if (remainingBlocks < 1870) {
+            if (blocksInEpoch > 0) {
+              change = (600 / (diff / blocksInEpoch ) - 1) * 100;
+            }
+            if (change > 300) {
+              change = 300;
+            }
+            if (change < -75) {
+              change = -75;
+            }
+          }
+
+          const timeAvgDiff = change * 0.1;
+
+          let timeAvgMins = 10;
+          if (timeAvgDiff > 0) {
+            timeAvgMins -= Math.abs(timeAvgDiff);
+          } else {
+            timeAvgMins += Math.abs(timeAvgDiff);
+          }
+
+          const timeAvg = timeAvgMins.toFixed(0);
+          const remainingTime = (remainingBlocks * timeAvgMins * 60 * 1000) + (now * 1000);
+
+          let colorAdjustments = '#ffffff66';
+          if (change > 0) {
+            colorAdjustments = '#3bcc49';
+          }
+          if (change < 0) {
+            colorAdjustments = '#dc3545';
+          }
+
+          let colorPreviousAdjustments = '#dc3545';
+          if (previousRetarget) {
+            if (previousRetarget >= 0) {
+              colorPreviousAdjustments = '#3bcc49';
+            }
+            if (previousRetarget === 0) {
+              colorPreviousAdjustments = '#ffffff66';
+            }
+          } else {
+            colorPreviousAdjustments = '#ffffff66';
+          }
+
+          const blocksUntilHalving = block.height % 210000;
+          const timeUntilHalving = (blocksUntilHalving * timeAvgMins * 60 * 1000) + (now * 1000);
+
+          return {
+            base: `${progress}%`,
+            change,
+            progress,
+            remainingBlocks,
+            timeAvg,
+            colorAdjustments,
+            colorPreviousAdjustments,
+            blocksInEpoch,
+            newDifficultyHeight,
+            remainingTime,
+            previousRetarget,
+            blocksUntilHalving,
+            timeUntilHalving,
+          };
+        })
+      );
+  }
+}

frontend/src/app/components/docs/api-docs-nav.component.html

@@ -0,0 +1,76 @@
+<ng-template [ngIf]="network.val !== 'bisq' && network.val !== 'liquid' && network.val !== 'liquidtestnet'">
+  <p>General</p>
+  <a [routerLink]="['./']" fragment="get-difficulty-adjustment" (click)="collapseItem.toggle()">GET Difficulty Adjustment</a>
+</ng-template>
+
+<ng-template [ngIf]="network.val === 'bisq'">
+  <p>Markets</p>
+  <a [routerLink]="['./']" fragment="get-market-currencies" (click)="collapseItem.toggle()">GET Market Currencies</a>
+  <a [routerLink]="['./']" fragment="get-market-depth" (click)="collapseItem.toggle()">GET Market Depth</a>
+  <a [routerLink]="['./']" fragment="get-market-hloc" (click)="collapseItem.toggle()">GET Market HLOC</a>
+  <a [routerLink]="['./']" fragment="get-markets" (click)="collapseItem.toggle()">GET Markets</a>
+  <a [routerLink]="['./']" fragment="get-market-offers" (click)="collapseItem.toggle()">GET Market Offers</a>
+  <a [routerLink]="['./']" fragment="get-market-ticker" (click)="collapseItem.toggle()">GET Market Ticker</a>
+  <a [routerLink]="['./']" fragment="get-market-trades" (click)="collapseItem.toggle()">GET Market Trades</a>
+  <a [routerLink]="['./']" fragment="get-market-volumes" (click)="collapseItem.toggle()">GET Market Volumes</a>
+</ng-template>
+
+<ng-template [ngIf]="network.val === 'bisq'">
+  <p>General</p>
+  <a [routerLink]="['./']" fragment="get-stats" (click)="collapseItem.toggle()">GET Stats</a>
+</ng-template>
+
+<p>Addresses</p>
+<a [routerLink]="['./']" fragment="get-address" (click)="collapseItem.toggle()">GET Address</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-address-transactions" (click)="collapseItem.toggle()">GET Address Transactions</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-address-transactions-chain" (click)="collapseItem.toggle()">GET Address Transactions Chain</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-address-transactions-mempool" (click)="collapseItem.toggle()">GET Address Transactions Mempool</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-address-utxo" (click)="collapseItem.toggle()">GET Address UTXO</a>
+
+<ng-template [ngIf]="network.val === 'liquid' || network.val === 'liquidtestnet'">
+  <p>Assets</p>
+  <a [routerLink]="['./']" fragment="get-asset" (click)="collapseItem.toggle()">GET Asset</a>
+  <a [routerLink]="['./']" fragment="get-asset-transactions" (click)="collapseItem.toggle()">GET Asset Transactions</a>
+  <a [routerLink]="['./']" fragment="get-asset-supply" (click)="collapseItem.toggle()">GET Asset Supply</a>
+  <a [routerLink]="['./']" fragment="get-asset-icons" (click)="collapseItem.toggle()">GET Asset Icons</a>
+  <a [routerLink]="['./']" fragment="get-asset-icon" (click)="collapseItem.toggle()">GET Asset Icon</a>
+</ng-template>
+
+<p>Blocks</p>
+<a [routerLink]="['./']" fragment="get-block" (click)="collapseItem.toggle()">GET Block</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-header" (click)="collapseItem.toggle()">GET Block Header</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-height" (click)="collapseItem.toggle()">GET Block Height</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-raw" (click)="collapseItem.toggle()">GET Block Raw</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-status" (click)="collapseItem.toggle()">GET Block Status</a>
+<a [routerLink]="['./']" fragment="get-block-tip-height" (click)="collapseItem.toggle()">GET Block Tip Height</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-tip-hash" (click)="collapseItem.toggle()">GET Block Tip Hash</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-transaction-id" (click)="collapseItem.toggle()">GET Block Transaction ID</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-transaction-ids" (click)="collapseItem.toggle()">GET Block Transaction IDs</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-block-transactions" (click)="collapseItem.toggle()">GET Block Transactions</a>
+<a [routerLink]="['./']" fragment="get-blocks" (click)="collapseItem.toggle()">GET Blocks</a>
+
+<ng-template [ngIf]="network.val !== 'bisq'">
+  <p>Fees</p>
+  <a [routerLink]="['./']" fragment="get-mempool-blocks-fees" (click)="collapseItem.toggle()">GET Mempool Blocks Fees</a>
+  <a [routerLink]="['./']" fragment="get-recommended-fees" (click)="collapseItem.toggle()">GET Recommended Fees</a>
+</ng-template>
+
+<ng-template [ngIf]="network.val !== 'bisq'">
+  <p>Mempool</p>
+  <a [routerLink]="['./']" fragment="get-mempool" (click)="collapseItem.toggle()">GET Mempool</a>
+  <a [routerLink]="['./']" fragment="get-mempool-transaction-ids" (click)="collapseItem.toggle()">GET Mempool Transaction IDs</a>
+  <a [routerLink]="['./']" fragment="get-mempool-recent" (click)="collapseItem.toggle()">GET Mempool Recent</a>
+</ng-template>
+
+<p>Transactions</p>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-cpfp" (click)="collapseItem.toggle()">GET Children Pay for Parent</a>
+<a [routerLink]="['./']" fragment="get-transaction" (click)="collapseItem.toggle()">GET Transaction</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-hex" (click)="collapseItem.toggle()">GET Transaction Hex</a>
+<a *ngIf="network.val !== 'bisq' && network.val !== 'liquid' && network.val !== 'liquidtestnet'" [routerLink]="['./']" fragment="get-transaction-merkleblock-proof" (click)="collapseItem.toggle()">GET Transaction Merkleblock Proof</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-merkle-proof" (click)="collapseItem.toggle()">GET Transaction Merkle Proof</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-outspend" (click)="collapseItem.toggle()">GET Transaction Outspend</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-outspends" (click)="collapseItem.toggle()">GET Transaction Outspends</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-raw" (click)="collapseItem.toggle()">GET Transaction Raw</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="get-transaction-status" (click)="collapseItem.toggle()">GET Transaction Status</a>
+<a *ngIf="network.val === 'bisq'" [routerLink]="['./']" fragment="get-transactions" (click)="collapseItem.toggle()">GET Transactions</a>
+<a *ngIf="network.val !== 'bisq'" [routerLink]="['./']" fragment="post-transaction" (click)="collapseItem.toggle()">POST Transaction</a>

frontend/src/app/components/docs/api-docs-nav.component.scss

@@ -0,0 +1,17 @@
+p {
+  color: #4a68b9;
+  font-weight: 700;
+  margin: 10px 0;
+  margin: 15px 0 10px 0;
+}
+
+p:first-child {
+  margin-top: 0
+}
+
+a {
+  color: #fff;
+  text-decoration: none;
+  display: block;
+  margin: 5px 0;
+}

frontend/src/app/components/docs/api-docs-nav.component.ts

@@ -0,0 +1,18 @@
+import { Component, OnInit, Input } from '@angular/core';
+
+@Component({
+  selector: 'app-api-docs-nav',
+  templateUrl: './api-docs-nav.component.html',
+  styleUrls: ['./api-docs-nav.component.scss']
+})
+export class ApiDocsNavComponent implements OnInit {
+
+  @Input() network: any;
+  @Input() collapseItem: any = { toggle: () => {} };
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

frontend/src/app/components/docs/api-docs.component.scss

@@ -22,6 +22,10 @@ li.nav-item {
   }
 }
 
+.no-bottom-space {
+  margin-bottom: 0;
+}
+
 .nav-tabs .nav-link.active {
   border-bottom: 1px solid #fff;
   @media (min-width: 676px){
@@ -72,10 +76,131 @@ li.nav-item {
   padding: 15px;
 }
 
-#restAPI .api-category {
-  margin: 30px 0;
+#doc-nav-desktop {
+  width: 300px;
 }
 
-.api-category h4 {
-  margin-bottom: 15px;
+#doc-nav-desktop.relative {
+  float: left;
+  overflow: hidden;
+}
+
+#doc-nav-desktop.fixed {
+  float: unset;
+  position: fixed;
+  top: 20px;
+  overflow-y: auto;
+  height: calc(100vh - 50px);
+  scrollbar-color: #2d3348 #11131f;
+  scrollbar-width: thin;
+}
+::-webkit-scrollbar {
+  width: 3px;
+}
+::-webkit-scrollbar-track {
+  background: #11131f;
+}
+::-webkit-scrollbar-thumb {
+  background-color: #2d3348;
+  border-radius: 5px;
+  border: none;
+}
+
+.doc-content {
+  width: calc(100% - 330px);
+  float: right;
+}
+
+.endpoint-container:before {
+	display: block;
+ 	content: " ";
+  height: 1px;
+  margin-top: -1px;
+  visibility: hidden;
+}
+
+.endpoint-container .section-header {
+  display: block;
+  background-color: #2d3348;
+  color: #1bd8f4;
+  padding: 1rem 1.3rem 1rem 1.3rem;
+  font-weight: bold;
+  border-radius: 0.25rem;
+  margin: 20px 0 20px 0;
+  font-size: 24px;
+  position: relative;
+}
+.endpoint-container .section-header:hover {
+  text-decoration: none;
+}
+
+.endpoint-container .section-header span {
+  color: #fff;
+  background-color: #653b9c;
+  font-size: 12px;
+  text-transform: uppercase;
+  font-weight: 400;
+  padding: 8px 10px;
+  letter-spacing: 1px;
+  border-radius: 0.25rem;
+  font-family: monospace;
+  float: right;
+}
+
+#doc-nav-mobile {
+  position: fixed;
+  top: 20px;
+  width: calc(100% - 60px);
+  z-index: 100;
+}
+
+#doc-nav-mobile > div {
+  background-color: #2d3348;
+  z-index: 100;
+  border-radius: 0 0 0.5rem 0.5rem;
+  height: 55vh;
+  overflow-y: auto;
+}
+
+#doc-nav-mobile button {
+  width: 100%;
+  background-color: #105fb0;
+  color: #fff;
+  border-color: #105fb0;
+  border-radius: 0.5rem 0.5rem 0 0;
+}
+
+@media (max-width: 992px) {
+
+  .hide-on-mobile {
+    display: none;
+  }
+
+  .doc-content {
+    width: 100%;
+  }
+
+  .endpoint-container .section-header {
+    margin: 40px 0 70px 0;
+  }
+
+  .endpoint-container .section-header span {
+    float: none;
+    position: absolute;
+    top: unset;
+    left: 0;
+    bottom: -50px;
+  }
+
+  .endpoint-container:before {
+    height: 30px;
+    margin-top: -12px;
+  }
+
+}
+
+@media (min-width: 992px) {
+  .hide-on-desktop {
+    display: none;
+  }
 }

frontend/src/app/components/docs/code-template.component.html

@@ -7,7 +7,7 @@
         <pre><code [innerText]="wrapCurlTemplate(code)"></code></pre>
       </ng-template>
     </li>
-    <li ngbNavItem>
+    <li ngbNavItem *ngIf="network !== 'liquidtestnet'">
       <a ngbNavLink>CommonJS</a>
       <ng-template ngbNavContent>
         <div class="subtitle"><ng-container i18n="API Docs code example">Code Example</ng-container> <app-clipboard [text]="wrapCommonJS(code)"></app-clipboard></div>
@@ -18,7 +18,7 @@
       </ng-template>
     </li>
     <li ngbNavItem>
-      <a ngbNavLink>ES Module</a>
+      <a ngbNavLink *ngIf="network !== 'liquidtestnet'">ES Module</a>
       <ng-template ngbNavContent>
         <div class="subtitle"><ng-container i18n="API Docs install lib">Install Package</ng-container> <app-clipboard [text]="wrapImportTemplate()"></app-clipboard></div>
         <div class="links">

frontend/src/app/components/docs/code-template.component.ts

@@ -26,7 +26,7 @@ export class CodeTemplateComponent implements OnInit {
     if (this.network === 'bisq') {
       npmLink = `https://github.com/mempool/mempool.js/tree/main/npm-bisq-js`;
     }
-    if (this.network === 'liquid') {
+    if (this.network === 'liquid' || this.network === 'liquidtestnet') {
       npmLink = `https://github.com/mempool/mempool.js/tree/main/npm-liquid-js`;
     }
     return npmLink;
@@ -37,7 +37,7 @@ export class CodeTemplateComponent implements OnInit {
     if (this.network === 'bisq') {
       npmLink = `https://www.npmjs.org/package/@mempool/bisq.js`;
     }
-    if (this.network === 'liquid') {
+    if (this.network === 'liquid' || this.network === 'liquidtestnet') {
       npmLink = `https://www.npmjs.org/package/@mempool/liquid.js`;
     }
     return npmLink;
@@ -50,7 +50,7 @@ export class CodeTemplateComponent implements OnInit {
       } else {
         codeText = codeText.replace('%{0}', 'bitcoin');
       }
-      if(['', 'main', 'liquid', 'bisq'].includes(this.network)) {
+      if(['', 'main', 'liquid', 'bisq', 'liquidtestnet'].includes(this.network)) {
         codeText = codeText.replace('mempoolJS();', `mempoolJS({
     hostname: '${document.location.hostname}'
   });`);
@@ -119,7 +119,7 @@ export class CodeTemplateComponent implements OnInit {
       if (this.network === 'signet') {
         codeText = this.replaceJSPlaceholder(codeText, code.codeSampleSignet.esModule);
       }
-      if (this.network === 'liquid') {
+      if (this.network === 'liquid' || this.network === 'liquidtestnet') {
         codeText = this.replaceJSPlaceholder(codeText, code.codeSampleLiquid.esModule);
       }
       if (this.network === 'bisq') {
@@ -157,13 +157,17 @@ init();`;
       if (this.network === 'signet') {
         codeText = this.replaceJSPlaceholder(codeText, code.codeSampleSignet.esModule);
       }
-      if (this.network === 'liquid') {
+      if (this.network === 'liquid' || this.network === 'liquidtestnet') {
         codeText = this.replaceJSPlaceholder(codeText, code.codeSampleLiquid.esModule);
       }
       if (this.network === 'bisq') {
         codeText = this.replaceJSPlaceholder(codeText, code.codeSampleBisq.esModule);
       }
 
+      if (code.noWrap) {
+        return codeText;
+      }
+
       let importText = `<script src="https://mempool.space/mempool.js"></script>`;
       if (this.env.BASE_MODULE === 'bisq') {
         importText = `<script src="https://bisq.markets/bisq.js"></script>`;
@@ -236,6 +240,9 @@ yarn add @mempool/liquid.js`;
       if (this.network === 'liquid') {
         return this.replaceCurlPlaceholder(code.codeTemplate.curl, code.codeSampleLiquid);
       }
+      if (this.network === 'liquidtestnet') {
+        return this.replaceCurlPlaceholder(code.codeTemplate.curl, code.codeSampleLiquidTestnet);
+      }
       if (this.network === 'bisq') {
         return this.replaceCurlPlaceholder(code.codeTemplate.curl, code.codeSampleBisq);
       }
@@ -258,6 +265,9 @@ yarn add @mempool/liquid.js`;
     if (this.network === 'liquid') {
       return code.codeSampleLiquid.response;
     }
+    if (this.network === 'liquidtestnet') {
+      return code.codeSampleLiquidTestnet.response;
+    }
     if (this.network === 'bisq') {
       return code.codeSampleBisq.response;
     }
@@ -293,10 +303,18 @@ yarn add @mempool/liquid.js`;
         return `curl -X POST -sSLd "${text}"`;
       }
       return `curl -sSL "${this.hostname}/${this.network}${text}"`;
+    } else if (this.env.BASE_MODULE === 'liquid') {
+      if (this.method === 'post') {
+        if (this.network !== 'liquid') {
+          text = text.replace('/api', `/${this.network}/api`);
+        }
+        return `curl -X POST -sSLd "${text}"`;
+      }
+      return ( this.network === 'liquid' ? `curl -sSL "${this.hostname}${text}"` : `curl -sSL "${this.hostname}/${this.network}${text}"` );
+    } else {
+        return `curl -sSL "${this.hostname}${text}"`;
     }
-    if (this.env.BASE_MODULE !== 'mempool') {
-      return `curl -sSL "${this.hostname}${text}"`;
-    }
+
   }
 
 }

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

@@ -27,5 +27,13 @@
 
     <div id="main-tab-content" [ngbNavOutlet]="nav" class="mt-2"></div>
 
+    <br>
+
+    <div id="footer" class="text-center">
+      <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
+      |
+      <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
+    </div>
+
   </div>
 </div>

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

@@ -1,4 +1,9 @@
 #main-tab-content {
   text-align: left;
   padding-top: 10px;
+  scroll-behavior: smooth;
+}
+
+#footer {
+  clear: both;
 }

frontend/src/app/components/docs/docs.component.ts

@@ -22,6 +22,6 @@ export class DocsComponent implements OnInit {
     const url = this.route.snapshot.url;
     this.activeTab = ( url[2].path === "rest" ) ? 0 : 1;
     this.env = this.stateService.env;
-    this.showWebSocketTab = ( ! ( ( this.env.BASE_MODULE === "bisq" ) || ( this.stateService.network === "bisq" ) ) );
+    this.showWebSocketTab = ( ! ( ( this.env.BASE_MODULE === "bisq" ) || ( this.stateService.network === "bisq" ) || ( this.stateService.network === "liquidtestnet" ) ) );
   }
 }

frontend/src/app/components/fees-box/fees-box.component.ts

@@ -26,7 +26,7 @@ export class FeesBoxComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.defaultFee = this.stateService.network === 'liquid' ? 0.1 : 1;
+    this.defaultFee = this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet' ? 0.1 : 1;
 
     this.isLoadingWebSocket$ = this.stateService.isLoadingWebSocket$;
     this.feeEstimations$ = this.stateService.mempoolBlocks$

frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts

@@ -67,10 +67,12 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
         left: this.left,
       },
       animation: false,
-      dataZoom: [{
+      dataZoom: (this.template === 'widget' && this.isMobile()) ? null : [{
         type: 'inside',
         realtime: true,
+        zoomLock: (this.template === 'widget') ? true : false,
         zoomOnMouseWheel: (this.template === 'advanced') ? true : false,
+        moveOnMouseMove: (this.template === 'widget') ? true : false,
         maxSpan: 100,
         minSpan: 10,
       }, {
@@ -91,6 +93,7 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
         },
       }],
       tooltip: {
+        show: !this.isMobile(),
         trigger: 'axis',
         position: (pos, params, el, elRect, size) => {
           const obj = { top: -20 };
@@ -217,4 +220,8 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
       },
     };
   }
+
+  isMobile() {
+    return window.innerWidth <= 767.98;
+  }
 }

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

@@ -1,8 +1,8 @@
 import { DOCUMENT } from '@angular/common';
 import { ChangeDetectionStrategy, Component, Inject, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
-import { Language, languages } from 'src/app/app.constants';
-import { StateService } from 'src/app/services/state.service';
+import { languages } from 'src/app/app.constants';
+import { LanguageService } from 'src/app/services/language.service';
 
 @Component({
   selector: 'app-language-selector',
@@ -12,42 +12,25 @@ import { StateService } from 'src/app/services/state.service';
 })
 export class LanguageSelectorComponent implements OnInit {
   languageForm: FormGroup;
-  languages: Language[];
+  languages = languages;
 
   constructor(
+    @Inject(DOCUMENT) private document: Document,
     private formBuilder: FormBuilder,
-    private stateService: StateService,
-    @Inject(DOCUMENT) private document: Document
+    private languageService: LanguageService,
   ) { }
 
   ngOnInit() {
-    this.languages = languages;
-
     this.languageForm = this.formBuilder.group({
-      language: ['']
+      language: ['en']
     });
-    this.setLanguageFromUrl();
-  }
-
-  setLanguageFromUrl() {
-    const urlLanguage = this.document.location.pathname.split('/')[1];
-    if (this.languages.map((lang) => lang.code).indexOf(urlLanguage) > -1) {
-      this.languageForm.get('language').setValue(urlLanguage);
-    } else {
-      this.languageForm.get('language').setValue('en');
-    }
+    this.languageForm.get('language').setValue(this.languageService.getLanguage());
   }
 
   changeLanguage() {
-    const language = this.languageForm.get('language').value;
-    try {
-      document.cookie = `lang=${language}; expires=Thu, 18 Dec 2050 12:00:00 UTC; path=/`;
-    } catch (e) { }
-    
-    if (this.stateService.env.BASE_MODULE === 'mempool') {
-      this.document.location.href = `/${language}/${this.stateService.network}`;
-    } else {
-      this.document.location.href = `/${language}`;
-    }
+    const newLang = this.languageForm.get('language').value;
+    this.languageService.setLanguage(newLang);
+    const rawUrlPath = this.languageService.stripLanguageFromUrl(null);
+    this.document.location.href = (newLang !== 'en' ? `/${newLang}` : '') + rawUrlPath;
   }
 }

frontend/src/app/components/liquid-master-page/liquid-master-page.component.html

@@ -1,3 +1,4 @@
+<ng-container *ngIf="{ val: network$ | async } as network">
 <header>
   <nav class="navbar navbar-expand-md navbar-dark bg-dark">
   <a class="navbar-brand" [routerLink]="['/' | relativeUrl]" style="position: relative;">
@@ -10,29 +11,30 @@
     </ng-container>
   </a>
 
-  <div ngbDropdown (window:resize)="onResize($event)" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED">
+  <div ngbDropdown (window:resize)="onResize($event)" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED || env.LIQUID_TESTNET_ENABLED">
     <button ngbDropdownToggle type="button" class="btn btn-secondary dropdown-toggle-split" aria-haspopup="true">
-      <img src="./resources/liquid-logo.png" style="width: 25px; height: 25px;" class="mr-1">
+      <img src="./resources/{{ network.val === '' ? 'liquid' : network.val }}-logo.png" style="width: 25px; height: 25px;" class="mr-1">
     </button>
     <div ngbDropdownMenu [ngClass]="{'dropdown-menu-right' : isMobile}">
-      <a href="https://mempool.space" ngbDropdownItem class="mainnet"><img src="./resources/bitcoin-logo.png" style="width: 30px;" class="mr-1"> Mainnet</a>
-      <a href="https://mempool.space/signet" ngbDropdownItem *ngIf="env.SIGNET_ENABLED" class="signet"><img src="./resources/signet-logo.png" style="width: 30px;" class="mr-1"> Signet</a>
-      <a href="https://mempool.space/testnet" ngbDropdownItem *ngIf="env.TESTNET_ENABLED" class="testnet"><img src="./resources/testnet-logo.png" style="width: 30px;" class="mr-1"> Testnet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage" ngbDropdownItem class="mainnet"><img src="./resources/bitcoin-logo.png" style="width: 30px;" class="mr-1"> Mainnet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + '/signet'" ngbDropdownItem *ngIf="env.SIGNET_ENABLED" class="signet"><img src="./resources/signet-logo.png" style="width: 30px;" class="mr-1"> Signet</a>
+      <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + '/testnet'" ngbDropdownItem *ngIf="env.TESTNET_ENABLED" class="testnet"><img src="./resources/testnet-logo.png" style="width: 30px;" class="mr-1"> Testnet</a>
       <h6 class="dropdown-header" i18n="master-page.layer2-networks-header">Layer 2 Networks</h6>
-      <a href="https://bisq.markets" ngbDropdownItem class="mainnet"><img src="./resources/bisq-logo.png" style="width: 30px;" class="mr-1"> Bisq</a>
-      <button ngbDropdownItem class="liquid active" routerLink="/"><img src="./resources/liquid-logo.png" style="width: 30px;" class="mr-1"> Liquid</button>
+      <a [href]="env.BISQ_WEBSITE_URL + urlLanguage" ngbDropdownItem class="mainnet"><img src="./resources/bisq-logo.png" style="width: 30px;" class="mr-1"> Bisq</a>
+      <button ngbDropdownItem class="liquid" [class.active]="network.val === 'liquid'" routerLink="/"><img src="./resources/liquid-logo.png" style="width: 30px;" class="mr-1"> Liquid</button>
+      <button ngbDropdownItem *ngIf="env.LIQUID_TESTNET_ENABLED" class="liquidtestnet" [class.active]="network.val === 'liquidtestnet'" routerLink="/testnet"><img src="./resources/liquidtestnet-logo.png" style="width: 30px;" class="mr-1"> Liquid Testnet</button>
     </div>
   </div>
 
   <div class="navbar-collapse" id="navbarCollapse">
-    <ul class="navbar-nav liquid">
-      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
+    <ul class="navbar-nav {{ network.val }}">
+      <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" id="btn-home">
         <a class="nav-link" [routerLink]="['/' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'tachometer-alt']" [fixedWidth]="true" i18n-title="master-page.dashboard" title="Dashboard"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-blocks">
         <a class="nav-link" [routerLink]="['/blocks' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'cubes']" [fixedWidth]="true" i18n-title="master-page.blocks" title="Blocks"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-graphs">
         <a class="nav-link" [routerLink]="['/graphs' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'chart-area']" [fixedWidth]="true" i18n-title="master-page.graphs" title="Graphs"></fa-icon></a>
       </li>
       <!--
@@ -40,13 +42,13 @@
         <a class="nav-link" [routerLink]="['/tv' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'tv']" [fixedWidth]="true" i18n-title="master-page.tvview" title="TV view"></fa-icon></a>
       </li>
       -->
-      <li class="nav-item" routerLinkActive="active">
-        <a class="nav-link" [routerLink]="['/assets']" (click)="collapse()"><fa-icon [icon]="['fas', 'database']" [fixedWidth]="true" i18n-title="master-page.assets" title="Assets"></fa-icon></a>
+      <li class="nav-item" routerLinkActive="active" id="btn-assets">
+        <a class="nav-link" [routerLink]="['/assets' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'database']" [fixedWidth]="true" i18n-title="master-page.assets" title="Assets"></fa-icon></a>
       </li>
-      <li [hidden]="isMobile" class="nav-item mr-2" routerLinkActive="active">
+      <li [hidden]="isMobile" class="nav-item mr-2" routerLinkActive="active" id="btn-docs">
         <a class="nav-link" [routerLink]="['/docs' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'book']" [fixedWidth]="true" i18n-title="master-page.docs" title="Docs"></fa-icon></a>
       </li>
-      <li class="nav-item" routerLinkActive="active">
+      <li class="nav-item" routerLinkActive="active" id="btn-about">
         <a class="nav-link" [routerLink]="['/about']" (click)="collapse()"><fa-icon [icon]="['fas', 'info-circle']" [fixedWidth]="true" i18n-title="master-page.about" title="About"></fa-icon></a>
       </li>
     </ul>
@@ -60,3 +62,4 @@
 <router-outlet></router-outlet>
 
 <br>
+</ng-container>

frontend/src/app/components/liquid-master-page/liquid-master-page.component.scss

@@ -102,6 +102,10 @@ nav {
   background-color: #116761;
 }
 
+.liquidtestnet.active {
+  background-color: #494a4a;
+}
+
 .testnet.active {
   background-color: #1d486f;
 }

frontend/src/app/components/liquid-master-page/liquid-master-page.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { Env, StateService } from '../../services/state.service';
-import { Observable} from 'rxjs';
+import { merge, Observable, of} from 'rxjs';
+import { LanguageService } from 'src/app/services/language.service';
 
 @Component({
   selector: 'app-liquid-master-page',
@@ -13,14 +14,19 @@ export class LiquidMasterPageComponent implements OnInit {
   navCollapsed = false;
   isMobile = window.innerWidth <= 767.98;
   officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE;
+  network$: Observable<string>;
+  urlLanguage: string;
 
   constructor(
     private stateService: StateService,
+    private languageService: LanguageService,
   ) { }
 
   ngOnInit() {
     this.env = this.stateService.env;
     this.connectionState$ = this.stateService.connectionState$;
+    this.network$ = merge(of(''), this.stateService.networkChanged$);
+    this.urlLanguage = this.languageService.getLanguageForUrl();
   }
 
   collapse(): void {