()
+
+ isOpen$ = this.toggle$.pipe(
+ scan((state, _) => !state, false),
+ startWith(false)
+ )
+}
\ No newline at end of file
diff --git a/client/src/app/components/activities/collapsible-card/collapsible-card.module.ts b/client/src/app/components/activities/collapsible-card/collapsible-card.module.ts
new file mode 100644
index 000000000..8014871c6
--- /dev/null
+++ b/client/src/app/components/activities/collapsible-card/collapsible-card.module.ts
@@ -0,0 +1,21 @@
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { LetModule, PushModule } from "@ngrx/component";
+import { NzCardModule } from "ng-zorro-antd/card";
+import { CvcCollapsibleCardComponent } from "./collapsible-card.component";
+import { NzButtonModule } from "ng-zorro-antd/button";
+import { NzIconModule } from "ng-zorro-antd/icon";
+
+@NgModule({
+ declarations: [CvcCollapsibleCardComponent],
+ imports: [
+ CommonModule,
+ PushModule,
+ LetModule,
+ NzCardModule,
+ NzButtonModule,
+ NzIconModule
+ ],
+ exports: [CvcCollapsibleCardComponent],
+})
+export class CvcCollapsibleCardModule {}
\ No newline at end of file
diff --git a/client/src/app/components/comments/comment-body/comment-body.component.html b/client/src/app/components/comments/comment-body/comment-body.component.html
index 78b13446d..6585baab5 100644
--- a/client/src/app/components/comments/comment-body/comment-body.component.html
+++ b/client/src/app/components/comments/comment-body/comment-body.component.html
@@ -8,13 +8,21 @@
-
+
+
+
+
+
+
+
+
+
+ {{ c.displayName }}
+
+}
+
+export interface CommentInterface {
+ createdAt: string | number,
+ parsedComment: CommentBodySegment[],
+ commenter: CommenterInterface
+}
@Component({
selector: 'cvc-comment-display',
templateUrl: './comment-display.component.html',
})
export class CvcCommentDisplayComponent implements OnInit {
- @Input() comment!: Comment
+ @Input() comment!: CommentInterface
ngOnInit() {
if (this.comment === undefined) {
diff --git a/client/src/app/components/comments/comment-list/comment-list.component.html b/client/src/app/components/comments/comment-list/comment-list.component.html
index 46834a991..d8e3d2ebb 100644
--- a/client/src/app/components/comments/comment-list/comment-list.component.html
+++ b/client/src/app/components/comments/comment-list/comment-list.component.html
@@ -1,3 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
@@ -45,70 +60,72 @@
-
-
-
-
-
+
+
+
+ [nzSrc]="user.profileImagePath">
+
+
+
+
+ {{ user.displayName }}
- {{ user.displayName }}
-
-
-
-
-
-
-
+
+
+
+ [nzSrc]="user.profileImagePath">
+
+
+
+
+ {{ user.displayName }}
+
+
+
+
+
+ {{ role.tag.displayName }}s
- {{ user.displayName }}
-
-
-
-
-
- {{ role.tag.displayName }}s
-
-
-
-
-
- {{ entity.tag.displayName }}
-
-
+
+
+
+
+ {{ entity.tag.displayName }}
+
+
+
diff --git a/client/src/app/components/comments/comment-list/comment-list.component.ts b/client/src/app/components/comments/comment-list/comment-list.component.ts
index a32c455a7..aa7890fcc 100644
--- a/client/src/app/components/comments/comment-list/comment-list.component.ts
+++ b/client/src/app/components/comments/comment-list/comment-list.component.ts
@@ -6,12 +6,10 @@ import {
CommentListQuery,
CommentListQueryVariables,
CommentTagSegment,
- DateSort,
DateSortColumns,
Maybe,
PageInfo,
SortDirection,
- TaggableEntity,
UserRole,
} from '@app/generated/civic.apollo'
@@ -21,6 +19,7 @@ import { Observable } from 'rxjs'
import { map } from 'rxjs/operators'
import { pluck } from 'rxjs-etc/operators'
import { TagLinkableUser } from '@app/components/users/user-tag/user-tag.component'
+import { CommentInterface } from '../comment-display/comment-display.component'
interface CommentTagSegmentWithId {
id: string
@@ -34,6 +33,7 @@ interface CommentTagSegmentWithId {
})
export class CvcCommentListComponent implements OnInit {
@Input() commentable!: CommentableInput
+ @Input() creationComment?: CommentInterface
loading$?: Observable
pageInfo$?: Observable
diff --git a/client/src/app/components/comments/comment-list/comment-list.query.gql b/client/src/app/components/comments/comment-list/comment-list.query.gql
index 04a2bb725..b923eeb4b 100644
--- a/client/src/app/components/comments/comment-list/comment-list.query.gql
+++ b/client/src/app/components/comments/comment-list/comment-list.query.gql
@@ -82,6 +82,11 @@ fragment commentListNode on Comment {
}
}
parsedComment {
+ ...parsedCommentFragment
+ }
+}
+
+fragment parsedCommentFragment on CommentBodySegment{
__typename
... on CommentTagSegment {
entityId
@@ -101,5 +106,4 @@ fragment commentListNode on Comment {
displayName
role
}
- }
}
diff --git a/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.component.html b/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.component.html
index bc39905de..60c5c6baa 100644
--- a/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.component.html
+++ b/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.component.html
@@ -27,57 +27,59 @@
-
-
- {{ state.displayName }}
-
-
-
-
-
-
-
+
+
+
+ {{ state.displayName }}
+
+
+
+
+ [nzSrc]="user.profileImagePath">
+
+
+
+
+ {{ user.username }}
- {{ user.username }}
-
-
-
-
-
-
-
+
+
+
+ [nzSrc]="user.profileImagePath">
+
+
+
+
+ {{ user.username }}
- {{ user.username }}
-
-
+
+
diff --git a/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.gql b/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.gql
index 584ab8d71..c8184c980 100644
--- a/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.gql
+++ b/client/src/app/components/flags/flag-list-and-filter/flag-list-and-filter.gql
@@ -53,65 +53,35 @@ fragment flagList on FlagConnection {
fragment flag on Flag {
id
state
- createdAt
- resolvedAt
flaggable {
id
name
link
}
- flaggingUser {
+ openActivity {
id
- displayName
- role
- profileImagePath(size: 32)
+ createdAt
+ parsedNote {
+ ...parsedCommentFragment
+ }
+ user {
+ id
+ displayName
+ role
+ profileImagePath(size: 32)
+ }
}
- resolvingUser {
+ resolutionActivity {
id
- displayName
- role
- profileImagePath(size: 32)
- }
- openComment {
- __typename
- parsedComment {
- __typename
- ... on CommentTagSegment {
- entityId
- displayName
- tagType
- link
- __typename
- }
- ... on CommentTextSegment {
- text
- }
- ... on User {
- id
- displayName
- role
- }
+ createdAt
+ parsedNote {
+ ...parsedCommentFragment
}
- }
- resolutionComment {
- __typename
- parsedComment {
- __typename
- ... on CommentTagSegment {
- entityId
- displayName
- tagType
- link
- __typename
- }
- ... on CommentTextSegment {
- text
- }
- ... on User {
- id
- displayName
- role
- }
+ user {
+ id
+ displayName
+ role
+ profileImagePath(size: 32)
}
}
}
diff --git a/client/src/app/components/flags/flag-list/flag-list.component.html b/client/src/app/components/flags/flag-list/flag-list.component.html
index 500fe0c61..e6f6f8b0d 100644
--- a/client/src/app/components/flags/flag-list/flag-list.component.html
+++ b/client/src/app/components/flags/flag-list/flag-list.component.html
@@ -24,9 +24,9 @@
nzType="inner"
*nzSpaceItem>
@@ -39,10 +39,10 @@
-
+
@@ -53,9 +53,9 @@
style="text-align: right">
Resolved By
- {{ flag.resolvedAt | timeAgo }}
+ *ngIf="flag.resolutionActivity !== undefined"
+ [user]="flag.resolutionActivity.user">
+ {{ flag.resolutionActivity?.createdAt | timeAgo }}
@@ -79,11 +79,11 @@
nzType="secondary"
>Flagged By
-
+
{{ flag.createdAt | timeAgo }}{{ flag.openActivity.createdAt | timeAgo }}
- {{ f.openComment.comment }}
+
diff --git a/client/src/app/components/flags/flag-popover/flag-popover.module.ts b/client/src/app/components/flags/flag-popover/flag-popover.module.ts
index 0cab17c06..c0804b59f 100644
--- a/client/src/app/components/flags/flag-popover/flag-popover.module.ts
+++ b/client/src/app/components/flags/flag-popover/flag-popover.module.ts
@@ -15,6 +15,7 @@ import { NzSpaceModule } from 'ng-zorro-antd/space'
import { NzDescriptionsModule } from 'ng-zorro-antd/descriptions'
import { CvcFlagPopoverComponent } from './flag-popover.component'
import { CvcPipesModule } from '@app/core/pipes/pipes.module'
+import { CvcCommentBodyModule } from '@app/components/comments/comment-body/comment-body.module'
@NgModule({
declarations: [CvcFlagPopoverComponent],
@@ -35,6 +36,7 @@ import { CvcPipesModule } from '@app/core/pipes/pipes.module'
CvcVariantTagModule,
CvcVariantGroupTagModule,
CvcStatusTagModule,
+ CvcCommentBodyModule
],
exports: [CvcFlagPopoverComponent],
})
diff --git a/client/src/app/components/flags/flag-popover/flag-popover.query.gql b/client/src/app/components/flags/flag-popover/flag-popover.query.gql
index a06018888..ddfccfdf9 100644
--- a/client/src/app/components/flags/flag-popover/flag-popover.query.gql
+++ b/client/src/app/components/flags/flag-popover/flag-popover.query.gql
@@ -19,7 +19,9 @@ fragment flagPopover on Flag {
name
}
createdAt
- openComment {
- comment
+ openActivity {
+ parsedNote {
+ ...parsedCommentFragment
+ }
}
}
diff --git a/client/src/app/components/layout/viewer-button/viewer-button.component.ts b/client/src/app/components/layout/viewer-button/viewer-button.component.ts
index f136fc059..af20480c4 100644
--- a/client/src/app/components/layout/viewer-button/viewer-button.component.ts
+++ b/client/src/app/components/layout/viewer-button/viewer-button.component.ts
@@ -51,9 +51,6 @@ export class CvcViewerButtonComponent implements OnInit {
)
}
this.addVariantModalVisible$ = new BehaviorSubject(false)
- this.addVariantModalVisible$
- .pipe(tag('addVariantModalVisible$'))
- .subscribe()
}
ngOnInit(): void {
diff --git a/client/src/app/components/molecular-profiles/molecular-profile-table/molecular-profile-table.component.html b/client/src/app/components/molecular-profiles/molecular-profile-table/molecular-profile-table.component.html
index 424a6ded3..755fbe52b 100644
--- a/client/src/app/components/molecular-profiles/molecular-profile-table/molecular-profile-table.component.html
+++ b/client/src/app/components/molecular-profiles/molecular-profile-table/molecular-profile-table.component.html
@@ -227,7 +227,7 @@
{{ mp.molecularProfileScore | number }}
|
diff --git a/client/src/app/components/revisions/revision-list/revision-list.component.html b/client/src/app/components/revisions/revision-list/revision-list.component.html
index 56ac1bdfb..1c5370bdb 100644
--- a/client/src/app/components/revisions/revision-list/revision-list.component.html
+++ b/client/src/app/components/revisions/revision-list/revision-list.component.html
@@ -317,11 +317,9 @@
-
+
+ [commentBodySegments]="revision.resolutionActivity!.parsedNote">
{{ revision.status | enumToTitle }} By
- {{ revision.resolvedAt | timeAgo }}
+ *ngIf="revision.resolutionActivity?.user !== undefined"
+ [user]="revision.resolutionActivity!.user">
+ {{ revision.resolutionActivity?.createdAt | timeAgo }}
@@ -350,7 +348,7 @@
RID{{ revision.id }}
{{ revision.linkoutData.name }} Updated
-
+
@@ -375,13 +373,13 @@
nzSize="small"
(click)="$event.stopPropagation()">
-
+
Submitted By
-
+
@@ -211,6 +212,7 @@
+
{{ suggestion.status | lowercase }}
@@ -218,15 +220,26 @@
-
+
{{ suggestion.status | lowercase }}
+
+ 0"
+ nz-icon
+ nz-popover
+ [nzPopoverContent]="!isScrolling ? statusNoteContentTemplate : ''"
+ [nzPopoverOverlayStyle]="{'width': '300px'}"
+ nzType="civic-comment">
+
+
+
+
+
@@ -236,14 +249,21 @@
|
+ nz-popover
+ [nzPopoverContent]="!isScrolling ? creationCommentTemplate : ''"
+ [nzPopoverOverlayStyle]="{'width': '300px'}">
+
+
+
+
|
([
['Event', '#1db8a9'],
['EvidenceItem', '#2a63b6'],
['Gene', '#07aff0'],
- ['Therapy', '#ac3996'],
['MolecularProfile', '#33b358'],
+ ['NccnGuideline', '#49566D'],
['Phenotype', '#1db8a9'],
['Source', '#f9ba45'],
+ ['Therapy', '#ac3996'],
['Variant', '#74d34c'],
['VariantGroup', '#74d34c'],
['VariantType', '#74d34c'],
diff --git a/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.html b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.html
new file mode 100644
index 000000000..8adeba1a4
--- /dev/null
+++ b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.html
@@ -0,0 +1,94 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 0"
+ nzType="error"
+ nzShowIcon
+ [nzDescription]="errorContents"
+ nzMessage="Error Deprecating Molecular Profile">
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.ts b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.ts
new file mode 100644
index 000000000..e36297028
--- /dev/null
+++ b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.form.ts
@@ -0,0 +1,141 @@
+import {
+ ChangeDetectionStrategy,
+ Component,
+ Input,
+ OnDestroy,
+ OnInit,
+} from '@angular/core'
+import {
+ DeprecateComplexMolecularProfileGQL,
+ DeprecateComplexMolecularProfileMutation,
+ DeprecateComplexMolecularProfileMutationVariables,
+ MolecularProfileDeprecationReasonMutationInput,
+ Maybe,
+ MolecularProfileDetailGQL,
+ EvidenceCountsForMolecularProfileGQL,
+ Organization,
+} from '@app/generated/civic.apollo'
+import { BehaviorSubject, Observable, Subject } from 'rxjs'
+import { NetworkErrorsService } from '@app/core/services/network-errors.service'
+import { MutatorWithState } from '@app/core/utilities/mutation-state-wrapper'
+import { ActivatedRoute } from '@angular/router'
+import { map, takeUntil} from 'rxjs/operators'
+import { Viewer, ViewerService } from '@app/core/services/viewer/viewer.service'
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'
+
+@UntilDestroy()
+@Component({
+ selector: 'cvc-complex-molecular-profile-deprecate-form',
+ templateUrl: './complex-molecular-profile-deprecate.form.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ComplexMolecularProfileDeprecateForm implements OnDestroy, OnInit {
+ @Input() molecularProfileId!: number
+
+ private destroy$ = new Subject()
+
+ deprecateComplexMolecularProfileMutator: MutatorWithState<
+ DeprecateComplexMolecularProfileGQL,
+ DeprecateComplexMolecularProfileMutation,
+ DeprecateComplexMolecularProfileMutationVariables
+ >
+
+ success: boolean = false
+ errorMessages: string[] = []
+ mutationLoading$ = new BehaviorSubject(false)
+
+ viewer$: Observable
+
+ comment: string = ''
+ reason: Maybe
+ selectedOrg: Maybe
+
+ hasEvidence$?: Observable
+ isLoading$?: Observable
+
+ constructor(
+ private deprecateComplexMolecularProfileGQL: DeprecateComplexMolecularProfileGQL,
+ private molecularProfileDetailGQL: MolecularProfileDetailGQL,
+ private evidenceCountsForMolecularProfileGQL: EvidenceCountsForMolecularProfileGQL,
+ private networkErrorService: NetworkErrorsService,
+ private route: ActivatedRoute,
+ private viewerService: ViewerService
+ ) {
+ this.deprecateComplexMolecularProfileMutator = new MutatorWithState(networkErrorService)
+ this.viewer$ = this.viewerService.viewer$
+ }
+
+ ngOnInit() {
+ this.viewerService.viewer$
+ .pipe(untilDestroyed(this))
+ .subscribe((v: Viewer) => {
+ this.selectedOrg = v.mostRecentOrg
+ })
+
+ if (this.molecularProfileId === undefined) {
+ throw new Error('Must pass a molecular profile id into deprecate complex molecular profile component')
+ }
+
+ let queryRef = this.evidenceCountsForMolecularProfileGQL.fetch({ molecularProfileId: this.molecularProfileId })
+
+ this.hasEvidence$ = queryRef.pipe(
+ map(({ data }) =>
+ data.molecularProfile!.evidenceCountsByStatus.submittedCount + data.molecularProfile!.evidenceCountsByStatus.acceptedCount > 0
+ ),
+ )
+
+ this.isLoading$ = queryRef.pipe(map(({ loading }) => loading))
+ }
+
+ deprecateMolecularProfile(): void {
+ this.errorMessages = []
+
+ if (this.reason && this.comment && this.molecularProfileId) {
+ let input = {
+ deprecationReason: this.reason,
+ comment: this.comment,
+ molecularProfileId: this.molecularProfileId,
+ organizationId: this.selectedOrg?.id,
+ }
+
+ this.mutationLoading$.next(true)
+
+ let state = this.deprecateComplexMolecularProfileMutator.mutate(
+ this.deprecateComplexMolecularProfileGQL,
+ input,
+ {
+ refetchQueries: [
+ {
+ query: this.molecularProfileDetailGQL.document,
+ variables: { molecularProfileId: this.molecularProfileId },
+ },
+ ],
+ }
+ )
+
+ state.submitSuccess$.pipe(takeUntil(this.destroy$)).subscribe((res) => {
+ if (res) {
+ this.success = true
+ this.comment = ''
+ this.mutationLoading$.next(false)
+ }
+ })
+
+ state.submitError$.pipe(takeUntil(this.destroy$)).subscribe((res) => {
+ if (res.length > 0) {
+ this.errorMessages = res
+ this.mutationLoading$.next(false)
+ }
+ })
+ }
+ }
+
+ onSuccessBannerClose() {
+ this.success = false
+ }
+
+ ngOnDestroy(): void {
+ this.destroy$.next()
+ this.destroy$.complete()
+ }
+}
diff --git a/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.module.ts b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.module.ts
new file mode 100644
index 000000000..cfc4882dd
--- /dev/null
+++ b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.module.ts
@@ -0,0 +1,52 @@
+import { CommonModule } from '@angular/common'
+import { NgModule } from '@angular/core'
+import { FormsModule, ReactiveFormsModule } from '@angular/forms'
+import { RouterModule } from '@angular/router'
+import { CvcMolecularProfileTagModule } from '@app/components/molecular-profiles/molecular-profile-tag/molecular-profile-tag.module'
+import { CvcCommentInputFormModule } from '@app/forms/components/comment-input/comment-input.module'
+import { CvcFormButtonsModule } from '@app/forms/components/form-buttons/form-buttons.module'
+import { CvcFormErrorsAlertModule } from '@app/forms/components/form-errors-alert/form-errors-alert.module'
+import { CvcSubmitButtonTypeModule } from '@app/forms/types/submit-button/submit-button.module'
+import { LetDirective, PushPipe } from '@ngrx/component'
+import { NzAlertModule } from 'ng-zorro-antd/alert'
+import { NzButtonModule } from 'ng-zorro-antd/button'
+import { NzCardModule } from 'ng-zorro-antd/card'
+import { NzFormModule } from 'ng-zorro-antd/form'
+import { NzGridModule } from 'ng-zorro-antd/grid'
+import { NzSelectModule } from 'ng-zorro-antd/select'
+import { NzSpaceModule } from 'ng-zorro-antd/space'
+import { NzSpinModule } from 'ng-zorro-antd/spin'
+import { NzToolTipModule } from 'ng-zorro-antd/tooltip'
+import { NzTypographyModule } from 'ng-zorro-antd/typography'
+import { ComplexMolecularProfileDeprecateForm } from './complex-molecular-profile-deprecate.form'
+
+@NgModule({
+ declarations: [ComplexMolecularProfileDeprecateForm],
+ imports: [
+ CommonModule,
+ RouterModule,
+ FormsModule,
+ ReactiveFormsModule,
+ LetDirective,
+ PushPipe,
+
+ NzFormModule,
+ NzAlertModule,
+ NzGridModule,
+ NzButtonModule,
+ NzSpinModule,
+ NzCardModule,
+ NzSpaceModule,
+ NzTypographyModule,
+ NzToolTipModule,
+ NzSelectModule,
+
+ CvcFormErrorsAlertModule,
+ CvcFormButtonsModule,
+ CvcSubmitButtonTypeModule,
+ CvcCommentInputFormModule,
+ CvcMolecularProfileTagModule,
+ ],
+ exports: [ComplexMolecularProfileDeprecateForm],
+})
+export class ComplexMolecularProfileDeprecateFormModule {}
diff --git a/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.query.gql b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.query.gql
new file mode 100644
index 000000000..9e21497ef
--- /dev/null
+++ b/client/src/app/forms/components/complex-molecular-profile-deprecate/complex-molecular-profile-deprecate.query.gql
@@ -0,0 +1,31 @@
+mutation DeprecateComplexMolecularProfile(
+ $molecularProfileId: Int!
+ $deprecationReason: MolecularProfileDeprecationReasonMutationInput!
+ $comment: String!
+ $organizationId: Int
+) {
+ deprecateComplexMolecularProfile(
+ input: {
+ molecularProfileId: $molecularProfileId
+ deprecationReason: $deprecationReason
+ comment: $comment
+ organizationId: $organizationId
+ }
+ ) {
+ molecularProfile {
+ id
+ name
+ }
+ }
+}
+query EvidenceCountsForMolecularProfile($molecularProfileId: Int!) {
+ molecularProfile(id: $molecularProfileId) {
+ id
+ name
+ link
+ evidenceCountsByStatus {
+ submittedCount
+ acceptedCount
+ }
+ }
+}
diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.html b/client/src/app/forms/components/entity-tag/entity-tag.component.html
index 35d75774a..142091899 100644
--- a/client/src/app/forms/components/entity-tag/entity-tag.component.html
+++ b/client/src/app/forms/components/entity-tag/entity-tag.component.html
@@ -26,9 +26,11 @@
-
-
+
+
@@ -39,9 +41,11 @@
-
-
+
+
@@ -55,7 +59,9 @@
-
+
@@ -71,7 +77,7 @@
CACHE-MISS ({{ cvcCacheId }})
+
-
+
diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.less b/client/src/app/forms/components/entity-tag/entity-tag.component.less
index cced71f9c..d1765e6a8 100644
--- a/client/src/app/forms/components/entity-tag/entity-tag.component.less
+++ b/client/src/app/forms/components/entity-tag/entity-tag.component.less
@@ -100,6 +100,10 @@ nz-tag {
padding: 3px 2px 3px 4px;
margin: -3px 0 -3px 0;
}
+ .tag-no-icon {
+ display: inline-block;
+ width: 4px;
+ }
.tag-label {
display: inline-block;
font-weight: normal;
diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.ts b/client/src/app/forms/components/entity-tag/entity-tag.component.ts
index b52c39808..e644c203e 100644
--- a/client/src/app/forms/components/entity-tag/entity-tag.component.ts
+++ b/client/src/app/forms/components/entity-tag/entity-tag.component.ts
@@ -32,7 +32,10 @@ export type LinkableEntity = {
export const isLinkableEntity: TypeGuard = (
entity: any
): entity is LinkableEntity =>
- entity !== undefined && entity.__typename && entity.id && entity.name !== undefined
+ entity !== undefined &&
+ entity.__typename &&
+ entity.id &&
+ entity.name !== undefined
export type CvcTagLabelMax =
| '50px'
@@ -100,6 +103,7 @@ export class CvcEntityTagComponent implements OnChanges {
@Input() cvcHasTooltip: boolean = false
@Input() cvcFullWidth: boolean = false
@Input() cvcShowPopover: boolean = false
+ @Input() cvcShowIcon: boolean = true
@Input() cvcTruncateLabel?: CvcTagLabelMax
@Output() cvcTagCheckedChange: EventEmitter =
@@ -143,7 +147,7 @@ export class CvcEntityTagComponent implements OnChanges {
}
// get linkable entity
let fragment = undefined
- if(!this.cvcDisableLink) {
+ if (!this.cvcDisableLink) {
fragment = {
id: `${typename}:${id}`,
fragment: gql`
@@ -154,7 +158,7 @@ export class CvcEntityTagComponent implements OnChanges {
}
`,
}
- } else if(this.cvcHasTooltip) {
+ } else if (this.cvcHasTooltip) {
fragment = {
id: `${typename}:${id}`,
fragment: gql`
@@ -165,8 +169,7 @@ export class CvcEntityTagComponent implements OnChanges {
}
`,
}
- }
- else{
+ } else {
fragment = {
id: `${typename}:${id}`,
fragment: gql`
@@ -176,8 +179,6 @@ export class CvcEntityTagComponent implements OnChanges {
}
`,
}
-
-
}
const entity = this.apollo.client.readFragment(fragment)
if (!isLinkableEntity(entity)) {
diff --git a/client/src/app/forms/components/enum-select/enum-select.module.ts b/client/src/app/forms/components/enum-select/enum-select.module.ts
index c30e18045..269fa86d5 100644
--- a/client/src/app/forms/components/enum-select/enum-select.module.ts
+++ b/client/src/app/forms/components/enum-select/enum-select.module.ts
@@ -3,7 +3,6 @@ import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { CvcPipesModule } from '@app/core/pipes/pipes.module';
import { FormlyModule } from '@ngx-formly/core';
-import { FormlyNzFormFieldModule } from '@ngx-formly/ng-zorro-antd/form-field';
import { NzFormModule } from 'ng-zorro-antd/form';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { NzInputModule } from 'ng-zorro-antd/input';
@@ -18,7 +17,6 @@ import { CvcEnumSelectComponent } from './enum-select.component';
CommonModule,
ReactiveFormsModule,
FormlyModule.forChild(),
- FormlyNzFormFieldModule,
NzIconModule,
NzFormModule,
NzSelectModule,
diff --git a/client/src/app/forms/components/flag-resolve/flag-resolve.form.html b/client/src/app/forms/components/flag-resolve/flag-resolve.form.html
index 45d3f0099..787b1c1a3 100644
--- a/client/src/app/forms/components/flag-resolve/flag-resolve.form.html
+++ b/client/src/app/forms/components/flag-resolve/flag-resolve.form.html
@@ -8,7 +8,7 @@
+ *ngIf="viewer.isEditor || viewer.isAdmin || this.flag.openActivity.user.id === viewer.id; else noPermissions">
@@ -38,7 +38,7 @@
[nzPopoverContent]="flagResolvePopoverContentTemplate"
[nzPopoverTrigger]="undefined "
nzPopoverPlacement="bottom"
- [disabled]="!viewer.signedIn || (viewer.isCurator && this.flag.flaggingUser.id != viewer.id)">
+ [disabled]="!viewer.signedIn || (viewer.isCurator && this.flag.openActivity.user.id != viewer.id)">
Resolve Flag
comment: string = ''
- reason: Maybe
+ reason: Maybe
selectedOrg: Maybe
mpsToDeprecate$?: Observable
diff --git a/client/src/app/forms/components/variant-deprecate/variant-deprecate.query.gql b/client/src/app/forms/components/variant-deprecate/variant-deprecate.query.gql
index cd6684bdd..3c25c3fb0 100644
--- a/client/src/app/forms/components/variant-deprecate/variant-deprecate.query.gql
+++ b/client/src/app/forms/components/variant-deprecate/variant-deprecate.query.gql
@@ -1,6 +1,6 @@
mutation DeprecateVariant(
$variantId: Int!
- $deprecationReason: DeprecationReason!
+ $deprecationReason: VariantDeprecationReason!
$comment: String!
$organizationId: Int
) {
diff --git a/client/src/app/forms/config/assertion-revise/assertion-revise.form.config.ts b/client/src/app/forms/config/assertion-revise/assertion-revise.form.config.ts
index fd12ec1e4..01c099a6b 100644
--- a/client/src/app/forms/config/assertion-revise/assertion-revise.form.config.ts
+++ b/client/src/app/forms/config/assertion-revise/assertion-revise.form.config.ts
@@ -15,13 +15,13 @@ import { CvcEntityTypeSelectFieldConfig } from '@app/forms/types/type-select/typ
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Submit Revisions',
showDevPanel: false,
},
fieldGroup: [
@@ -35,152 +35,183 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Assertion',
+ formCardOptions: { title: 'Revise Assertion' },
},
fieldGroup: [
{
- key: 'molecularProfileId',
- type: 'molecular-profile-select',
- props: {
- required: true,
- watchVariantMolecularProfileId: true,
- },
- },
- {
- key: 'assertionType',
- type: 'type-select',
- props: {
- required: true,
- },
- },
- {
- key: 'assertionDirection',
- type: 'direction-select',
- props: {
- required: true,
- colSpan: 8,
- formMode: 'revise'
- },
- },
- {
- key: 'significance',
- type: 'significance-select',
- props: {
- required: true,
- colSpan: 8,
- formMode: 'revise'
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'molecularProfileId',
+ type: 'molecular-profile-select',
+ props: {
+ required: true,
+ watchVariantMolecularProfileId: true,
+ },
+ },
+ ],
},
{
- key: 'diseaseId',
- type: 'disease-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'therapyIds',
- type: 'therapy-multi-select',
- props: {},
- },
- {
- key: 'therapyInteractionType',
- type: 'interaction-select',
- props: {},
- },
- {
- key: 'variantOrigin',
- type: 'origin-select',
- props: {
- required: true,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, lg: 12, xl: 8, xxl: 6 },
+ },
},
- },
- {
- key: 'phenotypeIds',
- type: 'phenotype-multi-select',
- props: {},
+ fieldGroup: [
+ {
+ key: 'assertionType',
+ type: 'type-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'assertionDirection',
+ type: 'direction-select',
+ props: {
+ required: true,
+ formMode: 'revise',
+ },
+ },
+ {
+ key: 'significance',
+ type: 'significance-select',
+ props: {
+ required: true,
+ formMode: 'revise',
+ },
+ },
+ {
+ key: 'diseaseId',
+ type: 'disease-select',
+ props: {},
+ },
+ {
+ key: 'therapyIds',
+ type: 'therapy-multi-select',
+ props: {},
+ },
+ {
+ key: 'therapyInteractionType',
+ type: 'interaction-select',
+ props: {},
+ },
+ {
+ key: 'variantOrigin',
+ type: 'origin-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'phenotypeIds',
+ type: 'phenotype-multi-select',
+ props: {},
+ },
+ {
+ key: 'ampLevel',
+ type: 'amp-category-select',
+ props: {},
+ },
+ {
+ key: 'acmgCodeIds',
+ type: 'acmg-code-multi-select',
+ props: {},
+ },
+ {
+ key: 'clingenCodeIds',
+ type: 'clingen-code-multi-select',
+ props: {},
+ },
+ {
+ key: 'nccnGuidelineId',
+ type: 'nccn-guideline-select',
+ props: {},
+ },
+ {
+ key: 'nccnGuidelineVersion',
+ type: 'nccn-guideline-version-input',
+ props: {},
+ },
+ {
+ key: 'fdaRegulatoryApproval',
+ type: 'fda-regulatory-approval-checkbox',
+ props: {},
+ },
+ {
+ key: 'fdaCompanionTest',
+ type: 'fda-companion-test-checkbox',
+ props: {},
+ },
+ ],
},
{
- key: 'ampLevel',
- type: 'amp-category-select',
- props: {
- colSpan: 8,
- }
- },
- {
- key: 'acmgCodeIds',
- type: 'acmg-code-multi-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'clingenCodeIds',
- type: 'clingen-code-multi-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'nccnGuidelineId',
- type: 'nccn-guideline-select',
- props: {},
- },
- {
- key: 'nccnGuidelineVersion',
- type: 'nccn-guideline-version-input',
- props: {}
- },
- {
- key: 'fdaRegulatoryApproval',
- type: 'fda-regulatory-approval-checkbox',
- props: {}
- },
- {
- key: 'fdaCompanionTest',
- type: 'fda-companion-test-checkbox',
- props: {}
- },
- {
- key: 'evidenceItemIds',
- type: 'evidence-multi-select',
- props: {
- required: true,
- isMultiSelect: true,
- colSpan: 24
- },
- },
- {
- key: 'summary',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'A short, one sentence summary of the Assertion',
- placeholder: 'Enter an Assertion Summary',
- label: 'Assertion Summary',
- required: true,
- colSpan: 24
- },
- },
- {
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'A complete, original description of this Assertion. Limited to one paragraph.',
- placeholder: 'Enter an Assertion Statement',
- label: 'Assertion Statement',
- required: true,
- rows: 5 ,
- colSpan: 24
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsiveIndexed: [
+ {
+ xs: 24,
+ },
+ {
+ md: 24,
+ lg: 8,
+ },
+ {
+ md: 24,
+ lg: 16,
+ },
+ ],
+ },
},
+ fieldGroup: [
+ {
+ key: 'evidenceItemIds',
+ type: 'evidence-multi-select',
+ props: {
+ required: true,
+ isMultiSelect: true,
+ },
+ },
+ {
+ key: 'summary',
+ type: 'base-textarea',
+ props: {
+ tooltip: 'A short, one sentence summary of the Assertion',
+ placeholder: 'Enter an Assertion Summary',
+ label: 'Assertion Summary',
+ required: true,
+ },
+ },
+ {
+ key: 'description',
+ type: 'base-textarea',
+ props: {
+ tooltip:
+ 'A complete, original description of this Assertion. Limited to one paragraph.',
+ placeholder: 'Enter an Assertion Statement',
+ label: 'Assertion Statement',
+ required: true,
+ rows: 5,
+ },
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
@@ -191,13 +222,14 @@ const formFieldConfig: FormlyFieldConfig[] = [
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
{
key: 'organizationId',
type: 'org-submit-button',
props: {
submitLabel: 'Submit Revisions',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/assertion-submit/assertion-submit.form.config.ts b/client/src/app/forms/config/assertion-submit/assertion-submit.form.config.ts
index 48c52b24b..df4fdc2dd 100644
--- a/client/src/app/forms/config/assertion-submit/assertion-submit.form.config.ts
+++ b/client/src/app/forms/config/assertion-submit/assertion-submit.form.config.ts
@@ -1,9 +1,4 @@
import { assertionSubmitFormInitialModel } from '@app/forms/models/assertion-submit.model'
-import { CvcAcmgCodeSelectFieldOptions } from '@app/forms/types/acmg-code-select/acmg-code-select.type'
-import { CvcAmpCategorySelectFieldOptions } from '@app/forms/types/amp-category-select/amp-category-select.type'
-import { CvcClingenCodeSelectFieldOptions } from '@app/forms/types/clingen-code-select/clingen-code-select.type'
-import { CvcDirectionSelectFieldOptions } from '@app/forms/types/direction-select/direction-select.type'
-import { CvcDiseaseSelectFieldOptions } from '@app/forms/types/disease-select/disease-select.type'
import { CvcFdaCompanionTestCheckboxFieldOptions } from '@app/forms/types/fda-companion-test-checkbox/fda-companion-test-checkbox.type'
import { CvcFdaRegulatoryApprovalCheckboxFieldOptions } from '@app/forms/types/fda-regulatory-approval-checkbox/fda-regulatory-approval-checkbox.type'
import { CvcInteractionSelectFieldOptions } from '@app/forms/types/interaction-select/interaction-select.type'
@@ -16,13 +11,13 @@ import { CvcTherapySelectFieldOptions } from '@app/forms/types/therapy-select/th
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Submit Assertion',
showDevPanel: false,
},
fieldGroup: [
@@ -36,160 +31,196 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'New Assertion',
+ formCardOptions: { title: 'New Assertion' },
},
fieldGroup: [
{
- key: 'molecularProfileId',
- type: 'molecular-profile-select',
- props: {
- required: true,
- tooltip:
- 'A single variant (Simple Molecular Profile) or a combination of variants (Complex Molecular Profile) relevant to the curated assertion.',
- watchVariantMolecularProfileId: true,
- colSpan: 16,
- },
- },
- {
- key: 'assertionType',
- type: 'type-select',
- props: {
- required: true,
- colSpan: 8,
- },
- },
- {
- key: 'assertionDirection',
- type: 'direction-select',
- props: {
- required: true,
- colSpan: 8,
- },
- },
- {
- key: 'significance',
- type: 'significance-select',
- props: {
- required: true,
- colSpan: 8,
- },
- },
- {
- key: 'diseaseId',
- type: 'disease-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'therapyIds',
- type: 'therapy-multi-select',
- props: {},
- },
- {
- key: 'therapyInteractionType',
- type: 'interaction-select',
- props: {},
- },
- {
- key: 'variantOrigin',
- type: 'origin-select',
- props: {
- required: true,
- },
- },
- {
- key: 'phenotypeIds',
- type: 'phenotype-multi-select',
- props: {},
- },
- {
- key: 'ampLevel',
- type: 'amp-category-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'acmgCodeIds',
- type: 'acmg-code-multi-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'clingenCodeIds',
- type: 'clingen-code-multi-select',
- props: {
- colSpan: 8,
- },
- },
- {
- key: 'nccnGuidelineId',
- type: 'nccn-guideline-select',
- props: {},
- },
- {
- key: 'nccnGuidelineVersion',
- type: 'nccn-guideline-version-input',
- props: {},
- },
- {
- key: 'fdaRegulatoryApproval',
- type: 'fda-regulatory-approval-checkbox',
- props: {},
- },
- {
- key: 'fdaCompanionTest',
- type: 'fda-companion-test-checkbox',
- props: {},
- },
- {
- key: 'evidenceItemIds',
- type: 'evidence-multi-select',
- props: {
- required: true,
- isMultiSelect: true,
- colSpan: 24,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'molecularProfileId',
+ type: 'molecular-profile-select',
+ props: {
+ required: true,
+ watchVariantMolecularProfileId: true,
+ },
+ },
+ ],
},
{
- key: 'summary',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip: 'A short, one sentence summary of the Assertion',
- placeholder: 'Enter an Assertion Summary',
- label: 'Assertion Summary',
- required: true,
- colSpan: 24,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, lg: 12, xl: 8, xxl: 6 },
+ },
},
+ fieldGroup: [
+ {
+ key: 'assertionType',
+ type: 'type-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'assertionDirection',
+ type: 'direction-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'significance',
+ type: 'significance-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'diseaseId',
+ type: 'disease-select',
+ props: {},
+ },
+ {
+ key: 'therapyIds',
+ type: 'therapy-multi-select',
+ props: {},
+ },
+ {
+ key: 'therapyInteractionType',
+ type: 'interaction-select',
+ props: {},
+ },
+ {
+ key: 'variantOrigin',
+ type: 'origin-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'phenotypeIds',
+ type: 'phenotype-multi-select',
+ props: {},
+ },
+ {
+ key: 'ampLevel',
+ type: 'amp-category-select',
+ props: {
+ colSpan: 8,
+ },
+ },
+ {
+ key: 'acmgCodeIds',
+ type: 'acmg-code-multi-select',
+ props: {
+ colSpan: 8,
+ },
+ },
+ {
+ key: 'clingenCodeIds',
+ type: 'clingen-code-multi-select',
+ props: {
+ colSpan: 8,
+ },
+ },
+ {
+ key: 'nccnGuidelineId',
+ type: 'nccn-guideline-select',
+ props: {},
+ },
+ {
+ key: 'nccnGuidelineVersion',
+ type: 'nccn-guideline-version-input',
+ props: {},
+ },
+ {
+ key: 'fdaRegulatoryApproval',
+ type: 'fda-regulatory-approval-checkbox',
+ props: {},
+ },
+ {
+ key: 'fdaCompanionTest',
+ type: 'fda-companion-test-checkbox',
+ props: {},
+ },
+ ],
},
{
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'A complete, original description of this Assertion. Limited to one paragraph.',
- placeholder: 'Enter an Assertion Statement',
- label: 'Assertion Statement',
- required: true,
- rows: 5,
- colSpan: 24,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsiveIndexed: [
+ {
+ xs: 24,
+ },
+ {
+ md: 24,
+ lg: 8,
+ },
+ {
+ md: 24,
+ lg: 16,
+ },
+ ],
+ },
},
+ fieldGroup: [
+ {
+ key: 'evidenceItemIds',
+ type: 'evidence-multi-select',
+ props: {
+ required: true,
+ isMultiSelect: true,
+ },
+ },
+ {
+ key: 'summary',
+ type: 'textarea',
+ wrappers: ['form-field'],
+ props: {
+ tooltip: 'A short, one sentence summary of the Assertion',
+ placeholder: 'Enter an Assertion Summary',
+ label: 'Assertion Summary',
+ required: true,
+ },
+ },
+ {
+ key: 'description',
+ type: 'base-textarea',
+ wrappers: ['form-field'],
+ props: {
+ tooltip:
+ 'A complete, original description of this Assertion. Limited to one paragraph.',
+ placeholder: 'Enter an Assertion Statement',
+ label: 'Assertion Statement',
+ required: true,
+ rows: 5,
+ },
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
- // required: true,
+ required: true,
},
},
{
@@ -200,6 +231,7 @@ const formFieldConfig: FormlyFieldConfig[] = [
type: 'org-submit-button',
props: {
submitLabel: 'Submit Assertion',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/evidence-revise/evidence-revise.form.config.ts b/client/src/app/forms/config/evidence-revise/evidence-revise.form.config.ts
index 2c079b701..b6c09719d 100644
--- a/client/src/app/forms/config/evidence-revise/evidence-revise.form.config.ts
+++ b/client/src/app/forms/config/evidence-revise/evidence-revise.form.config.ts
@@ -4,17 +4,21 @@ import { CvcDiseaseSelectFieldOptions } from '@app/forms/types/disease-select/di
import { CvcInteractionSelectFieldOptions } from '@app/forms/types/interaction-select/interaction-select.type'
import { CvcLevelSelectFieldOptions } from '@app/forms/types/level-select/level-select.type'
import { CvcMolecularProfileSelectFieldConfig } from '@app/forms/types/molecular-profile-select/molecular-profile-select.type'
+import { CvcOrgSubmitButtonFieldConfig } from '@app/forms/types/org-submit-button/org-submit-button.type'
import { CvcOriginSelectFieldOptions } from '@app/forms/types/origin-select/origin-select.type'
import { CvcPhenotypeSelectFieldOptions } from '@app/forms/types/phenotype-select/phenotype-select.type'
import { CvcRatingFieldOptions } from '@app/forms/types/rating/rating.type'
import { CvcSignificanceSelectFieldOptions } from '@app/forms/types/significance-select/significance-select.type'
-import { CvcSourceSelectFieldOptions } from '@app/forms/types/source-select/source-select.type'
+import {
+ CvcSourceSelectFieldConfig,
+ CvcSourceSelectFieldOptions,
+} from '@app/forms/types/source-select/source-select.type'
import { CvcTherapySelectFieldOptions } from '@app/forms/types/therapy-select/therapy-select.type'
import { CvcEntityTypeSelectFieldConfig } from '@app/forms/types/type-select/type-select.type'
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
-import { CvcFieldGridWrapperConfig } from '@app/forms/wrappers/field-grid/field-grid.wrapper'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
@@ -22,7 +26,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Revise Evidence Item',
showDevPanel: false,
},
fieldGroup: [
@@ -32,114 +35,150 @@ const formFieldConfig: FormlyFieldConfig[] = [
hidden: true,
},
},
- // form-card wraps the form fields in a card, providing a place to put a title, and other controls e.g. form options, status
{
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Evidence Item',
+ formCardOptions: { title: 'Revise Evidence Item' },
},
fieldGroup: [
- {
- key: 'molecularProfileId',
- type: 'molecular-profile-select',
- props: {
- required: true,
- },
- },
- {
- key: 'sourceId',
- type: 'source-select',
- props: { required: true },
- },
- {
- key: 'evidenceType',
- type: 'type-select',
- props: {
- required: true,
- },
- },
- {
- key: 'evidenceDirection',
- type: 'direction-select',
- props: {
- required: true,
- formMode: 'revise',
- },
- },
- {
- key: 'significance',
- type: 'significance-select',
- props: {
- required: true,
- formMode: 'revise',
- },
- },
- {
- key: 'diseaseId',
- type: 'disease-select',
- props: {},
- },
- {
- key: 'therapyIds',
- type: 'therapy-multi-select',
- props: {},
- },
- {
- key: 'therapyInteractionType',
- type: 'interaction-select',
- props: {},
- },
- {
- key: 'evidenceLevel',
- type: 'level-select',
- props: {
- required: true,
- },
- },
- {
- key: 'rating',
- type: 'rating',
- props: {
- required: true,
+ {
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'molecularProfileId',
+ type: 'molecular-profile-select',
+ props: {
+ required: true,
+ tooltip:
+ 'A single variant (Simple Molecular Profile) or a combination of variants (Complex Molecular Profile) relevant to the curated evidence.',
+ watchVariantMolecularProfileId: true,
+ },
+ },
+ {
+ key: 'sourceId',
+ type: 'source-select',
+ props: { required: true },
+ },
+ ],
},
- {
- key: 'variantOrigin',
- type: 'origin-select',
- props: {
- required: true,
+ {
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, lg: 12, xl: 8, xxl: 6 },
+ },
},
- },
- {
- key: 'phenotypeIds',
- type: 'phenotype-multi-select',
- props: {},
+ fieldGroup: [
+ {
+ key: 'evidenceType',
+ type: 'type-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'evidenceDirection',
+ type: 'direction-select',
+ props: {
+ required: true,
+ formMode: 'revise',
+ },
+ },
+ {
+ key: 'significance',
+ type: 'significance-select',
+ props: {
+ required: true,
+ formMode: 'revise',
+ },
+ },
+ {
+ key: 'diseaseId',
+ type: 'disease-select',
+ props: {},
+ },
+ {
+ key: 'therapyIds',
+ type: 'therapy-multi-select',
+ props: {},
+ },
+ {
+ key: 'therapyInteractionType',
+ type: 'interaction-select',
+ props: {},
+ },
+ {
+ key: 'evidenceLevel',
+ type: 'level-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'rating',
+ type: 'rating',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'variantOrigin',
+ type: 'origin-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'phenotypeIds',
+ type: 'phenotype-multi-select',
+ props: {},
+ },
+ ],
},
{
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'Your original description of evidence from published literature detailing the association or lack of association between a variant and its predictive, prognostic, diagnostic, predisposing, functional or oncogenic value. ',
- placeholder: 'Enter an Evidence Statement',
- extraType: 'description',
- description:
- 'Data constituting personal or identifying information should not be entered (e.g. protected health information (PHI) as defined by HIPAA in the U.S. and/or comparable laws in your jurisdiction).',
- label: 'Evidence Statement',
- required: true,
- colSpan: 24,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'description',
+ type: 'base-textarea',
+ props: {
+ tooltip:
+ 'Your original description of evidence from published literature detailing the association or lack of association between a variant and its predictive, prognostic, diagnostic, predisposing, functional or oncogenic value. ',
+ placeholder: 'Enter an Evidence Statement',
+ extraType: 'description',
+ description:
+ 'Data constituting personal or identifying information should not be entered (e.g. protected health information (PHI) as defined by HIPAA in the U.S. and/or comparable laws in your jurisdiction).',
+ label: 'Evidence Statement',
+ required: true,
+ colSpan: 24,
+ },
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
required: true,
@@ -149,11 +188,12 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
type: 'cvc-cancel-button',
},
- {
+ {
key: 'organizationId',
type: 'org-submit-button',
props: {
submitLabel: 'Submit Evidence Item Revisions',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/evidence-submit/evidence-submit.form.config.ts b/client/src/app/forms/config/evidence-submit/evidence-submit.form.config.ts
index 8f356d83c..f4b0aa41c 100644
--- a/client/src/app/forms/config/evidence-submit/evidence-submit.form.config.ts
+++ b/client/src/app/forms/config/evidence-submit/evidence-submit.form.config.ts
@@ -3,16 +3,22 @@ import { CvcDirectionSelectFieldOptions } from '@app/forms/types/direction-selec
import { CvcDiseaseSelectFieldOptions } from '@app/forms/types/disease-select/disease-select.type'
import { CvcInteractionSelectFieldOptions } from '@app/forms/types/interaction-select/interaction-select.type'
import { CvcLevelSelectFieldOptions } from '@app/forms/types/level-select/level-select.type'
+import { CvcMolecularProfileSelectFieldConfig } from '@app/forms/types/molecular-profile-select/molecular-profile-select.type'
+import { CvcOrgSubmitButtonFieldConfig } from '@app/forms/types/org-submit-button/org-submit-button.type'
import { CvcOriginSelectFieldOptions } from '@app/forms/types/origin-select/origin-select.type'
import { CvcPhenotypeSelectFieldOptions } from '@app/forms/types/phenotype-select/phenotype-select.type'
import { CvcRatingFieldOptions } from '@app/forms/types/rating/rating.type'
import { CvcSignificanceSelectFieldOptions } from '@app/forms/types/significance-select/significance-select.type'
-import { CvcSourceSelectFieldOptions } from '@app/forms/types/source-select/source-select.type'
+import {
+ CvcSourceSelectFieldConfig,
+ CvcSourceSelectFieldOptions,
+} from '@app/forms/types/source-select/source-select.type'
import { CvcTherapySelectFieldOptions } from '@app/forms/types/therapy-select/therapy-select.type'
import { CvcEntityTypeSelectFieldConfig } from '@app/forms/types/type-select/type-select.type'
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
@@ -20,7 +26,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
// form-layout contains the form itself and and a hideable dev panel
wrappers: ['form-layout'],
props: {
- submitLabel: 'Submit Evidence Item',
showDevPanel: false,
},
fieldGroup: [
@@ -30,130 +35,163 @@ const formFieldConfig: FormlyFieldConfig[] = [
hidden: true,
},
},
-
- // form-card wraps the form fields in a card, providing a
- // place to put a title, and other controls e.g. form options, status
{
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'New Evidence Item',
+ formCardOptions: {
+ title: 'New Evidence Item',
+ },
},
fieldGroup: [
{
- key: 'molecularProfileId',
- type: 'molecular-profile-select',
- props: {
- required: true,
- tooltip: 'A single variant (Simple Molecular Profile) or a combination of variants (Complex Molecular Profile) relevant to the curated evidence.',
- watchVariantMolecularProfileId: true,
- },
- },
- {
- key: 'sourceId',
- type: 'source-select',
- props: { required: true },
- },
- {
- key: 'evidenceType',
- type: 'type-select',
- props: {
- required: true,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'molecularProfileId',
+ type: 'molecular-profile-select',
+ props: {
+ required: true,
+ tooltip:
+ 'A single variant (Simple Molecular Profile) or a combination of variants (Complex Molecular Profile) relevant to the curated evidence.',
+ watchVariantMolecularProfileId: true,
+ },
+ },
+ {
+ key: 'sourceId',
+ type: 'source-select',
+ props: { required: true },
+ },
+ ],
},
- {
- key: 'evidenceDirection',
- type: 'direction-select',
- props: {
- required: true,
- },
- },
- {
- key: 'significance',
- type: 'significance-select',
- props: {
- required: true,
- },
- },
- {
- key: 'diseaseId',
- type: 'disease-select',
- props: {},
- },
- {
- key: 'therapyIds',
- type: 'therapy-multi-select',
- props: {},
- },
- {
- key: 'therapyInteractionType',
- type: 'interaction-select',
- props: {},
- },
- {
- key: 'evidenceLevel',
- type: 'level-select',
- props: {
- required: true,
- },
- },
- {
- key: 'rating',
- type: 'rating',
- props: {
- required: true,
- },
- },
- {
- key: 'variantOrigin',
- type: 'origin-select',
- props: {
- required: true,
+ {
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, lg: 12, xl: 8, xxl: 6 },
+ },
},
- },
- {
- key: 'phenotypeIds',
- type: 'phenotype-multi-select',
- props: {},
+ fieldGroup: [
+ {
+ key: 'evidenceType',
+ type: 'type-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'evidenceDirection',
+ type: 'direction-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'significance',
+ type: 'significance-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'diseaseId',
+ type: 'disease-select',
+ props: {},
+ },
+ {
+ key: 'therapyIds',
+ type: 'therapy-multi-select',
+ props: {},
+ },
+ {
+ key: 'therapyInteractionType',
+ type: 'interaction-select',
+ props: {},
+ },
+ {
+ key: 'evidenceLevel',
+ type: 'level-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'rating',
+ type: 'rating',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'variantOrigin',
+ type: 'origin-select',
+ props: {
+ required: true,
+ },
+ },
+ {
+ key: 'phenotypeIds',
+ type: 'phenotype-multi-select',
+ props: {},
+ },
+ ],
},
{
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'Your original description of evidence from published literature detailing the association or lack of association between a variant and its predictive, prognostic, diagnostic, predisposing, functional or oncogenic value. ',
- placeholder: 'Enter an Evidence Statement',
- extraType: 'description',
- description:
- 'Data constituting personal or identifying information should not be entered (e.g. protected health information (PHI) as defined by HIPAA in the U.S. and/or comparable laws in your jurisdiction).',
- label: 'Evidence Statement',
- required: true,
- colSpan: 24,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ key: 'description',
+ type: 'base-textarea',
+ props: {
+ tooltip:
+ 'Your original description of evidence from published literature detailing the association or lack of association between a variant and its predictive, prognostic, diagnostic, predisposing, functional or oncogenic value. ',
+ placeholder: 'Enter an Evidence Statement',
+ description:
+ 'Data constituting personal or identifying information should not be entered (e.g. protected health information (PHI) as defined by HIPAA in the U.S. and/or comparable laws in your jurisdiction).',
+ label: 'Evidence Statement',
+ required: true,
+ },
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
required: false,
- minLength: 10
+ minLength: 10,
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
- {
+ {
key: 'organizationId',
type: 'org-submit-button',
props: {
submitLabel: 'Submit Evidence Item',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/gene-revise/gene-revise.form.config.ts b/client/src/app/forms/config/gene-revise/gene-revise.form.config.ts
index 521c28fcf..e65376d04 100644
--- a/client/src/app/forms/config/gene-revise/gene-revise.form.config.ts
+++ b/client/src/app/forms/config/gene-revise/gene-revise.form.config.ts
@@ -2,6 +2,7 @@ import { geneReviseFormInitialModel } from '@app/forms/models/gene-revise.model'
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
@@ -9,7 +10,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Revise Gene',
showDevPanel: false,
},
fieldGroup: [
@@ -24,51 +24,67 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Evidence Item',
+ formCardOptions: { title: 'Revise Gene' },
},
fieldGroup: [
{
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- tooltip:
- 'User-defined summary of the clinical relevance of this Gene.',
- placeholder: 'Enter a Gene Summary',
- label: 'Gene Summary',
- required: false,
- rows: 5
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
- },
- {
- key: 'sourceIds',
- type: 'source-multi-select',
- wrappers: ['form-field'],
- props: {},
+ fieldGroup: [
+ {
+ key: 'description',
+ type: 'base-textarea',
+ wrappers: ['form-field'],
+ props: {
+ tooltip:
+ 'User-defined summary of the clinical relevance of this Gene.',
+ placeholder: 'Enter a Gene Summary',
+ label: 'Gene Summary',
+ required: false,
+ rows: 5,
+ },
+ },
+ {
+ key: 'sourceIds',
+ type: 'source-multi-select',
+ wrappers: ['form-field'],
+ props: {},
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
placeholder: 'Please enter a comment describing your revisions.',
required: true,
- minLength: 10
+ minLength: 10,
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
{
key: 'organizationId',
type: 'org-submit-button',
props: {
submitLabel: 'Submit Gene Revisions',
+ align: 'right',
},
},
],
@@ -77,7 +93,4 @@ const formFieldConfig: FormlyFieldConfig[] = [
},
]
export const geneReviseFields: FormlyFieldConfig[] =
- assignFieldConfigDefaultValues(
- formFieldConfig,
- geneReviseFormInitialModel
- )
+ assignFieldConfigDefaultValues(formFieldConfig, geneReviseFormInitialModel)
diff --git a/client/src/app/forms/config/molecular-profile-revise/molecular-profile-revise.form.config.ts b/client/src/app/forms/config/molecular-profile-revise/molecular-profile-revise.form.config.ts
index 84a50c1e3..e5edbb9d7 100644
--- a/client/src/app/forms/config/molecular-profile-revise/molecular-profile-revise.form.config.ts
+++ b/client/src/app/forms/config/molecular-profile-revise/molecular-profile-revise.form.config.ts
@@ -1,7 +1,9 @@
import { molecularProfileReviseFormInitialModel } from '@app/forms/models/molecular-profile-revise.model'
+import { CvcOrgSubmitButtonFieldConfig } from '@app/forms/types/org-submit-button/org-submit-button.type'
import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-default-values'
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
@@ -9,7 +11,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Revise Molecular Profile',
showDevPanel: false,
},
fieldGroup: [
@@ -24,62 +25,79 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Evidence Item',
+ formCardOptions: { title: 'Revise Molecular Profile' },
},
fieldGroup: [
{
- key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
- props: {
- placeholder: 'Enter a Molecular Profile Description',
- label: 'Molecular Profile Description',
- description: 'Provide a summary of the clinical relevance of this Molecular Profile. The Molecular Profile Summary should be a synthesis of the existing Evidence Statements for this profile. Basic information on recurrence rates and biological/functional impact of the variants may be included, but the focus should be on the clinical impact (i.e. predictive, prognostic, diagnostic, or predisposing relevance).',
- extraType: 'prompt',
- required: false,
- rows: 5,
- colSpan: 24
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsiveIndexed: [
+ { md: 24, lg: 16 },
+ { md: 24, lg: 8 },
+ { xs: 24 },
+ ],
+ },
},
- },
- {
- key: 'aliases',
- type: 'tag-multi-input',
- wrappers: ['form-field'],
- props: {
- label: 'Aliases',
- description: 'List any aliases commonly used to refer to this Molecular Profile',
- extraType: 'prompt'
- }
- },
- {
- key: 'sourceIds',
- type: 'source-multi-select',
- wrappers: ['form-field'],
- props: {},
+ fieldGroup: [
+ {
+ key: 'description',
+ type: 'textarea',
+ wrappers: ['form-field'],
+ props: {
+ placeholder: 'Enter a Molecular Profile Description',
+ label: 'Molecular Profile Description',
+ description:
+ 'Provide a summary of the clinical relevance of this Molecular Profile. The Molecular Profile Summary should be a synthesis of the existing Evidence Statements for this profile. Basic information on recurrence rates and biological/functional impact of the variants may be included, but the focus should be on the clinical impact (i.e. predictive, prognostic, diagnostic, or predisposing relevance).',
+ required: false,
+ rows: 5,
+ },
+ },
+ {
+ key: 'aliases',
+ type: 'tag-multi-input',
+ wrappers: ['form-field'],
+ props: {
+ label: 'Aliases',
+ description:
+ 'List any aliases commonly used to refer to this Molecular Profile',
+ },
+ },
+ {
+ key: 'sourceIds',
+ type: 'source-multi-select',
+ wrappers: ['form-field'],
+ props: {},
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
- placeholder: 'Please enter a comment describing your revisions.',
required: true,
- minLength: 10
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
- {
+ {
key: 'organizationId',
type: 'org-submit-button',
props: {
- submitLabel: 'Submit Molecular Profile Revisions',
+ submitLabel: 'Submit Revisions',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/source-submit/source-submit.form.config.ts b/client/src/app/forms/config/source-submit/source-submit.form.config.ts
index 37f353bdb..c1eef69b5 100644
--- a/client/src/app/forms/config/source-submit/source-submit.form.config.ts
+++ b/client/src/app/forms/config/source-submit/source-submit.form.config.ts
@@ -4,7 +4,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Submit Source Suggestion',
showDevPanel: false,
},
fieldGroup: [
@@ -19,7 +18,7 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Submit Source Suggestion',
+ formCardOptions: { title: 'Submit Source Suggestion' },
},
fieldGroup: [
{
@@ -27,7 +26,8 @@ const formFieldConfig: FormlyFieldConfig[] = [
type: 'molecular-profile-select',
props: {
required: false,
- description: 'Select a Molecular Profile for this Source Suggestion, if applicable.',
+ description:
+ 'Select a Molecular Profile for this Source Suggestion, if applicable.',
watchVariantMolecularProfileId: true,
},
},
@@ -53,11 +53,11 @@ const formFieldConfig: FormlyFieldConfig[] = [
props: {
label: 'Comment',
required: true,
- minLength: 10
+ minLength: 10,
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
{
key: 'organizationId',
diff --git a/client/src/app/forms/config/variant-revise/variant-revise.form.config.ts b/client/src/app/forms/config/variant-revise/variant-revise.form.config.ts
index 4f2a69d83..8a99f1b38 100644
--- a/client/src/app/forms/config/variant-revise/variant-revise.form.config.ts
+++ b/client/src/app/forms/config/variant-revise/variant-revise.form.config.ts
@@ -5,13 +5,13 @@ import assignFieldConfigDefaultValues from '@app/forms/utilities/assign-field-de
import { CvcFormCardWrapperProps } from '@app/forms/wrappers/form-card/form-card.wrapper'
import { CvcFormLayoutWrapperProps } from '@app/forms/wrappers/form-layout/form-layout.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
+import { CvcOrgSubmitButtonFieldConfig } from '@app/forms/types/org-submit-button/org-submit-button.type'
const formFieldConfig: FormlyFieldConfig[] = [
- // form-layout wrapper embeds the form in an nz-grid row, allowing the form to be placed adjacent to other controls or page elements. Currently, it provides a toggleable dev panel. Could be used to add a preview of the entity being added/edited, or more extensive feedback like lists of similar entities, etc.
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Revise Variant',
showDevPanel: false,
},
fieldGroup: [
@@ -21,239 +21,321 @@ const formFieldConfig: FormlyFieldConfig[] = [
hidden: true,
},
},
- // form-card wraps the form fields in a card, providing a place to put a title, and other controls e.g. form options, status
{
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Variant',
+ formCardOptions: { title: 'Revise Variant' },
},
fieldGroup: [
{
- key: 'geneId',
- type: 'gene-select',
- props: {
- description: 'Enter an Entrez Gene for this Variant',
- },
- },
- {
- key: 'name',
- type: 'input',
- wrappers: ['form-field'],
- props: {
- placeholder: 'Enter a name for this Variant',
- description:
- "Enter the name of the Variant according to the Variant Curation SOP",
- extraType: 'prompt',
- label: 'Name',
- required: true,
- rows: 1,
- },
- },
- {
- key: 'aliases',
- type: 'tag-multi-input',
- wrappers: ['form-field'],
- props: {
- label: 'Aliases',
- description:
- 'List any aliases commonly used to refer to this Variant',
- extraType: 'prompt',
- placeholder: 'Enter Alias and hit return',
- },
- },
- {
- key: 'hgvsDescriptions',
- type: 'tag-multi-input',
- wrappers: ['form-field'],
- props: {
- label: 'HGVS Descriptions',
- description: 'HGVS Descriptions',
- extraType: 'prompt',
- placeholder: 'Enter HGVS and hit return',
- },
- },
- {
- key: 'clinvarIds',
- type: 'clinvar-multi-input',
- wrappers: ['form-field'],
- props: {
- label: "ClinVar IDs",
- description: 'Specify if Clinvar IDs exist, or if they are not applicable for this variant.'
- }
- },
- {
- key: 'variantTypeIds',
- type: 'variant-type-multi-select',
- wrappers: ['form-field']
- },
- {
- template: "Primary (5') Coordinates",
- props: {
- colSpan: 24
- }
- },
- {
- key: 'referenceBuild',
- type: 'reference-build-select',
- },
- {
- key: 'ensemblVersion',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- nccnVersionNumber: {
- expression: (c: AbstractControl) => c.value ? /^\d{2,3}$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => `"${field.formControl?.value}" does not appear to be an Ensembl version number`,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsiveIndexed: [
+ { xs: 24, md: 12, lg: 8 },
+ { xs: 24, md: 12, lg: 8 },
+ { xs: 24, lg: 8 },
+ ],
},
},
- props: {
- label: 'Ensembl Version',
- description: "Enter a valid Ensembl database version (e.g. 75)"
- },
- },
- {
- key: 'referenceBases',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- nccnVersionNumber: {
- expression: (c: AbstractControl) => c.value ? /^[ACTG\\]+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => `"${field.formControl?.value}" contains invalid characters.`,
+ fieldGroup: [
+ {
+ key: 'geneId',
+ type: 'gene-select',
+ props: {
+ description: 'Enter an Entrez Gene for this Variant',
+ required: true,
+ },
},
- },
- props: {
- label: 'Reference Bases',
- description: "The nucleotide(s) of the reference genome affected by the variant. Only used for SNVs and Indels (otherwise leave blank)"
- },
- },
- {
- key: 'variantBases',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- nccnVersionNumber: {
- expression: (c: AbstractControl) => c.value ? /^[ACTG\\]+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => `"${field.formControl?.value}" contains invalid characters.`,
+ {
+ key: 'name',
+ type: 'base-input',
+ props: {
+ placeholder: 'Enter a name for this Variant',
+ description:
+ "Enter the name of the Variant according to the Variant Curation SOP",
+ label: 'Name',
+ required: true,
+ rows: 1,
+ },
},
- },
- props: {
- label: 'Variant Bases',
- description: "The nucleotide(s) of the variant allele. Only used for SNVs and Indels (otherwise leave blank)"
- },
- },
- {
- key: 'chromosome',
- type: 'select',
- wrappers: ['form-field'],
- props: {
- label: 'Chromosome',
- options: Chromosomes,
- description: 'Specify the chromosome in which this variant occurs (e.g. 17).'
- }
- },
- {
- key: 'start',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- isNumeric: {
- expression: (c: AbstractControl) => c.value ? /^\d+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => 'Start coordinate must be numeric',
+ {
+ key: 'aliases',
+ type: 'tag-multi-input',
+ props: {
+ label: 'Aliases',
+ description:
+ 'List any aliases commonly used to refer to this Variant',
+ placeholder: 'Enter Alias and hit return',
+ },
},
- },
- props: {
- label: 'Start',
- description: "Enter the left/first coordinate of this variant. Must be โค the Stop coordinate. Coordinate must be compatible with the selected reference build."
- },
+ ],
},
{
- key: 'stop',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- isNumeric: {
- expression: (c: AbstractControl) => c.value ? /^\d+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => 'Stop coordinate must be numeric',
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsiveIndexed: [
+ { xs: 24, lg: 12, xl: 6, xxl: 8 },
+ { xs: 24, lg: 12, xl: 6, xxl: 8 },
+ { xs: 24, xl: 12, xxl: 8 },
+ ],
},
},
- props: {
- label: 'Stop',
- description: "Provide the right/second coordinate of this variant. Must be โฅ the Start coordinate. Coordinate must be compatible with the selected reference build."
- },
- },
- {
- key: 'representativeTranscript',
- type: 'input',
- wrappers: ['form-field'],
- props: {
- label: 'Representative Transcript',
- description: "Specify a transcript ID, including version number (e.g. ENST00000348159.4, the canonical transcript defined by Ensembl)."
- },
- },
- {
- template: "Secondary (3') Coordinates",
- props: {
- colSpan: 24
- }
- },
- {
- key: 'chromosome2',
- type: 'select',
- wrappers: ['form-field'],
- props: {
- label: 'Chromosome',
- options: Chromosomes,
- description: 'If this variant is a fusion (e.g. BCR-ABL1), specify the chromosome name, coordinates, and representative transcript for the 3-prime partner.'
- }
- },
- {
- key: 'start2',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- isNumeric: {
- expression: (c: AbstractControl) => c.value ? /^\d+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => 'Start coordinate must be numeric',
+ fieldGroup: [
+ {
+ key: 'hgvsDescriptions',
+ type: 'tag-multi-input',
+ props: {
+ label: 'HGVS Descriptions',
+ description:
+ 'Enter any HGVS nomenclature descriptions of this Variant',
+ tooltip:
+ 'Human Genome Variation Society nomenclature descriptions',
+ placeholder: 'Enter HGVS and hit return',
+ },
},
- },
- props: {
- label: 'Start',
- description: "Enter the left/first coordinate of this 3-prime partner fusion variant. Must be โค the Stop coordinate. Coordinate must be compatible with the selected reference build."
- },
- },
- {
- key: 'stop2',
- type: 'input',
- wrappers: ['form-field'],
- validators: {
- isNumeric: {
- expression: (c: AbstractControl) => c.value ? /^\d+$/.test(c.value) : true,
- message: (_: any, field: FormlyFieldConfig) => 'Stop coordinate must be numeric',
+ {
+ key: 'variantTypeIds',
+ type: 'variant-type-multi-select',
},
- },
- props: {
- label: 'Stop',
- description: "Provide the right/second coordinate of this 3-prime partner fusion variant. Must be โฅ the Start coordinate. Coordinate must be compatible with the selected reference build."
- },
+ {
+ key: 'clinvarIds',
+ type: 'clinvar-multi-input',
+ wrappers: ['form-field'],
+ props: {
+ label: 'ClinVar IDs',
+ },
+ },
+ ],
},
{
- key: 'representativeTranscript2',
- type: 'input',
- wrappers: ['form-field'],
- props: {
- label: 'Representative Transcript',
- description: "Specify a transcript ID, including version number (e.g. ENST00000348159.4, the canonical transcript defined by Ensembl)."
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 24,
+ },
},
+ fieldGroup: [
+ {
+ wrappers: ['form-card'],
+ props: {
+ formCardOptions: {
+ title: `Primary (5') Coordinates`,
+ size: 'small',
+ },
+ },
+ fieldGroup: [
+ {
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, md: 12, lg: 8, xxl: 6 },
+ },
+ },
+ fieldGroup: [
+ {
+ key: 'referenceBuild',
+ type: 'reference-build-select',
+ },
+ {
+ key: 'ensemblVersion',
+ type: 'base-input',
+ validators: {
+ nccnVersionNumber: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^\d{2,3}$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ `"${field.formControl?.value}" does not appear to be an Ensembl version number`,
+ },
+ },
+ props: {
+ label: 'Ensembl Version',
+ description:
+ 'Enter a valid Ensembl database version (e.g. 75)',
+ },
+ },
+ {
+ key: 'referenceBases',
+ type: 'base-input',
+ validators: {
+ nccnVersionNumber: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^[ACTG\\]+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ `"${field.formControl?.value}" contains invalid characters.`,
+ },
+ },
+ props: {
+ label: 'Reference Bases',
+ description:
+ 'The nucleotide(s) of the reference genome affected by the variant. Only used for SNVs and Indels (otherwise leave blank)',
+ },
+ },
+ {
+ key: 'variantBases',
+ type: 'base-input',
+ validators: {
+ nccnVersionNumber: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^[ACTG\\]+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ `"${field.formControl?.value}" contains invalid characters.`,
+ },
+ },
+ props: {
+ label: 'Variant Bases',
+ description:
+ 'The nucleotide(s) of the variant allele. Only used for SNVs and Indels (otherwise leave blank)',
+ },
+ },
+ {
+ key: 'chromosome',
+ type: 'base-select',
+ props: {
+ label: 'Chromosome',
+ options: Chromosomes,
+ description:
+ 'Specify the chromosome in which this variant occurs (e.g. 17).',
+ },
+ },
+ {
+ key: 'start',
+ type: 'base-input',
+ validators: {
+ isNumeric: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^\d+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ 'Start coordinate must be numeric',
+ },
+ },
+ props: {
+ label: 'Start',
+ description:
+ 'Enter the left/first coordinate of this variant. Must be โค the Stop coordinate. Coordinate must be compatible with the selected reference build.',
+ },
+ },
+ {
+ key: 'stop',
+ type: 'base-input',
+ validators: {
+ isNumeric: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^\d+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ 'Stop coordinate must be numeric',
+ },
+ },
+ props: {
+ label: 'Stop',
+ description:
+ 'Provide the right/second coordinate of this variant. Must be โฅ the Start coordinate. Coordinate must be compatible with the selected reference build.',
+ },
+ },
+ {
+ key: 'representativeTranscript',
+ type: 'base-input',
+ props: {
+ label: 'Representative Transcript',
+ description:
+ 'Specify a transcript ID, including version number (e.g. ENST00000348159.4, the canonical transcript defined by Ensembl).',
+ },
+ },
+ ],
+ },
+ ],
+ },
+ {
+ wrappers: ['form-card'],
+ props: {
+ formCardOptions: {
+ title: `Secondary (3') Coordinates`,
+ size: 'small',
+ },
+ },
+ fieldGroup: [
+ {
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ responsive: { xs: 24, md: 12, lg: 8, xxl: 6 },
+ },
+ },
+ fieldGroup: [
+ {
+ key: 'chromosome2',
+ type: 'base-select',
+ props: {
+ label: 'Chromosome',
+ options: Chromosomes,
+ description:
+ 'If this variant is a fusion (e.g. BCR-ABL1), specify the chromosome name, coordinates, and representative transcript for the 3-prime partner.',
+ },
+ },
+ {
+ key: 'start2',
+ type: 'base-input',
+ validators: {
+ isNumeric: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^\d+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ 'Start coordinate must be numeric',
+ },
+ },
+ props: {
+ label: 'Start',
+ description:
+ 'Enter the left/first coordinate of this 3-prime partner fusion variant. Must be โค the Stop coordinate. Coordinate must be compatible with the selected reference build.',
+ },
+ },
+ {
+ key: 'stop2',
+ type: 'base-input',
+ validators: {
+ isNumeric: {
+ expression: (c: AbstractControl) =>
+ c.value ? /^\d+$/.test(c.value) : true,
+ message: (_: any, field: FormlyFieldConfig) =>
+ 'Stop coordinate must be numeric',
+ },
+ },
+ props: {
+ label: 'Stop',
+ description:
+ 'Provide the right/second coordinate of this 3-prime partner fusion variant. Must be โฅ the Start coordinate. Coordinate must be compatible with the selected reference build.',
+ },
+ },
+ {
+ key: 'representativeTranscript2',
+ type: 'base-input',
+ props: {
+ label: 'Representative Transcript',
+ description:
+ 'Specify a transcript ID, including version number (e.g. ENST00000348159.4, the canonical transcript defined by Ensembl).',
+ },
+ },
+ ],
+ },
+ ],
+ },
+ ],
},
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
- type: 'textarea',
+ type: 'base-textarea',
props: {
label: 'Comment',
placeholder: 'Please enter a comment describing your revisions.',
@@ -262,13 +344,14 @@ const formFieldConfig: FormlyFieldConfig[] = [
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
- {
+ {
key: 'organizationId',
type: 'org-submit-button',
props: {
submitLabel: 'Submit Variant Revisions',
+ align: 'right',
},
},
],
@@ -277,7 +360,4 @@ const formFieldConfig: FormlyFieldConfig[] = [
},
]
export const variantReviseFields: FormlyFieldConfig[] =
- assignFieldConfigDefaultValues(
- formFieldConfig,
- variantReviseFormInitialModel
- )
+ assignFieldConfigDefaultValues(formFieldConfig, variantReviseFormInitialModel)
diff --git a/client/src/app/forms/config/variant-submit/variant-submit.form.html b/client/src/app/forms/config/variant-submit/variant-submit.form.html
index 554bee066..25336f5ec 100644
--- a/client/src/app/forms/config/variant-submit/variant-submit.form.html
+++ b/client/src/app/forms/config/variant-submit/variant-submit.form.html
@@ -15,16 +15,26 @@
+ [nzDescription]="variantLink">
New Variant {{ variant.name }} added.
-
+
View its
details here.
+
+
+ Variant {{ variant.name }} already exists.
+
diff --git a/client/src/app/forms/config/variant-submit/variant-submit.form.ts b/client/src/app/forms/config/variant-submit/variant-submit.form.ts
index 0d79b2ed0..ab69985c6 100644
--- a/client/src/app/forms/config/variant-submit/variant-submit.form.ts
+++ b/client/src/app/forms/config/variant-submit/variant-submit.form.ts
@@ -2,24 +2,17 @@ import {
ChangeDetectionStrategy,
Component,
EventEmitter,
- OnDestroy,
- OnInit,
Output,
} from '@angular/core'
import { UntypedFormGroup } from '@angular/forms'
-import { CvcFieldGridWrapperConfig } from '@app/forms/wrappers/field-grid/field-grid.wrapper'
import { CvcVariantSelectFieldOption } from '@app/forms/types/variant-select/variant-select.type'
import { Maybe, Variant } from '@app/generated/civic.apollo'
import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core'
-import { BehaviorSubject, Subject } from 'rxjs'
-import {
- FormGene,
- FormMolecularProfile,
- FormVariant,
-} from '@app/forms/forms.interfaces'
+import { BehaviorSubject } from 'rxjs'
import { NzFormLayoutType } from 'ng-zorro-antd/form'
import { EntityFieldSubjectMap } from '@app/forms/states/base.state'
import { Apollo, gql } from 'apollo-angular'
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
type VariantSubmitModel = {
geneId?: number
@@ -31,18 +24,6 @@ type VariantSubmitState = {
fields: EntityFieldSubjectMap
}
-// interface FormModel {
-// fields: {
-// gene: FormGene[]
-// variant: FormVariant[]
-// }
-// }
-
-// export interface SelectedVariant {
-// variantId: number
-// molecularProfile: FormMolecularProfile
-// }
-
@Component({
selector: 'cvc-variant-submit-form',
templateUrl: './variant-submit.form.html',
@@ -58,6 +39,7 @@ export class VariantSubmitForm {
form: UntypedFormGroup
config: FormlyFieldConfig[]
layout: NzFormLayoutType = 'horizontal'
+ newlyCreated?: boolean
finderState: VariantSubmitState = {
formLayout: this.layout,
@@ -75,10 +57,10 @@ export class VariantSubmitForm {
this.config = [
{
- wrappers: ['field-grid'],
- props: {
- grid: {
- cols: 2,
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ span: 12,
},
},
fieldGroup: [
@@ -103,6 +85,7 @@ export class VariantSubmitForm {
showExtra: false,
},
hideLabel: true,
+ isNewlyCreatedCallback: (isNew: boolean): void => {this.newlyCreated = isNew},
},
},
],
diff --git a/client/src/app/forms/config/variantgroup-revise/variantgroup-revise.form.config.ts b/client/src/app/forms/config/variantgroup-revise/variantgroup-revise.form.config.ts
index b84973f6c..20e155615 100644
--- a/client/src/app/forms/config/variantgroup-revise/variantgroup-revise.form.config.ts
+++ b/client/src/app/forms/config/variantgroup-revise/variantgroup-revise.form.config.ts
@@ -1,10 +1,10 @@
+import { CvcFormRowWrapperProps } from '@app/forms/wrappers/form-row/form-row.wrapper'
import { FormlyFieldConfig } from '@ngx-formly/core'
const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Revise Variant Group',
showDevPanel: false,
},
fieldGroup: [
@@ -14,27 +14,24 @@ const formFieldConfig: FormlyFieldConfig[] = [
hidden: true,
},
},
- // form-card wraps the form fields in a card, providing a place to put a title, and other controls e.g. form options, status
{
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Revise Variant Group',
+ formCardOptions: { title: 'Revise Variant Group' },
},
fieldGroup: [
{
key: 'name',
- type: 'input',
+ type: 'base-input',
props: {
label: 'Variant Group Name',
required: true,
- colSpan: 24,
},
},
{
key: 'description',
- type: 'textarea',
- wrappers: ['form-field'],
+ type: 'base-textarea',
props: {
tooltip:
'User-defined summary of the clinical relevance of this Variant Group.',
@@ -56,7 +53,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
props: {
label: 'Variants',
required: true,
- colSpan: 24,
requireGene: false,
showManagerBtn: true,
},
@@ -64,7 +60,12 @@ const formFieldConfig: FormlyFieldConfig[] = [
],
},
{
- wrappers: ['form-footer'],
+ wrappers: ['form-row'],
+ props: {
+ formRowOptions: {
+ spanIndexed: [24, 12, 12],
+ },
+ },
fieldGroup: [
{
key: 'comment',
@@ -82,6 +83,7 @@ const formFieldConfig: FormlyFieldConfig[] = [
type: 'org-submit-button',
props: {
submitLabel: 'Submit Variant Group Revision',
+ align: 'right',
},
},
],
diff --git a/client/src/app/forms/config/variantgroup-submit/variantgroup-submit.form.config.ts b/client/src/app/forms/config/variantgroup-submit/variantgroup-submit.form.config.ts
index dea4049b3..d6c524eb6 100644
--- a/client/src/app/forms/config/variantgroup-submit/variantgroup-submit.form.config.ts
+++ b/client/src/app/forms/config/variantgroup-submit/variantgroup-submit.form.config.ts
@@ -4,7 +4,6 @@ const formFieldConfig: FormlyFieldConfig[] = [
{
wrappers: ['form-layout'],
props: {
- submitLabel: 'Submit Variant Group',
showDevPanel: false,
},
fieldGroup: [
@@ -19,12 +18,12 @@ const formFieldConfig: FormlyFieldConfig[] = [
key: 'fields',
wrappers: ['form-card'],
props: {
- title: 'Submit Variant Group',
+ formCardOptions: { title: 'Submit Variant Group' },
},
fieldGroup: [
{
key: 'name',
- type: 'input',
+ type: 'base-input',
props: {
label: 'Variant Group Name',
required: true,
@@ -41,7 +40,7 @@ const formFieldConfig: FormlyFieldConfig[] = [
placeholder: 'Enter a Variant Group Summary',
label: 'Variant Group Summary',
required: true,
- rows: 5
+ rows: 5,
},
},
{
@@ -75,7 +74,7 @@ const formFieldConfig: FormlyFieldConfig[] = [
},
},
{
- type: 'cvc-cancel-button'
+ type: 'cvc-cancel-button',
},
{
key: 'organizationId',
diff --git a/client/src/app/forms/mixins/base/base-field.ts b/client/src/app/forms/mixins/base/base-field.ts
index 2d7d2b65d..ca163c12a 100644
--- a/client/src/app/forms/mixins/base/base-field.ts
+++ b/client/src/app/forms/mixins/base/base-field.ts
@@ -3,7 +3,7 @@ import { BaseState } from '@app/forms/states/base.state'
import { Maybe } from '@app/generated/civic.apollo'
import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'
import { FieldType, FieldTypeConfig } from '@ngx-formly/core'
-import { BehaviorSubject, filter, map, Observable } from 'rxjs'
+import { BehaviorSubject, filter, first, map, Observable } from 'rxjs'
import { pluck } from 'rxjs-etc/operators'
import { tag } from 'rxjs-spy/operators'
@@ -52,13 +52,25 @@ export function BaseFieldType<
this.onValueChange$ = new BehaviorSubject>(
this.formControl.value
)
+
+ if (Array.isArray(this.formControl.value)) {
+ // only mark array type fields as touched if value contains elements
+ if (this.field.formControl.value.length > 0) {
+ this.formControl.markAsTouched()
+ }
+ } else {
+ this.formControl.markAsTouched()
+ }
} else {
this.onValueChange$ = new BehaviorSubject>(undefined)
}
- // this.onValueChange$
- // .pipe(tag(`${this.field.key} base-field onValueChange$`))
- // .subscribe()
+ // // DEBUG
+ // // uncomment next line to limit logging to a single field
+ // if (this.field.key === 'evidenceItemIds')
+ // this.onValueChange$
+ // .pipe(tag(`${this.field.key} base-field onValueChange$`))
+ // .subscribe()
// emit value from onValueChange$ for every model change
this.onModelChange$.pipe(untilDestroyed(this)).subscribe((v) => {
@@ -81,6 +93,7 @@ export function BaseFieldType<
this.field.key
)
}
+
// it is assumed entity state field names are
// field key string + '$', e.g. field key 'geneId'
// will emit value changes from state.field.geneId$
diff --git a/client/src/app/forms/mixins/entity-select-field.mixin.ts b/client/src/app/forms/mixins/entity-select-field.mixin.ts
index 98f6edee2..cf5f2bbb7 100644
--- a/client/src/app/forms/mixins/entity-select-field.mixin.ts
+++ b/client/src/app/forms/mixins/entity-select-field.mixin.ts
@@ -237,10 +237,9 @@ export function EntitySelectField<
})
) // end this.response$
- this.onOpenChange$
- .subscribe((change: boolean) => {
- if (change) this.onSearch$.next('')
- })
+ this.onOpenChange$.subscribe((change: boolean) => {
+ if (change) this.onSearch$.next('')
+ })
this.response$
.pipe(
diff --git a/client/src/app/forms/mixins/string-input-field.mixin.ts b/client/src/app/forms/mixins/string-input-field.mixin.ts
index 8a94ff4fa..ead9eee32 100644
--- a/client/src/app/forms/mixins/string-input-field.mixin.ts
+++ b/client/src/app/forms/mixins/string-input-field.mixin.ts
@@ -11,9 +11,6 @@ export function StringTagField>(
) {
@Injectable()
abstract class StringTagFieldMixin extends Base {
- // BASE FIELD TYPE SOURCE STREAMS
- onValueChange$?: Subject>
-
// LOCAL SOURCE STREAMS
onTagClose$!: Subject // emits on entity tag closed btn click
@@ -21,19 +18,7 @@ export function StringTagField>(
tagLabel$!: Subject> // emits label for tag
configureStringTagField(): void {
- if (!this.onValueChange$) {
- console.error(
- `${this.field.id} cannot find onValueChange$ Subject, ensure configureBaseField() has been called before configureDisplayStringTag in its AfterViewInit hook.`
- )
- return
- }
-
this.tagLabel$ = new Subject>()
- this.onValueChange$
- .pipe(untilDestroyed(this))
- .subscribe((str: Maybe) => {
- this.tagLabel$.next(str ? str.toString() : undefined)
- })
this.onTagClose$ = new Subject()
diff --git a/client/src/app/forms/test-pages/layout-tests/horizontal-form/horizontal-form.page.html b/client/src/app/forms/test-pages/layout-tests/horizontal-form/horizontal-form.page.html
index c99d63631..2b0626ca8 100644
--- a/client/src/app/forms/test-pages/layout-tests/horizontal-form/horizontal-form.page.html
+++ b/client/src/app/forms/test-pages/layout-tests/horizontal-form/horizontal-form.page.html
@@ -1,6 +1,6 @@
|