diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 6af7be5ab..52b5a0f87 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -21,26 +21,19 @@ Add New
- - -   - Metadata Source - - - -   - Metadata Provider - + + + + +   + + {{ action.content | translate }} + +
  • diff --git a/ui/src/app/app.component.spec.ts b/ui/src/app/app.component.spec.ts index 29246df6e..78c90e6a2 100644 --- a/ui/src/app/app.component.spec.ts +++ b/ui/src/app/app.component.spec.ts @@ -9,6 +9,8 @@ import { NotificationModule } from './notification/notification.module'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; import { MockTranslatePipe, MockI18nService, MockI18nModule } from '../testing/i18n.stub'; import { I18nService } from './i18n/service/i18n.service'; +import { NavigationService } from './core/service/navigation.service'; +import { NavigationServiceStub } from '../testing/navigation-service.stub'; @Component({ template: ` @@ -30,7 +32,8 @@ describe('AppComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ providers: [ - {provide: I18nService, useClass: MockI18nService } + {provide: I18nService, useClass: MockI18nService }, + { provide: NavigationService, useValue: NavigationServiceStub } ], imports: [ NgbDropdownModule, diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index 57119404d..50a5533c6 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { Observable } from 'rxjs'; -import { map } from 'rxjs/operators'; +import { Observable, of } from 'rxjs'; +import { map, catchError } from 'rxjs/operators'; import { Store } from '@ngrx/store'; @@ -12,6 +12,9 @@ import { SetLocale } from './i18n/action/message.action'; import { brand } from './app.brand'; import { Brand } from './core/model/brand'; import { UserLoadRequestAction } from './core/action/user.action'; +import { Router } from '@angular/router'; +import { NavigationService } from './core/service/navigation.service'; +import { NavigationAction } from './core/model/action'; @Component({ selector: 'app-root', @@ -26,23 +29,39 @@ export class AppComponent implements OnInit { today = new Date(); year = new Date().getFullYear(); isAdmin$: Observable; - brand: Brand = brand; + nav$: Observable; formatter = v => v && v.build ? `${v.build.version}-${v.git.commit.id}` : ''; constructor( private store: Store, - private i18nService: I18nService + private i18nService: I18nService, + private router: Router, + private navService: NavigationService ) { this.version$ = this.store.select(fromRoot.getVersionInfo); this.formatted$ = this.version$.pipe(map(this.formatter)); this.isAdmin$ = this.store.select(fromRoot.isCurrentUserAdmin); + + this.nav$ = this.navService.emitter; } ngOnInit(): void { this.store.dispatch(new UserLoadRequestAction()); this.store.dispatch(new VersionInfoLoadRequestAction()); this.store.dispatch(new SetLocale(this.i18nService.getCurrentLocale())); + + /* + this.router + .events + .pipe( + catchError(err => { + console.error(err); + return err; + }) + ) + .subscribe((ev) => console.log(ev)); + */ } } diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index 6bd9ae5da..4e9b543c3 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -25,6 +25,7 @@ import { WizardModule } from './wizard/wizard.module'; import { FormModule } from './schema-form/schema-form.module'; import { environment } from '../environments/environment.prod'; import { I18nModule } from './i18n/i18n.module'; +import { NavigationService } from './core/service/navigation.service'; @NgModule({ declarations: [ @@ -58,6 +59,7 @@ import { I18nModule } from './i18n/i18n.module'; ], providers: [ NavigatorService, + NavigationService, { provide: RouterStateSerializer, useClass: CustomRouterStateSerializer }, { provide: HTTP_INTERCEPTORS, diff --git a/ui/src/app/core/model/action.ts b/ui/src/app/core/model/action.ts new file mode 100644 index 000000000..6d796da39 --- /dev/null +++ b/ui/src/app/core/model/action.ts @@ -0,0 +1,7 @@ +export interface NavigationAction { + action: ($event: Event) => void; + category: string; + label: string; + content: string; + icon?: string; +} diff --git a/ui/src/app/core/service/navigation.service.ts b/ui/src/app/core/service/navigation.service.ts new file mode 100644 index 000000000..4d6f3821e --- /dev/null +++ b/ui/src/app/core/service/navigation.service.ts @@ -0,0 +1,31 @@ +import { Injectable } from '@angular/core'; +import { BehaviorSubject, Observable } from 'rxjs'; +import { NavigationAction } from '../model/action'; + +@Injectable() +export class NavigationService { + + private actions: { [name: string]: NavigationAction} = {}; + private subj: BehaviorSubject; + private obs: Observable; + + constructor() { + this.subj = new BehaviorSubject(this.actionList); + this.obs = this.subj.asObservable(); + } + + get actionList(): NavigationAction[] { + return Object.values(this.actions); + } + + get emitter(): Observable { + return this.obs; + } + + addAction(name: string, action: NavigationAction): NavigationAction[] { + console.log(this.actions); + this.actions[name] = action; + this.subj.next(this.actionList); + return this.actionList; + } +} diff --git a/ui/src/app/metadata/configuration/service/configuration.service.spec.ts b/ui/src/app/metadata/configuration/service/configuration.service.spec.ts index 3d44cae6a..49e9014ab 100644 --- a/ui/src/app/metadata/configuration/service/configuration.service.spec.ts +++ b/ui/src/app/metadata/configuration/service/configuration.service.spec.ts @@ -4,9 +4,13 @@ import { HttpTestingController, HttpClientTestingModule } from '@angular/common/ import { MetadataConfigurationService } from './configuration.service'; import { FileBackedHttpMetadataProviderEditor } from '../../provider/model'; import { MetadataSourceEditor } from '../../domain/model/wizards/metadata-source-editor'; -import { PATHS } from '../configuration.values'; +import { ResolverService } from '../../domain/service/resolver.service'; +import { of } from 'rxjs'; + +describe(`Configuration Service`, () => { + + let resolverService: any; -describe(`Attributes Service`, () => { beforeEach(() => { TestBed.configureTestingModule({ imports: [ @@ -14,21 +18,27 @@ describe(`Attributes Service`, () => { HttpClientTestingModule ], providers: [ - MetadataConfigurationService + MetadataConfigurationService, + { + provide: ResolverService, useValue: { + find: () => of([]) + } + } ] }); + + resolverService = TestBed.get(ResolverService); + }); describe('find method', () => { it(`should send an expected GET request`, async(inject([MetadataConfigurationService, HttpTestingController], (service: MetadataConfigurationService, backend: HttpTestingController) => { + spyOn(resolverService, 'find').and.callThrough(); const type = 'resolver'; const id = 'foo'; service.find(id, type).subscribe(); - backend.expectOne((req: HttpRequest) => { - return req.url === `${service.base}/${PATHS[type]}/${id}` - && req.method === 'GET'; - }, `GET metadata by id and type`); + expect(resolverService.find).toHaveBeenCalledWith(id); } ))); }); diff --git a/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.html b/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.html index 7b4273ac1..6023d63a5 100644 --- a/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.html +++ b/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.html @@ -24,16 +24,28 @@ [infiniteScrollThrottle]="50" (scrolled)="onScroll($event)"> - {{ resolver.name }} + + {{ resolver.name }} + + + {{ resolver.name }} + {{ resolver.getDisplayId() }} {{ resolver.createdBy }} {{ resolver.getCreationDate() ? (resolver.getCreationDate() | customDate) : '—' }} - - Incomplete Form + + +   + + Incomplete Form + { }); describe('edit method', () => { - it('should route to the edit page', () => { - spyOn(router, 'navigate'); - instance.edit(resolver); - expect(router.navigate).toHaveBeenCalledWith(['metadata', 'resolver', resolver.id, 'edit']); - }); it('should route to the wizard page', () => { + const evt = new Event('a type'); spyOn(router, 'navigate'); - instance.edit(draft); + spyOn(evt, 'preventDefault'); + instance.edit(evt, draft); expect(router.navigate).toHaveBeenCalledWith(['metadata', 'resolver', 'new', 'blank', 'common'], { queryParams: { id: '1' } }); + expect(evt.preventDefault).toHaveBeenCalled(); }); }); diff --git a/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.ts b/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.ts index 2654b1e01..bde5bc624 100644 --- a/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.ts +++ b/ui/src/app/metadata/manager/container/dashboard-resolvers-list.component.ts @@ -72,16 +72,13 @@ export class DashboardResolversListComponent implements OnInit { this.loadMore(this.page + 1); } - edit(entity: MetadataEntity): void { - if (entity.isDraft()) { - this.router.navigate(['metadata', 'resolver', 'new', 'blank', 'common'], { - queryParams: { - id: entity.getId() - } - }); - } else { - this.router.navigate(['metadata', 'resolver', entity.getId(), 'edit']); - } + edit(evt: Event, entity: MetadataEntity): void { + evt.preventDefault(); + this.router.navigate(['metadata', 'resolver', 'new', 'blank', 'common'], { + queryParams: { + id: entity.getId() + } + }); } toggleEntity(entity: MetadataEntity): void { diff --git a/ui/src/app/metadata/manager/container/manager.component.spec.ts b/ui/src/app/metadata/manager/container/manager.component.spec.ts index a9213a014..d33c28860 100644 --- a/ui/src/app/metadata/manager/container/manager.component.spec.ts +++ b/ui/src/app/metadata/manager/container/manager.component.spec.ts @@ -1,9 +1,12 @@ import { TestBed, ComponentFixture } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { StoreModule, combineReducers } from '@ngrx/store'; + import { ManagerComponent } from './manager.component'; -import { RouterModule, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { RouterStub, RouterLinkStubDirective, RouterOutletStubComponent } from '../../../../testing/router.stub'; import { MockI18nModule } from '../../../../testing/i18n.stub'; +import * as fromDashboard from '../reducer'; describe('Metadata Manager Parent Page', () => { let fixture: ComponentFixture; @@ -16,7 +19,10 @@ describe('Metadata Manager Parent Page', () => { ], imports: [ NoopAnimationsModule, - MockI18nModule + MockI18nModule, + StoreModule.forRoot({ + manager: combineReducers(fromDashboard.reducers), + }) ], declarations: [ ManagerComponent, diff --git a/ui/src/app/metadata/manager/container/manager.component.ts b/ui/src/app/metadata/manager/container/manager.component.ts index 77a9b0cbb..e6932a1bd 100644 --- a/ui/src/app/metadata/manager/container/manager.component.ts +++ b/ui/src/app/metadata/manager/container/manager.component.ts @@ -1,4 +1,9 @@ import { Component } from '@angular/core'; +import { Store } from '@ngrx/store'; +import { LoadResolverRequest } from '../../resolver/action/collection.action'; +import { LoadDraftRequest } from '../../resolver/action/draft.action'; +import * as fromRoot from '../../../app.reducer'; +import { LoadProviderRequest } from '../../provider/action/collection.action'; @Component({ selector: 'manager-page', @@ -6,5 +11,11 @@ import { Component } from '@angular/core'; styleUrls: ['./manager.component.scss'] }) export class ManagerComponent { - constructor() {} + constructor( + private store: Store + ) { + this.store.dispatch(new LoadResolverRequest()); + this.store.dispatch(new LoadDraftRequest()); + this.store.dispatch(new LoadProviderRequest()); + } } diff --git a/ui/src/app/metadata/manager/reducer/index.ts b/ui/src/app/metadata/manager/reducer/index.ts index 2585fb182..584760916 100644 --- a/ui/src/app/metadata/manager/reducer/index.ts +++ b/ui/src/app/metadata/manager/reducer/index.ts @@ -2,8 +2,6 @@ import { createSelector, createFeatureSelector } from '@ngrx/store'; import * as fromRoot from '../../../core/reducer'; import * as fromDashboard from './manager.reducer'; import * as fromSearch from './search.reducer'; -import { MetadataEntity } from '../../domain/model'; -import { Metadata } from '../../domain/domain.type'; export interface DashboardState { manager: fromDashboard.State; diff --git a/ui/src/app/metadata/metadata.component.spec.ts b/ui/src/app/metadata/metadata.component.spec.ts index b8f284611..5ce3c61c7 100644 --- a/ui/src/app/metadata/metadata.component.spec.ts +++ b/ui/src/app/metadata/metadata.component.spec.ts @@ -50,6 +50,5 @@ describe('Metadata Root Component', () => { it('should load metadata objects', async(() => { expect(app).toBeTruthy(); - expect(store.dispatch).toHaveBeenCalledTimes(3); })); }); diff --git a/ui/src/app/metadata/metadata.component.ts b/ui/src/app/metadata/metadata.component.ts index df271e2fd..5ffdd926a 100644 --- a/ui/src/app/metadata/metadata.component.ts +++ b/ui/src/app/metadata/metadata.component.ts @@ -1,10 +1,7 @@ import { Component, ChangeDetectionStrategy } from '@angular/core'; import { Store } from '@ngrx/store'; -import { LoadResolverRequest } from './resolver/action/collection.action'; -import { LoadDraftRequest } from './resolver/action/draft.action'; import * as fromRoot from '../app.reducer'; -import { LoadProviderRequest } from './provider/action/collection.action'; @Component({ selector: 'metadata-page', @@ -13,12 +10,7 @@ import { LoadProviderRequest } from './provider/action/collection.action'; styleUrls: [] }) export class MetadataPageComponent { - constructor( private store: Store - ) { - this.store.dispatch(new LoadResolverRequest()); - this.store.dispatch(new LoadDraftRequest()); - this.store.dispatch(new LoadProviderRequest()); - } + ) {} } diff --git a/ui/src/app/metadata/metadata.module.ts b/ui/src/app/metadata/metadata.module.ts index 3712ba969..6867ed75c 100644 --- a/ui/src/app/metadata/metadata.module.ts +++ b/ui/src/app/metadata/metadata.module.ts @@ -1,4 +1,5 @@ import { NgModule } from '@angular/core'; +import { Store } from '@ngrx/store'; import { ResolverModule } from './resolver/resolver.module'; import { FilterModule } from './filter/filter.module'; @@ -12,6 +13,12 @@ import { CustomWidgetRegistry } from '../schema-form/registry'; import { WidgetRegistry, SchemaValidatorFactory } from 'ngx-schema-form'; import { CustomSchemaValidatorFactory } from '../schema-form/service/schema-validator'; import { MetadataConfigurationModule } from './configuration/configuration.module'; +import { NavigationService } from '../core/service/navigation.service'; +import { MetadataResolver } from './domain/model'; +import { AddDraftRequest } from './resolver/action/draft.action'; +import * as fromResolver from './resolver/reducer'; +import * as fromProvider from './provider/reducer'; +import { Router } from '@angular/router'; @NgModule({ imports: [ @@ -35,4 +42,36 @@ import { MetadataConfigurationModule } from './configuration/configuration.modul MetadataPageComponent ] }) -export class MetadataModule { } +export class MetadataModule { + constructor( + private navService: NavigationService, + private store: Store, + private router: Router + ) { + this.navService.addAction('add-md-source', { + content: 'label.metadata-source', + label: 'action.add-new-source', + action: (event) => { + event.preventDefault(); + const resolver = { + id: `r-${Date.now()}` + }; + this.store.dispatch(new AddDraftRequest(resolver)); + this.router.navigate(['/metadata', 'resolver', 'new'], {queryParams: { id: resolver.id}}); + }, + category: 'metadata', + icon: 'fa-cube' + }); + + this.navService.addAction('add-md-provider', { + content: 'label.metadata-provider', + label: 'action.add-new-provider', + action: (event) => { + event.preventDefault(); + this.router.navigate(['/metadata', 'provider', 'wizard']); + }, + category: 'metadata', + icon: 'fa-cubes' + }); + } +} diff --git a/ui/src/app/metadata/provider/container/provider.component.html b/ui/src/app/metadata/provider/container/provider.component.html deleted file mode 100644 index 8d471248b..000000000 --- a/ui/src/app/metadata/provider/container/provider.component.html +++ /dev/null @@ -1,3 +0,0 @@ -
    - -
    \ No newline at end of file diff --git a/ui/src/app/metadata/provider/container/provider.component.spec.ts b/ui/src/app/metadata/provider/container/provider.component.spec.ts deleted file mode 100644 index c04839b6f..000000000 --- a/ui/src/app/metadata/provider/container/provider.component.spec.ts +++ /dev/null @@ -1,46 +0,0 @@ -import { Component, ViewChild } from '@angular/core'; -import { TestBed, async, ComponentFixture } from '@angular/core/testing'; -import { RouterTestingModule } from '@angular/router/testing'; - -import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; - -import { ProviderComponent } from './provider.component'; - -@Component({ - template: ` - - ` -}) -class TestHostComponent { - @ViewChild(ProviderComponent) - public componentUnderTest: ProviderComponent; -} - -describe('Provider Component', () => { - - let fixture: ComponentFixture; - let instance: TestHostComponent; - let app: ProviderComponent; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - imports: [ - NgbDropdownModule, - RouterTestingModule - ], - declarations: [ - ProviderComponent, - TestHostComponent - ], - }).compileComponents(); - - fixture = TestBed.createComponent(TestHostComponent); - instance = fixture.componentInstance; - app = instance.componentUnderTest; - fixture.detectChanges(); - })); - - it('should instantiate the component', async(() => { - expect(app).toBeTruthy(); - })); -}); diff --git a/ui/src/app/metadata/provider/container/provider.component.ts b/ui/src/app/metadata/provider/container/provider.component.ts deleted file mode 100644 index 54757e53d..000000000 --- a/ui/src/app/metadata/provider/container/provider.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component } from '@angular/core'; -import { Store } from '@ngrx/store'; -import * as fromProvider from '../reducer'; - -@Component({ - selector: 'provider-page', - templateUrl: './provider.component.html', - styleUrls: [] -}) -export class ProviderComponent { - constructor() {} -} diff --git a/ui/src/app/metadata/provider/provider.component.ts b/ui/src/app/metadata/provider/provider.component.ts new file mode 100644 index 000000000..3572b8642 --- /dev/null +++ b/ui/src/app/metadata/provider/provider.component.ts @@ -0,0 +1,20 @@ +import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Store } from '@ngrx/store'; + +import { LoadProviderRequest } from './action/collection.action'; +import * as fromRoot from '../../app.reducer'; + +@Component({ + selector: 'metadata-provider-page', + changeDetection: ChangeDetectionStrategy.OnPush, + template: '
    ', + styleUrls: [] +}) +export class MetadataProviderPageComponent { + + constructor( + private store: Store + ) { + // this.store.dispatch(new LoadProviderRequest()); + } +} diff --git a/ui/src/app/metadata/provider/provider.module.ts b/ui/src/app/metadata/provider/provider.module.ts index b06a9cae0..38bfecdf1 100644 --- a/ui/src/app/metadata/provider/provider.module.ts +++ b/ui/src/app/metadata/provider/provider.module.ts @@ -9,7 +9,6 @@ import { NgbDropdownModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; import { ProviderWizardComponent } from './container/provider-wizard.component'; import { ProviderWizardStepComponent } from './container/provider-wizard-step.component'; -import { ProviderComponent } from './container/provider.component'; import { WizardModule } from '../../wizard/wizard.module'; import * as fromProvider from './reducer'; import { EditorEffects } from './effect/editor.effect'; @@ -26,17 +25,18 @@ import { ContentionModule } from '../../contention/contention.module'; import { DeleteFilterComponent } from './component/delete-filter.component'; import { I18nModule } from '../../i18n/i18n.module'; import { DomainModule } from '../domain/domain.module'; +import { MetadataProviderPageComponent } from './provider.component'; @NgModule({ declarations: [ - ProviderComponent, ProviderWizardComponent, ProviderWizardStepComponent, ProviderEditComponent, ProviderEditStepComponent, ProviderSelectComponent, ProviderFilterListComponent, - DeleteFilterComponent + DeleteFilterComponent, + MetadataProviderPageComponent ], entryComponents: [ DeleteFilterComponent diff --git a/ui/src/app/metadata/provider/provider.routing.ts b/ui/src/app/metadata/provider/provider.routing.ts index 0e8d69549..036750a3e 100644 --- a/ui/src/app/metadata/provider/provider.routing.ts +++ b/ui/src/app/metadata/provider/provider.routing.ts @@ -1,6 +1,5 @@ import { Routes } from '@angular/router'; -import { ProviderComponent } from './container/provider.component'; import { ProviderWizardComponent } from './container/provider-wizard.component'; import { ProviderWizardStepComponent } from './container/provider-wizard-step.component'; import { ProviderEditComponent } from './container/provider-edit.component'; @@ -13,11 +12,12 @@ import { EditFilterComponent } from '../filter/container/edit-filter.component'; import { CanDeactivateGuard } from '../../core/service/can-deactivate.guard'; import { FilterComponent } from '../filter/container/filter.component'; import { AdminGuard } from '../../core/service/admin.guard'; +import { MetadataProviderPageComponent } from './provider.component'; export const ProviderRoutes: Routes = [ { path: 'provider', - component: ProviderComponent, + component: MetadataProviderPageComponent, canActivate: [AdminGuard], children: [ { diff --git a/ui/src/app/metadata/resolver/container/new-resolver.component.ts b/ui/src/app/metadata/resolver/container/new-resolver.component.ts index 9d8f8b40b..09efb0f1f 100644 --- a/ui/src/app/metadata/resolver/container/new-resolver.component.ts +++ b/ui/src/app/metadata/resolver/container/new-resolver.component.ts @@ -33,11 +33,11 @@ export class NewResolverComponent implements OnDestroy { }) ); - this.actionsSubscription = this.route.data.pipe( + this.actionsSubscription = this.route.queryParams.pipe( takeUntil(this.ngUnsubscribe), distinctUntilChanged(), map(data => { - return new SelectDraftRequest(data.draft); + return new SelectDraftRequest(data.id); }) ).subscribe(this.store); } diff --git a/ui/src/app/metadata/resolver/container/resolver-wizard.component.spec.ts b/ui/src/app/metadata/resolver/container/resolver-wizard.component.spec.ts index 984a746a2..1b6c5df32 100644 --- a/ui/src/app/metadata/resolver/container/resolver-wizard.component.spec.ts +++ b/ui/src/app/metadata/resolver/container/resolver-wizard.component.spec.ts @@ -2,7 +2,7 @@ import { Component, ViewChild } from '@angular/core'; import { TestBed, async, ComponentFixture } from '@angular/core/testing'; import { RouterTestingModule } from '@angular/router/testing'; import { StoreModule, Store, combineReducers } from '@ngrx/store'; -import { RouterStateSnapshot } from '@angular/router'; +import { RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'; import { NgbDropdownModule, NgbPopoverModule, NgbModal } from '@ng-bootstrap/ng-bootstrap'; import { of } from 'rxjs'; @@ -116,12 +116,23 @@ describe('Resolver Wizard Component', () => { describe('canDeactivate method', () => { it('should return true if moving to another page', async(() => { - app.canDeactivate(null, null, { - url: 'blank', - root: { - queryParams: { id: 'foo' } - } - } as RouterStateSnapshot).subscribe((can) => { + app.canDeactivate( + null, + { + url: 'foo', + root: { + queryParams: { + id: 'foo' + } + } + } as RouterStateSnapshot, + { + url: 'blank', + root: { + queryParams: { id: 'foo' } + } + } as RouterStateSnapshot + ).subscribe((can) => { expect(can).toBe(true); }); })); @@ -129,9 +140,23 @@ describe('Resolver Wizard Component', () => { it('should open a modal', () => { app.changes = {id: 'bar', serviceProviderName: 'foo', createdBy: 'admin'}; spyOn(modal, 'open').and.callThrough(); - app.canDeactivate(null, null, { - url: 'foo' - } as RouterStateSnapshot); + app.canDeactivate(null, + { + url: 'foo', + root: { + queryParams: { + id: 'foo' + } + } + } as RouterStateSnapshot, + { + url: 'foo', + root: { + queryParams: { + id: 'foo' + } + } + } as RouterStateSnapshot); expect(modal.open).toHaveBeenCalled(); }); @@ -139,8 +164,20 @@ describe('Resolver Wizard Component', () => { app.changes = {} as MetadataResolver; spyOn(store, 'select').and.returnValue(of(true)); spyOn(modal, 'open').and.callThrough(); - app.canDeactivate(null, null, { - url: 'foo' + app.canDeactivate(null, { + url: 'foo', + root: { + queryParams: { + id: 'foo' + } + } + } as RouterStateSnapshot, { + url: 'foo', + root: { + queryParams: { + id: 'foo' + } + } } as RouterStateSnapshot).subscribe((can) => { expect(can).toBe(true); expect(modal.open).not.toHaveBeenCalled(); diff --git a/ui/src/app/metadata/resolver/container/resolver-wizard.component.ts b/ui/src/app/metadata/resolver/container/resolver-wizard.component.ts index c4c4f7192..3ccddc90e 100644 --- a/ui/src/app/metadata/resolver/container/resolver-wizard.component.ts +++ b/ui/src/app/metadata/resolver/container/resolver-wizard.component.ts @@ -186,7 +186,8 @@ export class ResolverWizardComponent implements OnDestroy, CanComponentDeactivat currentState: RouterStateSnapshot, nextState: RouterStateSnapshot ): Observable { - if (nextState.url.match('blank') && !!nextState.root.queryParams.id) { + const changingIds = currentState.root.queryParams.id !== nextState.root.queryParams.id; + if (nextState.url.match('blank') && !!nextState.root.queryParams.id && !changingIds) { return of(true); } if (this.hasChanges(this.changes)) { diff --git a/ui/src/app/metadata/resolver/effect/wizard.effect.ts b/ui/src/app/metadata/resolver/effect/wizard.effect.ts index e64362c32..9f94182f3 100644 --- a/ui/src/app/metadata/resolver/effect/wizard.effect.ts +++ b/ui/src/app/metadata/resolver/effect/wizard.effect.ts @@ -38,19 +38,6 @@ export class WizardEffects { map(provider => new Clear()) ); - @Effect({ dispatch: false }) - updateEntityIdInUrl$ = this.actions$.pipe( - ofType(DraftActionTypes.SELECT_SUCCESS), - map(action => action.payload), - tap((id) => { - this.router.navigate([], { - relativeTo: this.activatedRoute, - queryParams: { id }, - queryParamsHandling: 'merge' - }); - }) - ); - constructor( private store: Store, private actions$: Actions, diff --git a/ui/src/app/metadata/resolver/resolver.component.ts b/ui/src/app/metadata/resolver/resolver.component.ts new file mode 100644 index 000000000..d488a26d8 --- /dev/null +++ b/ui/src/app/metadata/resolver/resolver.component.ts @@ -0,0 +1,22 @@ +import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Store } from '@ngrx/store'; + +import { LoadResolverRequest } from './action/collection.action'; +import { LoadDraftRequest } from './action/draft.action'; +import * as fromRoot from '../../app.reducer'; + +@Component({ + selector: 'metadata-resolver-page', + changeDetection: ChangeDetectionStrategy.OnPush, + template: '', + styleUrls: [] +}) +export class MetadataResolverPageComponent { + + constructor( + private store: Store + ) { + // this.store.dispatch(new LoadResolverRequest()); + // this.store.dispatch(new LoadDraftRequest()); + } +} diff --git a/ui/src/app/metadata/resolver/resolver.module.ts b/ui/src/app/metadata/resolver/resolver.module.ts index c5290431f..e0cb4bb5b 100644 --- a/ui/src/app/metadata/resolver/resolver.module.ts +++ b/ui/src/app/metadata/resolver/resolver.module.ts @@ -35,7 +35,7 @@ import { ResolverSelectComponent } from './container/resolver-select.component'; import { MetadataSourceEditor } from '../domain/model/wizards/metadata-source-editor'; import { FinishFormComponent } from './component/finish-form.component'; import { ProviderFormFragmentComponent } from './component/provider-form-fragment.component'; -import { CreateDraftResolverService } from './service/create-draft.resolver'; +import { MetadataResolverPageComponent } from './resolver.component'; @NgModule({ declarations: [ @@ -50,7 +50,8 @@ import { CreateDraftResolverService } from './service/create-draft.resolver'; ResolverWizardComponent, ResolverWizardStepComponent, FinishFormComponent, - ProviderFormFragmentComponent + ProviderFormFragmentComponent, + MetadataResolverPageComponent ], entryComponents: [], imports: [ @@ -76,8 +77,7 @@ export class ResolverModule { return { ngModule: RootResolverModule, providers: [ - CopyIsSetGuard, - CreateDraftResolverService + CopyIsSetGuard ] }; } diff --git a/ui/src/app/metadata/resolver/resolver.routing.ts b/ui/src/app/metadata/resolver/resolver.routing.ts index 9916e2206..fc92ebd02 100644 --- a/ui/src/app/metadata/resolver/resolver.routing.ts +++ b/ui/src/app/metadata/resolver/resolver.routing.ts @@ -13,18 +13,16 @@ import { ResolverWizardStepComponent } from './container/resolver-wizard-step.co import { ResolverEditComponent } from './container/resolver-edit.component'; import { ResolverEditStepComponent } from './container/resolver-edit-step.component'; import { ResolverSelectComponent } from './container/resolver-select.component'; -import { CreateDraftResolverService } from './service/create-draft.resolver'; +import { MetadataResolverPageComponent } from './resolver.component'; export const ResolverRoutes: Routes = [ { path: 'resolver', + component: MetadataResolverPageComponent, children: [ { path: 'new', component: NewResolverComponent, - resolve: { - draft: CreateDraftResolverService - }, children: [ { path: '', redirectTo: 'blank/common', pathMatch: 'prefix' }, { @@ -60,7 +58,6 @@ export const ResolverRoutes: Routes = [ { path: ':id', component: ResolverSelectComponent, - canActivate: [], children: [ { path: 'edit', diff --git a/ui/src/app/metadata/resolver/service/create-draft.resolver.ts b/ui/src/app/metadata/resolver/service/create-draft.resolver.ts deleted file mode 100644 index 1c6cb84a0..000000000 --- a/ui/src/app/metadata/resolver/service/create-draft.resolver.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; -import { Observable, of } from 'rxjs'; -import { Store } from '@ngrx/store'; -import { MetadataResolver } from '../../domain/model'; -import { AddDraftRequest } from '../action/draft.action'; -import * as fromResolver from '../reducer'; -import { EntityDraftService } from '../../domain/service/draft.service'; - -@Injectable() -export class CreateDraftResolverService { - constructor( - private store: Store, - private draftService: EntityDraftService - ) { } - - resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Observable { - let id = route.queryParamMap.get('id'); - if (id) { - let exists = this.draftService.exists(id); - if (!exists) { - let resolver = {id}; - this.store.dispatch(new AddDraftRequest(resolver)); - } - } - if (!id) { - let resolver = { - id: `r-${Date.now()}` - }; - id = resolver.id; - this.store.dispatch(new AddDraftRequest(resolver)); - } - return of(id); - } -} diff --git a/ui/src/testing/activated-route.stub.ts b/ui/src/testing/activated-route.stub.ts index 062493069..733b6df8e 100644 --- a/ui/src/testing/activated-route.stub.ts +++ b/ui/src/testing/activated-route.stub.ts @@ -28,7 +28,7 @@ export class ActivatedRouteStub { // ActivatedRoute.snapshot.paramMap get snapshot() { return { - paramMap: this.testParamMap + paramMap: this.testParamMap, }; } diff --git a/ui/src/testing/navigation-service.stub.ts b/ui/src/testing/navigation-service.stub.ts new file mode 100644 index 000000000..a0e745068 --- /dev/null +++ b/ui/src/testing/navigation-service.stub.ts @@ -0,0 +1,10 @@ +import { of } from 'rxjs'; +import { NavigationService } from '../app/core/service/navigation.service'; + +export const definition: unknown = { + emitter: of([]), + actionList: [], + addAction: jasmine.createSpy('navService') +}; + +export const NavigationServiceStub = definition as NavigationService; diff --git a/ui/src/testing/provider.stub.ts b/ui/src/testing/provider.stub.ts index 344ba5ef0..59fa89ea6 100644 --- a/ui/src/testing/provider.stub.ts +++ b/ui/src/testing/provider.stub.ts @@ -7,9 +7,11 @@ import { LogoutEndpoint } from '../app/metadata/domain/model'; -export const draft = { +const d: unknown = { serviceProviderName: 'bar' -} as MetadataProvider; +}; + +export const draft = d as MetadataProvider; export const provider = { ...draft,