From 9b4c6b9e2ca33cbab0e90f44658b0c39a0954423 Mon Sep 17 00:00:00 2001 From: softsimon Date: Sun, 24 Apr 2022 22:53:27 +0400 Subject: [PATCH] Moving Docs and Faq to separate lazy loaded module --- frontend/src/app/app-routing.module.ts | 74 +++---------------- frontend/src/app/app.module.ts | 18 ----- frontend/src/app/bisq/bisq.routing.module.ts | 14 +--- .../docs => docs/api-docs}/api-docs-data.ts | 0 .../api-docs}/api-docs-nav.component.html | 0 .../api-docs}/api-docs-nav.component.scss | 0 .../api-docs}/api-docs-nav.component.ts | 0 .../api-docs}/api-docs.component.html | 0 .../api-docs}/api-docs.component.scss | 0 .../api-docs}/api-docs.component.ts | 4 +- .../code-template.component.html | 0 .../code-template.component.scss | 0 .../code-template}/code-template.component.ts | 2 +- frontend/src/app/docs/docs.module.ts | 22 ++++++ frontend/src/app/docs/docs.routing.module.ts | 58 +++++++++++++++ .../docs/docs.component.html | 0 .../docs/docs.component.scss | 0 .../docs/docs.component.ts | 8 +- frontend/src/app/shared/shared.module.ts | 19 +++++ 19 files changed, 118 insertions(+), 101 deletions(-) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs-data.ts (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs-nav.component.html (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs-nav.component.scss (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs-nav.component.ts (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs.component.html (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs.component.scss (100%) rename frontend/src/app/{components/docs => docs/api-docs}/api-docs.component.ts (97%) rename frontend/src/app/{components/docs => docs/code-template}/code-template.component.html (100%) rename frontend/src/app/{components/docs => docs/code-template}/code-template.component.scss (100%) rename frontend/src/app/{components/docs => docs/code-template}/code-template.component.ts (99%) create mode 100644 frontend/src/app/docs/docs.module.ts create mode 100644 frontend/src/app/docs/docs.routing.module.ts rename frontend/src/app/{components => docs}/docs/docs.component.html (100%) rename frontend/src/app/{components => docs}/docs/docs.component.scss (100%) rename frontend/src/app/{components => docs}/docs/docs.component.ts (84%) diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index a9485f823..13465a612 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -14,7 +14,6 @@ import { AssetsNavComponent } from './components/assets/assets-nav/assets-nav.co import { StatusViewComponent } from './components/status-view/status-view.component'; import { DashboardComponent } from './dashboard/dashboard.component'; import { LatestBlocksComponent } from './components/latest-blocks/latest-blocks.component'; -import { DocsComponent } from './components/docs/docs.component'; import { TermsOfServiceComponent } from './components/terms-of-service/terms-of-service.component'; import { PrivacyPolicyComponent } from './components/privacy-policy/privacy-policy.component'; import { TrademarkPolicyComponent } from './components/trademark-policy/trademark-policy.component'; @@ -138,25 +137,13 @@ let routes: Routes = [ path: 'about', component: AboutComponent, }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/faq', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/faq' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'terms-of-service', @@ -281,25 +268,13 @@ let routes: Routes = [ children: [], component: AddressComponent }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/faq', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/faq' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, ], }, @@ -421,25 +396,13 @@ let routes: Routes = [ children: [], component: AddressComponent }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/faq', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/faq' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, ], }, @@ -567,21 +530,13 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') { } ] }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'about', @@ -679,21 +634,13 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') { } ] }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('./docs/docs.module').then(m => m.DocsModule) }, { path: 'about', @@ -743,7 +690,6 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') { scrollPositionRestoration: 'enabled', anchorScrolling: 'enabled' })], - exports: [RouterModule] }) export class AppRoutingModule { } diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 27a637efc..8738c37f1 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -12,7 +12,6 @@ import { StartComponent } from './components/start/start.component'; import { ElectrsApiService } from './services/electrs-api.service'; import { TransactionComponent } from './components/transaction/transaction.component'; import { TransactionsListComponent } from './components/transactions-list/transactions-list.component'; -import { AmountComponent } from './components/amount/amount.component'; import { StateService } from './services/state.service'; import { BlockComponent } from './components/block/block.component'; import { AddressComponent } from './components/address/address.component'; @@ -20,15 +19,12 @@ import { SearchFormComponent } from './components/search-form/search-form.compon import { LatestBlocksComponent } from './components/latest-blocks/latest-blocks.component'; import { WebsocketService } from './services/websocket.service'; import { AddressLabelsComponent } from './components/address-labels/address-labels.component'; -import { MempoolBlocksComponent } from './components/mempool-blocks/mempool-blocks.component'; import { MasterPageComponent } from './components/master-page/master-page.component'; import { BisqMasterPageComponent } from './components/bisq-master-page/bisq-master-page.component'; import { LiquidMasterPageComponent } from './components/liquid-master-page/liquid-master-page.component'; import { AboutComponent } from './components/about/about.component'; import { TelevisionComponent } from './components/television/television.component'; import { StatisticsComponent } from './components/statistics/statistics.component'; -import { BlockchainBlocksComponent } from './components/blockchain-blocks/blockchain-blocks.component'; -import { BlockchainComponent } from './components/blockchain/blockchain.component'; import { FooterComponent } from './components/footer/footer.component'; import { AudioService } from './services/audio.service'; import { MempoolBlockComponent } from './components/mempool-block/mempool-block.component'; @@ -53,11 +49,6 @@ import { DifficultyComponent } from './components/difficulty/difficulty.componen import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome'; import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faHammer, faDatabase, faExchangeAlt, faInfoCircle, faLink, faList, faSearch, faCaretUp, faCaretDown, faTachometerAlt, faThList, faTint, faTv, faAngleDoubleDown, faSortUp, faAngleDoubleUp, faChevronDown, faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook, faListUl } from '@fortawesome/free-solid-svg-icons'; -import { ApiDocsComponent } from './components/docs/api-docs.component'; -import { DocsComponent } from './components/docs/docs.component'; -import { ApiDocsNavComponent } from './components/docs/api-docs-nav.component'; -import { NoSanitizePipe } from './shared/pipes/no-sanitize.pipe'; -import { CodeTemplateComponent } from './components/docs/code-template.component'; import { TermsOfServiceComponent } from './components/terms-of-service/terms-of-service.component'; import { PrivacyPolicyComponent } from './components/privacy-policy/privacy-policy.component'; import { TrademarkPolicyComponent } from './components/trademark-policy/trademark-policy.component'; @@ -93,20 +84,16 @@ import { BlockFeeRatesGraphComponent } from './components/block-fee-rates-graph/ BisqMasterPageComponent, LiquidMasterPageComponent, TelevisionComponent, - BlockchainComponent, StartComponent, - BlockchainBlocksComponent, StatisticsComponent, TransactionComponent, BlockComponent, TransactionsListComponent, AddressComponent, - AmountComponent, LatestBlocksComponent, SearchFormComponent, TimeSpanComponent, AddressLabelsComponent, - MempoolBlocksComponent, FooterComponent, MempoolBlockComponent, FeeDistributionGraphComponent, @@ -122,16 +109,11 @@ import { BlockFeeRatesGraphComponent } from './components/block-fee-rates-graph/ FeesBoxComponent, DashboardComponent, DifficultyComponent, - ApiDocsComponent, - NoSanitizePipe, - CodeTemplateComponent, TermsOfServiceComponent, PrivacyPolicyComponent, TrademarkPolicyComponent, SponsorComponent, PushTransactionComponent, - DocsComponent, - ApiDocsNavComponent, AssetsNavComponent, AssetsFeaturedComponent, AssetGroupComponent, diff --git a/frontend/src/app/bisq/bisq.routing.module.ts b/frontend/src/app/bisq/bisq.routing.module.ts index 73dffee51..f7385ae63 100644 --- a/frontend/src/app/bisq/bisq.routing.module.ts +++ b/frontend/src/app/bisq/bisq.routing.module.ts @@ -7,7 +7,6 @@ import { BisqBlockComponent } from './bisq-block/bisq-block.component'; import { BisqBlocksComponent } from './bisq-blocks/bisq-blocks.component'; import { BisqAddressComponent } from './bisq-address/bisq-address.component'; import { BisqStatsComponent } from './bisq-stats/bisq-stats.component'; -import { DocsComponent } from '../components/docs/docs.component'; import { BisqDashboardComponent } from './bisq-dashboard/bisq-dashboard.component'; import { BisqMarketComponent } from './bisq-market/bisq-market.component'; import { BisqMainDashboardComponent } from './bisq-main-dashboard/bisq-main-dashboard.component'; @@ -60,21 +59,13 @@ const routes: Routes = [ path: 'about', component: AboutComponent, }, - { - path: 'docs/api/:type', - component: DocsComponent - }, - { - path: 'docs/api', - redirectTo: 'docs/api/rest' - }, { path: 'docs', - redirectTo: 'docs/api/rest' + loadChildren: () => import('../docs/docs.module').then(m => m.DocsModule) }, { path: 'api', - redirectTo: 'docs/api/rest' + loadChildren: () => import('../docs/docs.module').then(m => m.DocsModule) }, { path: 'terms-of-service', @@ -88,6 +79,5 @@ const routes: Routes = [ @NgModule({ imports: [RouterModule.forChild(routes)], - exports: [RouterModule] }) export class BisqRoutingModule { } diff --git a/frontend/src/app/components/docs/api-docs-data.ts b/frontend/src/app/docs/api-docs/api-docs-data.ts similarity index 100% rename from frontend/src/app/components/docs/api-docs-data.ts rename to frontend/src/app/docs/api-docs/api-docs-data.ts diff --git a/frontend/src/app/components/docs/api-docs-nav.component.html b/frontend/src/app/docs/api-docs/api-docs-nav.component.html similarity index 100% rename from frontend/src/app/components/docs/api-docs-nav.component.html rename to frontend/src/app/docs/api-docs/api-docs-nav.component.html diff --git a/frontend/src/app/components/docs/api-docs-nav.component.scss b/frontend/src/app/docs/api-docs/api-docs-nav.component.scss similarity index 100% rename from frontend/src/app/components/docs/api-docs-nav.component.scss rename to frontend/src/app/docs/api-docs/api-docs-nav.component.scss diff --git a/frontend/src/app/components/docs/api-docs-nav.component.ts b/frontend/src/app/docs/api-docs/api-docs-nav.component.ts similarity index 100% rename from frontend/src/app/components/docs/api-docs-nav.component.ts rename to frontend/src/app/docs/api-docs/api-docs-nav.component.ts diff --git a/frontend/src/app/components/docs/api-docs.component.html b/frontend/src/app/docs/api-docs/api-docs.component.html similarity index 100% rename from frontend/src/app/components/docs/api-docs.component.html rename to frontend/src/app/docs/api-docs/api-docs.component.html diff --git a/frontend/src/app/components/docs/api-docs.component.scss b/frontend/src/app/docs/api-docs/api-docs.component.scss similarity index 100% rename from frontend/src/app/components/docs/api-docs.component.scss rename to frontend/src/app/docs/api-docs/api-docs.component.scss diff --git a/frontend/src/app/components/docs/api-docs.component.ts b/frontend/src/app/docs/api-docs/api-docs.component.ts similarity index 97% rename from frontend/src/app/components/docs/api-docs.component.ts rename to frontend/src/app/docs/api-docs/api-docs.component.ts index 39f611310..6c645a14f 100644 --- a/frontend/src/app/components/docs/api-docs.component.ts +++ b/frontend/src/app/docs/api-docs/api-docs.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core'; -import { Env, StateService } from 'src/app/services/state.service'; +import { Env, StateService } from '../../services/state.service'; import { Observable, merge, of } from 'rxjs'; -import { SeoService } from 'src/app/services/seo.service'; +import { SeoService } from '../../services/seo.service'; import { tap } from 'rxjs/operators'; import { ActivatedRoute } from "@angular/router"; import { faqData, restApiDocsData, wsApiDocsData } from './api-docs-data'; diff --git a/frontend/src/app/components/docs/code-template.component.html b/frontend/src/app/docs/code-template/code-template.component.html similarity index 100% rename from frontend/src/app/components/docs/code-template.component.html rename to frontend/src/app/docs/code-template/code-template.component.html diff --git a/frontend/src/app/components/docs/code-template.component.scss b/frontend/src/app/docs/code-template/code-template.component.scss similarity index 100% rename from frontend/src/app/components/docs/code-template.component.scss rename to frontend/src/app/docs/code-template/code-template.component.scss diff --git a/frontend/src/app/components/docs/code-template.component.ts b/frontend/src/app/docs/code-template/code-template.component.ts similarity index 99% rename from frontend/src/app/components/docs/code-template.component.ts rename to frontend/src/app/docs/code-template/code-template.component.ts index cc7b8254e..69478f26c 100644 --- a/frontend/src/app/components/docs/code-template.component.ts +++ b/frontend/src/app/docs/code-template/code-template.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnInit } from '@angular/core'; -import { Env, StateService } from 'src/app/services/state.service'; +import { Env, StateService } from '../../services/state.service'; @Component({ selector: 'app-code-template', diff --git a/frontend/src/app/docs/docs.module.ts b/frontend/src/app/docs/docs.module.ts new file mode 100644 index 000000000..134886c5d --- /dev/null +++ b/frontend/src/app/docs/docs.module.ts @@ -0,0 +1,22 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { SharedModule } from '../shared/shared.module'; +import { ApiDocsComponent } from './/api-docs/api-docs.component'; +import { DocsComponent } from './docs/docs.component'; +import { ApiDocsNavComponent } from './api-docs/api-docs-nav.component'; +import { CodeTemplateComponent } from './code-template/code-template.component'; +import { DocsRoutingModule } from './docs.routing.module'; +@NgModule({ + declarations: [ + ApiDocsComponent, + CodeTemplateComponent, + ApiDocsNavComponent, + DocsComponent, + ], + imports: [ + CommonModule, + SharedModule, + DocsRoutingModule, + ] +}) +export class DocsModule { } diff --git a/frontend/src/app/docs/docs.routing.module.ts b/frontend/src/app/docs/docs.routing.module.ts new file mode 100644 index 000000000..52eb54f2e --- /dev/null +++ b/frontend/src/app/docs/docs.routing.module.ts @@ -0,0 +1,58 @@ +import { NgModule } from '@angular/core'; +import { RouterModule, Routes } from '@angular/router'; +import { DocsComponent } from './docs/docs.component'; + +const browserWindow = window || {}; +// @ts-ignore +const browserWindowEnv = browserWindow.__env || {}; + +let routes: Routes = []; + +if (browserWindowEnv.BASE_MODULE && (browserWindowEnv.BASE_MODULE === 'bisq' || browserWindowEnv.BASE_MODULE === 'liquid')) { + routes = [ + { + path: '', + redirectTo: 'api/rest' + }, + { + path: 'api/:type', + component: DocsComponent + }, + { + path: 'api', + redirectTo: 'api/rest' + }, + { + path: '**', + redirectTo: 'api/rest' + } + ]; +} else { + routes = [ + { + path: '', + redirectTo: 'faq' + }, + { + path: 'api/:type', + component: DocsComponent + }, + { + path: 'faq', + component: DocsComponent + }, + { + path: 'api', + redirectTo: 'api/rest' + }, + { + path: '**', + redirectTo: 'api/faq' + } + ]; +} + +@NgModule({ + imports: [RouterModule.forChild(routes)], +}) +export class DocsRoutingModule { } diff --git a/frontend/src/app/components/docs/docs.component.html b/frontend/src/app/docs/docs/docs.component.html similarity index 100% rename from frontend/src/app/components/docs/docs.component.html rename to frontend/src/app/docs/docs/docs.component.html diff --git a/frontend/src/app/components/docs/docs.component.scss b/frontend/src/app/docs/docs/docs.component.scss similarity index 100% rename from frontend/src/app/components/docs/docs.component.scss rename to frontend/src/app/docs/docs/docs.component.scss diff --git a/frontend/src/app/components/docs/docs.component.ts b/frontend/src/app/docs/docs/docs.component.ts similarity index 84% rename from frontend/src/app/components/docs/docs.component.ts rename to frontend/src/app/docs/docs/docs.component.ts index 2d0d0b55a..9a06f1127 100644 --- a/frontend/src/app/components/docs/docs.component.ts +++ b/frontend/src/app/docs/docs/docs.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit, HostBinding } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { Env, StateService } from 'src/app/services/state.service'; -import { WebsocketService } from 'src/app/services/websocket.service'; +import { Env, StateService } from '../../services/state.service'; +import { WebsocketService } from '../../services/websocket.service'; @Component({ selector: 'app-docs', @@ -26,9 +26,9 @@ export class DocsComponent implements OnInit { ngOnInit(): void { this.websocket.want(['blocks']); const url = this.route.snapshot.url; - if( url[1].path === "faq" ) { + if (url[0].path === "faq" ) { this.activeTab = 0; - } else if( url[2].path === "rest" ) { + } else if( url[1].path === "rest" ) { this.activeTab = 1; } else { this.activeTab = 2; diff --git a/frontend/src/app/shared/shared.module.ts b/frontend/src/app/shared/shared.module.ts index b29303c27..aa23bb639 100644 --- a/frontend/src/app/shared/shared.module.ts +++ b/frontend/src/app/shared/shared.module.ts @@ -12,6 +12,7 @@ import { RelativeUrlPipe } from './pipes/relative-url/relative-url.pipe'; import { ScriptpubkeyTypePipe } from './pipes/scriptpubkey-type-pipe/scriptpubkey-type.pipe'; import { BytesPipe } from './pipes/bytes-pipe/bytes.pipe'; import { WuBytesPipe } from './pipes/bytes-pipe/wubytes.pipe'; +import { BlockchainComponent } from '../components/blockchain/blockchain.component'; import { TimeSinceComponent } from '../components/time-since/time-since.component'; import { TimeUntilComponent } from '../components/time-until/time-until.component'; import { ClipboardComponent } from '../components/clipboard/clipboard.component'; @@ -23,6 +24,11 @@ import { TxFeeRatingComponent } from '../components/tx-fee-rating/tx-fee-rating. import { ReactiveFormsModule } from '@angular/forms'; import { LanguageSelectorComponent } from '../components/language-selector/language-selector.component'; import { ColoredPriceDirective } from './directives/colored-price.directive'; +import { NoSanitizePipe } from './pipes/no-sanitize.pipe'; +import { MempoolBlocksComponent } from '../components/mempool-blocks/mempool-blocks.component'; +import { BlockchainBlocksComponent } from '../components/blockchain-blocks/blockchain-blocks.component'; +import { AmountComponent } from '../components/amount/amount.component'; +import { RouterModule } from '@angular/router'; @NgModule({ declarations: [ @@ -36,6 +42,7 @@ import { ColoredPriceDirective } from './directives/colored-price.directive'; LanguageSelectorComponent, ScriptpubkeyTypePipe, RelativeUrlPipe, + NoSanitizePipe, Hex2asciiPipe, AsmStylerPipe, AbsolutePipe, @@ -47,9 +54,14 @@ import { ColoredPriceDirective } from './directives/colored-price.directive'; Decimal2HexPipe, FeeRoundingPipe, ColoredPriceDirective, + BlockchainComponent, + MempoolBlocksComponent, + BlockchainBlocksComponent, + AmountComponent, ], imports: [ CommonModule, + RouterModule, ReactiveFormsModule, NgbNavModule, NgbTooltipModule, @@ -61,8 +73,10 @@ import { ColoredPriceDirective } from './directives/colored-price.directive'; providers: [ VbytesPipe, RelativeUrlPipe, + NoSanitizePipe, ], exports: [ + RouterModule, NgbAccordionModule, NgbNavModule, CommonModule, @@ -92,6 +106,11 @@ import { ColoredPriceDirective } from './directives/colored-price.directive'; Decimal2HexPipe, FeeRoundingPipe, ColoredPriceDirective, + NoSanitizePipe, + BlockchainComponent, + MempoolBlocksComponent, + BlockchainBlocksComponent, + AmountComponent, ] }) export class SharedModule {}