Refactor preview routes into separate module

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

@@ -3,14 +3,10 @@ import { Routes, RouterModule } from '@angular/router';
 import { AppPreloadingStrategy } from './app.preloading-strategy'
 import { StartComponent } from './components/start/start.component';
 import { TransactionComponent } from './components/transaction/transaction.component';
-import { TransactionPreviewComponent } from './components/transaction/transaction-preview.component';
 import { BlockComponent } from './components/block/block.component';
 import { BlockAuditComponent } from './components/block-audit/block-audit.component';
-import { BlockPreviewComponent } from './components/block/block-preview.component';
 import { AddressComponent } from './components/address/address.component';
-import { AddressPreviewComponent } from './components/address/address-preview.component';
 import { MasterPageComponent } from './components/master-page/master-page.component';
-import { MasterPagePreviewComponent } from './components/master-page-preview/master-page-preview.component';
 import { AboutComponent } from './components/about/about.component';
 import { StatusViewComponent } from './components/status-view/status-view.component';
 import { TermsOfServiceComponent } from './components/terms-of-service/terms-of-service.component';
@@ -346,61 +342,18 @@ let routes: Routes = [
   },
   {
     path: 'preview',
-    component: MasterPagePreviewComponent,
     children: [
       {
-        path: 'block/:id',
+        path: '',
-        component: BlockPreviewComponent
+        loadChildren: () => import('./previews.module').then(m => m.PreviewsModule)
       },
       {
-        path: 'testnet/block/:id',
+        path: 'testnet',
-        component: BlockPreviewComponent
+        loadChildren: () => import('./previews.module').then(m => m.PreviewsModule)
       },
       {
-        path: 'signet/block/:id',
+        path: 'signet',
-        component: BlockPreviewComponent
+        loadChildren: () => import('./previews.module').then(m => m.PreviewsModule)
-      },
-      {
-        path: 'address/:id',
-        children: [],
-        component: AddressPreviewComponent
-      },
-      {
-        path: 'testnet/address/:id',
-        children: [],
-        component: AddressPreviewComponent
-      },
-      {
-        path: 'signet/address/:id',
-        children: [],
-        component: AddressPreviewComponent
-      },
-      {
-        path: 'tx/:id',
-        children: [],
-        component: TransactionPreviewComponent
-      },
-      {
-        path: 'testnet/tx/:id',
-        children: [],
-        component: TransactionPreviewComponent
-      },
-      {
-        path: 'signet/tx/:id',
-        children: [],
-        component: TransactionPreviewComponent
-      },
-      {
-        path: 'lightning',
-        loadChildren: () => import('./lightning/lightning-previews.module').then(m => m.LightningPreviewsModule)
-      },
-      {
-        path: 'testnet/lightning',
-        loadChildren: () => import('./lightning/lightning-previews.module').then(m => m.LightningPreviewsModule)
-      },
-      {
-        path: 'signet/lightning',
-        loadChildren: () => import('./lightning/lightning-previews.module').then(m => m.LightningPreviewsModule)
       },
     ],
   },
@@ -643,35 +596,14 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
     },
     {
       path: 'preview',
-      component: MasterPagePreviewComponent,
       children: [
         {
-          path: 'block/:id',
+          path: '',
-          component: BlockPreviewComponent
+          loadChildren: () => import('./previews.module').then(m => m.PreviewsModule)
         },
         {
-          path: 'testnet/block/:id',
+          path: 'testnet',
-          component: BlockPreviewComponent
+          loadChildren: () => import('./previews.module').then(m => m.PreviewsModule)
-        },
-        {
-          path: 'address/:id',
-          children: [],
-          component: AddressPreviewComponent
-        },
-        {
-          path: 'testnet/address/:id',
-          children: [],
-          component: AddressPreviewComponent
-        },
-        {
-          path: 'tx/:id',
-          children: [],
-          component: TransactionPreviewComponent
-        },
-        {
-          path: 'testnet/tx/:id',
-          children: [],
-          component: TransactionPreviewComponent
         },
       ],
     },

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

@@ -42,7 +42,7 @@ export class NodePreviewComponent implements OnInit {
     this.node$ = this.activatedRoute.paramMap
       .pipe(
         switchMap((params: ParamMap) => {
-        this.publicKey = params.get('public_key');
+          this.publicKey = params.get('public_key');
           this.openGraphService.waitFor('node-map-' + this.publicKey);
           this.openGraphService.waitFor('node-data-' + this.publicKey);
           return this.lightningApiService.getNode$(params.get('public_key'));

frontend/src/app/previews.module.ts

@@ -0,0 +1,26 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SharedModule } from './shared/shared.module';
+import { RouterModule } from '@angular/router';
+import { GraphsModule } from './graphs/graphs.module';
+import { PreviewsRoutingModule } from './previews.routing.module';
+import { TransactionPreviewComponent } from './components/transaction/transaction-preview.component';
+import { BlockPreviewComponent } from './components/block/block-preview.component';
+import { AddressPreviewComponent } from './components/address/address-preview.component';
+import { MasterPagePreviewComponent } from './components/master-page-preview/master-page-preview.component';
+@NgModule({
+  declarations: [
+    TransactionPreviewComponent,
+    BlockPreviewComponent,
+    AddressPreviewComponent,
+    MasterPagePreviewComponent,
+  ],
+  imports: [
+    CommonModule,
+    SharedModule,
+    RouterModule,
+    GraphsModule,
+    PreviewsRoutingModule,
+  ],
+})
+export class PreviewsModule { }

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

@@ -0,0 +1,39 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { TransactionPreviewComponent } from './components/transaction/transaction-preview.component';
+import { BlockPreviewComponent } from './components/block/block-preview.component';
+import { AddressPreviewComponent } from './components/address/address-preview.component';
+import { MasterPagePreviewComponent } from './components/master-page-preview/master-page-preview.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: MasterPagePreviewComponent,
+    children: [
+      {
+        path: 'block/:id',
+        component: BlockPreviewComponent
+      },
+      {
+        path: 'address/:id',
+        children: [],
+        component: AddressPreviewComponent
+      },
+      {
+        path: 'tx/:id',
+        children: [],
+        component: TransactionPreviewComponent
+      },
+      {
+        path: 'lightning',
+        loadChildren: () => import('./lightning/lightning-previews.module').then(m => m.LightningPreviewsModule)
+      },
+    ],
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class PreviewsRoutingModule { }

frontend/src/app/shared/shared.module.ts

@@ -7,7 +7,6 @@ import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, fa
   faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook, faListUl, faDownload, faQrcode, faArrowRightArrowLeft } from '@fortawesome/free-solid-svg-icons';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 import { MasterPageComponent } from '../components/master-page/master-page.component';
-import { MasterPagePreviewComponent } from '../components/master-page-preview/master-page-preview.component';
 import { PreviewTitleComponent } from '../components/master-page-preview/preview-title.component';
 import { BisqMasterPageComponent } from '../components/bisq-master-page/bisq-master-page.component';
 import { LiquidMasterPageComponent } from '../components/liquid-master-page/liquid-master-page.component';
@@ -44,15 +43,12 @@ import { RouterModule } from '@angular/router';
 import { CapAddressPipe } from './pipes/cap-address-pipe/cap-address-pipe';
 import { StartComponent } from '../components/start/start.component';
 import { TransactionComponent } from '../components/transaction/transaction.component';
-import { TransactionPreviewComponent } from '../components/transaction/transaction-preview.component';
 import { TransactionsListComponent } from '../components/transactions-list/transactions-list.component';
 import { BlockComponent } from '../components/block/block.component';
-import { BlockPreviewComponent } from '../components/block/block-preview.component';
 import { BlockAuditComponent } from '../components/block-audit/block-audit.component';
 import { BlockOverviewGraphComponent } from '../components/block-overview-graph/block-overview-graph.component';
 import { BlockOverviewTooltipComponent } from '../components/block-overview-tooltip/block-overview-tooltip.component';
 import { AddressComponent } from '../components/address/address.component';
-import { AddressPreviewComponent } from '../components/address/address-preview.component';
 import { SearchFormComponent } from '../components/search-form/search-form.component';
 import { AddressLabelsComponent } from '../components/address-labels/address-labels.component';
 import { FooterComponent } from '../components/footer/footer.component';
@@ -117,21 +113,17 @@ import { GeolocationComponent } from '../shared/components/geolocation/geolocati
     AmountComponent,
     AboutComponent,
     MasterPageComponent,
-    MasterPagePreviewComponent,
     PreviewTitleComponent,
     BisqMasterPageComponent,
     LiquidMasterPageComponent,
     StartComponent,
     TransactionComponent,
-    TransactionPreviewComponent,
     BlockComponent,
-    BlockPreviewComponent,
     BlockAuditComponent,
     BlockOverviewGraphComponent,
     BlockOverviewTooltipComponent,
     TransactionsListComponent,
     AddressComponent,
-    AddressPreviewComponent,
     SearchFormComponent,
     TimeSpanComponent,
     AddressLabelsComponent,
@@ -228,15 +220,12 @@ import { GeolocationComponent } from '../shared/components/geolocation/geolocati
     AmountComponent,
     StartComponent,
     TransactionComponent,
-    TransactionPreviewComponent,
     BlockComponent,
-    BlockPreviewComponent,
     BlockAuditComponent,
     BlockOverviewGraphComponent,
     BlockOverviewTooltipComponent,
     TransactionsListComponent,
     AddressComponent,
-    AddressPreviewComponent,
     SearchFormComponent,
     TimeSpanComponent,
     AddressLabelsComponent,