From 5252431a768b53dc70bb428b02f5ccaf8256113f Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Thu, 1 Aug 2024 14:11:48 +0200 Subject: [PATCH 01/13] create shared data entry module --- frontend/src/app/data-entry/shared/shared.module.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 frontend/src/app/data-entry/shared/shared.module.ts diff --git a/frontend/src/app/data-entry/shared/shared.module.ts b/frontend/src/app/data-entry/shared/shared.module.ts new file mode 100644 index 00000000..203e0364 --- /dev/null +++ b/frontend/src/app/data-entry/shared/shared.module.ts @@ -0,0 +1,12 @@ +import { NgModule } from '@angular/core'; +import { SharedModule } from '@shared/shared.module'; + + + +@NgModule({ + declarations: [], + imports: [ + SharedModule + ] +}) +export class DataEntrySharedModule { } From 2c7dd6278a70ddca2e6dda9eb3e781f8096acc3e Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Thu, 1 Aug 2024 14:15:53 +0200 Subject: [PATCH 02/13] generate designators control component --- .../designators-control.component.html | 1 + .../designators-control.component.scss | 0 .../designators-control.component.spec.ts | 21 +++++++++++++++++++ .../designators-control.component.ts | 9 ++++++++ .../app/data-entry/shared/shared.module.ts | 8 ++++++- 5 files changed, 38 insertions(+), 1 deletion(-) create mode 100644 frontend/src/app/data-entry/shared/designators-control/designators-control.component.html create mode 100644 frontend/src/app/data-entry/shared/designators-control/designators-control.component.scss create mode 100644 frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts create mode 100644 frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html new file mode 100644 index 00000000..e112900a --- /dev/null +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -0,0 +1 @@ +

designators-control works!

diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.scss b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts new file mode 100644 index 00000000..818f4b0b --- /dev/null +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DesignatorsControlComponent } from './designators-control.component'; + +describe('DesignatorsControlComponent', () => { + let component: DesignatorsControlComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [DesignatorsControlComponent] + }); + fixture = TestBed.createComponent(DesignatorsControlComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts new file mode 100644 index 00000000..e5484575 --- /dev/null +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts @@ -0,0 +1,9 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'lc-designators-control', + templateUrl: './designators-control.component.html', + styleUrls: ['./designators-control.component.scss'] +}) +export class DesignatorsControlComponent { +} diff --git a/frontend/src/app/data-entry/shared/shared.module.ts b/frontend/src/app/data-entry/shared/shared.module.ts index 203e0364..a64bc226 100644 --- a/frontend/src/app/data-entry/shared/shared.module.ts +++ b/frontend/src/app/data-entry/shared/shared.module.ts @@ -1,12 +1,18 @@ import { NgModule } from '@angular/core'; import { SharedModule } from '@shared/shared.module'; +import { DesignatorsControlComponent } from './designators-control/designators-control.component'; @NgModule({ - declarations: [], + declarations: [ + DesignatorsControlComponent + ], imports: [ SharedModule + ], + exports: [ + DesignatorsControlComponent, ] }) export class DataEntrySharedModule { } From 85a0b4aa01908b0f5e18fcf0e7eb21d97200d3e8 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Thu, 1 Aug 2024 14:18:59 +0200 Subject: [PATCH 03/13] modules magic --- .../shared/{shared.module.ts => data-entry-shared.module.ts} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename frontend/src/app/data-entry/shared/{shared.module.ts => data-entry-shared.module.ts} (100%) diff --git a/frontend/src/app/data-entry/shared/shared.module.ts b/frontend/src/app/data-entry/shared/data-entry-shared.module.ts similarity index 100% rename from frontend/src/app/data-entry/shared/shared.module.ts rename to frontend/src/app/data-entry/shared/data-entry-shared.module.ts From 40fd9533b924c81b120dff17bc42c4bb3ec38f79 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Thu, 1 Aug 2024 16:17:06 +0200 Subject: [PATCH 04/13] draft designators component --- .../designators-control.component.html | 29 +++++++- .../designators-control.component.ts | 72 ++++++++++++++++++- 2 files changed, 97 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index e112900a..e7ba3bcc 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -1 +1,28 @@ -

designators-control works!

+
+

Designators

+
+ + +
+
+ +
+ +
+ + +
+
diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts index e5484575..ac0dd2a2 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts @@ -1,9 +1,75 @@ -import { Component } from '@angular/core'; +import { Component, forwardRef, Input } from '@angular/core'; +import { ControlValueAccessor, FormControl, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; +import { actionIcons } from '@shared/icons'; +import { BehaviorSubject, Subject } from 'rxjs'; +import _ from 'underscore'; @Component({ selector: 'lc-designators-control', templateUrl: './designators-control.component.html', - styleUrls: ['./designators-control.component.scss'] + styleUrls: ['./designators-control.component.scss'], + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => DesignatorsControlComponent), + multi: true, + } + ], }) -export class DesignatorsControlComponent { +export class DesignatorsControlComponent implements ControlValueAccessor { + @Input({ required: true }) formControl!: FormControl; + + designators$ = new BehaviorSubject([]); + blur$ = new Subject(); + disabled = false; + + addForm = new FormGroup({ + designator: new FormControl('', { + nonNullable: true, + validators: [ + Validators.required, + Validators.minLength(1), + ] + }) + }); + + actionIcons = actionIcons; + + writeValue(obj: string[]): void { + this.designators$.next(obj); + } + + registerOnChange(fn: (_: any) => void): void { + this.designators$.subscribe(fn); + } + + registerOnTouched(fn: (_: any) => void): void { + this.blur$.subscribe(fn); + } + + setDisabledState(isDisabled: boolean): void { + this.disabled = isDisabled; + } + + onAddFormSubmit() { + if (this.addForm.valid) { + const designator = this.addForm.controls.designator.value; + this.designators$.next(this.designators$.value.concat([designator])); + this.addForm.reset({ designator: '' }); + } + } + + removeDesignator(index: number) { + const spliced = _.clone(this.designators$.value) + spliced.splice(index, 1); + this.designators$.next(spliced); + } + + designatorInputLabel(i: number): string { + return `designator ${i}`; + } + + designatorRemoveLabel(i: number): string { + return `remove designator ${i}`; + } } From 9f21859ae72dd82182f78831da66d163d4f17599 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Thu, 1 Aug 2024 16:28:44 +0200 Subject: [PATCH 05/13] handle disabled on designators form --- .../designators-control/designators-control.component.html | 3 +++ .../designators-control/designators-control.component.ts | 5 +++++ 2 files changed, 8 insertions(+) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index e7ba3bcc..1de1910c 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -4,8 +4,10 @@ class="input-group mb-3"> diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts index ac0dd2a2..38455bc2 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts @@ -49,6 +49,11 @@ export class DesignatorsControlComponent implements ControlValueAccessor { setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; + if (isDisabled) { + this.addForm.disable(); + } else { + this.addForm.enable(); + } } onAddFormSubmit() { From 589416c870cabbb4e9e9ea3a411622ad40beb584 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Fri, 2 Aug 2024 11:11:48 +0200 Subject: [PATCH 06/13] show message for empty designator --- .../designators-control.component.html | 33 +++++++++++-------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index 1de1910c..55d3cada 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -1,19 +1,24 @@

Designators

-
- - -
+

+ No designators added. +

+
    +
  • + + +
    • +
From f1dd79ae045c1c83289928ffe01f0a7618cb8b12 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Fri, 2 Aug 2024 11:38:00 +0200 Subject: [PATCH 07/13] no editing existing designators --- .../designators-control.component.html | 7 ++----- .../designators-control/designators-control.component.ts | 8 ++------ 2 files changed, 4 insertions(+), 11 deletions(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index 55d3cada..65785128 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -6,16 +6,13 @@
  • - + {{designator}}
diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts index 38455bc2..f7bf4d4d 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts @@ -70,11 +70,7 @@ export class DesignatorsControlComponent implements ControlValueAccessor { this.designators$.next(spliced); } - designatorInputLabel(i: number): string { - return `designator ${i}`; - } - - designatorRemoveLabel(i: number): string { - return `remove designator ${i}`; + designatorRemoveLabel(designator: string): string { + return `remove designator "${designator}"`; } } From 941b37085a283f41ba4c26743c61a6e6c44b9a97 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Fri, 2 Aug 2024 11:49:05 +0200 Subject: [PATCH 08/13] cleaner styling --- .../designators-control.component.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index 65785128..ca955514 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -3,11 +3,11 @@

No designators added.

-
    +
    • - {{designator}} -
    - +
    Date: Mon, 5 Aug 2024 15:42:57 +0200 Subject: [PATCH 09/13] fix test module import --- .../designators-control/designators-control.component.spec.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts index 818f4b0b..89f9e3a0 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.spec.ts @@ -1,6 +1,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { DesignatorsControlComponent } from './designators-control.component'; +import { SharedTestingModule } from '@shared/shared-testing.module'; describe('DesignatorsControlComponent', () => { let component: DesignatorsControlComponent; @@ -8,7 +9,8 @@ describe('DesignatorsControlComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [DesignatorsControlComponent] + declarations: [DesignatorsControlComponent], + imports: [SharedTestingModule], }); fixture = TestBed.createComponent(DesignatorsControlComponent); component = fixture.componentInstance; From 61274feea2ff3919b63172a6396c0d5911968c39 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Tue, 6 Aug 2024 16:26:06 +0200 Subject: [PATCH 10/13] close subscriptions, complete observables --- .../designators-control.component.ts | 24 +++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts index f7bf4d4d..cd25749f 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.ts @@ -1,7 +1,7 @@ -import { Component, forwardRef, Input } from '@angular/core'; +import { Component, forwardRef, Input, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormControl, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { actionIcons } from '@shared/icons'; -import { BehaviorSubject, Subject } from 'rxjs'; +import { BehaviorSubject, Subject, Subscription } from 'rxjs'; import _ from 'underscore'; @Component({ @@ -16,7 +16,7 @@ import _ from 'underscore'; } ], }) -export class DesignatorsControlComponent implements ControlValueAccessor { +export class DesignatorsControlComponent implements ControlValueAccessor, OnDestroy { @Input({ required: true }) formControl!: FormControl; designators$ = new BehaviorSubject([]); @@ -35,16 +35,26 @@ export class DesignatorsControlComponent implements ControlValueAccessor { actionIcons = actionIcons; + private onChangeSubscription?: Subscription; + private onTouchedSubscription?: Subscription; + writeValue(obj: string[]): void { this.designators$.next(obj); } - registerOnChange(fn: (_: any) => void): void { - this.designators$.subscribe(fn); + registerOnChange(fn: (_: unknown) => void): void { + this.onChangeSubscription?.unsubscribe(); + this.onChangeSubscription = this.designators$.subscribe(fn); + } + + registerOnTouched(fn: (_: unknown) => void): void { + this.onTouchedSubscription?.unsubscribe(); + this.onTouchedSubscription = this.blur$.subscribe(fn); } - registerOnTouched(fn: (_: any) => void): void { - this.blur$.subscribe(fn); + ngOnDestroy(): void { + this.designators$.complete(); + this.blur$.complete(); } setDisabledState(isDisabled: boolean): void { From 017a5d11751ea6a6ce4f187bf89d958407fa0ec4 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Tue, 6 Aug 2024 16:33:04 +0200 Subject: [PATCH 11/13] clarify label Co-Authored-By: Xander Vertegaal <73882506+XanderVertegaal@users.noreply.github.com> --- .../designators-control/designators-control.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html index ca955514..af069c8e 100644 --- a/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html +++ b/frontend/src/app/data-entry/shared/designators-control/designators-control.component.html @@ -27,7 +27,7 @@
    From cfeda0d76734090ec78485f4a01e5d488fc99b18 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Tue, 6 Aug 2024 16:49:34 +0200 Subject: [PATCH 12/13] generate types --- frontend/generated/graphql.ts | 68 +++++++++++++++++++++++++++++++ frontend/generated/schema.graphql | 2 + 2 files changed, 70 insertions(+) diff --git a/frontend/generated/graphql.ts b/frontend/generated/graphql.ts index f4744c83..59841ff6 100644 --- a/frontend/generated/graphql.ts +++ b/frontend/generated/graphql.ts @@ -386,6 +386,7 @@ export type Query = { giftDescriptions: Array; letterDescription?: Maybe; letterDescriptions: Array; + source: SourceType; sources: Array; spaceDescription?: Maybe; spaceDescriptions: Array; @@ -435,6 +436,11 @@ export type QueryLetterDescriptionsArgs = { }; +export type QuerySourceArgs = { + id: Scalars['ID']['input']; +}; + + export type QuerySpaceDescriptionArgs = { id: Scalars['ID']['input']; }; @@ -517,6 +523,7 @@ export type SourceType = { editionAuthor: Scalars['String']['output']; /** The title of the edition used for this source */ editionTitle: Scalars['String']['output']; + episodes: Array; id: Scalars['ID']['output']; /** The name of the original author of the work, if known */ medievalAuthor: Scalars['String']['output']; @@ -697,11 +704,72 @@ export type UpdateOrCreateSourceMutation = { source?: Maybe; }; +export type DataEntrySourceDetailQueryVariables = Exact<{ + id: Scalars['ID']['input']; +}>; + + +export type DataEntrySourceDetailQuery = { __typename?: 'Query', source: { __typename?: 'SourceType', id: string, name: string, editionAuthor: string, editionTitle: string, medievalAuthor: string, medievalTitle: string, numOfEpisodes: number, episodes: Array<{ __typename?: 'EpisodeType', id: string, name: string, description: string, summary: string, book: string, chapter: string, page: string, agents: Array<{ __typename?: 'AgentDescriptionType', id: string, name: string, isGroup: boolean, describes?: Array<{ __typename?: 'HistoricalPersonType', id: string, identifiable: boolean } | null> | null }>, gifts: Array<{ __typename?: 'GiftDescriptionType', id: string, name: string }>, letters: Array<{ __typename?: 'LetterDescriptionType', id: string, name: string }>, spaces: Array<{ __typename?: 'SpaceDescriptionType', id: string, name: string }> }> } }; + export type DataEntrySourceListQueryVariables = Exact<{ [key: string]: never; }>; export type DataEntrySourceListQuery = { __typename?: 'Query', sources: Array<{ __typename?: 'SourceType', id: string, name: string, editionAuthor: string, editionTitle: string, medievalAuthor: string, medievalTitle: string, numOfEpisodes: number }> }; +export const DataEntrySourceDetailDocument = gql` + query DataEntrySourceDetail($id: ID!) { + source(id: $id) { + id + name + editionAuthor + editionTitle + medievalAuthor + medievalTitle + numOfEpisodes + episodes { + id + name + description + summary + book + chapter + page + agents { + id + name + isGroup + describes { + id + identifiable + } + } + gifts { + id + name + } + letters { + id + name + } + spaces { + id + name + } + } + } +} + `; + + @Injectable({ + providedIn: 'root' + }) + export class DataEntrySourceDetailGQL extends Apollo.Query { + override document = DataEntrySourceDetailDocument; + + constructor(apollo: Apollo.Apollo) { + super(apollo); + } + } export const DataEntrySourceListDocument = gql` query DataEntrySourceList { sources { diff --git a/frontend/generated/schema.graphql b/frontend/generated/schema.graphql index ff086701..4aff6493 100644 --- a/frontend/generated/schema.graphql +++ b/frontend/generated/schema.graphql @@ -445,6 +445,7 @@ type Query { giftDescriptions(episodeId: ID, sourceId: ID): [GiftDescriptionType!]! letterDescription(id: ID!): LetterDescriptionType letterDescriptions(episodeId: ID, sourceId: ID): [LetterDescriptionType!]! + source(id: ID!): SourceType! sources: [SourceType!]! spaceDescription(id: ID!): SpaceDescriptionType spaceDescriptions(sourceId: ID): [SpaceDescriptionType!]! @@ -539,6 +540,7 @@ type SourceType { """The title of the edition used for this source""" editionTitle: String! + episodes: [EpisodeType!]! id: ID! """The name of the original author of the work, if known""" From 9e2f3f401c85e772e98c732c8fd24051864fc9e7 Mon Sep 17 00:00:00 2001 From: Luka van der Plas Date: Tue, 6 Aug 2024 16:49:48 +0200 Subject: [PATCH 13/13] fix episode preview component test --- .../episode-preview.component.spec.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/frontend/src/app/data-entry/source/episode-preview/episode-preview.component.spec.ts b/frontend/src/app/data-entry/source/episode-preview/episode-preview.component.spec.ts index fdfcbf14..cddbe7f7 100644 --- a/frontend/src/app/data-entry/source/episode-preview/episode-preview.component.spec.ts +++ b/frontend/src/app/data-entry/source/episode-preview/episode-preview.component.spec.ts @@ -1,6 +1,7 @@ import { ComponentFixture, TestBed } from "@angular/core/testing"; import { EpisodePreviewComponent } from "./episode-preview.component"; +import { SharedTestingModule } from "@shared/shared-testing.module"; describe("EpisodePreviewComponent", () => { let component: EpisodePreviewComponent; @@ -9,9 +10,23 @@ describe("EpisodePreviewComponent", () => { beforeEach(() => { TestBed.configureTestingModule({ declarations: [EpisodePreviewComponent], + imports: [SharedTestingModule], }); fixture = TestBed.createComponent(EpisodePreviewComponent); component = fixture.componentInstance; + component.episode = { + id: '1', + name: 'Test', + description: 'Test episode', + summary: '', + book: '', + chapter: '', + page: '', + agents: [], + gifts: [], + letters: [], + spaces: [], + } fixture.detectChanges(); });