Split master page components & deduplicate main routes

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

@@ -6,19 +6,14 @@ import { BlockViewComponent } from './components/block-view/block-view.component
 import { MempoolBlockViewComponent } from './components/mempool-block-view/mempool-block-view.component';
 import { ClockComponent } from './components/clock/clock.component';
 import { AddressComponent } from './components/address/address.component';
-import { MasterPageComponent } from './components/master-page/master-page.component';
 import { StatusViewComponent } from './components/status-view/status-view.component';
-import { BisqMasterPageComponent } from './components/bisq-master-page/bisq-master-page.component';
 import { PushTransactionComponent } from './components/push-transaction/push-transaction.component';
 import { BlocksList } from './components/blocks-list/blocks-list.component';
-import { RbfList } from './components/rbf-list/rbf-list.component';
-import { LiquidMasterPageComponent } from './components/liquid-master-page/liquid-master-page.component';
 import { AssetGroupComponent } from './components/assets/asset-group/asset-group.component';
 import { AssetsFeaturedComponent } from './components/assets/assets-featured/assets-featured.component';
 import { AssetsComponent } from './components/assets/assets.component';
 import { AssetComponent } from './components/asset/asset.component';
 import { AssetsNavComponent } from './components/assets/assets-nav/assets-nav.component';
-import { CalculatorComponent } from './components/calculator/calculator.component';
 
 const browserWindow = window || {};
 // @ts-ignore
@@ -36,77 +31,8 @@ let routes: Routes = [
       },
       {
         path: '',
-        component: MasterPageComponent,
-        children: [
-          {
-            path: 'mining/blocks',
-            redirectTo: 'blocks',
-            pathMatch: 'full'
-          },
-          {
-            path: 'tx/push',
-            component: PushTransactionComponent,
-          },
-          {
-            path: 'about',
-            loadChildren: () => import('./components/about/about.module').then(m => m.AboutModule),
-          },
-          {
-            path: 'blocks',
-            component: BlocksList,
-          },
-          {
-            path: 'rbf',
-            component: RbfList,
-          },
-          {
-            path: 'terms-of-service',
-            loadChildren: () => import('./components/terms-of-service/terms-of-service.module').then(m => m.TermsOfServiceModule),
-          },
-          {
-            path: 'privacy-policy',
-            loadChildren: () => import('./components/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyModule),
-          },
-          {
-            path: 'trademark-policy',
-            loadChildren: () => import('./components/trademark-policy/trademark-policy.module').then(m => m.TrademarkModule),
-          },
-          {
-            path: 'address/:id',
-            children: [],
-            component: AddressComponent,
-            data: {
-              ogImage: true,
-              networkSpecific: true,
-            }
-          },
-          {
-            path: 'tx',
-            component: StartComponent,
-            data: { preload: true, networkSpecific: true },
-            loadChildren: () => import('./components/transaction/transaction.module').then(m => m.TransactionModule),
-          },
-          {
-            path: 'block',
-            component: StartComponent,
-            data: { preload: true, networkSpecific: true },
-            loadChildren: () => import('./components/block/block.module').then(m => m.BlockModule),
-          },
-          {
-            path: 'docs',
-            loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule),
-            data: { preload: true },
-          },
-          {
-            path: 'api',
-            loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-          },
-          {
-            path: 'lightning',
-            loadChildren: () => import('./lightning/lightning.module').then(m => m.LightningModule),
-            data: { preload: browserWindowEnv && browserWindowEnv.LIGHTNING === true, networks: ['bitcoin'] },
-          },
-        ],
+        loadChildren: () => import('./master-page.module').then(m => m.MasterPageModule),
+        data: { preload: true },
       },
       {
         path: 'status',
@@ -138,71 +64,8 @@ let routes: Routes = [
       },
       {
         path: '',
-        component: MasterPageComponent,
-        children: [
-          {
-            path: 'tx/push',
-            component: PushTransactionComponent,
-          },
-          {
-            path: 'about',
-            loadChildren: () => import('./components/about/about.module').then(m => m.AboutModule),
-          },
-          {
-            path: 'blocks',
-            component: BlocksList,
-          },
-          {
-            path: 'rbf',
-            component: RbfList,
-          },
-          {
-            path: 'terms-of-service',
-            loadChildren: () => import('./components/terms-of-service/terms-of-service.module').then(m => m.TermsOfServiceModule),
-          },
-          {
-            path: 'privacy-policy',
-            loadChildren: () => import('./components/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyModule),
-          },
-          {
-            path: 'trademark-policy',
-            loadChildren: () => import('./components/trademark-policy/trademark-policy.module').then(m => m.TrademarkModule),
-          },
-          {
-            path: 'address/:id',
-            children: [],
-            component: AddressComponent,
-            data: {
-              ogImage: true,
-              networkSpecific: true,
-            }
-          },
-          {
-            path: 'tx',
-            component: StartComponent,
-            data: { preload: true, networkSpecific: true },
-            loadChildren: () => import('./components/transaction/transaction.module').then(m => m.TransactionModule),
-          },
-          {
-            path: 'block',
-            component: StartComponent,
-            data: { preload: true, networkSpecific: true },
-            loadChildren: () => import('./components/block/block.module').then(m => m.BlockModule),
-          },
-          {
-            path: 'docs',
-            loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-          },
-          {
-            path: 'api',
-            loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-          },
-          {
-            path: 'lightning',
-            data: { networks: ['bitcoin'] },
-            loadChildren: () => import('./lightning/lightning.module').then(m => m.LightningModule)
-          },
-        ],
+        loadChildren: () => import('./master-page.module').then(m => m.MasterPageModule),
+        data: { preload: true },
       },
       {
         path: 'status',
@@ -226,80 +89,8 @@ let routes: Routes = [
   },
   {
     path: '',
-    component: MasterPageComponent,
-    children: [
-      {
-        path: 'mining/blocks',
-        redirectTo: 'blocks',
-        pathMatch: 'full'
-      },
-      {
-        path: 'tx/push',
-        component: PushTransactionComponent,
-      },
-      {
-        path: 'about',
-        loadChildren: () => import('./components/about/about.module').then(m => m.AboutModule),
-      },
-      {
-        path: 'blocks',
-        component: BlocksList,
-      },
-      {
-        path: 'rbf',
-        component: RbfList,
-      },
-      {
-        path: 'tools/calculator',
-        component: CalculatorComponent
-      },
-      {
-        path: 'terms-of-service',
-        loadChildren: () => import('./components/terms-of-service/terms-of-service.module').then(m => m.TermsOfServiceModule),
-      },
-      {
-        path: 'privacy-policy',
-        loadChildren: () => import('./components/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyModule),
-      },
-      {
-        path: 'trademark-policy',
-        loadChildren: () => import('./components/trademark-policy/trademark-policy.module').then(m => m.TrademarkModule),
-      },
-      {
-        path: 'address/:id',
-        children: [],
-        component: AddressComponent,
-        data: {
-          ogImage: true,
-          networkSpecific: true,
-        }
-      },
-      {
-        path: 'tx',
-        component: StartComponent,
-        data: { preload: true, networkSpecific: true },
-        loadChildren: () => import('./components/transaction/transaction.module').then(m => m.TransactionModule),
-      },
-      {
-        path: 'block',
-        component: StartComponent,
-        data: { preload: true, networkSpecific: true },
-        loadChildren: () => import('./components/block/block.module').then(m => m.BlockModule),
-      },
-      {
-        path: 'docs',
-        loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-      },
-      {
-        path: 'api',
-        loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-      },
-      {
-        path: 'lightning',
-        data: { networks: ['bitcoin'] },
-        loadChildren: () => import('./lightning/lightning.module').then(m => m.LightningModule)
-      },
-    ],
+    loadChildren: () => import('./master-page.module').then(m => m.MasterPageModule),
+    data: { preload: true },
   },
   {
     path: 'preview',
@@ -356,7 +147,6 @@ let routes: Routes = [
 if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'bisq') {
   routes = [{
     path: '',
-    component: BisqMasterPageComponent,
     loadChildren: () => import('./bisq/bisq.module').then(m => m.BisqModule)
   }];
 }
@@ -373,88 +163,7 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
         },
         {
           path: '',
-          component: LiquidMasterPageComponent,
-          children: [
-            {
-              path: 'tx/push',
-              component: PushTransactionComponent,
-            },
-            {
-              path: 'about',
-              loadChildren: () => import('./components/about/about.module').then(m => m.AboutModule),
-            },
-            {
-              path: 'blocks',
-              component: BlocksList,
-            },
-            {
-              path: 'terms-of-service',
-              loadChildren: () => import('./components/terms-of-service/terms-of-service.module').then(m => m.TermsOfServiceModule),
-            },
-            {
-              path: 'privacy-policy',
-              loadChildren: () => import('./components/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyModule),
-            },
-            {
-              path: 'trademark-policy',
-              loadChildren: () => import('./components/trademark-policy/trademark-policy.module').then(m => m.TrademarkModule),
-            },
-            {
-              path: 'address/:id',
-              children: [],
-              component: AddressComponent,
-              data: {
-                ogImage: true,
-                networkSpecific: true,
-              }
-            },
-            {
-              path: 'tx',
-              component: StartComponent,
-              data: { preload: true, networkSpecific: true },
-              loadChildren: () => import('./components/transaction/transaction.module').then(m => m.TransactionModule),
-            },
-            {
-              path: 'block',
-              component: StartComponent,
-              data: { preload: true, networkSpecific: true },
-              loadChildren: () => import('./components/block/block.module').then(m => m.BlockModule),
-            },
-            {
-              path: 'assets',
-              data: { networks: ['liquid'] },
-              component: AssetsNavComponent,
-              children: [
-                {
-                  path: 'all',
-                  data: { networks: ['liquid'] },
-                  component: AssetsComponent,
-                },
-                {
-                  path: 'asset/:id',
-                  data: { networkSpecific: true },
-                  component: AssetComponent
-                },
-                {
-                  path: 'group/:id',
-                  data: { networkSpecific: true },
-                  component: AssetGroupComponent
-                },
-                {
-                  path: '**',
-                  redirectTo: 'all'
-                }
-              ]
-            },
-            {
-              path: 'docs',
-              loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-            },
-            {
-              path: 'api',
-              loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-            },
-          ],
+          loadChildren: () => import ('./liquid/liquid-master-page.module').then(m => m.LiquidMasterPageModule)
         },
         {
           path: 'status',
@@ -478,93 +187,7 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
     },
     {
       path: '',
-      component: LiquidMasterPageComponent,
-      children: [
-        {
-          path: 'tx/push',
-          component: PushTransactionComponent,
-        },
-        {
-          path: 'about',
-          loadChildren: () => import('./components/about/about.module').then(m => m.AboutModule),
-        },
-        {
-          path: 'blocks',
-          component: BlocksList,
-        },
-        {
-          path: 'terms-of-service',
-          loadChildren: () => import('./components/terms-of-service/terms-of-service.module').then(m => m.TermsOfServiceModule),
-        },
-        {
-          path: 'privacy-policy',
-          loadChildren: () => import('./components/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyModule),
-        },
-        {
-          path: 'trademark-policy',
-          loadChildren: () => import('./components/trademark-policy/trademark-policy.module').then(m => m.TrademarkModule),
-        },
-        {
-          path: 'address/:id',
-          children: [],
-          component: AddressComponent,
-          data: {
-            ogImage: true,
-            networkSpecific: true,
-          }
-        },
-        {
-          path: 'tx',
-          component: StartComponent,
-          data: { preload: true, networkSpecific: true },
-          loadChildren: () => import('./components/transaction/transaction.module').then(m => m.TransactionModule),
-        },
-        {
-          path: 'block',
-          component: StartComponent,
-          data: { preload: true, networkSpecific: true },
-          loadChildren: () => import('./components/block/block.module').then(m => m.BlockModule),
-        },
-        {
-          path: 'assets',
-          data: { networks: ['liquid'] },
-          component: AssetsNavComponent,
-          children: [
-            {
-              path: 'featured',
-              data: { networkSpecific: true },
-              component: AssetsFeaturedComponent,
-            },
-            {
-              path: 'all',
-              data: { networks: ['liquid'] },
-              component: AssetsComponent,
-            },
-            {
-              path: 'asset/:id',
-              data: { networkSpecific: true },
-              component: AssetComponent
-            },
-            {
-              path: 'group/:id',
-              data: { networkSpecific: true },
-              component: AssetGroupComponent
-            },
-            {
-              path: '**',
-              redirectTo: 'featured'
-            }
-          ]
-        },
-        {
-          path: 'docs',
-          loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-        },
-        {
-          path: 'api',
-          loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule)
-        },
-      ],
+      loadChildren: () => import ('./liquid/liquid-master-page.module').then(m => m.LiquidMasterPageModule)
     },
     {
       path: 'preview',