Skip to content

Commit

Permalink
fix: inconsistent breadcrumb updates on category, search & product page
Browse files Browse the repository at this point in the history
  • Loading branch information
@Sebastian-Haehnlein
Sebastian-Haehnlein committed Jul 23, 2020
1 parent caaa600 commit 83ac5f9
Show file tree
Hide file tree
Showing 4 changed files with 62 additions and 30 deletions.
15 changes: 10 additions & 5 deletions src/app/core/store/shopping/categories/categories.effects.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,11 +115,16 @@ export class CategoriesEffects {
);

setBreadcrumbForCategoryPage$ = createEffect(() =>
this.store.pipe(
ofCategoryUrl(),
select(getBreadcrumbForCategoryPage),
whenTruthy(),
map(breadcrumbData => setBreadcrumbData({ breadcrumbData }))
this.actions$.pipe(
ofType(routerNavigatedAction),
switchMapTo(
this.store.pipe(
ofCategoryUrl(),
select(getBreadcrumbForCategoryPage),
whenTruthy(),
map(breadcrumbData => setBreadcrumbData({ breadcrumbData }))
)
)
)
);
}
17 changes: 12 additions & 5 deletions src/app/core/store/shopping/products/products.effects.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { Router } from '@angular/router';
import { Actions, createEffect, ofType } from '@ngrx/effects';
import { Dictionary } from '@ngrx/entity';
import { routerNavigatedAction } from '@ngrx/router-store';
import { Store, select } from '@ngrx/store';
import { identity } from 'rxjs';
import {
Expand All @@ -14,6 +15,7 @@ import {
groupBy,
map,
mergeMap,
switchMapTo,
tap,
throttleTime,
withLatestFrom,
Expand Down Expand Up @@ -331,11 +333,16 @@ export class ProductsEffects {
);

setBreadcrumbForProductPage$ = createEffect(() =>
this.store.pipe(
ofProductUrl(),
select(getBreadcrumbForProductPage),
whenTruthy(),
map(breadcrumbData => setBreadcrumbData({ breadcrumbData }))
this.actions$.pipe(
ofType(routerNavigatedAction),
switchMapTo(
this.store.pipe(
ofProductUrl(),
select(getBreadcrumbForProductPage),
whenTruthy(),
map(breadcrumbData => setBreadcrumbData({ breadcrumbData }))
)
)
)
);

Expand Down
24 changes: 16 additions & 8 deletions src/app/core/store/shopping/search/search.effects.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
map,
sample,
switchMap,
switchMapTo,
tap,
withLatestFrom,
} from 'rxjs/operators';
Expand Down Expand Up @@ -109,14 +110,21 @@ export class SearchEffects {
);

setSearchBreadcrumb$ = createEffect(() =>
this.store.pipe(
ofUrl(/^\/search.*/),
select(selectRouteParam('searchTerm')),
whenTruthy(),
switchMap(searchTerm =>
this.translateService
.get('search.breadcrumbs.your_search.label')
.pipe(map(translation => setBreadcrumbData({ breadcrumbData: [{ text: `${translation} ${searchTerm}` }] })))
this.actions$.pipe(
ofType(routerNavigatedAction),
switchMapTo(
this.store.pipe(
ofUrl(/^\/search.*/),
select(selectRouteParam('searchTerm')),
whenTruthy(),
switchMap(searchTerm =>
this.translateService
.get('search.breadcrumbs.your_search.label')
.pipe(
map(translation => setBreadcrumbData({ breadcrumbData: [{ text: `${translation} ${searchTerm}` }] }))
)
)
)
)
)
);
Expand Down
36 changes: 24 additions & 12 deletions src/app/core/store/shopping/shopping-store.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -280,6 +280,8 @@ describe('Shopping Store', () => {
@ngrx/router-store/navigated:
routerState: {"url":"/category/A.123","params":{"categoryUniqueId":"A.123...
event: {"id":2,"url":"/category/A.123"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123"}]
`);
}));
});
Expand Down Expand Up @@ -328,6 +330,8 @@ describe('Shopping Store', () => {
event: {"id":2,"url":"/search/something"}
[Product Listing] Load More Products:
id: {"type":"search","value":"something"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"search.breadcrumbs.your_search.label something"}]
[Product Listing Internal] Load More Products For Params:
id: {"type":"search","value":"something"}
filters: undefined
Expand Down Expand Up @@ -413,15 +417,13 @@ describe('Shopping Store', () => {
categories: tree(A.123,A.123.456)
[Categories Internal] Load Category:
categoryId: "A"
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA123"}]
[Categories API] Load Category Success:
categories: tree(A,A.123)
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123"}]
@ngrx/router-store/navigated:
routerState: {"url":"/category/A.123","params":{"categoryUniqueId":"A.123...
event: {"id":1,"url":"/category/A.123"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123"}]
`);
}));

Expand Down Expand Up @@ -497,19 +499,17 @@ describe('Shopping Store', () => {
categoryId: "A"
[Categories Internal] Load Category:
categoryId: "A.123"
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA123456"}]
[Categories API] Load Category Success:
categories: tree(A,A.123)
[Categories API] Load Category Success:
categories: tree(A.123,A.123.456)
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
@ngrx/router-store/navigated:
routerState: {"url":"/category/A.123.456","params":{"categoryUniqueId":"A...
event: {"id":1,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
[Product Listing Internal] Load More Products For Params:
id: {"type":"category","value":"A.123.456"}
filters: undefined
Expand Down Expand Up @@ -588,11 +588,15 @@ describe('Shopping Store', () => {
event: {"id":3,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
@ngrx/router-store/navigated:
routerState: {"url":"/category/A.123.456","params":{"categoryUniqueId":"A...
event: {"id":3,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
`);
}));
});
Expand Down Expand Up @@ -620,6 +624,8 @@ describe('Shopping Store', () => {
event: {"id":2,"url":"/search/something"}
[Product Listing] Load More Products:
id: {"type":"search","value":"something"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"search.breadcrumbs.your_search.label something"}]
[Product Listing Internal] Load More Products For Params:
id: {"type":"search","value":"something"}
filters: undefined
Expand Down Expand Up @@ -660,6 +666,8 @@ describe('Shopping Store', () => {
event: {"id":3,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
[Product Listing Internal] Load More Products For Params:
id: {"type":"category","value":"A.123.456"}
filters: undefined
Expand All @@ -676,6 +684,8 @@ describe('Shopping Store', () => {
event: {"id":3,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
`);
}));
});
Expand Down Expand Up @@ -800,10 +810,10 @@ describe('Shopping Store', () => {
@ngrx/router-store/navigation:
routerState: {"url":"/category/A.123.456","params":{"categoryUniqueId":"A...
event: {"id":2,"url":"/category/A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
[Product Listing Internal] Load More Products For Params:
id: {"type":"category","value":"A.123.456"}
filters: undefined
Expand Down Expand Up @@ -831,6 +841,8 @@ describe('Shopping Store', () => {
event: {"id":2,"url":"/category/A.123.456"}
[Product Listing] Load More Products:
id: {"type":"category","value":"A.123.456"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"nA","link":"/nA-catA"},{"text":"nA123","link":"/nA...
`);
}));

Expand Down Expand Up @@ -1074,13 +1086,13 @@ describe('Shopping Store', () => {
@ngrx/router-store/navigation:
routerState: {"url":"/search/something","params":{"searchTerm":"something...
event: {"id":1,"url":"/search/something"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"search.breadcrumbs.your_search.label something"}]
@ngrx/router-store/navigated:
routerState: {"url":"/search/something","params":{"searchTerm":"something...
event: {"id":1,"url":"/search/something"}
[Product Listing] Load More Products:
id: {"type":"search","value":"something"}
[Viewconf Internal] Set Breadcrumb Data:
breadcrumbData: [{"text":"search.breadcrumbs.your_search.label something"}]
[Product Listing Internal] Load More Products For Params:
id: {"type":"search","value":"something"}
filters: undefined
Expand Down

0 comments on commit 83ac5f9

Please sign in to comment.