Skip to content

Commit

Permalink
Revert "remove bg efo"
Browse files Browse the repository at this point in the history 
This reverts commit 802d8ee.
  • Loading branch information
@ala-ebi
ala-ebi committed Sep 5, 2022
1 parent 44269f3 commit 9121999
Show file tree
Hide file tree
Showing 2 changed files with 94 additions and 1 deletion.
35 changes: 35 additions & 0 deletions src/app/feature/submission/components/study-tab/study-tab.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,33 @@
</mat-form-field>
<button mat-raised-button color="primary" class="mx-4 -top-1" (click)="saveEfoTraits()" [disabled]="efoTraits.length == 0"> Save </button>

<mat-form-field class="w-4/5" appearance="outline">
<mat-label>Background EFO traits</mat-label>
<mat-chip-list #bgEfoChipList>
<mat-chip *ngFor="let bgEfoTrait of bgEfoTraits"
(removed)="removeBgEfo(bgEfoTrait)">
{{bgEfoTrait.trait + ', ' + bgEfoTrait.shortForm}}
<button matChipRemove>
<mat-icon>cancel</mat-icon>
</button>
</mat-chip>
<input
placeholder="Add trait..."
#bgEfoTraitInput
[formControl]="bgEfoTraitCtrl"
[matAutocomplete]="bgEfoAuto"
[matChipInputFor]="bgEfoChipList"
[matChipInputSeparatorKeyCodes]="separatorKeysCodes">
</mat-chip-list>
<mat-autocomplete #bgEfoAuto="matAutocomplete" (optionSelected)="selectedBgEfo($event)">
<mat-option *ngFor="let bgEfoTrait of bgEfoTraitsDropdownItems" [value]="bgEfoTrait">
{{bgEfoTrait.trait + ', ' + bgEfoTrait.shortForm}}
</mat-option>
<mat-option disabled *ngIf="bgEfoTraitsDropdownItems.length == 0"> No results. </mat-option>
</mat-autocomplete>
</mat-form-field>
<button mat-raised-button color="primary" class="mx-4 -top-1" (click)="saveBgEfoTraits()"> Save </button>

</div>
</mat-sidenav>
<mat-sidenav-content>
Expand Down Expand Up @@ -271,6 +298,14 @@ <h4 class="color-warn">Report may contain errors, please download and have a loo
</td>
</ng-container>

<ng-container matColumnDef="background_efo">
<th mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Background EFO</th>
<td mat-cell *matCellDef="let row" style="max-width: 350px">
<span *ngIf="!row.background_efo_trait">N/A</span>
<span *ngIf="row.background_efo_trait">{{row.background_efo_trait}}</span>
</td>
</ng-container>

<ng-container matColumnDef="sumstats_file">
<th mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Sumstats File</th>
<td mat-cell *matCellDef="let row" style="max-width: 350px">
Expand Down
60 changes: 59 additions & 1 deletion src/app/feature/submission/components/study-tab/study-tab.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,20 +30,24 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
dataSource: MatTableDataSource<Study>;
resultsLength = 0;
isLoadingResults = true;
displayedColumns: string[] = ['study_accession', 'study_tag', 'genotyping_technology', 'array_manufacturer', 'array_information', 'imputation', 'variant_count', 'statistical_model', 'study_description', 'disease_trait', 'efo', 'sumstats_file', 'cohort'];
displayedColumns: string[] = ['study_accession', 'study_tag', 'genotyping_technology', 'array_manufacturer', 'array_information', 'imputation', 'variant_count', 'statistical_model', 'study_description', 'disease_trait', 'efo', 'background_efo', 'sumstats_file', 'cohort'];
@ViewChild(MatSort) sort: MatSort;
@ViewChild(MatPaginator) paginator: MatPaginator;
submissionId = this.route.snapshot.paramMap.get('id');
openedGcst: number;
separatorKeysCodes: number[] = [ENTER, COMMA];
traitCtrl = new FormControl();
efoTraitCtrl = new FormControl();
bgEfoTraitCtrl = new FormControl();
reportedTraits: ReportedTrait[] = [];
efoTraits: EfoTrait[] = [];
bgEfoTraits: EfoTrait[] = [];
reportedTraitsDropdownItems: ReportedTrait[] = [];
efoTraitsDropdownItems: EfoTrait[] = [];
bgEfoTraitsDropdownItems: EfoTrait[] = [];
@ViewChild('reportedTraitInput') reportedTraitInput: ElementRef;
@ViewChild('efoTraitInput') efoTraitInput: ElementRef;
@ViewChild('bgEfoTraitInput') bgEfoTraitInput: ElementRef;
@ViewChild('sidenav') sidenav: MatSidenav;
isLoadingSidenav: boolean;
sidenavStudy: Study;
Expand Down Expand Up @@ -151,10 +155,15 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
.subscribe(value => {
for (const study of value) {
study.efo_trait = '';
study.background_efo_trait = '';
for (const efo of study.efoTraits) {
study.efo_trait = study.efo_trait + efo.trait + ' | ';
}
study.efo_trait = study.efo_trait.substring(0, study.efo_trait.length - 3);
for (const efo of study.backgroundEfoTraits) {
study.background_efo_trait = study.background_efo_trait + efo.trait + ' | ';
}
study.background_efo_trait = study.background_efo_trait.substring(0, study.background_efo_trait.length - 3);
}
this.dataSource = new MatTableDataSource<Study>(value);
});
Expand Down Expand Up @@ -188,6 +197,21 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
}
});
});

fromEvent(this.bgEfoTraitInput.nativeElement, 'input').pipe()
.pipe(map((event: Event) => (event.target as HTMLInputElement).value))
.pipe(debounceTime(1000))
.pipe(distinctUntilChanged())
.subscribe(data => {
this.efoTraitService.getTraits(50, 0, 'trait', 'asc', data).subscribe(value => {
if (value?._embedded?.efoTraits) {
this.bgEfoTraitsDropdownItems = value._embedded.efoTraits;
}
else {
this.bgEfoTraitsDropdownItems = [];
}
});
});
}

getSubmissionStudies() {
Expand All @@ -214,6 +238,14 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
}
}

removeBgEfo(trait: EfoTrait): void {
const index = this.bgEfoTraits.indexOf(trait);

if (index >= 0) {
this.bgEfoTraits.splice (index, 1);
}
}

selected(event: MatAutocompleteSelectedEvent): void {
this.reportedTraits[0] = event.option.value;
this.reportedTraitInput.nativeElement.value = '';
Expand All @@ -228,6 +260,14 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
this.efoTraitCtrl.setValue(null);
}

selectedBgEfo(event: MatAutocompleteSelectedEvent): void {
if (this.bgEfoTraits.indexOf(event.option.value) < 0) {
this.bgEfoTraits.push(event.option.value);
}
this.bgEfoTraitInput.nativeElement.value = '';
this.bgEfoTraitCtrl.setValue(null);
}

openSidenav(id: string) {

// open sidenav
Expand All @@ -242,6 +282,7 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
this.reportedTraits[0] = this.sidenavStudy.diseaseTrait;
}
this.efoTraits = this.sidenavStudy.efoTraits;
this.bgEfoTraits = this.sidenavStudy.backgroundEfoTraits;
this.isLoadingSidenav = false;
});
}
Expand Down Expand Up @@ -278,6 +319,18 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
});
}


saveBgEfoTraits() {
this.isLoadingSidenav = true;

this.submissionService.editBgEfoTraits(this.bgEfoTraits, this.submissionId, this.sidenavStudy)
.subscribe((v) => {
this.sidenavStudy = v;
this.isLoadingSidenav = false;
this.reloadStudies();
});
}

downloadBulkStudyMultiTraitUploadTemplate() {

this.submissionService.downloadBulkStudyMultiTraitUploadTemplate().subscribe((response: any) => {
Expand Down Expand Up @@ -319,10 +372,15 @@ export class StudyTabComponent implements OnInit, AfterViewInit {
.subscribe(value => {
for (const study of value._embedded.studies) {
study.efo_trait = '';
study.background_efo_trait = '';
for (const efo of study.efoTraits) {
study.efo_trait = study.efo_trait + efo.trait + ' | ';
}
study.efo_trait = study.efo_trait.substring(0, study.efo_trait.length - 3);
for (const efo of study.backgroundEfoTraits) {
study.background_efo_trait = study.background_efo_trait + efo.trait + ' | ';
}
study.background_efo_trait = study.background_efo_trait.substring(0, study.background_efo_trait.length - 3);
}
this.isLoadingResults = false;
this.dataSource = new MatTableDataSource<Study>(value._embedded.studies);
Expand Down

0 comments on commit 9121999

Please sign in to comment.