machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into knorrium/fix_docker_gha_oom

Browse Source
This commit is contained in:
Felipe Knorr Kuhn 2022-08-12 20:33:32 -07:00
commit b082d81924
No known key found for this signature in database
GPG Key ID: 79619B52BB097C1A
29 changed files with 550 additions and 163 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
backend/src/api/common.ts
View File

@ -1,6 +1,5 @@
import { CpfpInfo, TransactionExtended, TransactionStripped } from '../mempool.interfaces';
import config from '../config';
import { convertChannelId } from './lightning/clightning/clightning-convert';
export class Common {
static nativeAssetId = config.MEMPOOL.NETWORK === 'liquidtestnet' ?
'144c654344aa716d6f3abcc1ca90e5641e4e2a7f633bc09fe3baf64585819a49'
@ -193,16 +192,20 @@ export class Common {
date.setUTCMilliseconds(0);
}
static channelShortIdToIntegerId(id: string): string {
if (config.LIGHTNING.BACKEND === 'lnd') {
return id;
static channelShortIdToIntegerId(channelId: string): string {
if (channelId.indexOf('x') === -1) { // Already an integer id
return channelId;
}
return convertChannelId(id);
if (channelId.indexOf('/') !== -1) { // Topology import
channelId = channelId.slice(0, -2);
}
const s = channelId.split('x').map(part => BigInt(part));
return ((s[0] << 40n) | (s[1] << 16n) | s[2]).toString();
}
/** Decodes a channel id returned by lnd as uint64 to a short channel id */
static channelIntegerIdToShortId(id: string): string {
if (config.LIGHTNING.BACKEND === 'cln') {
if (id.indexOf('x') !== -1) { // Already a short id
return id;
}

2
backend/src/api/explorer/channels.api.ts
View File

@ -448,7 +448,7 @@ class ChannelsApi {
const result = await DB.query<ResultSetHeader>(`
UPDATE channels
SET status = 0
WHERE short_id NOT IN (
WHERE id NOT IN (
${graphChannelsIds.map(id => `"${id}"`).join(',')}
)
AND status != 2

2
backend/src/api/explorer/nodes.api.ts
View File

@ -168,7 +168,7 @@ class NodesApi {
}
}
public async $getNodesISP(groupBy: string, showTor: boolean) {
public async $getNodesISPRanking(groupBy: string, showTor: boolean) {
try {
const orderBy = groupBy === 'capacity' ? `CAST(SUM(capacity) as INT)` : `COUNT(DISTINCT nodes.public_key)`;

2
backend/src/api/explorer/nodes.routes.ts
View File

@ -79,7 +79,7 @@ class NodesRoutes {
return;
}
const nodesPerAs = await nodesApi.$getNodesISP(groupBy, showTor);
const nodesPerAs = await nodesApi.$getNodesISPRanking(groupBy, showTor);
res.header('Pragma', 'public');
res.header('Cache-control', 'public');

13
backend/src/api/lightning/clightning/clightning-convert.ts
View File

@ -1,6 +1,7 @@
import { ILightningApi } from '../lightning-api.interface';
import FundingTxFetcher from '../../../tasks/lightning/sync-tasks/funding-tx-fetcher';
import logger from '../../../logger';
import { Common } from '../../common';
/**
* Convert a clightning "listnode" entry to a lnd node entry
@ -70,14 +71,6 @@ export async function convertAndmergeBidirectionalChannels(clChannels: any[]): P
return consolidatedChannelList;
}
export function convertChannelId(channelId): string {
if (channelId.indexOf('/') !== -1) {
channelId = channelId.slice(0, -2);
}
const s = channelId.split('x').map(part => BigInt(part));
return ((s[0] << 40n) | (s[1] << 16n) | s[2]).toString();
}
/**
* Convert two clightning "getchannels" entries into a full a lnd "describegraph.edges" format
* In this case, clightning knows the channel policy for both nodes
@ -90,7 +83,7 @@ async function buildFullChannel(clChannelA: any, clChannelB: any): Promise<ILigh
const outputIdx = parts[2];
return {
channel_id: clChannelA.short_channel_id,
channel_id: Common.channelShortIdToIntegerId(clChannelA.short_channel_id),
capacity: clChannelA.satoshis,
last_update: lastUpdate,
node1_policy: convertPolicy(clChannelA),
@ -111,7 +104,7 @@ async function buildIncompleteChannel(clChannel: any): Promise<ILightningApi.Cha
const outputIdx = parts[2];
return {
channel_id: clChannel.short_channel_id,
channel_id: Common.channelShortIdToIntegerId(clChannel.short_channel_id),
capacity: clChannel.satoshis,
last_update: clChannel.last_update ?? 0,
node1_policy: convertPolicy(clChannel),

2
backend/src/tasks/lightning/network-sync.service.ts
View File

@ -107,8 +107,6 @@ class NetworkSyncService {
} catch (e) {
logger.err(`Cannot update channel list. Reason: ${(e instanceof Error ? e.message : e)}`);
}
setTimeout(() => { this.$runTasks(); }, 1000 * config.LIGHTNING.STATS_REFRESH_INTERVAL);
}
// This method look up the creation date of the earliest channel of the node

2
backend/src/tasks/lightning/stats-updater.service.ts
View File

@ -25,7 +25,7 @@ class LightningStatsUpdater {
const date = new Date();
Common.setDateMidnight(date);
const networkGraph = await lightningApi.$getNetworkGraph();
LightningStatsImporter.computeNetworkStats(date.getTime() / 1000, networkGraph);
await LightningStatsImporter.computeNetworkStats(date.getTime() / 1000, networkGraph);
logger.info(`Updated latest network stats`);
}

20
backend/src/tasks/lightning/sync-tasks/stats-importer.ts
View File

@ -4,6 +4,8 @@ import { XMLParser } from 'fast-xml-parser';
import logger from '../../../logger';
import fundingTxFetcher from './funding-tx-fetcher';
import config from '../../../config';
import { ILightningApi } from '../../../api/lightning/lightning-api.interface';
import { isIP } from 'net';
const fsPromises = promises;
@ -48,7 +50,7 @@ class LightningStatsImporter {
/**
* Generate LN network stats for one day
*/
public async computeNetworkStats(timestamp: number, networkGraph): Promise<unknown> {
public async computeNetworkStats(timestamp: number, networkGraph: ILightningApi.NetworkGraph): Promise<unknown> {
// Node counts and network shares
let clearnetNodes = 0;
let torNodes = 0;
@ -61,8 +63,8 @@ class LightningStatsImporter {
let isUnnanounced = true;
for (const socket of (node.addresses ?? [])) {
hasOnion = hasOnion || ['torv2', 'torv3'].includes(socket.network);
hasClearnet = hasClearnet || ['ipv4', 'ipv6'].includes(socket.network);
hasOnion = hasOnion || ['torv2', 'torv3'].includes(socket.network) || socket.addr.indexOf('onion') !== -1;
hasClearnet = hasClearnet || ['ipv4', 'ipv6'].includes(socket.network) || [4, 6].includes(isIP(socket.addr.split(':')[0]));
}
if (hasOnion && hasClearnet) {
clearnetTorNodes++;
@ -127,22 +129,28 @@ class LightningStatsImporter {
if (channel.node1_policy !== undefined) { // Coming from the node
for (const policy of [channel.node1_policy, channel.node2_policy]) {
if (policy && policy.fee_rate_milli_msat < 5000) {
if (policy && parseInt(policy.fee_rate_milli_msat, 10) < 5000) {
avgFeeRate += parseInt(policy.fee_rate_milli_msat, 10);
feeRates.push(parseInt(policy.fee_rate_milli_msat, 10));
}
if (policy && policy.fee_base_msat < 5000) {
if (policy && parseInt(policy.fee_base_msat, 10) < 5000) {
avgBaseFee += parseInt(policy.fee_base_msat, 10);
baseFees.push(parseInt(policy.fee_base_msat, 10));
}
}
} else { // Coming from the historical import
// @ts-ignore
if (channel.fee_rate_milli_msat < 5000) {
// @ts-ignore
avgFeeRate += parseInt(channel.fee_rate_milli_msat, 10);
// @ts-ignore
feeRates.push(parseInt(channel.fee_rate_milli_msat), 10);
}
}
// @ts-ignore
if (channel.fee_base_msat < 5000) {
// @ts-ignore
avgBaseFee += parseInt(channel.fee_base_msat, 10);
// @ts-ignore
baseFees.push(parseInt(channel.fee_base_msat), 10);
}
}

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

@ -2,6 +2,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';
import { EnterpriseService } from 'src/app/services/enterprise.service';
@Component({
selector: 'app-bisq-master-page',
@ -18,6 +19,7 @@ export class BisqMasterPageComponent implements OnInit {
constructor(
private stateService: StateService,
private languageService: LanguageService,
private enterpriseService: EnterpriseService,
) { }
ngOnInit() {

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

@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { Env, StateService } from '../../services/state.service';
import { merge, Observable, of} from 'rxjs';
import { LanguageService } from 'src/app/services/language.service';
import { EnterpriseService } from 'src/app/services/enterprise.service';
@Component({
selector: 'app-liquid-master-page',
@ -20,6 +21,7 @@ export class LiquidMasterPageComponent implements OnInit {
constructor(
private stateService: StateService,
private languageService: LanguageService,
private enterpriseService: EnterpriseService,
) { }
ngOnInit() {

6
frontend/src/app/components/pool-ranking/pool-ranking.component.html
View File

@ -76,10 +76,8 @@
</div>
<div [class]="!widget ? 'bottom-padding' : 'pb-0'" class="container pb-lg-0">
<div>
<div [class]="widget ? 'chart-widget' : 'chart'" echarts [initOpts]="chartInitOptions" [options]="chartOptions"
(chartInit)="onChartInit($event)">
</div>
<div [class]="widget ? 'chart-widget' : 'chart'" echarts [initOpts]="chartInitOptions" [options]="chartOptions"
(chartInit)="onChartInit($event)">
</div>
<div class="text-center loadingGraphs" *ngIf="isLoading">

8
frontend/src/app/docs/api-docs/api-docs.component.html
View File

@ -42,16 +42,18 @@
<div class="endpoint">
<div class="subtitle" i18n="Api docs endpoint">Endpoint</div>
<ng-container *ngIf="item.httpRequestMethod === 'GET' && network.val === 'bisq' && item.codeExample.hasOwnProperty('bisq');else liquid_link_example" #bisq_link_example>
<a [href]="wrapUrl(network.val, item.codeExample.bisq)" target="_blank">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
<a [href]="wrapUrl(network.val, item.codeExample.bisq)" target="_blank" rel="nofollow">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
</ng-container>
<ng-template #liquid_link_example>
<ng-container *ngIf="item.httpRequestMethod === 'GET' && network.val === 'liquid' && item.codeExample.hasOwnProperty('liquid');else default_link_example">
<a [href]="wrapUrl(network.val, item.codeExample.liquid)" target="_blank">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
<a [href]="wrapUrl(network.val, item.codeExample.liquid)" target="_blank" rel="nofollow" *ngIf="item.fragment !== 'get-cpfp'">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
<p *ngIf="item.fragment === 'get-cpfp'">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</p>
</ng-container>
</ng-template>
<ng-template #default_link_example>
<ng-container *ngIf="item.httpRequestMethod === 'GET'">
<a [href]="wrapUrl(network.val, item.codeExample.default)" target="_blank">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
<a [href]="wrapUrl(network.val, item.codeExample.default)" target="_blank" rel="nofollow" *ngIf="item.fragment !== 'get-cpfp'">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</a>
<p *ngIf="item.fragment === 'get-cpfp'">{{ item.httpRequestMethod }} {{ baseNetworkUrl }}/api{{ item.urlString }}</p>
</ng-container>
</ng-template>
<div *ngIf="item.httpRequestMethod === 'POST'">{{ item.httpRequestMethod }} {{ item.urlString }}</div>

12
frontend/src/app/docs/api-docs/api-docs.component.ts
View File

@ -50,9 +50,7 @@ export class ApiDocsComponent implements OnInit, AfterViewInit {
document.getElementById( this.route.snapshot.fragment ).scrollIntoView();
}
}
window.addEventListener('scroll', function() {
that.desktopDocsNavPosition = ( window.pageYOffset > 182 ) ? "fixed" : "relative";
}, { passive: true} );
window.addEventListener('scroll', that.onDocScroll, { passive: true });
}, 1 );
}
@ -87,6 +85,14 @@ export class ApiDocsComponent implements OnInit, AfterViewInit {
});
}
ngOnDestroy(): void {
window.removeEventListener('scroll', this.onDocScroll);
}
onDocScroll() {
this.desktopDocsNavPosition = ( window.pageYOffset > 182 ) ? "fixed" : "relative";
}
anchorLinkClick( event: any ) {
let targetId = "";
if( event.target.nodeName === "A" ) {

31
frontend/src/app/lightning/lightning-dashboard/lightning-dashboard.component.html
View File

@ -4,6 +4,7 @@
<div class="row row-cols-1 row-cols-md-2">
<!-- Network capacity/channels/nodes -->
<div class="col">
<div class="main-title">
<span i18n="lightning.statistics-title">Network Statistics</span>&nbsp;
@ -17,6 +18,7 @@
</div>
</div>
<!-- Channels stats -->
<div class="col">
<div class="main-title">
<span i18n="lightning.statistics-title">Channels Statistics</span>&nbsp;
@ -30,29 +32,32 @@
</div>
</div>
<!-- ISP pie chart -->
<div class="col" style="margin-bottom: 1.47rem">
<div class="card graph-card">
<div class="card-body pl-2 pr-2">
<app-nodes-per-isp-chart [widget]="true"></app-nodes-per-isp-chart>
<div class="mt-2"><a [attr.data-cy]="'pool-distribution-view-more'" [routerLink]="['/graphs/lightning/nodes-per-isp' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<div class="card graph-card">
<div class="card-body pl-2 pr-2 pt-1">
<h5 class="card-title mt-3" i18n="lightning.network-history">Lightning network history</h5>
<app-lightning-statistics-chart [widget]=true></app-lightning-statistics-chart>
<app-nodes-networks-chart [widget]=true></app-nodes-networks-chart>
<div class="mt-1"><a [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<app-lightning-statistics-chart [widget]=true></app-lightning-statistics-chart>
<div class="mt-1"><a [routerLink]="['/graphs/lightning/capacity' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<h5 class="card-title">Top Capacity Nodes</h5>
<app-nodes-list [nodes$]="nodesByCapacity$"></app-nodes-list>
<app-nodes-list [nodes$]="nodesByCapacity$" [show]="'mobile-capacity'"></app-nodes-list>
<!-- <div><a [routerLink]="['/lightning/nodes' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div> -->
</div>
</div>
@ -62,7 +67,7 @@
<div class="card">
<div class="card-body">
<h5 class="card-title">Most Connected Nodes</h5>
<app-nodes-list [nodes$]="nodesByChannels$"></app-nodes-list>
<app-nodes-list [nodes$]="nodesByChannels$" [show]="'mobile-channels'"></app-nodes-list>
<!-- <div><a [routerLink]="['/lightning/nodes' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div> -->
</div>
</div>

34
frontend/src/app/lightning/lightning-dashboard/lightning-dashboard.component.scss
View File

@ -14,6 +14,13 @@
background-color: #1d1f31;
}
.graph-card {
height: 100%;
@media (min-width: 992px) {
height: 385px;
}
}
.card-title {
font-size: 1rem;
color: #4a68b9;
@ -22,9 +29,6 @@
color: #4a68b9;
}
.card-body {
padding: 1.25rem 1rem 0.75rem 1rem;
}
.card-body.pool-ranking {
padding: 1.25rem 0.25rem 0.75rem 0.25rem;
}
@ -32,6 +36,21 @@
font-size: 22px;
}
#blockchain-container {
position: relative;
overflow-x: scroll;
overflow-y: hidden;
scrollbar-width: none;
-ms-overflow-style: none;
}
#blockchain-container::-webkit-scrollbar {
display: none;
}
.fade-border {
-webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 80%, transparent 100%)
}
.main-title {
position: relative;
@ -45,7 +64,7 @@
}
.more-padding {
padding: 18px;
padding: 24px 20px !important;
}
.card-wrapper {
@ -78,3 +97,10 @@
.card-text {
font-size: 22px;
}
.title-link, .title-link:hover, .title-link:focus, .title-link:active {
display: block;
margin-bottom: 10px;
text-decoration: none;
color: inherit;
}

13
frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss
View File

@ -30,21 +30,28 @@
}
.widget {
width: 99vw;
width: 90vw;
margin-left: auto;
margin-right: auto;
height: 250px;
-webkit-mask: linear-gradient(0deg, #11131f00 5%, #11131fff 25%);
@media (max-width: 767.98px) {
width: 100vw;
}
}
.widget > .chart {
-webkit-mask: linear-gradient(180deg, #11131f00 0%, #11131fff 20%);
min-height: 250px;
-webkit-mask: linear-gradient(180deg, #11131f00 0%, #11131fff 20%);
@media (max-width: 767.98px) {
padding-bottom: 0px;
}
}
.chart {
min-height: 500px;
width: 100%;
height: 100%;
padding-right: 10px;
@media (max-width: 992px) {
padding-bottom: 25px;
}

40
frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.ts
View File

@ -8,6 +8,7 @@ import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.
import { StateService } from 'src/app/services/state.service';
import { EChartsOption, registerMap } from 'echarts';
import 'echarts-gl';
import { isMobile } from 'src/app/shared/common.utils';
@Component({
selector: 'app-nodes-channels-map',
@ -50,8 +51,15 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
ngOnInit(): void {
this.center = this.style === 'widget' ? [0, 40] : [0, 5];
this.zoom = this.style === 'widget' ? 3.5 : 1.3;
this.zoom = 1.3;
if (this.style === 'widget' && !isMobile()) {
this.zoom = 3.5;
}
if (this.style === 'widget' && isMobile()) {
this.zoom = 1.4;
this.center = [0, 10];
}
if (this.style === 'graph') {
this.seoService.setTitle($localize`Lightning nodes channels world map`);
}
@ -181,7 +189,7 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
center: this.center,
zoom: this.zoom,
tooltip: {
show: true
show: false
},
map: 'world',
roam: this.style === 'widget' ? false : true,
@ -192,18 +200,21 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
scaleLimit: {
min: 1.3,
max: 100000,
},
emphasis: {
disabled: true,
}
},
series: [
{
large: true,
progressive: 200,
type: 'scatter',
data: nodes,
coordinateSystem: 'geo',
geoIndex: 0,
symbolSize: 4,
tooltip: {
show: true,
backgroundColor: 'rgba(17, 19, 31, 1)',
borderRadius: 4,
shadowColor: 'rgba(0, 0, 0, 0.5)',
@ -220,15 +231,15 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
},
itemStyle: {
color: 'white',
borderColor: 'black',
borderWidth: 2,
opacity: 1,
borderColor: 'black',
borderWidth: 0,
},
blendMode: 'lighter',
zlevel: 1,
zlevel: 2,
},
{
large: true,
large: false,
progressive: 200,
silent: true,
type: 'lines',
@ -244,7 +255,7 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
tooltip: {
show: false,
},
zlevel: 2,
zlevel: 1,
}
]
};
@ -285,12 +296,19 @@ export class NodesChannelsMap implements OnInit, OnDestroy {
series: this.chartOptions.series
};
let nodeBorder = 0;
if (this.chartInstance.getOption().geo[0].zoom > 5000) {
nodeBorder = 2;
}
chartOptions.series[0].itemStyle.borderWidth = nodeBorder;
chartOptions.series[0].symbolSize += e.zoom > 1 ? speed * 15 : -speed * 15;
chartOptions.series[0].symbolSize = Math.max(4, Math.min(7, chartOptions.series[0].symbolSize));
chartOptions.series[1].lineStyle.opacity += e.zoom > 1 ? speed : -speed;
chartOptions.series[1].lineStyle.width += e.zoom > 1 ? speed : -speed;
chartOptions.series[0].symbolSize += e.zoom > 1 ? speed * 10 : -speed * 10;
chartOptions.series[1].lineStyle.opacity = Math.max(0.05, Math.min(0.5, chartOptions.series[1].lineStyle.opacity));
chartOptions.series[1].lineStyle.width = Math.max(0.5, Math.min(1, chartOptions.series[1].lineStyle.width));
chartOptions.series[0].symbolSize = Math.max(4, Math.min(5.5, chartOptions.series[0].symbolSize));
this.chartInstance.setOption(chartOptions);
});

8
frontend/src/app/lightning/nodes-list/nodes-list.component.html
View File

@ -3,18 +3,18 @@
<table class="table table-borderless">
<thead>
<th class="alias text-left" i18n="nodes.alias">Alias</th>
<th class="capacity text-right" i18n="node.capacity">Capacity</th>
<th class="channels text-right" i18n="node.channels">Channels</th>
<th class="capacity text-right" [class]="show" i18n="node.capacity">Capacity</th>
<th class="channels text-right" [class]="show" i18n="node.channels">Channels</th>
</thead>
<tbody *ngIf="nodes$ | async as nodes; else skeleton">
<tr *ngFor="let node of nodes; let i = index;">
<td class="alias text-left">
<a [routerLink]="['/lightning/node' | relativeUrl, node.public_key]">{{ node.alias }}</a>
</td>
<td class="capacity text-right">
<td class="capacity text-right" [class]="show">
<app-amount [satoshis]="node.capacity" digitsInfo="1.2-2"></app-amount>
</td>
<td class="channels text-right">
<td class="channels text-right" [class]="show">
{{ node.channels | number }}
</td>
</tr>

11
frontend/src/app/lightning/nodes-list/nodes-list.component.scss
View File

@ -0,0 +1,11 @@
.capacity.mobile-channels {
@media (max-width: 767.98px) {
display: none;
}
}
.channels.mobile-capacity {
@media (max-width: 767.98px) {
display: none;
}
}

1
frontend/src/app/lightning/nodes-list/nodes-list.component.ts
View File

@ -9,6 +9,7 @@ import { Observable } from 'rxjs';
})
export class NodesListComponent implements OnInit {
@Input() nodes$: Observable<any>;
@Input() show: string;
constructor() { }

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

@ -51,8 +51,7 @@
}
.chart-widget {
width: 100%;
height: 100%;
max-height: 270px;
height: 145px;
}
.formRadioGroup {

111
frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.ts
View File

@ -1,5 +1,5 @@
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
import { EChartsOption} from 'echarts';
import { EChartsOption, graphic} from 'echarts';
import { Observable } from 'rxjs';
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
import { formatNumber } from '@angular/common';
@ -9,6 +9,7 @@ import { MiningService } from 'src/app/services/mining.service';
import { download } from 'src/app/shared/graphs.utils';
import { SeoService } from 'src/app/services/seo.service';
import { LightningApiService } from '../lightning-api.service';
import { AmountShortenerPipe } from 'src/app/shared/pipes/amount-shortener.pipe';
@Component({
selector: 'app-nodes-networks-chart',
@ -26,7 +27,7 @@ import { LightningApiService } from '../lightning-api.service';
})
export class NodesNetworksChartComponent implements OnInit {
@Input() right: number | string = 45;
@Input() left: number | string = 55;
@Input() left: number | string = 45;
@Input() widget = false;
miningWindowPreference: string;
@ -51,7 +52,8 @@ export class NodesNetworksChartComponent implements OnInit {
private lightningApiService: LightningApiService,
private formBuilder: FormBuilder,
private storageService: StorageService,
private miningService: MiningService
private miningService: MiningService,
private amountShortenerPipe: AmountShortenerPipe,
) {
}
@ -82,11 +84,17 @@ export class NodesNetworksChartComponent implements OnInit {
.pipe(
tap((response) => {
const data = response.body;
this.prepareChartOptions({
const chartData = {
tor_nodes: data.map(val => [val.added * 1000, val.tor_nodes]),
clearnet_nodes: data.map(val => [val.added * 1000, val.clearnet_nodes]),
unannounced_nodes: data.map(val => [val.added * 1000, val.unannounced_nodes]),
});
};
let maxYAxis = 0;
for (const day of data) {
maxYAxis = Math.max(maxYAxis, day.tor_nodes + day.clearnet_nodes + day.unannounced_nodes);
}
maxYAxis = Math.ceil(maxYAxis / 3000) * 3000;
this.prepareChartOptions(chartData, maxYAxis);
this.isLoading = false;
}),
map((response) => {
@ -100,7 +108,7 @@ export class NodesNetworksChartComponent implements OnInit {
);
}
prepareChartOptions(data) {
prepareChartOptions(data, maxYAxis) {
let title: object;
if (data.tor_nodes.length === 0) {
title = {
@ -110,24 +118,30 @@ export class NodesNetworksChartComponent implements OnInit {
},
text: $localize`:@@23555386d8af1ff73f297e89dd4af3f4689fb9dd:Indexing blocks`,
left: 'center',
top: 'center'
top: 'top',
};
} else if (this.widget) {
title = {
textStyle: {
color: 'grey',
fontSize: 11
},
text: $localize`Nodes per network`,
left: 'center',
top: 11,
zlevel: 10,
};
}
this.chartOptions = {
title: title,
animation: false,
color: [
'#D81B60',
'#039BE5',
'#7CB342',
'#FFB300',
],
grid: {
top: 40,
bottom: this.widget ? 30 : 70,
right: this.right,
left: this.left,
height: this.widget ? 100 : undefined,
top: this.widget ? 10 : 40,
bottom: this.widget ? 0 : 70,
right: (this.isMobile() && this.widget) ? 35 : this.right,
left: (this.isMobile() && this.widget) ? 40 :this.left,
},
tooltip: {
show: !this.isMobile() || !this.widget,
@ -171,7 +185,7 @@ export class NodesNetworksChartComponent implements OnInit {
hideOverlap: true,
}
},
legend: data.tor_nodes.length === 0 ? undefined : {
legend: this.widget || data.tor_nodes.length === 0 ? undefined : {
padding: 10,
data: [
{
@ -207,7 +221,7 @@ export class NodesNetworksChartComponent implements OnInit {
icon: 'roundRect',
},
],
selected: JSON.parse(this.storageService.getValue('nodes_networks_legend')) ?? {
selected: this.widget ? undefined : JSON.parse(this.storageService.getValue('nodes_networks_legend')) ?? {
'Total': true,
'Tor': true,
'Clearnet': true,
@ -218,13 +232,14 @@ export class NodesNetworksChartComponent implements OnInit {
{
type: 'value',
position: 'left',
min: (value) => {
return value.min * 0.9;
},
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val) => {
return `${formatNumber(Math.round(val * 100) / 100, this.locale, '1.0-0')}`;
formatter: (val: number): string => {
if (this.widget) {
return `${this.amountShortenerPipe.transform(val, 0)}`;
} else {
return `${formatNumber(Math.round(val), this.locale, '1.0-0')}`;
}
}
},
splitLine: {
@ -232,8 +247,35 @@ export class NodesNetworksChartComponent implements OnInit {
type: 'dotted',
color: '#ffffff66',
opacity: 0.25,
},
},
max: maxYAxis,
min: 0,
interval: 3000,
},
{
type: 'value',
position: 'right',
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val: number): string => {
if (this.widget) {
return `${this.amountShortenerPipe.transform(val, 0)}`;
} else {
return `${formatNumber(Math.round(val), this.locale, '1.0-0')}`;
}
}
},
splitLine: {
lineStyle: {
type: 'dotted',
color: '#ffffff66',
opacity: 0.25,
},
},
max: maxYAxis,
min: 0,
interval: 3000,
}
],
series: data.tor_nodes.length === 0 ? [] : [
@ -252,7 +294,12 @@ export class NodesNetworksChartComponent implements OnInit {
opacity: 0.5,
},
stack: 'Total',
color: '#FDD835',
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
{ offset: 0, color: '#D81B60' },
{ offset: 1, color: '#D81B60AA' },
]),
smooth: true,
},
{
zlevel: 1,
@ -269,11 +316,15 @@ export class NodesNetworksChartComponent implements OnInit {
opacity: 0.5,
},
stack: 'Total',
color: '#00ACC1',
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
{ offset: 0, color: '#FFB300' },
{ offset: 1, color: '#FFB300AA' },
]),
smooth: true,
},
{
zlevel: 1,
yAxisIndex: 0,
yAxisIndex: 1,
name: $localize`Tor`,
showSymbol: false,
symbol: 'none',
@ -286,7 +337,11 @@ export class NodesNetworksChartComponent implements OnInit {
opacity: 0.5,
},
stack: 'Total',
color: '#7D4698',
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
{ offset: 0, color: '#7D4698' },
{ offset: 1, color: '#7D4698AA' },
]),
smooth: true,
},
],
dataZoom: this.widget ? null : [{

64
frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.html
View File

@ -1,6 +1,29 @@
<div class="full-container h-100">
<div [class]="widget === false ? 'full-container' : ''">
<div class="card-header">
<div *ngIf="widget">
<div class="pool-distribution" *ngIf="(nodesPerAsObservable$ | async) as stats; else loadingReward">
<div class="item">
<h5 class="card-title d-inline-block" i18n="lightning.tagged-isp">Tagged ISPs</h5>
<p class="card-text">
{{ stats.taggedISP }}
</p>
</div>
<div class="item">
<h5 class="card-title d-inline-block" i18n="lightning.tagged-nodes">Tagged nodes</h5>
<p class="card-text" i18n-ngbTooltip="mining.pools-count-desc">
{{ stats.taggedNodeCount }}
</p>
</div>
<div class="item">
<h5 class="card-title d-inline-block" i18n="lightning.tagged-capacity">Tagged capacity</h5>
<p class="card-text" i18n-ngbTooltip="mining.blocks-count-desc">
<app-amount [satoshis]="stats.taggedCapacity" [digitsInfo]="'1.2-2'" [noFiat]="true"></app-amount>
</p>
</div>
</div>
</div>
<div class="card-header" *ngIf="!widget">
<div class="d-flex d-md-block align-items-baseline" style="margin-bottom: -5px">
<span i18n="lightning.nodes-per-isp">Lightning nodes per ISP</span>
<button class="btn p-0 pl-2" style="margin: 0 0 4px 0px" (click)="onSaveChart()">
@ -12,23 +35,21 @@
</small>
</div>
<div class="container pb-lg-0 bottom-padding">
<div class="pb-lg-5" *ngIf="nodesPerAsObservable$ | async">
<div class="chart w-100" echarts [initOpts]="chartInitOptions" [options]="chartOptions"
(chartInit)="onChartInit($event)">
</div>
<div [class]="!widget ? 'bottom-padding' : 'pb-0'" class="container pb-lg-0">
<div [class]="widget ? 'chart-widget' : 'chart'" echarts [initOpts]="chartInitOptions" [options]="chartOptions"
(chartInit)="onChartInit($event)">
</div>
<div class="text-center loadingGraphs" *ngIf="isLoading">
<div class="spinner-border text-light"></div>
</div>
<div class="d-flex toggle">
<div class="d-flex toggle" *ngIf="!widget">
<app-toggle [textLeft]="'Show Tor'" [textRight]="" (toggleStatusChanged)="onTorToggleStatusChanged($event)"></app-toggle>
<app-toggle [textLeft]="'Nodes'" [textRight]="'Capacity'" (toggleStatusChanged)="onGroupToggleStatusChanged($event)"></app-toggle>
</div>
<table class="table table-borderless text-center m-auto" style="max-width: 900px">
<table class="table table-borderless text-center m-auto" style="max-width: 900px" *ngIf="!widget">
<thead>
<tr>
<th class="rank text-left pl-0" i18n="mining.rank">Rank</th>
@ -39,7 +60,7 @@
</tr>
</thead>
<tbody [attr.data-cy]="'pools-table'" *ngIf="(nodesPerAsObservable$ | async) as asList">
<tr *ngFor="let asEntry of asList">
<tr *ngFor="let asEntry of asList.data">
<td class="rank text-left pl-0">{{ asEntry.rank }}</td>
<td class="name text-left text-truncate">
<a *ngIf="asEntry.ispId" [routerLink]="[('/lightning/nodes/isp/' + asEntry.ispId) | relativeUrl]">{{ asEntry.name }}</a>
@ -54,3 +75,26 @@
</div>
</div>
<ng-template #loadingReward>
<div class="pool-distribution">
<div class="item">
<h5 class="card-title" i18n="lightning.tagged-isp">Tagged ISPs</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
<div class="item">
<h5 class="card-title" i18n="lightning.tagged-capacity">Tagged capacity</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
<div class="item">
<h5 class="card-title" i18n="lightning.tagged-nodes">Tagged nodes</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
</div>
</ng-template>

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

@ -22,7 +22,40 @@
max-height: 400px;
@media (max-width: 767.98px) {
max-height: 230px;
margin-top: -35px;
margin-top: -40px;
}
}
.chart-widget {
width: 100%;
height: 100%;
height: 240px;
@media (max-width: 485px) {
max-height: 200px;
}
}
.formRadioGroup {
margin-top: 6px;
display: flex;
flex-direction: column;
@media (min-width: 991px) {
position: relative;
top: -65px;
}
@media (min-width: 830px) and (max-width: 991px) {
position: relative;
top: 0px;
}
@media (min-width: 830px) {
flex-direction: row;
float: right;
margin-top: 0px;
}
.btn-sm {
font-size: 9px;
@media (min-width: 830px) {
font-size: 14px;
}
}
}
@ -35,6 +68,79 @@
};
}
@media (max-width: 767.98px) {
.pools-table th,
.pools-table td {
padding: .3em !important;
}
}
.loadingGraphs {
position: absolute;
top: 50%;
left: calc(50% - 15px);
z-index: 100;
}
.pool-distribution {
min-height: 56px;
display: block;
@media (min-width: 485px) {
display: flex;
flex-direction: row;
}
h5 {
margin-bottom: 5px;
}
.item {
max-width: 160px;
width: 50%;
display: inline-block;
margin: 0px auto 20px;
&:nth-child(2) {
order: 2;
@media (min-width: 485px) {
order: 3;
}
}
&:nth-child(3) {
width: 50%;
order: 3;
@media (min-width: 485px) {
order: 2;
display: block;
}
@media (min-width: 768px) {
display: none;
}
@media (min-width: 992px) {
display: block;
}
}
.card-title {
font-size: 1rem;
color: #4a68b9;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.card-text {
font-size: 18px;
span {
color: #ffffff66;
font-size: 12px;
}
}
}
}
.skeleton-loader {
width: 100%;
display: block;
max-width: 80px;
margin: 15px auto 3px;
}
.rank {
width: 15%;
@media (max-width: 576px) {

58
frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.ts
View File

@ -1,11 +1,12 @@
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone } from '@angular/core';
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone, Input } from '@angular/core';
import { Router } from '@angular/router';
import { EChartsOption, PieSeriesOption } from 'echarts';
import { combineLatest, map, Observable, share, Subject, switchMap, tap } from 'rxjs';
import { combineLatest, map, Observable, share, startWith, Subject, switchMap, tap } from 'rxjs';
import { chartColors } from 'src/app/app.constants';
import { ApiService } from 'src/app/services/api.service';
import { SeoService } from 'src/app/services/seo.service';
import { StateService } from 'src/app/services/state.service';
import { isMobile } from 'src/app/shared/common.utils';
import { download } from 'src/app/shared/graphs.utils';
import { AmountShortenerPipe } from 'src/app/shared/pipes/amount-shortener.pipe';
import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe';
@ -17,6 +18,8 @@ import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class NodesPerISPChartComponent implements OnInit {
@Input() widget: boolean = false;
isLoading = true;
chartOptions: EChartsOption = {};
chartInitOptions = {
@ -46,7 +49,11 @@ export class NodesPerISPChartComponent implements OnInit {
this.seoService.setTitle($localize`Lightning nodes per ISP`);
this.showTorObservable$ = this.showTorSubject.asObservable();
this.nodesPerAsObservable$ = combineLatest([this.groupBySubject, this.showTorSubject])
this.nodesPerAsObservable$ = combineLatest([
this.groupBySubject.pipe(startWith(false)),
this.showTorSubject.pipe(startWith(false)),
])
.pipe(
switchMap((selectedFilters) => {
return this.apiService.getNodesPerAs(
@ -62,23 +69,41 @@ export class NodesPerISPChartComponent implements OnInit {
for (let i = 0; i < data.length; ++i) {
data[i].rank = i + 1;
}
return data.slice(0, 100);
return {
taggedISP: data.length,
taggedCapacity: data.reduce((partialSum, isp) => partialSum + isp.capacity, 0),
taggedNodeCount: data.reduce((partialSum, isp) => partialSum + isp.count, 0),
data: data.slice(0, 100),
};
})
);
}),
share()
);
if (this.widget) {
this.showTorSubject.next(false);
this.groupBySubject.next(false);
}
}
generateChartSerieData(as): PieSeriesOption[] {
const shareThreshold = this.isMobile() ? 2 : 0.5;
let shareThreshold = 0.5;
if (this.widget && isMobile() || isMobile()) {
shareThreshold = 1;
} else if (this.widget) {
shareThreshold = 0.75;
}
const data: object[] = [];
let totalShareOther = 0;
let totalNodeOther = 0;
let edgeDistance: string | number = '10%';
if (this.isMobile()) {
if (isMobile() && this.widget) {
edgeDistance = 0;
} else if (isMobile() && !this.widget || this.widget) {
edgeDistance = 10;
}
as.forEach((as) => {
@ -92,15 +117,16 @@ export class NodesPerISPChartComponent implements OnInit {
color: as.ispId === null ? '#7D4698' : undefined,
},
value: as.share,
name: as.name + (this.isMobile() ? `` : ` (${as.share}%)`),
name: as.name + (isMobile() || this.widget ? `` : ` (${as.share}%)`),
label: {
overflow: 'truncate',
width: isMobile() ? 75 : this.widget ? 125 : 250,
color: '#b1b1b1',
alignTo: 'edge',
edgeDistance: edgeDistance,
},
tooltip: {
show: !this.isMobile(),
show: !isMobile(),
backgroundColor: 'rgba(17, 19, 31, 1)',
borderRadius: 4,
shadowColor: 'rgba(0, 0, 0, 0.5)',
@ -125,7 +151,7 @@ export class NodesPerISPChartComponent implements OnInit {
color: 'grey',
},
value: totalShareOther,
name: 'Other' + (this.isMobile() ? `` : ` (${totalShareOther.toFixed(2)}%)`),
name: 'Other' + (isMobile() || this.widget ? `` : ` (${totalShareOther.toFixed(2)}%)`),
label: {
overflow: 'truncate',
color: '#b1b1b1',
@ -153,7 +179,7 @@ export class NodesPerISPChartComponent implements OnInit {
prepareChartOptions(as): void {
let pieSize = ['20%', '80%']; // Desktop
if (this.isMobile()) {
if (isMobile() && !this.widget) {
pieSize = ['15%', '60%'];
}
@ -177,8 +203,8 @@ export class NodesPerISPChartComponent implements OnInit {
lineStyle: {
width: 2,
},
length: this.isMobile() ? 1 : 20,
length2: this.isMobile() ? 1 : undefined,
length: isMobile() ? 1 : 20,
length2: isMobile() ? 1 : undefined,
},
label: {
fontSize: 14,
@ -204,10 +230,6 @@ export class NodesPerISPChartComponent implements OnInit {
};
}
isMobile(): boolean {
return (window.innerWidth <= 767.98);
}
onChartInit(ec): void {
if (this.chartInstance !== undefined) {
return;
@ -244,5 +266,9 @@ export class NodesPerISPChartComponent implements OnInit {
onGroupToggleStatusChanged(e): void {
this.groupBySubject.next(e);
}
isEllipsisActive(e) {
return (e.offsetWidth < e.scrollWidth);
}
}

3
frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss
View File

@ -51,8 +51,7 @@
}
.chart-widget {
width: 100%;
height: 100%;
max-height: 270px;
height: 145px;
}
.formRadioGroup {

92
frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.ts
View File

@ -9,6 +9,7 @@ import { StorageService } from 'src/app/services/storage.service';
import { MiningService } from 'src/app/services/mining.service';
import { download } from 'src/app/shared/graphs.utils';
import { LightningApiService } from '../lightning-api.service';
import { AmountShortenerPipe } from 'src/app/shared/pipes/amount-shortener.pipe';
@Component({
selector: 'app-lightning-statistics-chart',
@ -25,7 +26,7 @@ import { LightningApiService } from '../lightning-api.service';
})
export class LightningStatisticsChartComponent implements OnInit {
@Input() right: number | string = 45;
@Input() left: number | string = 55;
@Input() left: number | string = 45;
@Input() widget = false;
miningWindowPreference: string;
@ -51,6 +52,7 @@ export class LightningStatisticsChartComponent implements OnInit {
private formBuilder: FormBuilder,
private storageService: StorageService,
private miningService: MiningService,
private amountShortenerPipe: AmountShortenerPipe,
) {
}
@ -105,24 +107,39 @@ export class LightningStatisticsChartComponent implements OnInit {
color: 'grey',
fontSize: 15
},
text: `Indexing in progess`,
text: $localize`Indexing in progess`,
left: 'center',
top: 'center'
};
} else if (this.widget) {
title = {
textStyle: {
color: 'grey',
fontSize: 11
},
text: $localize`Channels & Capacity`,
left: 'center',
top: 11,
zlevel: 10,
};
}
this.chartOptions = {
title: title,
animation: false,
color: [
'#FDD835',
'#D81B60',
'#FFB300',
new graphic.LinearGradient(0, 0.75, 0, 1, [
{ offset: 0, color: '#D81B60' },
{ offset: 1, color: '#D81B60AA' },
]),
],
grid: {
top: 40,
bottom: this.widget ? 30 : 70,
right: this.right,
left: this.left,
height: this.widget ? 100 : undefined,
top: this.widget ? 10 : 40,
bottom: this.widget ? 0 : 70,
right: (this.isMobile() && this.widget) ? 35 : this.right,
left: (this.isMobile() && this.widget) ? 40 :this.left,
},
tooltip: {
show: !this.isMobile(),
@ -166,7 +183,7 @@ export class LightningStatisticsChartComponent implements OnInit {
hideOverlap: true,
}
},
legend: data.channel_count.length === 0 ? undefined : {
legend: this.widget || data.channel_count.length === 0 ? undefined : {
padding: 10,
data: [
{
@ -178,7 +195,7 @@ export class LightningStatisticsChartComponent implements OnInit {
icon: 'roundRect',
},
{
name: 'Capacity (BTC)',
name: 'Capacity',
inactiveColor: 'rgb(110, 112, 121)',
textStyle: {
color: 'white',
@ -188,17 +205,20 @@ export class LightningStatisticsChartComponent implements OnInit {
],
selected: JSON.parse(this.storageService.getValue('sizes_ln_legend')) ?? {
'Channels': true,
'Capacity (BTC)': true,
'Capacity': true,
}
},
yAxis: data.channel_count.length === 0 ? undefined : [
{
min: 0,
type: 'value',
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val) => {
return `${formatNumber(Math.round(val), this.locale, '1.0-0')}`;
formatter: (val: number): string => {
if (this.widget) {
return `${this.amountShortenerPipe.transform(val, 0)}`;
} else {
return `${formatNumber(Math.round(val), this.locale, '1.0-0')}`;
}
}
},
splitLine: {
@ -208,6 +228,7 @@ export class LightningStatisticsChartComponent implements OnInit {
opacity: 0.25,
}
},
minInterval: this.widget ? 20000 : undefined,
},
{
min: 0,
@ -215,8 +236,12 @@ export class LightningStatisticsChartComponent implements OnInit {
position: 'right',
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val) => {
return `${formatNumber(Math.round(val / 100000000), this.locale, '1.0-0')}`;
formatter: (val: number): string => {
if (this.widget) {
return `${this.amountShortenerPipe.transform(Math.round(val / 100000000), 0)}`;
} else {
return `${formatNumber(Math.round(val / 100000000), this.locale, '1.0-0')}`;
}
}
},
splitLine: {
@ -244,20 +269,49 @@ export class LightningStatisticsChartComponent implements OnInit {
opacity: 1,
width: 1,
},
}
},
smooth: true,
},
{
zlevel: 0,
yAxisIndex: 1,
name: 'Capacity (BTC)',
name: $localize`Capacity`,
showSymbol: false,
symbol: 'none',
stack: 'Total',
data: data.capacity,
areaStyle: {},
areaStyle: {
opacity: 0.5,
},
type: 'line',
smooth: true,
}
],
dataZoom: this.widget ? null : [{
type: 'inside',
realtime: true,
zoomLock: true,
maxSpan: 100,
minSpan: 5,
moveOnMouseMove: false,
}, {
showDetail: false,
show: true,
type: 'slider',
brushSelect: false,
realtime: true,
left: 20,
right: 15,
selectedDataBackground: {
lineStyle: {
color: '#fff',
opacity: 0.45,
},
areaStyle: {
opacity: 0,
}
},
}],
};
}

46
frontend/src/app/services/enterprise.service.ts
View File

@ -24,16 +24,16 @@ export class EnterpriseService {
this.subdomain = subdomain;
this.fetchSubdomainInfo();
this.disableSubnetworks();
} else if (document.location.hostname === 'mempool.space') {
} else {
this.insertMatomo();
}
}
getSubdomain() {
getSubdomain(): string {
return this.subdomain;
}
disableSubnetworks() {
disableSubnetworks(): void {
this.stateService.env.TESTNET_ENABLED = false;
this.stateService.env.LIQUID_ENABLED = false;
this.stateService.env.LIQUID_TESTNET_ENABLED = false;
@ -41,7 +41,7 @@ export class EnterpriseService {
this.stateService.env.BISQ_ENABLED = false;
}
fetchSubdomainInfo() {
fetchSubdomainInfo(): void {
this.apiService.getEnterpriseInfo$(this.subdomain).subscribe((info) => {
this.info = info;
this.insertMatomo(info.site_id);
@ -54,14 +54,38 @@ export class EnterpriseService {
});
}
insertMatomo(siteId = 5) {
insertMatomo(siteId?: number): void {
let statsUrl = '//stats.mempool.space/';
if (this.document.location.hostname === 'liquid.network') {
statsUrl = '//stats.liquid.network/';
siteId = 8;
} else if (this.document.location.hostname === 'bisq.markets') {
statsUrl = '//stats.bisq.markets/';
siteId = 7;
if (!siteId) {
switch (this.document.location.hostname) {
case 'mempool.space':
statsUrl = '//stats.mempool.space/';
siteId = 5;
break;
case 'mempool.ninja':
statsUrl = '//stats.mempool.space/';
siteId = 4;
break;
case 'liquid.network':
siteId = 8;
statsUrl = '//stats.liquid.network/';
break;
case 'liquid.place':
siteId = 10;
statsUrl = '//stats.liquid.network/';
break;
case 'bisq.markets':
siteId = 7;
statsUrl = '//stats.bisq.markets/';
break;
case 'bisq.ninja':
statsUrl = '//stats.bisq.markets/';
siteId = 11;
break;
default:
return;
}
}
// @ts-ignore

2
frontend/src/app/shared/pipes/amount-shortener.pipe.ts
View File

@ -5,7 +5,7 @@ import { Pipe, PipeTransform } from '@angular/core';
})
export class AmountShortenerPipe implements PipeTransform {
transform(num: number, ...args: any[]): unknown {
const digits = args[0] || 1;
const digits = args[0] ?? 1;
const unit = args[1] || undefined;
if (num < 1000) {