Merge pull request #6100 from mempool/simon/ng20

Angular 16 -> 20
2026-08-20 13:28:00 +02:00 · 2025-11-18 03:29:01 -06:00 · 2025-11-18 03:29:01 -06:00 · 075cf80933
commit 075cf80933
parent 4cb3a12835 ee2394430f
247 changed files with 13741 additions and 9665 deletions
--- a/backend/package-lock.json
+++ b/backend/package-lock.json
@ -7829,7 +7829,11 @@
      }
    },
    "rust-gbt": {
-      "version": "0.0.1"
+      "name": "gbt",
+      "version": "3.0.1",
+      "engines": {
+        "node": ">= 12"
+      }
    }
  },
  "dependencies": {
--- a/frontend/cypress/support/PageIdleDetector.ts
+++ b/frontend/cypress/support/PageIdleDetector.ts
@ -1,7 +1,7 @@
 // source: chrisp_68 @ https://stackoverflow.com/questions/50525143/how-do-you-reliably-wait-for-page-idle-in-cypress-io-test
 export class PageIdleDetector
 {   
-    defaultOptions: Object = { timeout: 60000 };
+    defaultOptions: object = { timeout: 60000 };

    public WaitForPageToBeIdle(): void
    {
@ -11,7 +11,7 @@ export class PageIdleDetector
        this.WaitForAnimationsToStop();
    }

-    public WaitForPageToLoad(options: Object = this.defaultOptions): void
+    public WaitForPageToLoad(options: object = this.defaultOptions): void
    {
        cy.document(options).should((myDocument: any) =>
        {
@ -19,7 +19,7 @@ export class PageIdleDetector
        });
    }

-    public WaitForAngularRequestsToComplete(options: Object = this.defaultOptions): void
+    public WaitForAngularRequestsToComplete(options: object = this.defaultOptions): void
    {
        cy.window(options).should((myWindow: any) =>
        {
@ -30,7 +30,7 @@ export class PageIdleDetector
        });
    }

-    public WaitForAngularDigestCycleToComplete(options: Object = this.defaultOptions): void
+    public WaitForAngularDigestCycleToComplete(options: object = this.defaultOptions): void
    {
        cy.window(options).should((myWindow: any) =>
        {
@ -41,7 +41,7 @@ export class PageIdleDetector
        });
    }

-    public WaitForAnimationsToStop(options: Object = this.defaultOptions): void
+    public WaitForAnimationsToStop(options: object = this.defaultOptions): void
    {
        cy.get(":animated", options).should("not.exist");
    }
--- a/frontend/eslint.config.js
+++ b/frontend/eslint.config.js
@ -0,0 +1,92 @@
+import js from '@eslint/js';
+import tsParser from '@typescript-eslint/parser';
+import tsPlugin from '@typescript-eslint/eslint-plugin';
+
+// Flat config migrated from legacy .eslintrc
+export default [
+  {
+    ignores: [
+      'node_modules/**',
+      'dist/**',
+      'src/resources/**',
+      // Keep parity with legacy .eslintignore
+      'frontend/**',
+      'server.run.js',
+    ],
+  },
+  js.configs.recommended,
+  // Node globals for local JS utility scripts in this package
+  {
+    // Apply to all JS files in this package (including nested ones)
+    files: ['**/*.js', '**/*.cjs', '**/*.mjs'],
+    languageOptions: {
+      globals: {
+        require: 'readonly',
+        module: 'readonly',
+        process: 'readonly',
+        __dirname: 'readonly',
+        __filename: 'readonly',
+        Buffer: 'readonly',
+        console: 'readonly',
+        InitWally: 'readonly',
+        document: 'readonly',
+        window: 'readonly',
+      },
+    },
+  },
+  {
+    files: ['**/*.ts'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        sourceType: 'module',
+      },
+      // Make common browser globals available in TS as well
+      globals: {
+        document: 'readonly',
+        window: 'readonly',
+      },
+    },
+    plugins: {
+      '@typescript-eslint': tsPlugin,
+    },
+    rules: {
+      // Adjust base recommended rules for TypeScript (matches legacy extends: plugin:@typescript-eslint/eslint-recommended)
+      ...tsPlugin.configs['eslint-recommended']?.overrides?.[0]?.rules,
+      // Start from @typescript-eslint's recommended rules
+      ...tsPlugin.configs.recommended.rules,
+
+      // Project-specific rules migrated from .eslintrc
+      '@typescript-eslint/ban-ts-comment': 'warn',
+      '@typescript-eslint/no-empty-function': 'warn',
+      '@typescript-eslint/no-explicit-any': 'warn',
+      '@typescript-eslint/no-inferrable-types': 'off',
+      '@typescript-eslint/no-namespace': 'warn',
+      '@typescript-eslint/no-this-alias': 'warn',
+      '@typescript-eslint/no-var-requires': 'warn',
+      '@typescript-eslint/explicit-function-return-type': 'warn',
+      '@typescript-eslint/no-unused-vars': 'warn',
+      '@typescript-eslint/no-unused-expressions': 'warn',
+      '@typescript-eslint/no-require-imports': 'warn',
+      '@typescript-eslint/no-unsafe-function-type': 'warn',
+      'no-case-declarations': 'warn',
+      'no-console': 'warn',
+      'no-constant-condition': 'warn',
+      'no-dupe-else-if': 'warn',
+      'no-empty': 'warn',
+      'no-extra-boolean-cast': 'warn',
+      'no-prototype-builtins': 'warn',
+      'no-self-assign': 'warn',
+      'no-useless-catch': 'warn',
+      'no-var': 'warn',
+      'prefer-const': 'warn',
+      'prefer-rest-params': 'warn',
+      'quotes': ['warn', 'single', { allowTemplateLiterals: true }],
+      'semi': 'warn',
+      'curly': ['warn', 'all'],
+      'eqeqeq': 'warn',
+      'no-trailing-spaces': 'warn',
+    },
+  },
+];
--- a/frontend/generate-config.js
+++ b/frontend/generate-config.js
@ -29,7 +29,7 @@ if (configContent && configContent.CUSTOMIZATION) {
  try {
    customConfig = readConfig(configContent.CUSTOMIZATION);
    customConfigContent = JSON.parse(customConfig);
-  } catch (e) {
+  } catch {
    console.log(`failed to load customization config from ${configContent.CUSTOMIZATION}`);
  }
 }
@ -54,7 +54,7 @@ try {
  throw new Error(e);
 }

-for (setting in configContent) {
+for (const setting in configContent) {
  settings.push({
    key: setting,
    value: configContent[setting]
@ -98,7 +98,7 @@ function readConfig(path) {
  try {
    const currentConfig = fs.readFileSync(path).toString().trim();
    return currentConfig;
-  } catch (e) {
+  } catch {
    return false;
  }
 }
@ -136,13 +136,11 @@ writeConfig(GENERATED_CUSTOMIZATION_FILE_NAME, customConfigJs);

 if (currentConfig && currentConfig === newConfig) {
  console.log(`No configuration updates, skipping ${GENERATED_CONFIG_FILE_NAME} file update`);
-  return;
 } else if (!currentConfig) {
  console.log(`${GENERATED_CONFIG_FILE_NAME} file not found, creating new config file`);
  console.log('CONFIG: ', newConfig);
  writeConfig(GENERATED_CONFIG_FILE_NAME, newConfig);
  console.log(`${GENERATED_CONFIG_FILE_NAME} file saved`);
-  return;
 } else {
  console.log(`Configuration changes detected, updating ${GENERATED_CONFIG_FILE_NAME} file`);
  console.log('OLD CONFIG: ', currentConfig);
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
--- a/frontend/package.json
+++ b/frontend/package.json
@ -60,54 +60,54 @@
    "cypress:run:ci:parameterized": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:parameterized 4200 cypress:run:record"
  },
  "dependencies": {
-    "@angular-devkit/build-angular": "^17.3.1",
-    "@angular/animations": "^17.3.1",
-    "@angular/cli": "^17.3.1",
-    "@angular/common": "^17.3.1",
-    "@angular/compiler": "^17.3.1",
-    "@angular/core": "^17.3.1",
-    "@angular/forms": "^17.3.1",
-    "@angular/localize": "^17.3.1",
-    "@angular/platform-browser": "^17.3.1",
-    "@angular/platform-browser-dynamic": "^17.3.1",
-    "@angular/platform-server": "^17.3.1",
-    "@angular/router": "^17.3.1",
-    "@angular/ssr": "^17.3.1",
-    "@fortawesome/angular-fontawesome": "~0.14.1",
+    "@angular-devkit/build-angular": "^20.3.7",
+    "@angular/animations": "^20.3.9",
+    "@angular/cli": "^20.3.7",
+    "@angular/common": "^20.3.9",
+    "@angular/compiler": "^20.3.9",
+    "@angular/core": "^20.3.9",
+    "@angular/forms": "^20.3.9",
+    "@angular/localize": "^20.3.9",
+    "@angular/platform-browser": "^20.3.9",
+    "@angular/platform-browser-dynamic": "^20.3.9",
+    "@angular/platform-server": "^20.3.9",
+    "@angular/router": "^20.3.9",
+    "@angular/ssr": "^20.3.7",
+    "@fortawesome/angular-fontawesome": "^3.0.0",
    "@fortawesome/fontawesome-common-types": "~6.7.2",
    "@fortawesome/fontawesome-svg-core": "~6.7.2",
    "@fortawesome/free-solid-svg-icons": "~6.7.2",
    "@mempool/mempool.js": "2.3.0",
-    "@ng-bootstrap/ng-bootstrap": "^16.0.0",
+    "@ng-bootstrap/ng-bootstrap": "^19.0.0",
    "@types/qrcode": "~1.5.0",
    "bootstrap": "~4.6.2",
    "browserify": "^17.0.0",
    "clipboard": "^2.0.11",
    "domino": "^2.1.6",
-    "echarts": "~5.6.0",
-    "ngx-echarts": "~17.2.0",
-    "ngx-infinite-scroll": "^17.0.0",
+    "echarts": "~5.4.0",
+    "ngx-echarts": "~20.0.2",
+    "ngx-infinite-scroll": "^20.0.0",
    "qrcode": "1.5.1",
    "rxjs": "~7.8.1",
    "esbuild": "^0.25.8",
    "tinyify": "^4.0.0",
    "tlite": "^0.1.9",
    "tslib": "~2.8.0",
-    "zone.js": "~0.14.4"
+    "zone.js": "~0.15.1"
  },
  "devDependencies": {
-    "@angular/compiler-cli": "^17.3.1",
-    "@angular/language-service": "^17.3.1",
-    "@types/node": "^18.11.9",
-    "@typescript-eslint/eslint-plugin": "^7.4.0",
-    "@typescript-eslint/parser": "^7.4.0",
-    "eslint": "^8.57.0",
+    "@angular/compiler-cli": "^20.3.9",
+    "@angular/language-service": "^20.3.9",
+    "@types/node": "^24.9.2",
+    "@typescript-eslint/eslint-plugin": "^8.46.2",
+    "@typescript-eslint/parser": "^8.46.2",
+    "eslint": "^9.39.0",
    "browser-sync": "^3.0.3",
    "http-proxy-middleware": "~2.0.6",
    "prettier": "^3.0.0",
    "source-map-support": "^0.5.21",
    "ts-node": "~10.9.1",
-    "typescript": "~5.4.3"
+    "typescript": "~5.8.3"
  },
  "optionalDependencies": {
    "@cypress/schematic": "^2.5.0",
--- a/frontend/proxy.conf.parameterized.js
+++ b/frontend/proxy.conf.parameterized.js
@ -1,8 +1,6 @@
-const fs = require('fs');
-
 const PROXY_CONFIG = require('./proxy.conf');

-const addApiKeyHeader = (proxyReq, req, res) => {
+const addApiKeyHeader = (proxyReq) => {
  if (process.env.MEMPOOL_CI_API_KEY) {
    proxyReq.setHeader('X-Mempool-Auth', process.env.MEMPOOL_CI_API_KEY);
  }
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@ -1,6 +1,6 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { ModuleWithProviders, NgModule } from '@angular/core';
-import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
+import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { ZONE_SERVICE } from '@app/injection-tokens';
 import { AppRoutingModule } from './app-routing.module';
@ -50,7 +50,6 @@ const providers = [
  FiatShortenerPipe,
  FiatCurrencyPipe,
  CapAddressPipe,
-  DatePipe,
  AppPreloadingStrategy,
  ServicesApiServices,
  PreloadService,
@ -58,20 +57,19 @@ const providers = [
  { provide: ZONE_SERVICE, useClass: ZoneService },
 ];

-@NgModule({
-  declarations: [
-    AppComponent,
-  ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule,
-    HttpClientModule,
-    BrowserAnimationsModule,
-    SharedModule,
-  ],
-  providers: providers,
-  bootstrap: [AppComponent]
-})
+@NgModule({ declarations: [
+        AppComponent,
+    ],
+    bootstrap: [AppComponent], imports: [BrowserModule,
+        AppRoutingModule,
+        BrowserAnimationsModule,
+        SharedModule
+      ],
+      providers: [
+        provideHttpClient(withInterceptorsFromDi()),
+        DatePipe,
+        ...providers
+      ] })
 export class AppModule { }

@NgModule({})
--- a/frontend/src/app/components/about/about-sponsors.component.ts
+++ b/frontend/src/app/components/about/about-sponsors.component.ts
@ -5,6 +5,7 @@ import { EnterpriseService } from '@app/services/enterprise.service';
  selector: 'app-about-sponsors',
  templateUrl: './about-sponsors.component.html',
  styleUrls: ['./about-sponsors.component.scss'],
+  standalone: false,
 })
 export class AboutSponsorsComponent {
  @Input() host = 'https://mempool.space';
--- a/frontend/src/app/components/about/about.component.ts
+++ b/frontend/src/app/components/about/about.component.ts
@ -16,6 +16,7 @@ import { EnterpriseService } from '@app/services/enterprise.service';
  selector: 'app-about',
  templateUrl: './about.component.html',
  styleUrls: ['./about.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AboutComponent implements OnInit {
--- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts
+++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts
@ -54,7 +54,8 @@ type CheckoutStep = 'quote' | 'summary' | 'checkout' | 'cashapp' | 'applepay' |
@Component({
  selector: 'app-accelerate-checkout',
  templateUrl: './accelerate-checkout.component.html',
-  styleUrls: ['./accelerate-checkout.component.scss']
+  styleUrls: ['./accelerate-checkout.component.scss'],
+  standalone: false,
 })
 export class AccelerateCheckout implements OnInit, OnDestroy {
  @Input() tx: Transaction;
--- a/frontend/src/app/components/accelerate-checkout/accelerate-fee-graph.component.ts
+++ b/frontend/src/app/components/accelerate-checkout/accelerate-fee-graph.component.ts
@ -17,6 +17,7 @@ interface GraphBar {
  selector: 'app-accelerate-fee-graph',
  templateUrl: './accelerate-fee-graph.component.html',
  styleUrls: ['./accelerate-fee-graph.component.scss'],
+  standalone: false,
 })
 export class AccelerateFeeGraphComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
  @Input() tx: Transaction;
--- a/frontend/src/app/components/acceleration-timeline/acceleration-timeline-tooltip.component.ts
+++ b/frontend/src/app/components/acceleration-timeline/acceleration-timeline-tooltip.component.ts
@ -4,6 +4,7 @@ import { Component, ElementRef, ViewChild, Input, OnChanges } from '@angular/cor
  selector: 'app-acceleration-timeline-tooltip',
  templateUrl: './acceleration-timeline-tooltip.component.html',
  styleUrls: ['./acceleration-timeline-tooltip.component.scss'],
+  standalone: false,
 })
 export class AccelerationTimelineTooltipComponent implements OnChanges {
  @Input() accelerationInfo: any;
--- a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts
+++ b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts
@ -8,6 +8,7 @@ import { MiningService } from '@app/services/mining.service';
  selector: 'app-acceleration-timeline',
  templateUrl: './acceleration-timeline.component.html',
  styleUrls: ['./acceleration-timeline.component.scss'],
+  standalone: false,
 })
 export class AccelerationTimelineComponent implements OnInit, OnChanges {
  @Input() transactionTime: number;
--- a/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.ts
+++ b/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.ts
@ -27,6 +27,7 @@ import { RelativeUrlPipe } from '@app/shared/pipes/relative-url/relative-url.pip
    }
  `],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AccelerationFeesGraphComponent implements OnInit, OnChanges, OnDestroy {
  @Input() widget: boolean = false;
--- a/frontend/src/app/components/acceleration/acceleration-stats/acceleration-stats.component.ts
+++ b/frontend/src/app/components/acceleration/acceleration-stats/acceleration-stats.component.ts
@ -14,6 +14,7 @@ export type AccelerationStats = {
  templateUrl: './acceleration-stats.component.html',
  styleUrls: ['./acceleration-stats.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AccelerationStatsComponent implements OnInit, OnChanges {
  @Input() timespan: '24h' | '3d' | '1w' | '1m' | 'all' = '1w';
--- a/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.ts
+++ b/frontend/src/app/components/acceleration/accelerations-list/accelerations-list.component.ts
@ -13,6 +13,7 @@ import { MiningService } from '@app/services/mining.service';
  templateUrl: './accelerations-list.component.html',
  styleUrls: ['./accelerations-list.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AccelerationsListComponent implements OnInit, OnDestroy {
  @Input() widget: boolean = false;
--- a/frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.ts
+++ b/frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.ts
@ -26,6 +26,7 @@ interface AccelerationBlock extends BlockExtended {
  selector: 'app-accelerator-dashboard',
  templateUrl: './accelerator-dashboard.component.html',
  styleUrls: ['./accelerator-dashboard.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AcceleratorDashboardComponent implements OnInit, OnDestroy {
@ -51,7 +52,6 @@ export class AcceleratorDashboardComponent implements OnInit, OnDestroy {
    private serviceApiServices: ServicesApiServices,
    private audioService: AudioService,
    private stateService: StateService,
-    @Inject(PLATFORM_ID) private platformId: Object,
  ) {
    this.webGlEnabled = this.stateService.isBrowser && detectWebGL();
    this.seoService.setTitle($localize`:@@6b867dc61c6a92f3229f1950f9f2d414790cce95:Accelerator Dashboard`);
--- a/frontend/src/app/components/acceleration/active-acceleration-box/active-acceleration-box.component.ts
+++ b/frontend/src/app/components/acceleration/active-acceleration-box/active-acceleration-box.component.ts
@ -21,6 +21,7 @@ function toRGB({r,g,b}): string {
  templateUrl: './active-acceleration-box.component.html',
  styleUrls: ['./active-acceleration-box.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class ActiveAccelerationBox implements OnChanges {
  @Input() acceleratedBy?: number[];
--- a/frontend/src/app/components/acceleration/pending-stats/pending-stats.component.ts
+++ b/frontend/src/app/components/acceleration/pending-stats/pending-stats.component.ts
@ -10,6 +10,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  templateUrl: './pending-stats.component.html',
  styleUrls: ['./pending-stats.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class PendingStatsComponent implements OnInit {
  @Input() accelerations$: Observable<Acceleration[]>;
--- a/frontend/src/app/components/acceleration/sparkles/acceleration-sparkles.component.ts
+++ b/frontend/src/app/components/acceleration/sparkles/acceleration-sparkles.component.ts
@ -5,6 +5,7 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, Inpu
  templateUrl: './acceleration-sparkles.component.html',
  styleUrls: ['./acceleration-sparkles.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AccelerationSparklesComponent implements OnChanges {
  @Input() arrow: ElementRef<HTMLDivElement>;
--- a/frontend/src/app/components/address-graph/address-graph.component.ts
+++ b/frontend/src/app/components/address-graph/address-graph.component.ts
@ -32,6 +32,7 @@ const periodSeconds = {
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AddressGraphComponent implements OnChanges, OnDestroy {
--- a/frontend/src/app/components/address-group/address-group.component.ts
+++ b/frontend/src/app/components/address-group/address-group.component.ts
@ -14,7 +14,8 @@ import { AddressInformation } from '@interfaces/node-api.interface';
@Component({
  selector: 'app-address-group',
  templateUrl: './address-group.component.html',
-  styleUrls: ['./address-group.component.scss']
+  styleUrls: ['./address-group.component.scss'],
+  standalone: false,
 })
 export class AddressGroupComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/address-labels/address-labels.component.ts
+++ b/frontend/src/app/components/address-labels/address-labels.component.ts
@ -8,6 +8,7 @@ import { AddressType, AddressTypeInfo } from '@app/shared/address-utils';
  templateUrl: './address-labels.component.html',
  styleUrls: ['./address-labels.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AddressLabelsComponent implements OnChanges {
  network = '';
--- a/frontend/src/app/components/address-transactions-widget/address-transactions-widget.component.ts
+++ b/frontend/src/app/components/address-transactions-widget/address-transactions-widget.component.ts
@ -9,6 +9,7 @@ import { PriceService } from '@app/services/price.service';
  selector: 'app-address-transactions-widget',
  templateUrl: './address-transactions-widget.component.html',
  styleUrls: ['./address-transactions-widget.component.scss'],
+  standalone: false,
 })
 export class AddressTransactionsWidgetComponent implements OnInit, OnChanges, OnDestroy {
  @Input() address: string;
--- a/frontend/src/app/components/address/address-preview.component.ts
+++ b/frontend/src/app/components/address/address-preview.component.ts
@ -15,7 +15,8 @@ import { AddressInformation } from '@interfaces/node-api.interface';
@Component({
  selector: 'app-address-preview',
  templateUrl: './address-preview.component.html',
-  styleUrls: ['./address-preview.component.scss']
+  styleUrls: ['./address-preview.component.scss'],
+  standalone: false,
 })
 export class AddressPreviewComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/address/address.component.ts
+++ b/frontend/src/app/components/address/address.component.ts
@ -92,7 +92,8 @@ class AddressStats implements ChainStats {
@Component({
  selector: 'app-address',
  templateUrl: './address.component.html',
-  styleUrls: ['./address.component.scss']
+  styleUrls: ['./address.component.scss'],
+  standalone: false,
 })
 export class AddressComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/addresses-treemap/addresses-treemap.component.ts
+++ b/frontend/src/app/components/addresses-treemap/addresses-treemap.component.ts
@ -14,6 +14,7 @@ import { formatNumber } from '@angular/common';
  templateUrl: './addresses-treemap.component.html',
  styleUrls: ['./addresses-treemap.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AddressesTreemap implements OnChanges {
  @Input() addresses: Address[];
--- a/frontend/src/app/components/amount-selector/amount-selector.component.ts
+++ b/frontend/src/app/components/amount-selector/amount-selector.component.ts
@ -7,6 +7,7 @@ import { StateService } from '@app/services/state.service';
  selector: 'app-amount-selector',
  templateUrl: './amount-selector.component.html',
  styleUrls: ['./amount-selector.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AmountSelectorComponent implements OnInit {
--- a/frontend/src/app/components/amount/amount.component.ts
+++ b/frontend/src/app/components/amount/amount.component.ts
@ -8,6 +8,7 @@ import { Price } from '@app/services/price.service';
  templateUrl: './amount.component.html',
  styleUrls: ['./amount.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AmountComponent implements OnInit, OnDestroy {
  conversions$: Observable<any>;
--- a/frontend/src/app/components/app/app.component.ts
+++ b/frontend/src/app/components/app/app.component.ts
@ -11,6 +11,7 @@ import { SeoService } from '@app/services/seo.service';
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
+  standalone: false,
  providers: [NgbTooltipConfig]
 })
 export class AppComponent implements OnInit {
--- a/frontend/src/app/components/asset-circulation/asset-circulation.component.ts
+++ b/frontend/src/app/components/asset-circulation/asset-circulation.component.ts
@ -11,6 +11,7 @@ import { environment } from '@environments/environment';
  templateUrl: './asset-circulation.component.html',
  styleUrls: ['./asset-circulation.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AssetCirculationComponent implements OnInit {
  @Input() assetId: string;
--- a/frontend/src/app/components/asset/asset.component.ts
+++ b/frontend/src/app/components/asset/asset.component.ts
@ -16,7 +16,8 @@ import { moveDec } from '@app/bitcoin.utils';
@Component({
  selector: 'app-asset',
  templateUrl: './asset.component.html',
-  styleUrls: ['./asset.component.scss']
+  styleUrls: ['./asset.component.scss'],
+  standalone: false,
 })
 export class AssetComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/assets/asset-group/asset-group.component.ts
+++ b/frontend/src/app/components/assets/asset-group/asset-group.component.ts
@ -8,7 +8,8 @@ import { AssetsService } from '@app/services/assets.service';
@Component({
  selector: 'app-asset-group',
  templateUrl: './asset-group.component.html',
-  styleUrls: ['./asset-group.component.scss']
+  styleUrls: ['./asset-group.component.scss'],
+  standalone: false,
 })
 export class AssetGroupComponent implements OnInit {
  group$: Observable<any>;
--- a/frontend/src/app/components/assets/assets-featured/assets-featured.component.ts
+++ b/frontend/src/app/components/assets/assets-featured/assets-featured.component.ts
@ -6,7 +6,8 @@ import { StateService } from '@app/services/state.service';
@Component({
  selector: 'app-assets-featured',
  templateUrl: './assets-featured.component.html',
-  styleUrls: ['./assets-featured.component.scss']
+  styleUrls: ['./assets-featured.component.scss'],
+  standalone: false,
 })
 export class AssetsFeaturedComponent implements OnInit {
  featuredAssets$: Observable<any>;
--- a/frontend/src/app/components/assets/assets-nav/assets-nav.component.ts
+++ b/frontend/src/app/components/assets/assets-nav/assets-nav.component.ts
@ -14,7 +14,8 @@ import { environment } from '@environments/environment';
@Component({
  selector: 'app-assets-nav',
  templateUrl: './assets-nav.component.html',
-  styleUrls: ['./assets-nav.component.scss']
+  styleUrls: ['./assets-nav.component.scss'],
+  standalone: false,
 })
 export class AssetsNavComponent implements OnInit {
  @ViewChild('instance', {static: true}) instance: NgbTypeahead;
--- a/frontend/src/app/components/assets/assets.component.ts
+++ b/frontend/src/app/components/assets/assets.component.ts
@ -13,7 +13,8 @@ import { StateService } from '@app/services/state.service';
  selector: 'app-assets',
  templateUrl: './assets.component.html',
  styleUrls: ['./assets.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class AssetsComponent implements OnInit {
  nativeAssetId = this.stateService.network === 'liquidtestnet' ? environment.nativeTestAssetId : environment.nativeAssetId;
--- a/frontend/src/app/components/balance-widget/balance-widget.component.ts
+++ b/frontend/src/app/components/balance-widget/balance-widget.component.ts
@ -9,6 +9,7 @@ import { Observable, catchError, of } from 'rxjs';
  templateUrl: './balance-widget.component.html',
  styleUrls: ['./balance-widget.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class BalanceWidgetComponent implements OnInit, OnChanges {
  @Input() address: string;
--- a/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts
+++ b/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts
@ -8,7 +8,8 @@ import { ServicesApiServices } from '@app/services/services-api.service';
@Component({
  selector: 'app-bitcoin-invoice',
  templateUrl: './bitcoin-invoice.component.html',
-  styleUrls: ['./bitcoin-invoice.component.scss']
+  styleUrls: ['./bitcoin-invoice.component.scss'],
+  standalone: false,
 })
 export class BitcoinInvoiceComponent implements OnInit, OnChanges, OnDestroy {
  @Input() invoice;
--- a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts
+++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts
@ -26,6 +26,7 @@ import { ActivatedRoute, Router } from '@angular/router';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockFeeRatesGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-fees-graph/block-fees-graph.component.ts
+++ b/frontend/src/app/components/block-fees-graph/block-fees-graph.component.ts
@ -26,6 +26,7 @@ import { StateService } from '@app/services/state.service';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockFeesGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.ts
+++ b/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.ts
@ -27,6 +27,7 @@ import { RelativeUrlPipe } from '@app/shared/pipes/relative-url/relative-url.pip
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockFeesSubsidyGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-filters/block-filters.component.ts
+++ b/frontend/src/app/components/block-filters/block-filters.component.ts
@ -8,6 +8,7 @@ import { Subscription } from 'rxjs';
  selector: 'app-block-filters',
  templateUrl: './block-filters.component.html',
  styleUrls: ['./block-filters.component.scss'],
+  standalone: false,
 })
 export class BlockFiltersComponent implements OnInit, OnChanges, OnDestroy {
  @Input() cssWidth: number = 800;
--- a/frontend/src/app/components/block-health-graph/block-health-graph.component.ts
+++ b/frontend/src/app/components/block-health-graph/block-health-graph.component.ts
@ -24,6 +24,7 @@ import { StateService } from '@app/services/state.service';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockHealthGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-overview-graph/block-overview-graph.component.ts
+++ b/frontend/src/app/components/block-overview-graph/block-overview-graph.component.ts
@ -35,6 +35,7 @@ const unmatchedContrastAuditColors = {
  selector: 'app-block-overview-graph',
  templateUrl: './block-overview-graph.component.html',
  styleUrls: ['./block-overview-graph.component.scss'],
+  standalone: false,
 })
 export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy, OnChanges {
  @Input() isLoading: boolean;
--- a/frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.ts
+++ b/frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.ts
@ -9,6 +9,7 @@ import { Block } from '@interfaces/electrs.interface.js';
  selector: 'app-block-overview-tooltip',
  templateUrl: './block-overview-tooltip.component.html',
  styleUrls: ['./block-overview-tooltip.component.scss'],
+  standalone: false,
 })
 export class BlockOverviewTooltipComponent implements OnChanges {
  @Input() tx: TransactionStripped | void;
--- a/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.ts
+++ b/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.ts
@ -26,6 +26,7 @@ import { StateService } from '@app/services/state.service';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockRewardsGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts
+++ b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts
@ -24,6 +24,7 @@ import { StateService } from '@app/services/state.service';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockSizesWeightsGraphComponent implements OnInit {
--- a/frontend/src/app/components/block-view/block-view.component.ts
+++ b/frontend/src/app/components/block-view/block-view.component.ts
@ -28,7 +28,8 @@ function bestFitResolution(min, max, n): number {
@Component({
  selector: 'app-block-view',
  templateUrl: './block-view.component.html',
-  styleUrls: ['./block-view.component.scss']
+  styleUrls: ['./block-view.component.scss'],
+  standalone: false,
 })
 export class BlockViewComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/block/block-preview.component.ts
+++ b/frontend/src/app/components/block/block-preview.component.ts
@ -15,7 +15,8 @@ import { ServicesApiServices } from '@app/services/services-api.service';
@Component({
  selector: 'app-block-preview',
  templateUrl: './block-preview.component.html',
-  styleUrls: ['./block-preview.component.scss']
+  styleUrls: ['./block-preview.component.scss'],
+  standalone: false,
 })
 export class BlockPreviewComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/block/block-transactions.component.ts
+++ b/frontend/src/app/components/block/block-transactions.component.ts
@ -10,6 +10,7 @@ import { PreloadService } from '@app/services/preload.service';
  selector: 'app-block-transactions',
  templateUrl: './block-transactions.component.html',
  styleUrl: './block-transactions.component.scss',
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockTransactionsComponent implements OnInit {
--- a/frontend/src/app/components/block/block.component.ts
+++ b/frontend/src/app/components/block/block.component.ts
@ -32,6 +32,7 @@ interface ComparisonStats {
@Component({
  selector: 'app-block',
  templateUrl: './block.component.html',
+  standalone: false,
  styleUrls: ['./block.component.scss'],
  styles: [`
    .loadingGraphs {
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
@ -15,6 +15,7 @@ interface BlockchainBlock extends BlockExtended {
  selector: 'app-blockchain-blocks',
  templateUrl: './blockchain-blocks.component.html',
  styleUrls: ['./blockchain-blocks.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
--- a/frontend/src/app/components/blockchain/blockchain.component.ts
+++ b/frontend/src/app/components/blockchain/blockchain.component.ts
@ -7,6 +7,7 @@ import { StorageService } from '@app/services/storage.service';
  selector: 'app-blockchain',
  templateUrl: './blockchain.component.html',
  styleUrls: ['./blockchain.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
--- a/frontend/src/app/components/blocks-list/blocks-list.component.ts
+++ b/frontend/src/app/components/blocks-list/blocks-list.component.ts
@ -15,6 +15,7 @@ import { RelativeUrlPipe } from '@app/shared/pipes/relative-url/relative-url.pip
  selector: 'app-blocks-list',
  templateUrl: './blocks-list.component.html',
  styleUrls: ['./blocks-list.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BlocksList implements OnInit {
--- a/frontend/src/app/components/calculator/calculator.component.ts
+++ b/frontend/src/app/components/calculator/calculator.component.ts
@ -9,6 +9,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  selector: 'app-calculator',
  templateUrl: './calculator.component.html',
  styleUrls: ['./calculator.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CalculatorComponent implements OnInit {
--- a/frontend/src/app/components/change/change.component.ts
+++ b/frontend/src/app/components/change/change.component.ts
@ -4,6 +4,7 @@ import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/c
  selector: 'app-change',
  templateUrl: './change.component.html',
  styleUrls: ['./change.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ChangeComponent implements OnChanges {
--- a/frontend/src/app/components/clipboard/clipboard.component.ts
+++ b/frontend/src/app/components/clipboard/clipboard.component.ts
@ -4,6 +4,7 @@ import { Component, Input, ChangeDetectionStrategy, ChangeDetectorRef } from '@a
  selector: 'app-clipboard',
  templateUrl: './clipboard.component.html',
  styleUrls: ['./clipboard.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ClipboardComponent {
--- a/frontend/src/app/components/clock-face/clock-face.component.ts
+++ b/frontend/src/app/components/clock-face/clock-face.component.ts
@ -6,6 +6,7 @@ import { StateService } from '@app/services/state.service';
  selector: 'app-clock-face',
  templateUrl: './clock-face.component.html',
  styleUrls: ['./clock-face.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
--- a/frontend/src/app/components/clock/clock.component.ts
+++ b/frontend/src/app/components/clock/clock.component.ts
@ -11,6 +11,7 @@ import { RelativeUrlPipe } from '@app/shared/pipes/relative-url/relative-url.pip
  selector: 'app-clock',
  templateUrl: './clock.component.html',
  styleUrls: ['./clock.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ClockComponent implements OnInit {
--- a/frontend/src/app/components/clockchain/clockchain.component.ts
+++ b/frontend/src/app/components/clockchain/clockchain.component.ts
@ -6,6 +6,7 @@ import { StateService } from '@app/services/state.service';
  selector: 'app-clockchain',
  templateUrl: './clockchain.component.html',
  styleUrls: ['./clockchain.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ClockchainComponent implements OnInit, OnChanges, OnDestroy {
--- a/frontend/src/app/components/custom-dashboard/custom-dashboard.component.ts
+++ b/frontend/src/app/components/custom-dashboard/custom-dashboard.component.ts
@ -33,6 +33,7 @@ interface MempoolStatsData {
  selector: 'app-custom-dashboard',
  templateUrl: './custom-dashboard.component.html',
  styleUrls: ['./custom-dashboard.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CustomDashboardComponent implements OnInit, OnDestroy, AfterViewInit {
@ -89,7 +90,6 @@ export class CustomDashboardComponent implements OnInit, OnDestroy, AfterViewIni
    private websocketService: WebsocketService,
    private seoService: SeoService,
    private cd: ChangeDetectorRef,
-    @Inject(PLATFORM_ID) private platformId: Object,
  ) {
    this.webGlEnabled = this.stateService.isBrowser && detectWebGL();
    this.widgets = this.stateService.env.customize?.dashboard.widgets || [];
--- a/frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts
+++ b/frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts
@ -18,6 +18,7 @@ import { StateService } from '@app/services/state.service';
      z-index: 99;
    }
  `],
+  standalone: false,
 })
 export class DifficultyAdjustmentsTable implements OnInit {
  hashrateObservable$: Observable<any>;
--- a/frontend/src/app/components/difficulty-mining/difficulty-mining.component.ts
+++ b/frontend/src/app/components/difficulty-mining/difficulty-mining.component.ts
@ -23,6 +23,7 @@ interface EpochProgress {
  selector: 'app-difficulty-mining',
  templateUrl: './difficulty-mining.component.html',
  styleUrls: ['./difficulty-mining.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class DifficultyMiningComponent implements OnInit {
--- a/frontend/src/app/components/difficulty/difficulty-tooltip.component.ts
+++ b/frontend/src/app/components/difficulty/difficulty-tooltip.component.ts
@ -22,6 +22,7 @@ const EPOCH_BLOCK_LENGTH = 2016; // Bitcoin mainnet
  selector: 'app-difficulty-tooltip',
  templateUrl: './difficulty-tooltip.component.html',
  styleUrls: ['./difficulty-tooltip.component.scss'],
+  standalone: false,
 })
 export class DifficultyTooltipComponent implements OnChanges {
  @Input() status: string | void;
--- a/frontend/src/app/components/difficulty/difficulty.component.ts
+++ b/frontend/src/app/components/difficulty/difficulty.component.ts
@ -39,6 +39,7 @@ const EPOCH_BLOCK_LENGTH = 2016; // Bitcoin mainnet
  selector: 'app-difficulty',
  templateUrl: './difficulty.component.html',
  styleUrls: ['./difficulty.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class DifficultyComponent implements OnInit {
--- a/frontend/src/app/components/eight-blocks/eight-blocks.component.ts
+++ b/frontend/src/app/components/eight-blocks/eight-blocks.component.ts
@ -45,6 +45,7 @@ interface BlockInfo extends BlockExtended {
      ])
    ]),
  ],
+  standalone: false,
 })
 export class EightBlocksComponent implements OnInit, OnDestroy {
  network = '';
--- a/frontend/src/app/components/faucet/faucet.component.ts
+++ b/frontend/src/app/components/faucet/faucet.component.ts
@ -11,7 +11,8 @@ import { HttpErrorResponse } from '@angular/common/http';
@Component({
  selector: 'app-faucet',
  templateUrl: './faucet.component.html',
-  styleUrls: ['./faucet.component.scss']
+  styleUrls: ['./faucet.component.scss'],
+  standalone: false,
 })
 export class FaucetComponent implements OnInit, OnDestroy {
  loading = true;
--- a/frontend/src/app/components/fee-distribution-graph/fee-distribution-graph.component.ts
+++ b/frontend/src/app/components/fee-distribution-graph/fee-distribution-graph.component.ts
@ -11,6 +11,7 @@ import { Subscription } from 'rxjs';
  templateUrl: './fee-distribution-graph.component.html',
  styleUrls: ['./fee-distribution-graph.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class FeeDistributionGraphComponent implements OnInit, OnChanges, OnDestroy {
  @Input() feeRange: number[];
--- a/frontend/src/app/components/fees-box/fees-box.component.ts
+++ b/frontend/src/app/components/fees-box/fees-box.component.ts
@ -11,6 +11,7 @@ import { ThemeService } from '@app/services/theme.service';
  templateUrl: './fees-box.component.html',
  styleUrls: ['./fees-box.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class FeesBoxComponent implements OnInit, OnDestroy {
  isLoading$: Observable<boolean>;
--- a/frontend/src/app/components/fiat-selector/fiat-selector.component.ts
+++ b/frontend/src/app/components/fiat-selector/fiat-selector.component.ts
@ -8,7 +8,8 @@ import { StateService } from '@app/services/state.service';
  selector: 'app-fiat-selector',
  templateUrl: './fiat-selector.component.html',
  styleUrls: ['./fiat-selector.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class FiatSelectorComponent implements OnInit {
  fiatForm: UntypedFormGroup;
--- a/frontend/src/app/components/footer/footer.component.ts
+++ b/frontend/src/app/components/footer/footer.component.ts
@ -20,6 +20,7 @@ interface MempoolInfoData {
  selector: 'app-footer',
  templateUrl: './footer.component.html',
  styleUrls: ['./footer.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FooterComponent implements OnInit {
--- a/frontend/src/app/components/github-login.component/github-login.component.ts
+++ b/frontend/src/app/components/github-login.component/github-login.component.ts
@ -2,6 +2,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
  selector: 'app-github-login',
  templateUrl: './github-login.component.html',
+  standalone: false,
 })
 export class GithubLogin {
  @Input() width: string | null = null;
--- a/frontend/src/app/components/graphs/graphs.component.ts
+++ b/frontend/src/app/components/graphs/graphs.component.ts
@ -8,6 +8,7 @@ import { handleDemoRedirect } from '@app/shared/common.utils';
  selector: 'app-graphs',
  templateUrl: './graphs.component.html',
  styleUrls: ['./graphs.component.scss'],
+  standalone: false,
 })
 export class GraphsComponent implements OnInit {
  flexWrap = false;
--- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts
+++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts
@ -27,6 +27,7 @@ import { AmountShortenerPipe } from '@app/shared/pipes/amount-shortener.pipe';
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HashrateChartComponent implements OnInit {
--- a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.ts
+++ b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.ts
@ -31,6 +31,7 @@ interface Hashrate {
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HashrateChartPoolsComponent implements OnInit {
--- a/frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
+++ b/frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
@ -20,6 +20,7 @@ const OUTLIERS_MEDIAN_MULTIPLIER = 4;
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, OnDestroy {
--- a/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
+++ b/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
@ -3,7 +3,8 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
@Component({
  selector: 'app-indexing-progress',
  templateUrl: './indexing-progress.component.html',
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class IndexingProgressComponent implements OnInit {
  constructor(
--- a/frontend/src/app/components/language-selector/language-selector.component.ts
+++ b/frontend/src/app/components/language-selector/language-selector.component.ts
@ -8,6 +8,7 @@ import { LanguageService } from '@app/services/language.service';
  selector: 'app-language-selector',
  templateUrl: './language-selector.component.html',
  styleUrls: ['./language-selector.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class LanguageSelectorComponent implements OnInit {
--- a/frontend/src/app/components/lbtc-pegs-graph/lbtc-pegs-graph.component.ts
+++ b/frontend/src/app/components/lbtc-pegs-graph/lbtc-pegs-graph.component.ts
@ -18,6 +18,7 @@ import { AmountShortenerPipe } from '@app/shared/pipes/amount-shortener.pipe';
    }
  `],
  templateUrl: './lbtc-pegs-graph.component.html',
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class LbtcPegsGraphComponent implements OnInit, OnChanges {
@ -271,18 +272,22 @@ export class LbtcPegsGraphComponent implements OnInit, OnChanges {
    this.pegsChartOptions = {
      ...this.pegsChartOptions,
      grid: {
-        ...this.pegsChartOptions.grid,
+        ...(Array.isArray(this.pegsChartOptions?.grid)
+          ? (this.pegsChartOptions.grid[0] ?? {})
+          : (this.pegsChartOptions?.grid ?? {})) as Record<string, any>,
        right: this.adjustedRight,
        left: this.adjustedLeft,
      },
      legend: {
-        ...this.pegsChartOptions.legend,
+        ...(Array.isArray(this.pegsChartOptions?.legend)
+          ? (this.pegsChartOptions.legend[0] ?? {})
+          : (this.pegsChartOptions?.legend ?? {})) as Record<string, any>,
        selected: this.selected,
      },
    };
  }

-  onChartInit(ec) {
+  onChartInit(ec: any): void {
    this.chartInstance = ec;
    this.chartInstance.on('legendselectchanged', this.onLegendSelectChanged.bind(this));
  }
--- a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.ts
+++ b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.ts
@ -9,6 +9,7 @@ import { NavigationService } from '@app/services/navigation.service';
  selector: 'app-liquid-master-page',
  templateUrl: './liquid-master-page.component.html',
  styleUrls: ['./liquid-master-page.component.scss'],
+  standalone: false,
 })
 export class LiquidMasterPageComponent implements OnInit, OnDestroy {
  env: Env;
--- a/frontend/src/app/components/liquid-reserves-audit/expired-utxos-stats/expired-utxos-stats.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/expired-utxos-stats/expired-utxos-stats.component.ts
@ -6,6 +6,7 @@ import { FederationUtxo } from '@interfaces/node-api.interface';
  selector: 'app-expired-utxos-stats',
  templateUrl: './expired-utxos-stats.component.html',
  styleUrls: ['./expired-utxos-stats.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ExpiredUtxosStatsComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts
@ -10,6 +10,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  selector: 'app-federation-addresses-list',
  templateUrl: './federation-addresses-list.component.html',
  styleUrls: ['./federation-addresses-list.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FederationAddressesListComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/federation-addresses-stats/federation-addresses-stats.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/federation-addresses-stats/federation-addresses-stats.component.ts
@ -5,6 +5,7 @@ import { Observable, combineLatest, map, of } from 'rxjs';
  selector: 'app-federation-addresses-stats',
  templateUrl: './federation-addresses-stats.component.html',
  styleUrls: ['./federation-addresses-stats.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FederationAddressesStatsComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts
@ -11,6 +11,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  selector: 'app-federation-utxos-list',
  templateUrl: './federation-utxos-list.component.html',
  styleUrls: ['./federation-utxos-list.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FederationUtxosListComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/federation-wallet/federation-wallet.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/federation-wallet/federation-wallet.component.ts
@ -4,6 +4,7 @@ import { SeoService } from '@app/services/seo.service';
@Component({
  selector: 'app-federation-wallet',
  templateUrl: './federation-wallet.component.html',
+  standalone: false,
  styleUrls: ['./federation-wallet.component.scss']
 })
 export class FederationWalletComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/recent-pegs-list/recent-pegs-list.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/recent-pegs-list/recent-pegs-list.component.ts
@ -12,6 +12,7 @@ import { SeoService } from '@app/services/seo.service';
  selector: 'app-recent-pegs-list',
  templateUrl: './recent-pegs-list.component.html',
  styleUrls: ['./recent-pegs-list.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class RecentPegsListComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/recent-pegs-stats/recent-pegs-stats.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/recent-pegs-stats/recent-pegs-stats.component.ts
@ -6,6 +6,7 @@ import { PegsVolume } from '@interfaces/node-api.interface';
  selector: 'app-recent-pegs-stats',
  templateUrl: './recent-pegs-stats.component.html',
  styleUrls: ['./recent-pegs-stats.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class RecentPegsStatsComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/reserves-ratio-stats/reserves-ratio-stats.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/reserves-ratio-stats/reserves-ratio-stats.component.ts
@ -5,6 +5,7 @@ import { Observable, map } from 'rxjs';
  selector: 'app-reserves-ratio-stats',
  templateUrl: './reserves-ratio-stats.component.html',
  styleUrls: ['./reserves-ratio-stats.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ReservesRatioStatsComponent implements OnInit {
--- a/frontend/src/app/components/liquid-reserves-audit/reserves-ratio/reserves-ratio.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/reserves-ratio/reserves-ratio.component.ts
@ -7,6 +7,7 @@ import { CurrentPegs } from '@interfaces/node-api.interface';
  selector: 'app-reserves-ratio',
  templateUrl: './reserves-ratio.component.html',
  styleUrls: ['./reserves-ratio.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ReservesRatioComponent implements OnInit, OnChanges {
--- a/frontend/src/app/components/liquid-reserves-audit/reserves-supply-stats/reserves-supply-stats.component.ts
+++ b/frontend/src/app/components/liquid-reserves-audit/reserves-supply-stats/reserves-supply-stats.component.ts
@ -7,6 +7,7 @@ import { CurrentPegs } from '@interfaces/node-api.interface';
  selector: 'app-reserves-supply-stats',
  templateUrl: './reserves-supply-stats.component.html',
  styleUrls: ['./reserves-supply-stats.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ReservesSupplyStatsComponent implements OnInit {
--- a/frontend/src/app/components/loading-indicator/loading-indicator.component.ts
+++ b/frontend/src/app/components/loading-indicator/loading-indicator.component.ts
@ -8,6 +8,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  selector: 'app-loading-indicator',
  templateUrl: './loading-indicator.component.html',
  styleUrls: ['./loading-indicator.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class LoadingIndicatorComponent implements OnInit {
--- a/frontend/src/app/components/master-page-preview/master-page-preview.component.ts
+++ b/frontend/src/app/components/master-page-preview/master-page-preview.component.ts
@ -8,6 +8,7 @@ import { EnterpriseService } from '@app/services/enterprise.service';
  selector: 'app-master-page-preview',
  templateUrl: './master-page-preview.component.html',
  styleUrls: ['./master-page-preview.component.scss'],
+  standalone: false,
 })
 export class MasterPagePreviewComponent implements OnInit {
  network$: Observable<string>;
--- a/frontend/src/app/components/master-page-preview/preview-title.component.ts
+++ b/frontend/src/app/components/master-page-preview/preview-title.component.ts
@ -6,6 +6,7 @@ import { Observable, merge, of } from 'rxjs';
  selector: 'app-preview-title',
  templateUrl: './preview-title.component.html',
  styleUrls: [],
+  standalone: false,
 })
 export class PreviewTitleComponent implements OnInit {
  network$: Observable<string>;
--- a/frontend/src/app/components/master-page/master-page.component.ts
+++ b/frontend/src/app/components/master-page/master-page.component.ts
@ -12,6 +12,7 @@ import { StorageService } from '@app/services/storage.service';
  selector: 'app-master-page',
  templateUrl: './master-page.component.html',
  styleUrls: ['./master-page.component.scss'],
+  standalone: false,
 })
 export class MasterPageComponent implements OnInit, OnDestroy {
  @Input() headerVisible = true;
--- a/frontend/src/app/components/mempool-block-overview/mempool-block-overview.component.ts
+++ b/frontend/src/app/components/mempool-block-overview/mempool-block-overview.component.ts
@ -16,6 +16,7 @@ import { FilterMode, GradientMode } from '@app/shared/filters.utils';
  selector: 'app-mempool-block-overview',
  templateUrl: './mempool-block-overview.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
 })
 export class MempoolBlockOverviewComponent implements OnInit, OnDestroy, OnChanges, AfterViewInit {
  @Input() index: number;
--- a/frontend/src/app/components/mempool-block-view/mempool-block-view.component.ts
+++ b/frontend/src/app/components/mempool-block-view/mempool-block-view.component.ts
@ -21,7 +21,8 @@ function bestFitResolution(min, max, n): number {
@Component({
  selector: 'app-mempool-block-view',
  templateUrl: './mempool-block-view.component.html',
-  styleUrls: ['./mempool-block-view.component.scss']
+  styleUrls: ['./mempool-block-view.component.scss'],
+  standalone: false,
 })
 export class MempoolBlockViewComponent implements OnInit, OnDestroy {
  autofit: boolean = false;
--- a/frontend/src/app/components/mempool-block/mempool-block.component.ts
+++ b/frontend/src/app/components/mempool-block/mempool-block.component.ts
@ -14,6 +14,7 @@ import { WebsocketService } from '@app/services/websocket.service';
  selector: 'app-mempool-block',
  templateUrl: './mempool-block.component.html',
  styleUrls: ['./mempool-block.component.scss'],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MempoolBlockComponent implements OnInit, OnDestroy {
@ -30,8 +31,6 @@ export class MempoolBlockComponent implements OnInit, OnDestroy {
    public stateService: StateService,
    private seoService: SeoService,
    private websocketService: WebsocketService,
-    private cd: ChangeDetectorRef,
-    @Inject(PLATFORM_ID) private platformId: Object,
  ) {
    this.webGlEnabled = this.stateService.isBrowser && detectWebGL();
  }
--- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts
+++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts
@ -23,6 +23,7 @@ import { ThemeService } from '@app/services/theme.service';
      animate('2s 0s ease', style({ transform: '' })),
    ]),
  ])],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
--- a/frontend/src/app/components/mempool-graph/mempool-graph.component.ts
+++ b/frontend/src/app/components/mempool-graph/mempool-graph.component.ts
@ -21,6 +21,7 @@ import { download, formatterXAxis, formatterXAxisLabel } from '@app/shared/graph
      z-index: 99;
    }
  `],
+  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MempoolGraphComponent implements OnInit, OnChanges {
--- a/Show more
+++ b/Show more