From 1a96fa5042e8646125fd96a4f11f302531a6d04e Mon Sep 17 00:00:00 2001 From: edlu77 Date: Thu, 7 Sep 2023 20:51:58 -0400 Subject: [PATCH 1/6] Working solution --- .../reference-data/reference-data.state.ts | 2 +- .../store/registration/registration.state.ts | 26 ++-- projects/ccf-rui/src/index.html | 126 +++++++++--------- 3 files changed, 78 insertions(+), 76 deletions(-) diff --git a/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts b/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts index 68c1bee44..6d3093f42 100644 --- a/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts +++ b/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts @@ -97,7 +97,7 @@ export class ReferenceDataState extends NgxsImmutableDataRepository { + getSourceDB(): Observable { return this.globalConfig.getOption('baseHref').pipe( map(baseHref => (baseHref ?? '') + 'assets/reference-organ-data.json'), switchMap(url => from(fetch(url)).pipe( diff --git a/projects/ccf-rui/src/app/core/store/registration/registration.state.ts b/projects/ccf-rui/src/app/core/store/registration/registration.state.ts index 474eb6479..2b093d719 100644 --- a/projects/ccf-rui/src/app/core/store/registration/registration.state.ts +++ b/projects/ccf-rui/src/app/core/store/registration/registration.state.ts @@ -141,17 +141,21 @@ export class RegistrationState extends NgxsImmutableDataRepository this.ctx.patchState({ - useRegistrationCallback: !!(!useDownload && register) - })) - ).subscribe(); - - this.globalConfig.getOption('editRegistration').pipe( - filterNulls(), - tap(reg => this.editRegistration(reg as SpatialEntityJsonLd)) - ).subscribe(); + this.refData.getSourceDB().subscribe(db => { + this.refData.setState(db); + + this.globalConfig.config$.pipe( + take(1), + tap(({ useDownload, register }) => this.ctx.patchState({ + useRegistrationCallback: !!(!useDownload && register) + })) + ).subscribe(); + + this.globalConfig.getOption('editRegistration').pipe( + filterNulls(), + tap(reg => this.editRegistration(reg as SpatialEntityJsonLd)) + ).subscribe(); + }); } async editRegistration(reg: SpatialEntityJsonLd): Promise { diff --git a/projects/ccf-rui/src/index.html b/projects/ccf-rui/src/index.html index 056f12a3d..3999faaa0 100644 --- a/projects/ccf-rui/src/index.html +++ b/projects/ccf-rui/src/index.html @@ -1,77 +1,75 @@ + HuBMAP CCF Registration User Interface (CCF-RUI) - + + + + + + - - - - - + + + From 555a27a363570b2faca1505b71467e880b653487 Mon Sep 17 00:00:00 2001 From: edlu77 Date: Fri, 8 Sep 2023 17:39:54 -0400 Subject: [PATCH 2/6] Add async inject example --- .../checkbox/checkbox.component.spec.ts | 3 +- projects/ccf-rui/src/index.html | 118 +++++++++--------- .../webcomponent-async-inject-example.html | 79 ++++++++++++ .../ccf-rui/src/webcomponent-example.html | 3 - 4 files changed, 140 insertions(+), 63 deletions(-) create mode 100644 projects/ccf-rui/src/webcomponent-async-inject-example.html diff --git a/projects/ccf-eui/src/app/shared/components/checkbox/checkbox.component.spec.ts b/projects/ccf-eui/src/app/shared/components/checkbox/checkbox.component.spec.ts index 386d54831..740be50db 100644 --- a/projects/ccf-eui/src/app/shared/components/checkbox/checkbox.component.spec.ts +++ b/projects/ccf-eui/src/app/shared/components/checkbox/checkbox.component.spec.ts @@ -1,9 +1,8 @@ -import { MatCheckbox } from '@angular/material/checkbox'; +import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox'; import { Shallow } from 'shallow-render'; import { CheckboxComponent } from './checkbox.component'; import { CheckboxModule } from './checkbox.module'; -import { MatCheckboxChange } from '@angular/material/checkbox'; describe('FiltersCheckboxComponent', () => { diff --git a/projects/ccf-rui/src/index.html b/projects/ccf-rui/src/index.html index 3999faaa0..86f66f2ef 100644 --- a/projects/ccf-rui/src/index.html +++ b/projects/ccf-rui/src/index.html @@ -1,75 +1,77 @@ - HuBMAP CCF Registration User Interface (CCF-RUI) + - - - - + - diff --git a/projects/ccf-rui/src/webcomponent-async-inject-example.html b/projects/ccf-rui/src/webcomponent-async-inject-example.html new file mode 100644 index 000000000..28d3813eb --- /dev/null +++ b/projects/ccf-rui/src/webcomponent-async-inject-example.html @@ -0,0 +1,79 @@ + + + + + HuBMAP CCF Registration User Interface (CCF-RUI) + + + + + + + + + + + diff --git a/projects/ccf-rui/src/webcomponent-example.html b/projects/ccf-rui/src/webcomponent-example.html index 39a10df13..d59893903 100644 --- a/projects/ccf-rui/src/webcomponent-example.html +++ b/projects/ccf-rui/src/webcomponent-example.html @@ -8,8 +8,6 @@ - - - From 4d03038efee0a10a113c919da6292174dce6a297 Mon Sep 17 00:00:00 2001 From: edlu77 Date: Fri, 8 Sep 2023 18:31:52 -0400 Subject: [PATCH 3/6] Fix tests --- .../core/store/registration/registration.state.spec.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts b/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts index 548fc598f..5330407ee 100644 --- a/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts +++ b/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts @@ -15,6 +15,7 @@ import { PageState, PageStateModel, Person } from '../page/page.state'; import { ReferenceDataState, ReferenceDataStateModel } from '../reference-data/reference-data.state'; import { AnatomicalStructureTagState } from './../anatomical-structure-tags/anatomical-structure-tags.state'; import { RegistrationState } from './registration.state'; +import { subscribe } from 'diagnostics_channel'; const testVisibilityItems: VisibilityItem[] = [{ id: 0, name: 'test', visible: true }]; @@ -133,7 +134,12 @@ describe('RegistrationState', () => { { provide: ReferenceDataState, useValue: { state$: referenceDataStateSubject, - snapshot: initialReferenceDataState + snapshot: initialReferenceDataState, + getSourceDB: () => ( + { + subscribe: () => undefined + } + ) } }, { From 6fc449dfb12c8fbdf670b06dba22cea3d852cf7c Mon Sep 17 00:00:00 2001 From: edlu77 Date: Fri, 8 Sep 2023 18:54:34 -0400 Subject: [PATCH 4/6] Code smell --- .../src/app/core/store/registration/registration.state.spec.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts b/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts index 5330407ee..0a548a363 100644 --- a/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts +++ b/projects/ccf-rui/src/app/core/store/registration/registration.state.spec.ts @@ -15,7 +15,6 @@ import { PageState, PageStateModel, Person } from '../page/page.state'; import { ReferenceDataState, ReferenceDataStateModel } from '../reference-data/reference-data.state'; import { AnatomicalStructureTagState } from './../anatomical-structure-tags/anatomical-structure-tags.state'; import { RegistrationState } from './registration.state'; -import { subscribe } from 'diagnostics_channel'; const testVisibilityItems: VisibilityItem[] = [{ id: 0, name: 'test', visible: true }]; From dcfe8b564fcaa9282dd10ade3d4dda11403be10a Mon Sep 17 00:00:00 2001 From: edlu77 Date: Mon, 11 Sep 2023 15:57:51 -0400 Subject: [PATCH 5/6] Clear up testing errors in RUI --- projects/ccf-rui/src/app/app.component.spec.ts | 3 --- .../core/services/theming/theming.service.spec.ts | 3 --- .../anatomical-structure-tags.state.spec.ts | 15 ++++++++++++--- .../src/app/core/store/model/model.state.spec.ts | 7 ++++--- .../src/app/core/store/page/page.state.spec.ts | 12 +++++++++--- .../app/modules/header/header.component.spec.ts | 3 --- .../right-sidebar/right-sidebar.component.spec.ts | 3 --- .../drawer/container/container.component.spec.ts | 3 --- .../drawer/content/content.component.spec.ts | 3 --- .../drawer/drawer/drawer.component.spec.ts | 3 --- .../toggle-button/toggle-button.component.spec.ts | 3 --- 11 files changed, 25 insertions(+), 33 deletions(-) delete mode 100644 projects/ccf-rui/src/app/app.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/core/services/theming/theming.service.spec.ts delete mode 100644 projects/ccf-rui/src/app/modules/header/header.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/modules/right-sidebar/right-sidebar.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/shared/components/drawer/container/container.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/shared/components/drawer/content/content.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/shared/components/drawer/drawer/drawer.component.spec.ts delete mode 100644 projects/ccf-rui/src/app/shared/components/drawer/toggle-button/toggle-button.component.spec.ts diff --git a/projects/ccf-rui/src/app/app.component.spec.ts b/projects/ccf-rui/src/app/app.component.spec.ts deleted file mode 100644 index 3da0d828b..000000000 --- a/projects/ccf-rui/src/app/app.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('AppComponent', () => { - // TODO -}); diff --git a/projects/ccf-rui/src/app/core/services/theming/theming.service.spec.ts b/projects/ccf-rui/src/app/core/services/theming/theming.service.spec.ts deleted file mode 100644 index 1eb13da7a..000000000 --- a/projects/ccf-rui/src/app/core/services/theming/theming.service.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('ThemingService', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/core/store/anatomical-structure-tags/anatomical-structure-tags.state.spec.ts b/projects/ccf-rui/src/app/core/store/anatomical-structure-tags/anatomical-structure-tags.state.spec.ts index ebe363fe8..37af65e57 100644 --- a/projects/ccf-rui/src/app/core/store/anatomical-structure-tags/anatomical-structure-tags.state.spec.ts +++ b/projects/ccf-rui/src/app/core/store/anatomical-structure-tags/anatomical-structure-tags.state.spec.ts @@ -1,11 +1,13 @@ -import { TestBed } from '@angular/core/testing'; import { NgxsDataPluginModule } from '@angular-ru/ngxs'; +import { TestBed } from '@angular/core/testing'; import { NgxsModule, Store } from '@ngxs/store'; import { GlobalConfigState } from 'ccf-shared'; -import { Observable, lastValueFrom } from 'rxjs'; +import { lastValueFrom, Observable, of } from 'rxjs'; import { take } from 'rxjs/operators'; import { PageState } from '../page/page.state'; +import { ReferenceDataState } from '../reference-data/reference-data.state'; +import { RegistrationState } from '../registration/registration.state'; import { GLOBAL_CONFIG } from './../../services/config/config'; import { ModelState } from './../model/model.state'; import { SceneState } from './../scene/scene.state'; @@ -27,8 +29,15 @@ describe('AnatomicalStructureTagsState', () => { ], providers: [ AnatomicalStructureTagState, + RegistrationState, SceneState, - ModelState, + { + provide: ModelState, + useValue: { + modelChanged$: of([]) + } + }, + ReferenceDataState, GlobalConfigState, { provide: GLOBAL_CONFIG, diff --git a/projects/ccf-rui/src/app/core/store/model/model.state.spec.ts b/projects/ccf-rui/src/app/core/store/model/model.state.spec.ts index aa966ed40..72973fdc1 100644 --- a/projects/ccf-rui/src/app/core/store/model/model.state.spec.ts +++ b/projects/ccf-rui/src/app/core/store/model/model.state.spec.ts @@ -1,8 +1,8 @@ -import { TestBed } from '@angular/core/testing'; import { NgxsDataPluginModule } from '@angular-ru/ngxs'; +import { TestBed } from '@angular/core/testing'; import { NgxsModule, Store } from '@ngxs/store'; import { GlobalConfigState, OrganInfo } from 'ccf-shared'; -import { Observable, lastValueFrom } from 'rxjs'; +import { lastValueFrom, Observable, of } from 'rxjs'; import { take } from 'rxjs/operators'; import { ExtractionSet } from '../../models/extraction-set'; @@ -54,7 +54,8 @@ describe('ModelState', () => { { provide: PageState, useValue: { - setHasChanges: () => undefined + setHasChanges: () => undefined, + registrationStarted$: of([]) } } ] diff --git a/projects/ccf-rui/src/app/core/store/page/page.state.spec.ts b/projects/ccf-rui/src/app/core/store/page/page.state.spec.ts index 5a3d7f767..b5005c290 100644 --- a/projects/ccf-rui/src/app/core/store/page/page.state.spec.ts +++ b/projects/ccf-rui/src/app/core/store/page/page.state.spec.ts @@ -1,12 +1,13 @@ -import { TestBed } from '@angular/core/testing'; import { NgxsDataPluginModule } from '@angular-ru/ngxs'; +import { TestBed } from '@angular/core/testing'; import { NgxsModule, Store } from '@ngxs/store'; import { GlobalConfigState } from 'ccf-shared'; -import { Observable, lastValueFrom } from 'rxjs'; +import { lastValueFrom, Observable, of } from 'rxjs'; import { take } from 'rxjs/operators'; import { GLOBAL_CONFIG } from '../../services/config/config'; import { AnatomicalStructureTagState } from '../anatomical-structure-tags/anatomical-structure-tags.state'; +import { ReferenceDataState } from '../reference-data/reference-data.state'; import { ModelState } from './../model/model.state'; import { PageState } from './page.state'; @@ -27,7 +28,12 @@ describe('PageState', () => { ], providers: [ ModelState, - AnatomicalStructureTagState, + ReferenceDataState, + { + provide: AnatomicalStructureTagState, useValue: { + tags$: of([]) + } + }, GlobalConfigState, { provide: GLOBAL_CONFIG, useValue: {} } ] diff --git a/projects/ccf-rui/src/app/modules/header/header.component.spec.ts b/projects/ccf-rui/src/app/modules/header/header.component.spec.ts deleted file mode 100644 index 9f099223d..000000000 --- a/projects/ccf-rui/src/app/modules/header/header.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('HeaderComponent', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/modules/right-sidebar/right-sidebar.component.spec.ts b/projects/ccf-rui/src/app/modules/right-sidebar/right-sidebar.component.spec.ts deleted file mode 100644 index 7fc59fc8b..000000000 --- a/projects/ccf-rui/src/app/modules/right-sidebar/right-sidebar.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('RightSidebarComponent', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/shared/components/drawer/container/container.component.spec.ts b/projects/ccf-rui/src/app/shared/components/drawer/container/container.component.spec.ts deleted file mode 100644 index 59dcc4371..000000000 --- a/projects/ccf-rui/src/app/shared/components/drawer/container/container.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('ContainerComponent', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/shared/components/drawer/content/content.component.spec.ts b/projects/ccf-rui/src/app/shared/components/drawer/content/content.component.spec.ts deleted file mode 100644 index 57f4eee0e..000000000 --- a/projects/ccf-rui/src/app/shared/components/drawer/content/content.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('ContentComponent', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/shared/components/drawer/drawer/drawer.component.spec.ts b/projects/ccf-rui/src/app/shared/components/drawer/drawer/drawer.component.spec.ts deleted file mode 100644 index 62a823fbb..000000000 --- a/projects/ccf-rui/src/app/shared/components/drawer/drawer/drawer.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('DrawerComponent', () => { - // Add tests -}); diff --git a/projects/ccf-rui/src/app/shared/components/drawer/toggle-button/toggle-button.component.spec.ts b/projects/ccf-rui/src/app/shared/components/drawer/toggle-button/toggle-button.component.spec.ts deleted file mode 100644 index 0cb3476ba..000000000 --- a/projects/ccf-rui/src/app/shared/components/drawer/toggle-button/toggle-button.component.spec.ts +++ /dev/null @@ -1,3 +0,0 @@ -describe('ToggleButtonComponent', () => { - // Add tests -}); From c657c000a057e01eb1e94dca596a7d165def9069 Mon Sep 17 00:00:00 2001 From: edlu77 Date: Mon, 11 Sep 2023 16:59:58 -0400 Subject: [PATCH 6/6] Listen to reference data state instead --- .../src/app/core/store/reference-data/reference-data.state.ts | 2 +- .../src/app/core/store/registration/registration.state.ts | 4 +--- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts b/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts index 6d3093f42..68c1bee44 100644 --- a/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts +++ b/projects/ccf-rui/src/app/core/store/reference-data/reference-data.state.ts @@ -97,7 +97,7 @@ export class ReferenceDataState extends NgxsImmutableDataRepository { + private getSourceDB(): Observable { return this.globalConfig.getOption('baseHref').pipe( map(baseHref => (baseHref ?? '') + 'assets/reference-organ-data.json'), switchMap(url => from(fetch(url)).pipe( diff --git a/projects/ccf-rui/src/app/core/store/registration/registration.state.ts b/projects/ccf-rui/src/app/core/store/registration/registration.state.ts index 2b093d719..a090710ea 100644 --- a/projects/ccf-rui/src/app/core/store/registration/registration.state.ts +++ b/projects/ccf-rui/src/app/core/store/registration/registration.state.ts @@ -141,9 +141,7 @@ export class RegistrationState extends NgxsImmutableDataRepository { - this.refData.setState(db); - + this.refData.state$.subscribe(() => { this.globalConfig.config$.pipe( take(1), tap(({ useDownload, register }) => this.ctx.patchState({