From e1e50e5e5271abd7c3563ffb9bfb564ef169f787 Mon Sep 17 00:00:00 2001 From: Damien Retzinger Date: Fri, 18 Oct 2024 13:28:53 -0400 Subject: [PATCH] feat(demo): use reworked external router --- apps/demo/src/app/app-routing.module.ts | 61 ++++++------------- .../app/category/category-routing.module.ts | 1 - .../category-view.component.spec.ts | 4 ++ apps/demo/src/app/drivers/in-memory.module.ts | 4 +- apps/demo/src/app/drivers/magento.module.ts | 4 +- .../product-card/product-card.component.html | 30 ++++----- .../product-card.component.spec.ts | 11 ---- .../product-card/product-card.component.ts | 8 --- .../product-card/product-card.module.ts | 2 + 9 files changed, 44 insertions(+), 81 deletions(-) diff --git a/apps/demo/src/app/app-routing.module.ts b/apps/demo/src/app/app-routing.module.ts index cfc6ec20b3..9ee25eec07 100644 --- a/apps/demo/src/app/app-routing.module.ts +++ b/apps/demo/src/app/app-routing.module.ts @@ -4,12 +4,8 @@ import { RouterModule, } from '@angular/router'; -import { - DaffExternalRouterModule, - daffDataPathUrlMatcher, - daffInsertDataPathStrategy, -} from '@daffodil/external-router'; -import { DaffExternalRouterExistenceGuard } from '@daffodil/external-router/routing'; +import { provideExternalRouter } from '@daffodil/external-router'; +import { daffExternalMatcherTypeGuard } from '@daffodil/external-router/routing'; import { DaffProductPageIdResolver, DaffProductPageUrlResolver, @@ -37,39 +33,30 @@ export const appRoutes: Routes = [ product: DaffProductPageIdResolver, }, }, - { - matcher: daffDataPathUrlMatcher, - data: { - daffExternalRouteType: 'PRODUCT', - }, - component: ProductViewComponent, - resolve: { - product: DaffProductPageUrlResolver, - }, - }, { path: 'category', loadChildren: () => import('./category/category.module').then(m => m.CategoryModule), }, - { - matcher: daffDataPathUrlMatcher, - data: { - daffExternalRouteType: 'CATEGORY', - }, - loadChildren: () => import('./category/category.module').then(m => m.CategoryModule), - }, { path: 'checkout', loadChildren: () => import('./checkout/checkout.module').then(m => m.CheckoutModule), }, { path: '404', component: NotFoundComponent }, + { + path: '**', + canMatch: [daffExternalMatcherTypeGuard('PRODUCT')], + component: ProductViewComponent, + resolve: { + product: DaffProductPageUrlResolver, + }, + }, + { + path: '**', + canMatch: [daffExternalMatcherTypeGuard('CATEGORY')], + loadChildren: () => import('./category/category.module').then(m => m.CategoryModule), + }, ], }, - { - path: '**', - canActivate: [DaffExternalRouterExistenceGuard], - children: [], - }, ]; @NgModule({ @@ -77,21 +64,9 @@ export const appRoutes: Routes = [ RouterModule.forRoot(appRoutes, { scrollPositionRestoration: 'enabled', }), - DaffExternalRouterModule.forRoot({ - failedResolutionPath: '404', - notFoundResolutionPath: '404', - }, [ - { - type: 'CATEGORY', - insertionStrategy: daffInsertDataPathStrategy, - route: {}, - }, - { - type: 'PRODUCT', - insertionStrategy: daffInsertDataPathStrategy, - route: {}, - }, - ]), + ], + providers: [ + provideExternalRouter(), ], exports: [ RouterModule, diff --git a/apps/demo/src/app/category/category-routing.module.ts b/apps/demo/src/app/category/category-routing.module.ts index 8a471a88c9..8a0ffa35e7 100644 --- a/apps/demo/src/app/category/category-routing.module.ts +++ b/apps/demo/src/app/category/category-routing.module.ts @@ -9,7 +9,6 @@ import { DaffCategoryPageUrlResolver, DaffCategoryRoutingModule, } from '@daffodil/category/routing'; -import { daffDataPathUrlMatcher } from '@daffodil/external-router'; import { CategoryViewComponent } from './pages/category-view/category-view.component'; diff --git a/apps/demo/src/app/category/pages/category-view/category-view.component.spec.ts b/apps/demo/src/app/category/pages/category-view/category-view.component.spec.ts index c76f95d3f2..7de247ee75 100644 --- a/apps/demo/src/app/category/pages/category-view/category-view.component.spec.ts +++ b/apps/demo/src/app/category/pages/category-view/category-view.component.spec.ts @@ -4,6 +4,7 @@ import { TestBed, } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; +import { provideRouter } from '@angular/router'; import { DaffCategory } from '@daffodil/category'; import { @@ -46,6 +47,9 @@ describe('CategoryViewComponent', () => { DaffCategoryStateTestingModule, DaffProductTestingModule, ], + providers: [ + provideRouter([]), + ], }) .compileComponents(); })); diff --git a/apps/demo/src/app/drivers/in-memory.module.ts b/apps/demo/src/app/drivers/in-memory.module.ts index 70379066d1..0a7234f155 100644 --- a/apps/demo/src/app/drivers/in-memory.module.ts +++ b/apps/demo/src/app/drivers/in-memory.module.ts @@ -10,7 +10,7 @@ import { DaffCartInMemoryDriverModule } from '@daffodil/cart/driver/in-memory'; import { DaffCategoryInMemoryDriverModule } from '@daffodil/category/driver/in-memory'; import { DaffInMemoryBackendCategoryService } from '@daffodil/category/driver/in-memory'; import { DaffInMemoryDriverModule } from '@daffodil/driver/in-memory'; -import { DaffExternalRouterDriverInMemoryModule } from '@daffodil/external-router/driver/in-memory'; +import { provideDaffExternalRouterInMemoryDriver } from '@daffodil/external-router/driver/in-memory'; import { DaffGeographyInMemoryDriverModule } from '@daffodil/geography/driver/in-memory'; import { DaffNavigationInMemoryDriverModule, @@ -36,9 +36,9 @@ import { DEMO_EXTERNAL_ROUTER_DRIVER_IN_MEMORY_CONFIG } from './in-memory/extern DaffNewsletterInMemoryDriverModule.forRoot(), DaffGeographyInMemoryDriverModule.forRoot(), DaffCategoryInMemoryDriverModule.forRoot(), - DaffExternalRouterDriverInMemoryModule.forRoot(DEMO_EXTERNAL_ROUTER_DRIVER_IN_MEMORY_CONFIG), ], providers: [ + provideDaffExternalRouterInMemoryDriver(DEMO_EXTERNAL_ROUTER_DRIVER_IN_MEMORY_CONFIG), { provide: DAFF_NAVIGATION_IN_MEMORY_SEED_DATA_PROVIDER, useFactory: () => { diff --git a/apps/demo/src/app/drivers/magento.module.ts b/apps/demo/src/app/drivers/magento.module.ts index 69de5f8271..d333adc695 100644 --- a/apps/demo/src/app/drivers/magento.module.ts +++ b/apps/demo/src/app/drivers/magento.module.ts @@ -10,7 +10,7 @@ import { DaffMagentoAuthorizeNetDriverModule } from '@daffodil/authorizenet/driv import { DaffCartMagentoDriverModule } from '@daffodil/cart/driver/magento'; import { DaffCategoryMagentoDriverModule } from '@daffodil/category/driver/magento'; import { DaffMagentoApolloCacheableOperationsLinkGenerator } from '@daffodil/driver/magento'; -import { DaffExternalRouterDriverMagentoModule } from '@daffodil/external-router/driver/magento/2.4.3'; +import { provideDaffExternalRouterMagentoDriver } from '@daffodil/external-router/driver/magento/2.4.3'; import { DaffGeographyMagentoDriverModule } from '@daffodil/geography/driver/magento'; import { DaffNavigationMagentoDriverModule } from '@daffodil/navigation/driver/magento'; import { DaffNewsletterInMemoryDriverModule } from '@daffodil/newsletter/driver/in-memory'; @@ -32,11 +32,11 @@ import { MagentoEnvironmentDriverConfiguration } from '../../environments/enviro DaffNewsletterInMemoryDriverModule.forRoot(), DaffGeographyMagentoDriverModule.forRoot(), DaffCategoryMagentoDriverModule.forRoot(), - DaffExternalRouterDriverMagentoModule.forRoot(), DaffMagentoAuthorizeNetDriverModule.forRoot((environment.driver).anetConfig), ApolloModule, ], providers: [ + provideDaffExternalRouterMagentoDriver(), { provide: APOLLO_OPTIONS, useFactory: demoMagentoApolloOptions, diff --git a/apps/demo/src/app/product/components/product-card/product-card.component.html b/apps/demo/src/app/product/components/product-card/product-card.component.html index cf223a5f0e..f279279f79 100644 --- a/apps/demo/src/app/product/components/product-card/product-card.component.html +++ b/apps/demo/src/app/product/components/product-card/product-card.component.html @@ -1,14 +1,16 @@ -
- -
-

- {{product.brand}} -

-

- {{product.name}} -

-

- ${{product.price}} -

-
-
\ No newline at end of file + +
+ +
+

+ {{product.brand}} +

+

+ {{product.name}} +

+

+ ${{product.price}} +

+
+
+ \ No newline at end of file diff --git a/apps/demo/src/app/product/components/product-card/product-card.component.spec.ts b/apps/demo/src/app/product/components/product-card/product-card.component.spec.ts index d80185816e..4397ffbcf0 100644 --- a/apps/demo/src/app/product/components/product-card/product-card.component.spec.ts +++ b/apps/demo/src/app/product/components/product-card/product-card.component.spec.ts @@ -68,15 +68,4 @@ describe('ProductCardComponent', () => { it('should be able to take a product as input', () => { expect(productCardComponent.componentInstance.product).toEqual(stubProduct); }); - - describe('when demo-product-card is clicked', () => { - - beforeEach(() => { - fixture.debugElement.query(By.css('.demo-product-card')).nativeElement.click(); - }); - - it('should call router.navigateByUrl', () => { - expect(productCardComponent.componentInstance.router.navigateByUrl).toHaveBeenCalledWith('product/' + stubProduct.id); - }); - }); }); diff --git a/apps/demo/src/app/product/components/product-card/product-card.component.ts b/apps/demo/src/app/product/components/product-card/product-card.component.ts index e99061c772..765bfc92a3 100644 --- a/apps/demo/src/app/product/components/product-card/product-card.component.ts +++ b/apps/demo/src/app/product/components/product-card/product-card.component.ts @@ -14,12 +14,4 @@ import { DaffProduct } from '@daffodil/product'; export class ProductCardComponent { @Input() product: DaffProduct; - - constructor( - private router: Router, - ) { } - - navigateToProduct() { - this.router.navigateByUrl('product/' + this.product.id); - } } diff --git a/apps/demo/src/app/product/components/product-card/product-card.module.ts b/apps/demo/src/app/product/components/product-card/product-card.module.ts index 12301e7961..a7a49f8c52 100644 --- a/apps/demo/src/app/product/components/product-card/product-card.module.ts +++ b/apps/demo/src/app/product/components/product-card/product-card.module.ts @@ -1,11 +1,13 @@ import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; +import { RouterModule } from '@angular/router'; import { ProductCardComponent } from './product-card.component'; @NgModule({ imports: [ CommonModule, + RouterModule, ], declarations: [ ProductCardComponent,