diff --git a/src/sites/iva/conf/opencga-variant-constants.js b/src/sites/iva/conf/opencga-variant-constants.js index e256c5efa8..808470a2eb 100644 --- a/src/sites/iva/conf/opencga-variant-constants.js +++ b/src/sites/iva/conf/opencga-variant-constants.js @@ -868,7 +868,7 @@ const tooltips = { "This knowledge is both human-readable and machine-readable, and is a foundation for computational analysis of large-scale molecular biology and genetics experiments in biomedical research.", hpo: "The Human Phenotype Ontology (HPO) provides a standardized vocabulary of phenotypic abnormalities encountered in human disease.", clinvar: "Filter out variants falling outside the genomic features (gene, transcript, SNP, etc.) defined", - fullTextSearch: "Filter out variants falling outside the genomic features (gene, transcript, SNP, etc.) defined", + fullTextSearch: "Filter out variants that do not match with the IDs or the full text provided", cadd: "Raw values have relative meaning, with higher values indicating that a variant is more likely to be " + "simulated (or not observed) and therefore more likely to have deleterious effects. If discovering causal variants " + "within an individual, or small groups, of exomes or genomes te use of the scaled CADD score is recommended", diff --git a/src/webcomponents/clinical/clinical-analysis-create.js b/src/webcomponents/clinical/clinical-analysis-create.js index 3af0f02b37..94815f52df 100644 --- a/src/webcomponents/clinical/clinical-analysis-create.js +++ b/src/webcomponents/clinical/clinical-analysis-create.js @@ -23,6 +23,7 @@ import UtilsNew from "../../core/utils-new.js"; import "../commons/forms/data-form.js"; import "../commons/filters/disease-panel-filter.js"; import "../commons/filters/catalog-search-autocomplete.js"; +import "../commons/image-viewer.js"; import "./filters/clinical-priority-filter.js"; import "./filters/clinical-flag-filter.js"; @@ -107,14 +108,17 @@ export default class ClinicalAnalysisCreate extends LitElement { } // In FAMILY, changing the proband only sets the 'proband.id' field of the clinicalAnalysis object - // We have to add also the disorders list to 'proband.disorders'. + // We need to save the full member object in proband. if (e.detail.param === "proband.id" && this.clinicalAnalysis.type === "FAMILY") { + // Changing the 'proband.id' means we have to reset the disorder field + delete this.clinicalAnalysis.disorder; if (this.clinicalAnalysis.proband?.id) { const proband = this.clinicalAnalysis.family.members.find(member => member.id === this.clinicalAnalysis.proband?.id); - this.clinicalAnalysis.proband.disorders = proband?.disorders || []; - } else if (this.clinicalAnalysis.proband?.disorders) { - // If we have remove the 'proband.id', we have to remove also the 'proband.disorders' field - delete this.clinicalAnalysis.proband.disorders; + this.clinicalAnalysis.proband = UtilsNew.objectClone(proband); + this.clinicalAnalysis.proband.disorders = this.clinicalAnalysis.proband.disorders || []; + } else { + // If we have removed the 'proband.id' field, we have to remove also the full proband object + delete this.clinicalAnalysis.proband; } } @@ -175,7 +179,7 @@ export default class ClinicalAnalysisCreate extends LitElement { if (this.clinicalAnalysis.family && this.clinicalAnalysis.family.members) { for (const member of this.clinicalAnalysis.family.members) { if (member.disorders && member.disorders.length > 0 && member.father.id && member.mother.id) { - this.clinicalAnalysis.proband = member; + this.clinicalAnalysis.proband = UtilsNew.objectClone(member); break; } } @@ -646,11 +650,15 @@ export default class ClinicalAnalysisCreate extends LitElement { title: "Pedigree", type: "custom", display: { - // defaultLayout: "vertical", render: data => { - if (data.family) { - return html``; + if (data?.family?.pedigreeGraph?.base64) { + return html` + + + `; } + return "-"; }, errorMessage: "No family selected", } diff --git a/src/webcomponents/disease-panel/disease-panel-create.js b/src/webcomponents/disease-panel/disease-panel-create.js index 6285554aa5..dfac1ddead 100644 --- a/src/webcomponents/disease-panel/disease-panel-create.js +++ b/src/webcomponents/disease-panel/disease-panel-create.js @@ -83,7 +83,8 @@ export default class DiseasePanelCreate extends LitElement { const params = { exclude: "transcripts,annotation", }; - this.opencgaSession.cellbaseClient.getGeneClient(gene.name, "info", params) + this.opencgaSession.cellbaseClient + .getGeneClient(gene.name, "info", params) .then(res => { const g = res.responses[0].results[0]; gene.id = g.id; @@ -106,6 +107,46 @@ export default class DiseasePanelCreate extends LitElement { } } } + // Set the region coordinates if needed: location, assembly, and source + if (e.detail?.data?.regions?.length > 0) { + for (const region of e.detail.data.regions) { + if (region.id) { + if (region.id !== region.coordinates?.[0]?.location) { + region.coordinates = [ + { + location: region.id, + assembly: this.opencgaSession?.project?.organism?.assembly || "", + // source: region.source || "", + } + ]; + } + } else { + if (region.coordinates) { + region.coordinates = null; + } + } + } + } + // Set the variant coordinates if needed: location, assembly, and source + if (e.detail?.data?.variants?.length > 0) { + for (const variant of e.detail.data.variants) { + if (variant.id) { + if (variant.id !== variant.coordinates?.[0]?.location) { + variant.coordinates = [ + { + location: variant.id, + assembly: this.opencgaSession?.project?.organism?.assembly || "", + // source: region.source || "", + } + ]; + } + } else { + if (variant.coordinates) { + variant.coordinates = null; + } + } + } + } this.diseasePanel = {...e.detail.data}; // force to refresh the object-list this.requestUpdate(); } @@ -297,8 +338,11 @@ export default class DiseasePanelCreate extends LitElement { view: gene => html`
${gene?.name} (${gene?.id})
-
MoI: ${gene?.modeOfInheritance || "NA"} (Confidence: ${gene.confidence || "NA"})
-
${gene.coordinates?.[0]?.location}
+
MoI: ${gene?.modesOfInheritance?.join(", ") || "-"} (Confidence: ${gene.confidence || "NA"})
+
+ Location: ${gene.coordinates?.[0]?.location || "-"}, + Assembly: ${gene.coordinates?.[0]?.assembly || "-"}, +
`, }, @@ -326,7 +370,7 @@ export default class DiseasePanelCreate extends LitElement { field: "genes[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." @@ -346,7 +390,7 @@ export default class DiseasePanelCreate extends LitElement { field: "genes[].cancer.roles", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: ROLE_IN_CANCER, display: { placeholder: "Select role in cancer..." @@ -366,17 +410,24 @@ export default class DiseasePanelCreate extends LitElement { display: { style: "border-left: 2px solid #0c2f4c; padding-left: 12px; margin-bottom:24px", collapsedUpdate: true, - view: region => html` -
${region.id} - ${region?.modeOfInheritance || "-"}
+ view: region => html ` +
+
${region?.id}
+
MoI: ${region?.modesOfInheritance?.join(", ") || "-"} (Confidence: ${region?.confidence || "NA"})
+
+ Location: ${region.coordinates?.[0]?.location || "-"}, + Assembly: ${region.coordinates?.[0]?.assembly || "-"}, +
+
`, }, elements: [ { - title: "Region ID", + title: "Region ID/Location", field: "regions[].id", type: "input-text", display: { - placeholder: "Add region...", + placeholder: "Add a region ID/Location (e.g. 1:10100-10110)...", } }, { @@ -384,7 +435,7 @@ export default class DiseasePanelCreate extends LitElement { field: "regions[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." @@ -414,16 +465,23 @@ export default class DiseasePanelCreate extends LitElement { style: "border-left: 2px solid #0c2f4c; padding-left: 12px; margin-bottom:24px", collapsedUpdate: true, view: variant => html` -
${variant.id} - ${variant?.modeOfInheritance || "-"}
+
+
${variant.id}
+
MoI: ${variant?.modesOfInheritance?.join(", ") || "-"}
+
+ Location: ${variant.coordinates?.[0]?.location || "-"}, + Assembly: ${variant.coordinates?.[0]?.assembly || "-"}, +
+
`, }, elements: [ { - title: "Variant ID", + title: "Variant ID/Location", field: "variants[].id", type: "input-text", display: { - placeholder: "Add variant ID...", + placeholder: "Add the variant ID/Location...", } }, { @@ -431,7 +489,7 @@ export default class DiseasePanelCreate extends LitElement { field: "variants[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." diff --git a/src/webcomponents/disease-panel/disease-panel-region-view.js b/src/webcomponents/disease-panel/disease-panel-region-view.js index f222d41072..52af5aaa73 100644 --- a/src/webcomponents/disease-panel/disease-panel-region-view.js +++ b/src/webcomponents/disease-panel/disease-panel-region-view.js @@ -132,9 +132,19 @@ export default class DiseasePanelRegionView extends LitElement { halign: this._config.header.horizontalAlign, }, { - id: "modeOfInheritance", + id: "modesOfInheritance", title: "Mode of Inheritance", - field: "modeOfInheritance", + field: "modesOfInheritance", + formatter: (value, row) => { + const modesOfInheritanceContent = this.generateList(row.modesOfInheritance, ""); + return String.raw ` + ${modesOfInheritanceContent ? String.raw ` + ` : "-" + } + `; + }, }, { id: "confidence", @@ -190,17 +200,16 @@ export default class DiseasePanelRegionView extends LitElement { render() { return html` - ${this._config.showToolbar ? - html` - - ` : nothing - } + ${this._config.showToolbar ? html` + + + ` : nothing}
diff --git a/src/webcomponents/disease-panel/disease-panel-update.js b/src/webcomponents/disease-panel/disease-panel-update.js index efdbb6e033..14ef5b8994 100644 --- a/src/webcomponents/disease-panel/disease-panel-update.js +++ b/src/webcomponents/disease-panel/disease-panel-update.js @@ -117,6 +117,47 @@ export default class DiseasePanelUpdate extends LitElement { } } } + + // Set the region coordinates if needed: location, assembly, and source + if (e.detail?.component?.regions?.length > 0) { + for (const region of e.detail.component.regions) { + if (region.id) { + if (region.id !== region.coordinates?.[0]?.location) { + region.coordinates = [ + { + location: region.id, + assembly: this.opencgaSession?.project?.organism?.assembly || "", + // source: region.source || "", + } + ]; + } + } else { + if (region.coordinates) { + region.coordinates = null; + } + } + } + } + + if (e.detail?.component?.variants?.length > 0) { + for (const variant of e.detail.component.variants) { + if (variant.id) { + if (variant.id !== variant.coordinates?.[0]?.location) { + variant.coordinates = [ + { + location: variant.id, + assembly: this.opencgaSession?.project?.organism?.assembly || "", + // source: region.source || "", + } + ]; + } + } else { + if (variant.coordinates) { + variant.coordinates = null; + } + } + } + } } render() { @@ -273,7 +314,10 @@ export default class DiseasePanelUpdate extends LitElement {
${gene?.name} (${gene?.id})
MoI: ${gene?.modesOfInheritance.join(", ") || "NA"} (Confidence: ${gene.confidence || "NA"})
-
${gene.coordinates?.[0]?.location}
+
+ Location: ${gene.coordinates?.[0]?.location || "-"}, + Assembly: ${gene.coordinates?.[0]?.assembly || "-"}, +
`, }, @@ -301,7 +345,7 @@ export default class DiseasePanelUpdate extends LitElement { field: "genes[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." @@ -321,7 +365,7 @@ export default class DiseasePanelUpdate extends LitElement { field: "genes[].cancer.roles", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: ROLE_IN_CANCER, display: { placeholder: "Select role in cancer..." @@ -342,7 +386,14 @@ export default class DiseasePanelUpdate extends LitElement { style: "border-left: 2px solid #0c2f4c; padding-left: 12px; margin-bottom:24px", collapsedUpdate: true, view: region => html ` -
${region.id} - ${region?.modesOfInheritance.join(", ") || "-"}
+
+
${region?.id}
+
MoI: ${region?.modesOfInheritance?.join(", ") || "-"} (Confidence: ${region?.confidence || "NA"})
+
+ Location: ${region.coordinates?.[0]?.location || "-"}, + Assembly: ${region.coordinates?.[0]?.assembly || "-"}, +
+
`, }, elements: [ @@ -351,7 +402,7 @@ export default class DiseasePanelUpdate extends LitElement { field: "regions[].id", type: "input-text", display: { - placeholder: "Add region...", + placeholder: "Add a region location (e.g. 1:10100-10110)...", } }, { @@ -359,7 +410,7 @@ export default class DiseasePanelUpdate extends LitElement { field: "regions[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." @@ -389,7 +440,14 @@ export default class DiseasePanelUpdate extends LitElement { style: "border-left: 2px solid #0c2f4c; padding-left: 12px; margin-bottom:24px", collapsedUpdate: true, view: variant => html` -
${variant.id} - ${variant?.modesOfInheritance.join(", ") || "-"}
+
+
${variant.id}
+
MoI: ${variant?.modesOfInheritance?.join(", ") || "-"}
+
+ Location: ${variant.coordinates?.[0]?.location || "-"}, + Assembly: ${variant.coordinates?.[0]?.assembly || "-"}, +
+
`, }, elements: [ @@ -406,7 +464,7 @@ export default class DiseasePanelUpdate extends LitElement { field: "variants[].modesOfInheritance", type: "select", multiple: true, - save: value => value.split(","), // Array when select and multiple + save: value => value?.split(",") || [], // Array when select and multiple allowedValues: MODE_OF_INHERITANCE, display: { placeholder: "Select a mode of inheritance..." diff --git a/src/webcomponents/variant/variant-browser-grid.js b/src/webcomponents/variant/variant-browser-grid.js index 933ab39c52..d032041588 100644 --- a/src/webcomponents/variant/variant-browser-grid.js +++ b/src/webcomponents/variant/variant-browser-grid.js @@ -546,7 +546,8 @@ export default class VariantBrowserGrid extends LitElement { colspan: 1, formatter: VariantInterpreterGridFormatter.sampleGenotypeFormatter, align: "center", - nucleotideGenotype: true + nucleotideGenotype: true, + visible: this.gridCommons.isColumnVisible(this.samples[i].id), }); } } @@ -571,7 +572,8 @@ export default class VariantBrowserGrid extends LitElement { colspan: 1, formatter: this.cohortFormatter, align: "center", - eligible: true + eligible: true, + visible: this.gridCommons.isColumnVisible(study.id), }); } } @@ -611,6 +613,7 @@ export default class VariantBrowserGrid extends LitElement { colspan: 1, formatter: this.populationFrequenciesFormatter, align: "center", + visible: this.gridCommons.isColumnVisible(this.populationFrequencies.studies[j].id), }); } }