From b73c6628d153c01b1436b121691020f56a49e968 Mon Sep 17 00:00:00 2001 From: imedina Date: Sun, 22 Oct 2023 03:06:33 +0100 Subject: [PATCH 01/73] core: add new bioinfo links --- src/core/bioinfo/bioinfo-utils.js | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/src/core/bioinfo/bioinfo-utils.js b/src/core/bioinfo/bioinfo-utils.js index 4727480824..f88f40fcab 100644 --- a/src/core/bioinfo/bioinfo-utils.js +++ b/src/core/bioinfo/bioinfo-utils.js @@ -230,6 +230,29 @@ export default class BioinfoUtils { return `https://panelapp.genomicsengland.co.uk/panels/${panelAppId}/`; } + static getOntologyLink(ontologyTermId) { + if (ontologyTermId.includes(":")) { + const [source, id] = ontologyTermId?.split(":"); + switch (source?.toUpperCase()) { + case "HP": + return this.getHpoLink(ontologyTermId); + case "SO": + return this.getSequenceOntologyLink(ontologyTermId); + case "OMIM": + return this.getOmimOntologyLink(id); + case "ORPHA": + return this.getOrphanetLink(id); + case "MONDO": + // MONDO ontology does not have a specific URL + return this.getOboLink(ontologyTermId); + default: + return ontologyTermId; + } + } else { + return ontologyTermId; + } + } + static getOboLink(ontologyId) { const ontologyShort = ontologyId.replace(":", "_"); return `http://purl.obolibrary.org/obo/${ontologyShort}`; @@ -243,4 +266,11 @@ export default class BioinfoUtils { return `http://www.sequenceontology.org/browser/current_svn/term/${soTerm}`; } + static getOmimOntologyLink(soTerm) { + return `https://omim.org/entry/${soTerm}"`; + } + + static getOrphanetLink(orphaId) { + return `https://www.orpha.net/consor/cgi-bin/OC_Exp.php?lng=EN&Expert=${orphaId}`; + } } From d2d8dea89092104c2260fdca56dbab6bf9d5884d Mon Sep 17 00:00:00 2001 From: imedina Date: Sun, 22 Oct 2023 03:07:11 +0100 Subject: [PATCH 02/73] conf: update config files --- src/sites/iva/conf/config.js | 2 +- .../conf/opencga-individual-browser.settings.js | 16 ++++++++++++++++ 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/src/sites/iva/conf/config.js b/src/sites/iva/conf/config.js index 6c8636bd0e..04ab111996 100644 --- a/src/sites/iva/conf/config.js +++ b/src/sites/iva/conf/config.js @@ -23,7 +23,7 @@ const hosts = [ }, { id: "test", - url: "https://ws.opencb.org/opencga-test" + url: "https://demo.app.zettagenomics.com/opencga" }, { id: "testteam", diff --git a/src/sites/iva/conf/opencga-individual-browser.settings.js b/src/sites/iva/conf/opencga-individual-browser.settings.js index d772399da7..1f189424ec 100644 --- a/src/sites/iva/conf/opencga-individual-browser.settings.js +++ b/src/sites/iva/conf/opencga-individual-browser.settings.js @@ -27,6 +27,22 @@ const OPENCGA_INDIVIDUAL_BROWSER_SETTINGS = { // merge criterium: uses this array as filter for internal 1D/2D array. It handles row/col span // It is supported either columns[] or hiddenColumns[]. columns: ["id", "samples", "father", "mother", "disorders", "phenotypes", "caseId", "sex", "ethnicity", "dateOfBirth", "creationDate", "actions"] + + // Example: + // annotations: [ + // { + // title: "Cardiology Tests", + // position: 3, + // variableSetId: "cardiology_tests_checklist", + // variables: ["ecg_test", "echo_test"] + // }, + // { + // title: "Risk Assessment", + // position: 5, + // variableSetId: "risk_assessment", + // variables: ["vf_cardiac_arrest_events"] + // } + // ] }, // merge criterium: uses this array as filter for internal 1D array. details: ["individual-view", "clinical-analysis-grid", "individual-inferred-sex", "individual-mendelian-error", "json-view"] From 13f030c06e209978fb33ebfd0917aca8fc9d83e1 Mon Sep 17 00:00:00 2001 From: imedina Date: Sun, 22 Oct 2023 03:07:59 +0100 Subject: [PATCH 03/73] core: initial implementation --- src/webcomponents/cohort/cohort-grid.js | 30 ++- .../commons/catalog-grid-formatter.js | 189 ++++++++++----- src/webcomponents/commons/forms/data-form.js | 4 +- src/webcomponents/commons/grid-commons.js | 28 +++ .../commons/opencga-browser-filter.js | 3 +- .../disease-panel/disease-panel-grid.js | 218 ++++++++---------- .../disease-panel/disease-panel-summary.js | 2 +- src/webcomponents/family/family-browser.js | 31 +-- src/webcomponents/family/family-grid.js | 45 ++-- src/webcomponents/file/file-browser.js | 51 ++-- src/webcomponents/file/file-grid.js | 74 ++++-- .../individual/individual-browser.js | 26 +-- .../individual/individual-grid.js | 133 ++++++----- .../individual/individual-view.js | 49 +++- src/webcomponents/job/job-grid.js | 113 ++++++--- src/webcomponents/sample/sample-grid.js | 57 ++++- src/webcomponents/sample/sample-view.js | 28 +-- styles/css/global.css | 8 +- 18 files changed, 657 insertions(+), 432 deletions(-) diff --git a/src/webcomponents/cohort/cohort-grid.js b/src/webcomponents/cohort/cohort-grid.js index 596db506c9..0491c57cf3 100644 --- a/src/webcomponents/cohort/cohort-grid.js +++ b/src/webcomponents/cohort/cohort-grid.js @@ -289,12 +289,19 @@ export default class CohortGrid extends LitElement { id: "id", title: "Cohort ID", field: "id", + formatter: (cohortId, cohort) => { + return ` +
+ ${cohortId} + ${cohort.name ? `${cohort.name}` : ""} +
`; + }, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("id") }, { id: "numSamples", - title: "#Samples", + title: "Number of Samples", field: "numSamples", // formatter: (value, row) => row.numSamples ?? 0, halign: this._config.header.horizontalAlign, @@ -302,20 +309,25 @@ export default class CohortGrid extends LitElement { }, { id: "creationDate", - title: "Date", + title: "Creation Date", field: "creationDate", formatter: CatalogGridFormatter.dateFormatter, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("creationDate") }, - { - id: "type", - title: "Type", - field: "type", - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("type") - } + // { + // id: "type", + // title: "Type", + // field: "type", + // halign: this._config.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("type") + // } ]; + + if (this._config.annotations?.length > 0) { + this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); + } + if (this.opencgaSession && this._config.showActions) { this._columns.push({ id: "actions", diff --git a/src/webcomponents/commons/catalog-grid-formatter.js b/src/webcomponents/commons/catalog-grid-formatter.js index 1abfb3531d..31452fe077 100644 --- a/src/webcomponents/commons/catalog-grid-formatter.js +++ b/src/webcomponents/commons/catalog-grid-formatter.js @@ -19,72 +19,85 @@ import BioinfoUtils from "../../core/bioinfo/bioinfo-utils.js"; export default class CatalogGridFormatter { - static phenotypesFormatter(value, row) { - if (!value || !value?.length) { + static phenotypesFormatter(phenotypes) { + if (!phenotypes || phenotypes.length === 0) { return "-"; } const status = ["OBSERVED", "NOT_OBSERVED", "UNKNOWN"]; - const tooltip = [...value].sort((a, b) => status.indexOf(a.status) - status.indexOf(b.status)).map(phenotype => { - const result = []; - if (phenotype.name) { - result.push(UtilsNew.escapeHtml(phenotype.name)); - // Check if we have also the phenotype ID --> add the '-' separator + const phenotypesHtml = phenotypes + .sort((a, b) => status.indexOf(a.status) - status.indexOf(b.status)) + .map(phenotype => { + const result = []; + if (phenotype.name) { + result.push(UtilsNew.escapeHtml(phenotype.name)); + } + // Add phenotype ID if exists if (phenotype.id && phenotype.id !== phenotype.name) { - result.push("-"); + if (phenotype.source && phenotype.source.toUpperCase() === "HPO") { + result.push(` + (${phenotype.id}) + `); + } else { + result.push(phenotype.id); + } } - } - // Add phenotype ID if exists - if (phenotype.id && phenotype.id !== phenotype.name) { - if (phenotype.source && phenotype.source.toUpperCase() === "HPO") { - result.push(` - ${phenotype.id}`); + // Add phenotype status if exists + // if (phenotype.status) { + // result.push(`(${phenotype.status})`); + // } + return `
${result.join("")}
`; + }); + + if (phenotypesHtml?.length > 0) { + let html = "
"; + for (let i = 0; i < phenotypesHtml.length; i++) { + // Display first 3 phenotypes + if (i < 3) { + html += phenotypesHtml[i]; } else { - result.push(phenotype.id); + html += `... view all phenotypes (${phenotypesHtml.length})`; + break; } } - // Add phenotype status if exists - if (phenotype.status) { - result.push(`(${phenotype.status})`); - } - return `

${result.join(" ")}

`; - }).join(""); - if (value && value.length > 0) { - return ` ${value.length} term${value.length > 1 ? "s" : ""} found`; + html += "
"; + return html; } else { // TODO Think about this - return `
${tooltip}
`; + return `-`; } } - static disorderFormatter(value, row) { - if (value && value.id) { - let idHtml; - const split = value.id.split(":"); - switch (split[0]) { - case "HP": - idHtml = ` - ${value.id} - - `; - break; - case "OMIM": - idHtml = ` - ${value.id} - - `; - break; - default: - idHtml = value.id; - break; - } - if (value.name) { - return `${value.name} (${idHtml})`; - } else { - return `${idHtml}`; + static disorderFormatter(disorders) { + let html = "-"; + if (disorders?.length > 0) { + html = "
"; + for (const disorder of disorders) { + if (disorder?.id) { + // Default value if the disorder ID does not include ':' (source:ID) + let idHtml = disorder.id; + // We try to get a HTTP link + const ontologyLink = BioinfoUtils.getOntologyLink(disorder.id); + if (ontologyLink.startsWith("http")) { + // We have identified the ontology source and created a link + idHtml = `${disorder.id}`; + } + if (disorder.name && disorder.name !== disorder.id) { + html += ` +
+ ${disorder.name} (${idHtml}) +
`; + } else { + html += ` +
+ ${idHtml} +
+ `; + } + } } - } else { - return "-"; + html += "
"; } + return html; } static panelFormatter(panels) { @@ -113,21 +126,38 @@ export default class CatalogGridFormatter { // @param {String} key The property to map onto in case `files` is an array of objects. // @returns {string} html code static fileFormatter(files, extensions, key) { - let results = []; - if (files && files.length > 0) { - if (extensions && extensions.length > 0) { + let bamAndVcfFiles = []; + if (files?.length > 0) { + if (extensions?.length > 0) { files.forEach(file => { const f = key ? file[key] : file; for (const extension of extensions) { if (f.endsWith(extension)) { - results.push(f); + bamAndVcfFiles.push(f); + break; } } }); } else { - results = key ? files.map(file => file?.name) : files; + bamAndVcfFiles = key ? files.map(file => file[key]) : files; + } + + if (bamAndVcfFiles?.length > 0) { + let html = `
`; + for (let i = 0; i < bamAndVcfFiles.length; i++) { + // Display first 3 files + if (i < 3) { + html += ` +
${bamAndVcfFiles[i]}
+ `; + } else { + html += `... view all files (${bamAndVcfFiles.length})`; + break; + } + } + html += "
"; + return html; } - return results.length > 20 ? results.length + " files" : `
    ${results.map(file => `
  • ${file}
    • `).join("")}
`; } else { return "-"; } @@ -145,9 +175,9 @@ export default class CatalogGridFormatter { let result = ""; for (const clinicalAnalysis of clinicalAnalysisArray) { result += ` -
- - ${clinicalAnalysis.id} ${clinicalAnalysis.proband.id === individualId ? "(proband)" : ""} +
+ + ${clinicalAnalysis.id} ${clinicalAnalysis.proband.id === individualId ? "(proband)" : ""}
`; @@ -158,4 +188,43 @@ export default class CatalogGridFormatter { } } + static customAnnotationFormatter(annotationSets, selectedVariableSetId, selectedVariables) { + let html = `
`; + if (selectedVariableSetId) { + // Select the first annotationSet for the selectedVariableSetId. In the future there will be only one. + const annotationSet = annotationSets?.find(v => v.variableSetId === selectedVariableSetId); + if (annotationSet) { + // If 'variables' is not provided we display all of them + const variables = (selectedVariables?.length > 0) ? selectedVariables : Object.keys(annotationSet.annotations).sort(); + for (const variable of variables) { + html += ` +
+ ${variable}: ${annotationSet.annotations[variable]} +
`; + } + } else { + // This entity has not this variableSetId annotated + html += `-`; + } + } else { + if (annotationSets?.length > 0) { + // We display all variableSetIds + for (const annotationSet of annotationSets) { + html += `
${annotationSet.variableSetId}
`; + for (const variable of Object.keys(annotationSet.annotations).sort()) { + html += ` +
+ ${variable}: ${annotationSet.annotations[variable]} +
`; + } + } + } else { + // This entity has not annotations + html += `-`; + } + } + html += `
`; + return html; + } + } diff --git a/src/webcomponents/commons/forms/data-form.js b/src/webcomponents/commons/forms/data-form.js index 28e8275d0a..963c5b5b7f 100644 --- a/src/webcomponents/commons/forms/data-form.js +++ b/src/webcomponents/commons/forms/data-form.js @@ -656,6 +656,8 @@ export default class DataForm extends LitElement { `; } + // ${typeof content === "string" ? UtilsNew.renderHTML(content) : content} + // content.replace(/(<([^>]+)>)/ig, '') return html`
@@ -944,7 +946,7 @@ export default class DataForm extends LitElement { return html`No template provided`; } const content = html` - + ${UtilsNew.renderHTML(this.applyTemplate(element.display.template, data, null, this._getDefaultValue(element)))} `; diff --git a/src/webcomponents/commons/grid-commons.js b/src/webcomponents/commons/grid-commons.js index dd562c9b98..88660d22d1 100644 --- a/src/webcomponents/commons/grid-commons.js +++ b/src/webcomponents/commons/grid-commons.js @@ -17,6 +17,7 @@ import UtilsNew from "../../core/utils-new.js"; import CustomActions from "./custom-actions.js"; import ExtensionsManager from "../extensions-manager.js"; +import CatalogGridFormatter from "./catalog-grid-formatter"; export default class GridCommons { @@ -274,6 +275,16 @@ export default class GridCommons { isColumnVisible(colName) { if (this.config.columns?.length > 0) { + // return this.config.columns.some(column => column === colName || column.split(":")[0] === colName); + + // let found = false; + // for (const column of this.config.columns) { + // if (column === colName || column.split(":")[0] === colName) { + // found = true; + // } + // } + // return found; + return this.config.columns.includes(colName); } else { // Columns are visible by default. @@ -298,6 +309,23 @@ export default class GridCommons { return rowStyle; } + addColumnsFromAnnotations(columns, formatter, gridConfig) { + if (gridConfig?.annotations?.length > 0) { + for (const annotation of gridConfig.annotations) { + const column = { + id: "annotations", + title: annotation.title || "Custom Annotation", + field: "annotationSets", + formatter: annotationSets => formatter(annotationSets, annotation.variableSetId, annotation.variables), + halign: gridConfig.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("annotations") + }; + columns.splice(annotation.position, 0, column); + } + } + return columns; + } + addColumnsFromExtensions(columns, componentId) { if (!this.context?._config?.skipExtensions) { const id = componentId || this.context?.COMPONENT_ID; diff --git a/src/webcomponents/commons/opencga-browser-filter.js b/src/webcomponents/commons/opencga-browser-filter.js index 11d43c593f..1d8023848a 100644 --- a/src/webcomponents/commons/opencga-browser-filter.js +++ b/src/webcomponents/commons/opencga-browser-filter.js @@ -102,6 +102,7 @@ export default class OpencgaBrowserFilter extends LitElement { "genes": "genes.id", "categories": "categories.name", "source": "source.name", + "format": "format", "tags": "tags", "sex": "sex.id", "karyotypicSex": "karyotypicSex", @@ -232,6 +233,7 @@ export default class OpencgaBrowserFilter extends LitElement { case "tool": case "categories": case "genes": + case "format": case "tags": case "source": case "sex": @@ -251,7 +253,6 @@ export default class OpencgaBrowserFilter extends LitElement { break; case "affectationStatus": case "lifeStatus": - case "format": case "bioformat": case "internalVariantIndexStatus": case "internalStatus": diff --git a/src/webcomponents/disease-panel/disease-panel-grid.js b/src/webcomponents/disease-panel/disease-panel-grid.js index c666c28d7a..f20a17cb04 100644 --- a/src/webcomponents/disease-panel/disease-panel-grid.js +++ b/src/webcomponents/disease-panel/disease-panel-grid.js @@ -24,6 +24,7 @@ import LitUtils from "../commons/utils/lit-utils.js"; import "../commons/catalog-browser-grid-config.js"; import "../commons/opencb-grid-toolbar.js"; import ModalUtils from "../commons/modal/modal-utils"; +import CatalogGridFormatter from "../commons/catalog-grid-formatter"; export default class DiseasePanelGrid extends LitElement { @@ -137,7 +138,7 @@ export default class DiseasePanelGrid extends LitElement { renderTable() { // If this.diseasePanel is provided as property we render the array directly - if (this.diseasePanels && this.diseasePanels.length > 0) { + if (this.diseasePanels?.length > 0) { this.renderLocalTable(); } else { this.renderRemoteTable(); @@ -147,7 +148,6 @@ export default class DiseasePanelGrid extends LitElement { renderRemoteTable() { if (this.opencgaSession.opencgaClient && this.opencgaSession?.study?.fqn) { - // const filters = {...this.query}; if (this.lastFilters && JSON.stringify(this.lastFilters) === JSON.stringify(this.query)) { // Abort destroying and creating again the grid. The filters have not changed return; @@ -260,11 +260,6 @@ export default class DiseasePanelGrid extends LitElement { gridContext: this, formatLoadingMessage: () => "
", onClickRow: (row, selectedElement) => this.gridCommons.onClickRow(row.id, row, selectedElement), - // onPageChange: (page, size) => { - // const result = this.gridCommons.onPageChange(page, size); - // this.from = result.from || this.from; - // this.to = result.to || this.to; - // }, onPostBody: data => { // We call onLoadSuccess to select first row this.gridCommons.onLoadSuccess({rows: data, total: data.length}, 1); @@ -285,7 +280,6 @@ export default class DiseasePanelGrid extends LitElement { await this.updateComplete; ModalUtils.show(`${this._prefix}UpdateModal`); break; - case "copy-json": UtilsNew.copyToClipboard(JSON.stringify(row, null, "\t")); break; @@ -361,144 +355,113 @@ export default class DiseasePanelGrid extends LitElement { _getDefaultColumns() { this._columns = [ - [ - { - id: "id", - title: "Panel ID", - field: "id", - rowspan: 2, - colspan: 1, - formatter: (value, row) => { - if (row?.source && row?.source?.project === "PanelApp") { - return String.raw` + { + id: "name", + title: "Panel", + field: "name", + formatter: (name, row) => { + let idLinkHtml = ""; + if (row?.source && row?.source?.project === "PanelApp") { + idLinkHtml = ` ${row?.id ?? "-"} `; - } - return row?.id ?? "-"; - }, - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("id") - }, - { - id: "name", - title: "Name", - field: "name", - rowspan: 2, - colspan: 1, - formatter: (value, row) => row?.name ?? "-", - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("name") - }, - { - id: "disorders", - title: "Disorders", - field: "disorders", - rowspan: 2, - colspan: 1, - formatter: disorders => { - if (disorders?.length > 0) { - const disordersHtml = []; - for (const disorder of disorders) { - let result = disorder.id; - if (disorder.name) { - result += " - " + disorder.name; - } - disordersHtml.push(`
${result}
`); - } - return disordersHtml.join(""); - } - }, - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("disorders") + } + return ` +
+
${name}
+
${idLinkHtml}
+
`; }, - { - id: "stats", - title: "Stats", - field: "stats", - rowspan: 1, - colspan: 3, - align: "center", - visible: true + halign: this._config.header.horizontalAlign, + visible: this.gridCommons.isColumnVisible("name") + }, + // { + // id: "id", + // title: "Panel ID", + // field: "id", + // rowspan: 2, + // colspan: 1, + // formatter: (value, row) => { + // if (row?.source && row?.source?.project === "PanelApp") { + // return String.raw` + // + // ${row?.id ?? "-"} + // `; + // } + // return row?.id ?? "-"; + // }, + // halign: this._config.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("id") + // }, + { + id: "disorders", + title: "Disorders", + field: "disorders", + formatter: disorders => CatalogGridFormatter.disorderFormatter(disorders), + halign: this._config.header.horizontalAlign, + visible: this.gridCommons.isColumnVisible("disorders") + }, + { + id: "stats", + title: "Stats", + field: "stats", + formatter: stats => { + return ` +
+
+ Genes: ${stats.numberOfGenes} +
+
+ Regions: ${stats.numberOfRegions} +
+
+ Variants: ${stats.numberOfVariants} +
+
+ `; }, - { - id: "source", - title: "Source", - field: "source", - rowspan: 2, - colspan: 1, - formatter: (value, row) => { - if (row?.source) { - const {id, author, project, version} = row.source; - let projectAndVersion = ""; - if (project?.toUpperCase() === "PANELAPP") { - projectAndVersion = ` + align: "center", + visible: true + }, + { + id: "source", + title: "Source", + field: "source", + formatter: (value, row) => { + if (row?.source) { + const {id, author, project, version} = row.source; + let projectAndVersion = ""; + if (project?.toUpperCase() === "PANELAPP") { + projectAndVersion = ` ${project} ${version} `; - } else { - projectAndVersion = `${project || ""} ${version}`; - } - return `${author ? `${author} -` : ""} ${projectAndVersion}`; + } else { + projectAndVersion = `${project || ""} ${version}`; } - return "-"; - }, - align: "center", - visible: this.gridCommons.isColumnVisible("source") - }, - ], - [ - { - id: "numberOfGenes", - title: "# genes", - field: "numberOfGenes", - rowspan: 1, - colspan: 1, - formatter: (value, row) => row?.stats?.numberOfGenes ?? "-", - halign: this._config.header.horizontalAlign, - align: "right", - visible: this.gridCommons.isColumnVisible("numberOfGenes") - }, - { - id: "numberOfRegions", - title: "# regions", - field: "numberOfRegions", - rowspan: 1, - colspan: 1, - formatter: (value, row) => row?.stats?.numberOfRegions ?? "-", - halign: this._config.header.horizontalAlign, - align: "right", - visible: this.gridCommons.isColumnVisible("numberOfRegions") + return `${author ? `${author} -` : ""} ${projectAndVersion}`; + } + return "-"; }, - { - id: "numberOfVariants", - title: "# variants", - field: "numberOfVariants", - rowspan: 1, - colspan: 1, - formatter: (value, row) => row?.stats?.numberOfVariants ?? "-", - halign: this._config.header.horizontalAlign, - align: "right", - visible: this.gridCommons.isColumnVisible("numberOfVariants") - } - ] + align: "center", + visible: this.gridCommons.isColumnVisible("source") + }, ]; if (this.opencgaSession && this._config.showActions) { - this._columns[0].push({ + this._columns.push({ id: "actions", title: "Actions", field: "actions", halign: this._config.header.horizontalAlign, - rowspan: 2, - colspan: 1, formatter: (value, row) => `
- +
  • @@ -536,7 +499,6 @@ export default class DiseasePanelGrid extends LitElement { }); } - // _columns = UtilsNew.mergeTable(_columns, this._config.columns || this._config.hiddenColumns, !!this._config.hiddenColumns); this._columns = this.gridCommons.addColumnsFromExtensions(this._columns, this.COMPONENT_ID); return this._columns; } diff --git a/src/webcomponents/disease-panel/disease-panel-summary.js b/src/webcomponents/disease-panel/disease-panel-summary.js index 03b14645bf..3b19b1bb3d 100644 --- a/src/webcomponents/disease-panel/disease-panel-summary.js +++ b/src/webcomponents/disease-panel/disease-panel-summary.js @@ -177,7 +177,7 @@ export default class DiseasePanelSummary extends LitElement { type: "list", display: { contentLayout: "vertical", - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), defaultValue: "N/A" } }, diff --git a/src/webcomponents/family/family-browser.js b/src/webcomponents/family/family-browser.js index 7328de9db9..78b3f003bf 100644 --- a/src/webcomponents/family/family-browser.js +++ b/src/webcomponents/family/family-browser.js @@ -58,23 +58,8 @@ export default class FamilyBrowser extends LitElement { } _init() { - this._prefix = "fb" + UtilsNew.randomString(6); + this._prefix = UtilsNew.randomString(8); this._config = this.getDefaultConfig(); - - // These are for making the queries to server - /* this.facetFields = []; - this.facetRanges = []; - - this.facetFieldsName = []; - this.facetRangeFields = []; - - this.facets = new Set(); - this.facetFilters = []; - - this.facetActive = true; - this.selectedFacet = {}; - this.selectedFacetFormatted = {}; - this.errorState = false;*/ } update(changedProperties) { @@ -227,21 +212,21 @@ export default class FamilyBrowser extends LitElement { placeholder: "HG01879, HG01880, HG01881...", description: "" }, - { - id: "phenotypes", - name: "Phenotype", - placeholder: "Full-text search, e.g. *melanoma*", - description: "" - }, { id: "disorders", name: "Disorders", placeholder: "Intellectual disability,Arthrogryposis...", description: "" }, + { + id: "phenotypes", + name: "Phenotype", + placeholder: "Full-text search, e.g. *melanoma*", + description: "" + }, { id: "date", - name: "Date", + name: "Creation Date", description: "" }, { diff --git a/src/webcomponents/family/family-grid.js b/src/webcomponents/family/family-grid.js index 6cb638a44a..863e1e940f 100644 --- a/src/webcomponents/family/family-grid.js +++ b/src/webcomponents/family/family-grid.js @@ -136,7 +136,7 @@ export default class FamilyGrid extends LitElement { } renderTable() { - if (this.families && this.families?.length > 0) { + if (this.families?.length > 0) { this.renderLocalTable(); } else { this.renderRemoteTable(); @@ -146,7 +146,6 @@ export default class FamilyGrid extends LitElement { renderRemoteTable() { if (this.opencgaSession?.opencgaClient && this.opencgaSession?.study?.fqn) { - // const filters = {...this.query}; if (this.lastFilters && JSON.stringify(this.lastFilters) === JSON.stringify(this.query)) { // Abort destroying and creating again the grid. The filters have not changed return; @@ -385,19 +384,6 @@ export default class FamilyGrid extends LitElement { return result; } - membersFormatter(value, row) { - if (UtilsNew.isNotEmptyArray(value)) { - const members = value.map(member => `

    ${member.id} (${member.sex?.id || member.sex})

    `).join(""); - return ` -     - ${value.length} members found - - `; - } else { - return "No members found"; - } - } - async onActionClick(e, _, row) { const action = e.target.dataset.action?.toLowerCase(); switch (action) { @@ -426,6 +412,7 @@ export default class FamilyGrid extends LitElement { id: "id", title: "Family", field: "id", + formatter: familyId => `
    ${familyId}
    `, sortable: true, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("id") @@ -434,7 +421,27 @@ export default class FamilyGrid extends LitElement { id: "members", title: "Members", field: "members", - formatter: this.membersFormatter.bind(this), + formatter: members => { + let html = "-"; + if (members?.length > 0) { + html = `
    `; + for (let i = 0; i < members.length; i++) { + // Display first 5 members + if (i < 5) { + html += ` +
    + ${members[i].id} (${members[i].sex.id}) +
    + `; + } else { + html += `... view all members (${members.length})`; + break; + } + } + html += "
    "; + } + return html; + }, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("members") }, @@ -442,7 +449,7 @@ export default class FamilyGrid extends LitElement { id: "disorders", title: "Disorders", field: "disorders", - formatter: disorders => disorders.map(disorder => CatalogGridFormatter.disorderFormatter(disorder)).join("
    "), + formatter: disorders => CatalogGridFormatter.disorderFormatter(disorders), halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("disorders") }, @@ -473,6 +480,10 @@ export default class FamilyGrid extends LitElement { }, ]; + if (this._config.annotations?.length > 0) { + this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); + } + if (this.opencgaSession && this._config.showActions) { this._columns.push({ id: "actions", diff --git a/src/webcomponents/file/file-browser.js b/src/webcomponents/file/file-browser.js index 1a253bc2c4..ead936a35d 100644 --- a/src/webcomponents/file/file-browser.js +++ b/src/webcomponents/file/file-browser.js @@ -218,51 +218,40 @@ export default class FileBrowser extends LitElement { type: "string", placeholder: "HG01879, HG01880, HG01881...", description: "" - }, /* - { - id: "path", - name: "Path", - type: "string", - placeholder: "genomes/resources/files/...", - description: "" - },*/ - { - id: "directory", - name: "Directory", - type: "string", - placeholder: "genomes/resources/files/...", - description: "" }, { id: "jobId", name: "Job ID", + type: "string", placeholder: "Job ID ...", - allowedValues: "", - defaultValue: "", description: "", }, { - id: "format", - name: "Format", - type: "category", - multiple: true, - allowedValues: ["VCF", "BCF", "GVCF", "TBI", "BIGWIG", "SAM", "BAM", "BAI", "CRAM", "CRAI", "FASTQ", "FASTA", "PED", "TAB_SEPARATED_VALUES", - "COMMA_SEPARATED_VALUES", "XML", "PROTOCOL_BUFFER", "JSON", "AVRO", "PARQUET", "IMAGE", "PLAIN", "BINARY", "EXECUTABLE", "GZIP", "NONE", "UNKNOWN"], + id: "directory", + name: "Directory", + type: "string", placeholder: "genomes/resources/files/...", description: "" }, { - id: "bioformat", - name: "Bioformat", - type: "category", - multiple: true, - allowedValues: ["MICROARRAY_EXPRESSION_ONECHANNEL_AGILENT", "MICROARRAY_EXPRESSION_ONECHANNEL_AFFYMETRIX", "MICROARRAY_EXPRESSION_ONECHANNEL_GENEPIX", - "MICROARRAY_EXPRESSION_TWOCHANNELS_AGILENT", "MICROARRAY_EXPRESSION_TWOCHANNELS_GENEPIX", "DATAMATRIX_EXPRESSION", "IDLIST", "IDLIST_RANKED", - "ANNOTATION_GENEVSANNOTATION", "OTHER_NEWICK", "OTHER_BLAST", "OTHER_INTERACTION", "OTHER_GENOTYPE", "OTHER_PLINK", "OTHER_VCF", "OTHER_PED", - "VARIANT", "ALIGNMENT", "COVERAGE", "SEQUENCE", "PEDIGREE", "REFERENCE_GENOME", "NONE", "UNKNOWN"], - placeholder: "ALIGNMENT,VARIANT...", + id: "format", + name: "Format", + type: "string", + placeholder: "Format ...", description: "" }, + // { + // id: "bioformat", + // name: "Bioformat", + // type: "category", + // multiple: true, + // allowedValues: ["MICROARRAY_EXPRESSION_ONECHANNEL_AGILENT", "MICROARRAY_EXPRESSION_ONECHANNEL_AFFYMETRIX", "MICROARRAY_EXPRESSION_ONECHANNEL_GENEPIX", + // "MICROARRAY_EXPRESSION_TWOCHANNELS_AGILENT", "MICROARRAY_EXPRESSION_TWOCHANNELS_GENEPIX", "DATAMATRIX_EXPRESSION", "IDLIST", "IDLIST_RANKED", + // "ANNOTATION_GENEVSANNOTATION", "OTHER_NEWICK", "OTHER_BLAST", "OTHER_INTERACTION", "OTHER_GENOTYPE", "OTHER_PLINK", "OTHER_VCF", "OTHER_PED", + // "VARIANT", "ALIGNMENT", "COVERAGE", "SEQUENCE", "PEDIGREE", "REFERENCE_GENOME", "NONE", "UNKNOWN"], + // placeholder: "ALIGNMENT,VARIANT...", + // description: "" + // }, { id: "internalVariantIndexStatus", name: "Variant Index Status", diff --git a/src/webcomponents/file/file-grid.js b/src/webcomponents/file/file-grid.js index a1c87b856a..437a48263d 100644 --- a/src/webcomponents/file/file-grid.js +++ b/src/webcomponents/file/file-grid.js @@ -122,7 +122,6 @@ export default class OpencgaFileGrid extends LitElement { renderRemoteTable() { if (this.opencgaSession?.opencgaClient && this.opencgaSession?.study?.fqn) { - // const filters = {...this.query}; if (this.lastFilters && JSON.stringify(this.lastFilters) === JSON.stringify(this.query)) { // Abort destroying and creating again the grid. The filters have not changed return; @@ -156,7 +155,7 @@ export default class OpencgaFileGrid extends LitElement { limit: params.data.limit, skip: params.data.offset || 0, count: !this.table.bootstrapTable("getOptions").pageNumber || this.table.bootstrapTable("getOptions").pageNumber === 1, - include: "id,name,path,uuid,sampleIds,status,format,bioformat,size,creationDate,modificationDate,internal", + include: "id,name,path,uuid,sampleIds,jobId,status,format,bioformat,size,creationDate,modificationDate,internal", ...this.query }; // When searching by directory we must also show directories @@ -283,14 +282,58 @@ export default class OpencgaFileGrid extends LitElement { id: "name", title: "Name", field: "name", + formatter: (fileName, row) => { + return ` +
    + ${fileName} + /${row.path.replace(row.name, "").replace("//", "/")} +
    `; + }, visible: this.gridCommons.isColumnVisible("name") }, + // { + // id: "directory", + // title: "Directory", + // field: "path", + // formatter: (_, row) => "/" + row.path.replace("/" + row.name, ""), + // visible: this.gridCommons.isColumnVisible("directory") + // }, + { + id: "sampleIds", + title: "Samples", + field: "sampleIds", + formatter: sampleIds => { + let html = "-"; + if (sampleIds?.length > 0) { + html = `
    `; + for (let i = 0; i < sampleIds.length; i++) { + // Display first 3 files + if (i < 3) { + html += `
    ${sampleIds[i]}
    `; + } else { + html += `... view all samples (${sampleIds.length})`; + break; + } + } + html += "
    "; + } + return html; + }, + // halign: this._config.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("sampleIds") + }, { - id: "directory", - title: "Directory", - field: "path", - formatter: (_, row) => "/" + row.path.replace("/" + row.name, ""), - visible: this.gridCommons.isColumnVisible("directory") + id: "jobId", + title: "Job ID", + field: "jobId", + formatter: jobId => { + if (jobId) { + return `
    ${jobId}
    `; + } else { + return "-"; + } + }, + // visible: this.gridCommons.isColumnVisible("jobId") }, { id: "size", @@ -305,15 +348,11 @@ export default class OpencgaFileGrid extends LitElement { field: "format", visible: this.gridCommons.isColumnVisible("format") }, - { - id: "bioformat", - title: "Bioformat", - field: "bioformat", - visible: this.gridCommons.isColumnVisible("bioformat") - }, // { - // title: "Status", - // field: "internal.status.name" + // id: "bioformat", + // title: "Bioformat", + // field: "bioformat", + // visible: this.gridCommons.isColumnVisible("bioformat") // }, { id: "index", @@ -342,8 +381,11 @@ export default class OpencgaFileGrid extends LitElement { }, ]; - if (this.opencgaSession && this._config.showActions) { + if (this._config.annotations?.length > 0) { + this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); + } + if (this.opencgaSession && this._config.showActions) { const downloadUrl = this.opencgaSession?.server? [ this.opencgaSession?.server.host, "/webservices/rest/", diff --git a/src/webcomponents/individual/individual-browser.js b/src/webcomponents/individual/individual-browser.js index 7ec30f5545..17ef792324 100644 --- a/src/webcomponents/individual/individual-browser.js +++ b/src/webcomponents/individual/individual-browser.js @@ -211,16 +211,16 @@ export default class IndividualBrowser extends LitElement { description: "" }, { - id: "phenotypes", - name: "Phenotype", - placeholder: "Full-text search, e.g. *melanoma*", + id: "disorders", + name: "Disorder", + placeholder: "Intellectual disability,Arthrogryposis...", multiple: true, description: "" }, { - id: "disorders", - name: "Disorder", - placeholder: "Intellectual disability,Arthrogryposis...", + id: "phenotypes", + name: "Phenotype", + placeholder: "Full-text search, e.g. *melanoma*", multiple: true, description: "" }, @@ -243,13 +243,13 @@ export default class IndividualBrowser extends LitElement { placeholder: "White caucasian,asiatic...", description: "" }, - { - id: "lifeStatus", - name: "Life Status", - allowedValues: ["ALIVE", "ABORTED", "DECEASED", "UNBORN", "STILLBORN", "MISCARRIAGE", "UNKNOWN"], - multiple: true, - description: "" - }, + // { + // id: "lifeStatus", + // name: "Life Status", + // allowedValues: ["ALIVE", "ABORTED", "DECEASED", "UNBORN", "STILLBORN", "MISCARRIAGE", "UNKNOWN"], + // multiple: true, + // description: "" + // }, { id: "date", name: "Date", diff --git a/src/webcomponents/individual/individual-grid.js b/src/webcomponents/individual/individual-grid.js index caa6b35549..d3aa7912df 100644 --- a/src/webcomponents/individual/individual-grid.js +++ b/src/webcomponents/individual/individual-grid.js @@ -136,7 +136,7 @@ export default class IndividualGrid extends LitElement { renderTable() { // If this.individuals is provided as property we render the array directly - if (this.individuals && this.individuals?.length > 0) { + if (this.individuals?.length > 0) { this.renderLocalTable(); } else { this.renderRemoteTable(); @@ -146,7 +146,6 @@ export default class IndividualGrid extends LitElement { renderRemoteTable() { if (this.opencgaSession?.opencgaClient && this.opencgaSession?.study?.fqn) { - // const filters = {...this.query}; if (this.lastFilters && JSON.stringify(this.lastFilters) === JSON.stringify(this.query)) { // Abort destroying and creating again the grid. The filters have not changed return; @@ -333,12 +332,12 @@ export default class IndividualGrid extends LitElement { for (const sample of row.samples) { let tableCheckboxRow = ""; - // If parent row is checked and there is only one samlpe then it must be selected + // If parent row is checked and there is only one sample then it must be selected if (this.gridContext._config.multiSelection) { let checkedStr = ""; for (const individual of this.gridContext.individuals) { if (individual.id === row.id && row.samples.length === 1) { - // TODO check sampkle has been checked before, we need to store them + // TODO check sample has been checked before, we need to store them checkedStr = "checked"; break; } @@ -387,38 +386,6 @@ export default class IndividualGrid extends LitElement { return sexHtml; } - ethnicityFormatter(value, row) { - return row.ethnicity?.id || row.population?.name || "-"; - } - - fatherFormatter(value, row) { - if (row.father?.id) { - return row.father.id; - } else { - return "-"; - } - } - - motherFormatter(value, row) { - if (row.mother?.id) { - return row.mother.id; - } else { - return "-"; - } - } - - samplesFormatter(value) { - if (value?.length) { - return ` -
      - ${value.map(sample => `
    • ${sample.id}
      • `).join("")} -
    - `; - } else { - return "-"; - } - } - async onActionClick(e, _, row) { const action = e.target.dataset.action?.toLowerCase() || e.detail.action; switch (action) { @@ -446,6 +413,18 @@ export default class IndividualGrid extends LitElement { id: "id", title: "Individual", field: "id", + formatter: (individualId, individual) => { + // Get sex info + let sexHtml = `${individual?.sex ? individual.sex?.id || individual.sex : "Not specified"}`; + if (individual?.karyotypicSex) { + sexHtml += ` (${individual.karyotypicSex?.id || individual.karyotypicSex})`; + } + return ` +
    + ${individualId} + ${sexHtml} +
    `; + }, sortable: true, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("id") @@ -454,7 +433,21 @@ export default class IndividualGrid extends LitElement { id: "samples", title: "Samples", field: "samples", - formatter: this.samplesFormatter, + formatter: samples => { + let html = "-"; + if (samples?.length) { + html = "
    "; + for (const sample of samples) { + html += ` +
    + ${sample.id} + (${sample.somatic ? "S" : "G"}) +
    `; + } + html += `
    `; + } + return html; + }, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("samples") }, @@ -462,7 +455,7 @@ export default class IndividualGrid extends LitElement { id: "father", title: "Father", field: "father.id", - formatter: this.fatherFormatter, + formatter: fatherId => fatherId || "-", halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("father") }, @@ -470,7 +463,7 @@ export default class IndividualGrid extends LitElement { id: "mother", title: "Mother", field: "mother.id", - formatter: this.motherFormatter, + formatter: motherId => motherId || "-", halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("mother") }, @@ -478,10 +471,7 @@ export default class IndividualGrid extends LitElement { id: "disorders", title: "Disorders", field: "disorders", - formatter: disorders => { - const result = disorders?.map(disorder => CatalogGridFormatter.disorderFormatter(disorder)).join("
    "); - return result ? result : "-"; - }, + formatter: CatalogGridFormatter.disorderFormatter, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("disorders") }, @@ -493,6 +483,14 @@ export default class IndividualGrid extends LitElement { halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("phenotypes") }, + // { + // id: "sex", + // title: "Sex (Karyotypic)", + // field: "sex", + // formatter: this.sexFormatter, + // halign: this._config.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("sex") + // }, { id: "caseId", title: "Case ID", @@ -501,42 +499,53 @@ export default class IndividualGrid extends LitElement { halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("caseId") }, - { - id: "sex", - title: "Sex (Karyotypic Sex)", - field: "sex", - formatter: this.sexFormatter, - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("sex") - }, { id: "ethnicity", title: "Ethnicity", field: "ethnicity", - formatter: this.ethnicityFormatter, + formatter: (ethnicity, row) => ethnicity?.id || row.population?.name || "-", halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("ethnicity") }, - { - id: "dateOfBirth", - title: "Date of Birth", - field: "dateOfBirth", - sortable: true, - formatter: CatalogGridFormatter.dateFormatter, - halign: this._config.header.horizontalAlign, - visible: this.gridCommons.isColumnVisible("dateOfBirth") - }, + // { + // id: "dateOfBirth", + // title: "Date of Birth", + // field: "dateOfBirth", + // sortable: true, + // formatter: CatalogGridFormatter.dateFormatter, + // halign: this._config.header.horizontalAlign, + // visible: this.gridCommons.isColumnVisible("dateOfBirth") + // }, { id: "creationDate", title: "Creation Date", field: "creationDate", - sortable: true, formatter: CatalogGridFormatter.dateFormatter, + sortable: true, halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("creationDate") }, ]; + this._config.annotations = [ + { + title: "Cardiology Tests", + position: 6, + variableSetId: "cardiology_tests_checklist", + variables: ["ecg_test", "echo_test"] + }, + // { + // title: "Risk Assessment", + // position: 7, + // variableSetId: "risk_assessment", + // variables: ["vf_cardiac_arrest_events"] + // } + ]; + + if (this._config.annotations?.length > 0) { + this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); + } + if (this.opencgaSession && this._config.showActions) { this._columns.push({ id: "actions", diff --git a/src/webcomponents/individual/individual-view.js b/src/webcomponents/individual/individual-view.js index 9d8c646813..02e48f17ea 100644 --- a/src/webcomponents/individual/individual-view.js +++ b/src/webcomponents/individual/individual-view.js @@ -187,6 +187,20 @@ export default class IndividualView extends LitElement { render: data => html` ${data.id} (UUID: ${data.uuid}) `, + // render: { + // separator: "-", + // items: [ + // { + // text: "${data.id}", + // style: { + // "font-weight": "bold" + // } + // }, + // { + // text: "${data.uuid}", + // } + // ] + // } }, }, { @@ -244,21 +258,32 @@ export default class IndividualView extends LitElement { field: "phenotypes", type: "list", display: { - contentLayout: "bullets", - render: phenotype => { - let id = phenotype.id; - if (phenotype.id.startsWith("HP:")) { - id = html` - - ${phenotype.id} - - `; - } - return html`${phenotype.name} (${id})`; - }, + contentLayout: "vertical", + // render: phenotype => { + // let id = phenotype.id; + // if (phenotype.id.startsWith("HP:")) { + // id = html` + // + // ${phenotype.id} + // + // `; + // } + // return html`${phenotype.name} (${id})`; + // }, + render: phenotype => UtilsNew.renderHTML(CatalogGridFormatter.phenotypesFormatter([phenotype])), defaultValue: "N/A", }, }, + { + title: "Date of Birth", + field: "dateOfBirth", + type: "custom", + display: { + render: dateOfBirth => { + return dateOfBirth ? moment(dateOfBirth, "YYYYMMDDHHmmss").format("D MMM YYYY") : "-"; + } + } + }, { title: "Life Status", field: "lifeStatus", diff --git a/src/webcomponents/job/job-grid.js b/src/webcomponents/job/job-grid.js index 4df45ee5a3..2880c3d9fe 100644 --- a/src/webcomponents/job/job-grid.js +++ b/src/webcomponents/job/job-grid.js @@ -399,53 +399,106 @@ export default class JobGrid extends LitElement { id: "id", title: "Job ID", field: "id", + formatter: (id, row) => { + return ` +
    + ${id} + ${row.outDir?.path ? `/${row.outDir.path.replace(id, "").replace("//", "/")}` : ""} +
    `; + }, visible: this.gridCommons.isColumnVisible("id") }, { id: "toolId", - title: "Analysis Tool ID", + title: "Tool ID", field: "tool.id", + formatter: (toolId, row) => { + return ` +
    + ${toolId} + ${row.tool?.type ? `${row.tool.type}` : ""} +
    `; + }, visible: this.gridCommons.isColumnVisible("toolId") }, { - id: "status", - title: "Status", - field: "internal.status", - formatter: status => UtilsNew.jobStatusFormatter(status), - visible: this.gridCommons.isColumnVisible("status") + id: "params", + title: "Parameters", + field: "params", + formatter: params => { + let html = "-"; + if (UtilsNew.isNotEmpty(params)) { + html = "
    "; + for (const key of Object.keys(params)) { + typeof params[key] + let nestedObject = ""; + if (typeof params[key] === "object") { + for (const subKey of Object.keys(params[key])) { + nestedObject += ` +
    + ${subKey}: ${params[key][subKey]} +
    + `; + } + } + html += ` +
    + ${nestedObject ? ` +
    ${key}:
    +
    + ${nestedObject} +
    ` : + `${key}: ${params[key]}`} +
    `; + } + html += "
    "; + } + return html; + }, + // visible: this.gridCommons.isColumnVisible("params") }, { - id: "priority", - title: "Priority", - field: "priority", - visible: this.gridCommons.isColumnVisible("priority") + id: "output", + title: "Output Files", + field: "output", + formatter: outputFiles => CatalogGridFormatter.fileFormatter(outputFiles, null, "name"), + visible: this.gridCommons.isColumnVisible("output") }, + // { + // id: "priority", + // title: "Priority", + // field: "priority", + // visible: this.gridCommons.isColumnVisible("priority") + // }, { id: "dependsOn", title: "Depends On", field: "dependsOn", - formatter: dependsOn => dependsOn.length > 0 ? ` -
    - ")}"> - ${dependsOn.length} job${dependsOn.length > 1 ? "s" : ""} - -
    - ` : "-", + formatter: dependsOn => { + let html = "-"; + if (dependsOn?.length > 0) { + html = `
    `; + for (let i = 0; i < dependsOn.length; i++) { + // Display first 3 files + if (i < 3) { + html += `
    ${dependsOn[i].id}
    `; + } else { + html += `... view all jobs (${dependsOn.length})`; + break; + } + } + html += "
    "; + } + return html; + }, visible: this.gridCommons.isColumnVisible("dependsOn") }, { - id: "output", - title: "Output Files", - field: "output", - formatter: outputFiles => { - if (outputFiles?.length > 0) { - const fileIds = outputFiles?.map(file => file); - return CatalogGridFormatter.fileFormatter(fileIds, null, "name"); - } else { - return "-"; - } - }, - visible: this.gridCommons.isColumnVisible("output") + id: "status", + title: "Status", + field: "internal.status", + formatter: status => UtilsNew.jobStatusFormatter(status), + visible: this.gridCommons.isColumnVisible("status") }, { id: "executionR", @@ -458,7 +511,7 @@ export default class JobGrid extends LitElement { return ` ${duration.humanize()} `; } }, - visible: this.gridCommons.isColumnVisible("executionR") + // visible: this.gridCommons.isColumnVisible("executionR") }, { id: "executionD", diff --git a/src/webcomponents/sample/sample-grid.js b/src/webcomponents/sample/sample-grid.js index 2747b7bf31..1d3d193e2d 100644 --- a/src/webcomponents/sample/sample-grid.js +++ b/src/webcomponents/sample/sample-grid.js @@ -148,7 +148,6 @@ export default class SampleGrid extends LitElement { renderRemoteTable() { if (this.opencgaSession?.opencgaClient && this.opencgaSession?.study?.fqn) { - // const filters = {...this.query}; if (this.lastFilters && JSON.stringify(this.lastFilters) === JSON.stringify(this.query)) { // Abort destroying and creating again the grid. The filters have not changed return; @@ -175,12 +174,17 @@ export default class SampleGrid extends LitElement { gridContext: this, formatLoadingMessage: () => "
    ", ajax: params => { + const sort = this.table.bootstrapTable("getOptions").sortName ? { + sort: this.table.bootstrapTable("getOptions").sortName, + order: this.table.bootstrapTable("getOptions").sortOrder + } : {}; this.filters = { study: this.opencgaSession.study.fqn, limit: params.data.limit, skip: params.data.offset || 0, count: !this.table.bootstrapTable("getOptions").pageNumber || this.table.bootstrapTable("getOptions").pageNumber === 1, // exclude: "qualityControl", + ...sort, ...this.query }; @@ -190,7 +194,9 @@ export default class SampleGrid extends LitElement { .search(this.filters) .then(sampleResponse => { // Fetch clinical analysis to display the Case ID - const individualIds = sampleResponse.getResults().map(sample => sample.individualId).filter(Boolean).join(","); + const individualIds = sampleResponse.getResults() + .map(sample => sample.individualId) + .filter(Boolean).join(","); if (individualIds) { this.opencgaSession.opencgaClient.clinical() .search( @@ -324,18 +330,36 @@ export default class SampleGrid extends LitElement { id: "id", title: "Sample ID", field: "id", + formatter: (sampleId, sample) => { + let somaticHtml = ""; + if (typeof sample.somatic !== "undefined") { + somaticHtml = sample.somatic ? "Somatic" : "Germline"; + } + return ` +
    + ${sampleId} + ${somaticHtml ? `${somaticHtml}` : nothing} +
    `; + }, + sortable: true, visible: this.gridCommons.isColumnVisible("id") }, { id: "individualId", title: "Individual ID", field: "individualId", - formatter: (value, row) => row?.individualId ?? "-", + formatter: individualId => { + if (individualId) { + return `
    ${individualId}
    `; + } else { + return "-"; + } + }, visible: this.gridCommons.isColumnVisible("individualId") }, { id: "fileIds", - title: "Files (VCF, BAM)", + title: "Files (Only BAM and VCF)", field: "fileIds", formatter: fileIds => CatalogGridFormatter.fileFormatter(fileIds, ["vcf", "vcf.gz", "bam"]), visible: this.gridCommons.isColumnVisible("fileIds") @@ -347,6 +371,12 @@ export default class SampleGrid extends LitElement { formatter: (value, row) => CatalogGridFormatter.caseFormatter(value, row, row.individualId, this.opencgaSession), visible: this.gridCommons.isColumnVisible("caseId") }, + // { + // id: "cohortIds", + // title: "Cohorts", + // field: "cohortIds", + // // visible: this.gridCommons.isColumnVisible("cohorts") + // }, { id: "collection.method", title: "Collection Method", @@ -359,22 +389,27 @@ export default class SampleGrid extends LitElement { field: "processing.preparationMethod", visible: this.gridCommons.isColumnVisible("processing.preparationMethod") }, - { - id: "cellLine", - title: "Cell Line", - field: "cellLine", - formatter: (value, row) => row.somatic ? "Somatic" : "Germline", - visible: this.gridCommons.isColumnVisible("cellLine") - }, + // { + // id: "cellLine", + // title: "Cell Line", + // field: "cellLine", + // formatter: (value, row) => row.somatic ? "Somatic" : "Germline", + // visible: this.gridCommons.isColumnVisible("cellLine") + // }, { id: "creationDate", title: "Creation Date", field: "creationDate", formatter: CatalogGridFormatter.dateFormatter, + sortable: true, visible: this.gridCommons.isColumnVisible("creationDate") }, ]; + if (this._config.annotations?.length > 0) { + this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); + } + if (this.opencgaSession && this._config.showActions) { this._columns.push({ id: "actions", diff --git a/src/webcomponents/sample/sample-view.js b/src/webcomponents/sample/sample-view.js index cdc7f0f5b2..d31f5aa24c 100644 --- a/src/webcomponents/sample/sample-view.js +++ b/src/webcomponents/sample/sample-view.js @@ -23,6 +23,7 @@ import "../commons/forms/data-form.js"; import "../commons/filters/catalog-search-autocomplete.js"; import "../study/annotationset/annotation-set-view.js"; import "../loading-spinner.js"; +import CatalogGridFormatter from "../commons/catalog-grid-formatter"; export default class SampleView extends LitElement { @@ -215,7 +216,7 @@ export default class SampleView extends LitElement { field: "internal.status", type: "custom", display: { - render: field => html`${field?.name} (${UtilsNew.dateFormatter(field?.date)})`, + render: field => `${field?.name} (${UtilsNew.dateFormatter(field?.date)})`, }, }, { @@ -223,7 +224,7 @@ export default class SampleView extends LitElement { field: "creationDate", type: "custom", display: { - render: field => html`${UtilsNew.dateFormatter(field)}`, + render: field => `${UtilsNew.dateFormatter(field)}`, }, }, { @@ -248,17 +249,18 @@ export default class SampleView extends LitElement { display: { defaultValue: "N/A", contentLayout: "bullets", - render: phenotype => { - let id = phenotype?.id; - if (phenotype?.id?.startsWith("HP:")) { - id = html` - - ${phenotype.id} - - `; - } - return phenotype?.name ? html`${phenotype.name} (${id})}` : html`${id}`; - }, + // render: phenotype => { + // let id = phenotype?.id; + // if (phenotype?.id?.startsWith("HP:")) { + // id = html` + // + // ${phenotype.id} + // + // `; + // } + // return phenotype?.name ? html`${phenotype.name} (${id})}` : html`${id}`; + // }, + render: phenotype => UtilsNew.renderHTML(CatalogGridFormatter.phenotypesFormatter([phenotype])), }, }, /* diff --git a/styles/css/global.css b/styles/css/global.css index 65d2340aa1..446c015cc8 100644 --- a/styles/css/global.css +++ b/styles/css/global.css @@ -72,13 +72,13 @@ p { } a:link, a:visited { - /*color: var(--main-color-link);*/ - color: var(--main-bg-color); + color: var(--main-color-link); + /*color: var(--main-bg-color);*/ } a:focus, a:hover { - /*color: var(--main-color-hover);*/ - color: var(--main-bg-color); + color: var(--main-color-hover); + /*color: var(--main-bg-color);*/ text-decoration: none; } From 379b1b712f4b02e33895bcb4e21934a790788858 Mon Sep 17 00:00:00 2001 From: imedina Date: Tue, 24 Oct 2023 00:48:52 +0100 Subject: [PATCH 04/73] Fix and improve grid settings configuration --- .../clients/opencga/opencga-catalog-utils.js | 22 +-- src/core/clients/opencga/opencga-client.js | 133 +++++++----------- src/sites/api/api-app.js | 37 +---- src/sites/iva/iva-app.js | 58 ++++---- .../test-app/clients/opencga-client-mock.js | 22 ++- .../clinical/clinical-analysis-browser.js | 1 - src/webcomponents/cohort/cohort-browser.js | 32 ++--- src/webcomponents/cohort/cohort-grid.js | 9 +- .../commons/catalog-browser-grid-config.js | 16 ++- .../disease-panel/disease-panel-browser.js | 42 +----- .../disease-panel/disease-panel-grid.js | 2 +- src/webcomponents/family/family-browser.js | 59 +------- src/webcomponents/family/family-grid.js | 2 +- src/webcomponents/file/file-browser.js | 83 ++--------- src/webcomponents/file/file-grid.js | 2 +- .../individual/individual-browser.js | 37 +---- .../individual/individual-grid.js | 31 ++-- src/webcomponents/job/job-browser.js | 33 +---- src/webcomponents/job/job-grid.js | 2 +- src/webcomponents/sample/sample-browser.js | 27 +--- src/webcomponents/sample/sample-grid.js | 2 +- .../variant-interpreter-browser-cancer.js | 2 +- .../variant-interpreter-browser-cnv.js | 2 +- .../variant-interpreter-browser-rd.js | 2 +- .../variant-interpreter-browser-template.js | 18 ++- .../variant-interpreter-grid-config.js | 56 +++++--- .../variant-interpreter-grid.js | 65 +-------- .../variant-interpreter-review-primary.js | 24 +++- .../variant/variant-browser-grid.js | 9 +- src/webcomponents/variant/variant-browser.js | 28 ++-- 30 files changed, 274 insertions(+), 584 deletions(-) diff --git a/src/core/clients/opencga/opencga-catalog-utils.js b/src/core/clients/opencga/opencga-catalog-utils.js index b70a341e61..5d3ae68994 100644 --- a/src/core/clients/opencga/opencga-catalog-utils.js +++ b/src/core/clients/opencga/opencga-catalog-utils.js @@ -135,16 +135,22 @@ export default class OpencgaCatalogUtils { } // Update grid configuration of the specified browser - static updateGridConfig(opencgaSession, browserName, newGridConfig) { - const newConfig = { - ...opencgaSession.user.configs?.IVA, - [browserName]: { - ...opencgaSession.user.configs?.IVA[browserName], - grid: newGridConfig, - }, + static updateGridConfig(id = "IVA", opencgaSession, toolId, gridConfig) { + const userGridSettings = { + settings: { + ...opencgaSession.user.configs?.[id]?.settings, + [toolId]: { + ...opencgaSession.user.configs?.[id][toolId], + grid: gridConfig, + }, + } + }; + const newGridConfig = { + ...opencgaSession.user.configs?.[id], + ...userGridSettings }; - return opencgaSession.opencgaClient.updateUserConfigs(newConfig) + return opencgaSession.opencgaClient.updateUserConfig(id, newGridConfig) .then(response => { // Update user configuration in opencgaSession object // eslint-disable-next-line no-param-reassign diff --git a/src/core/clients/opencga/opencga-client.js b/src/core/clients/opencga/opencga-client.js index a3ac9c9962..9e4b5416fc 100644 --- a/src/core/clients/opencga/opencga-client.js +++ b/src/core/clients/opencga/opencga-client.js @@ -32,6 +32,7 @@ import User from "./api/User.js"; import Variant from "./api/Variant.js"; import VariantOperation from "./api/VariantOperation.js"; import {CellBaseClient} from "../cellbase/cellbase-client"; +import UtilsNew from "../../utils-new"; export class OpenCGAClient { @@ -170,14 +171,6 @@ export class OpenCGAClient { return this.clients.get("meta"); } - admin() { - if (!this.clients.has("admin")) { - this.clients.set("admin", new Admin(this._config)); - } - return this.clients.get("admin"); - } - - // Analysis alignments() { if (!this.clients.has("alignments")) { this.clients.set("alignments", new Alignment(this._config)); @@ -213,6 +206,13 @@ export class OpenCGAClient { return this.clients.get("ga4gh"); } + admin() { + if (!this.clients.has("admin")) { + this.clients.set("admin", new Admin(this._config)); + } + return this.clients.get("admin"); + } + /* * Convenient function to create a client from the entity name, this is case insensitive. */ @@ -250,6 +250,8 @@ export class OpenCGAClient { return this.clinical(); case "META": return this.meta(); + case "ADMIN": + return this.admin(); default: throw new Error("Resource not recognized"); } @@ -257,7 +259,8 @@ export class OpenCGAClient { async login(userId, password) { try { - const restResponse = await this.users().login({user: userId, password: password}); + const restResponse = await this.users() + .login({user: userId, password: password}); // TODO remove userId and token from config and move it to session this._config.userId = userId; @@ -265,10 +268,9 @@ export class OpenCGAClient { // Check if cookies being used if (this._config.cookies.active) { - this.setCookies(userId, this._config.token); + this.#setCookies(userId, this._config.token); } this.clients.forEach(client => client.setToken(this._config.token)); - // this.createSession(); return restResponse; } catch (restResponse) { console.error(restResponse); @@ -276,33 +278,24 @@ export class OpenCGAClient { } } - setCookies(userId, token) { - if (userId && token) { - // eslint-disable-next-line no-undef - Cookies.set(this._config.cookies.prefix + "_userId", userId, {secure: true}); - // eslint-disable-next-line no-undef - Cookies.set(this._config.cookies.prefix + "_sid", this._config.token, {secure: true}); - } else { - // eslint-disable-next-line no-undef - Cookies.expire(this._config.cookies.prefix + "_userId"); - // eslint-disable-next-line no-undef - Cookies.expire(this._config.cookies.prefix + "_sid"); - } - } - - // refresh only works if cookies are enabled + // Refresh only works if cookies are enabled async refresh() { const userId = this._config.userId; - const response = await this.users().login({refreshToken: this._config.token}); + const response = await this.users() + .login({refreshToken: this._config.token}); this._config.token = response.getResult(0).token; - await this.updateUserConfigs({ - lastAccess: new Date().getTime() - }); + // Nacho (22/10/2023): We should not update 'lastAccess' date when token is updated automatically + // await this.updateUserConfig({ + // lastAccess: new Date().getTime() + // }); + // Update cookie with the new token if (this._config.cookies.active) { - this.setCookies(userId, this._config.token); + this.#setCookies(userId, this._config.token); } + + // Update existing clients with the new token this.clients.forEach(client => client.setToken(this._config.token)); return response; } @@ -315,11 +308,25 @@ export class OpenCGAClient { // Remove cookies if (this._config.cookies.active) { - this.setCookies(); + this.#setCookies(); } return Promise.resolve(); } + #setCookies(userId, token) { + if (userId && token) { + // eslint-disable-next-line no-undef + Cookies.set(this._config.cookies.prefix + "_userId", userId, {secure: true}); + // eslint-disable-next-line no-undef + Cookies.set(this._config.cookies.prefix + "_sid", this._config.token, {secure: true}); + } else { + // eslint-disable-next-line no-undef + Cookies.expire(this._config.cookies.prefix + "_userId"); + // eslint-disable-next-line no-undef + Cookies.expire(this._config.cookies.prefix + "_sid"); + } + } + // Creates and return an anonymous session object, it is a sync function. createAnonymousSession() { const opencgaSession = {}; @@ -342,14 +349,12 @@ export class OpenCGAClient { * opencgaClient object itself. * @returns {Promise} */ - // TODO urgent refactor createSession() { const _this = this; return new Promise((resolve, reject) => { // check that a session exists // TODO should we check the session has not expired? if (_this._config.token) { - // _this._notifySessionEvent("signingIn", "Fetching User data"); _this.users().info(_this._config.userId) .then(async response => { console.log("Creating session"); @@ -366,8 +371,7 @@ export class OpenCGAClient { // serverVersion: _this._config.serverVersion, }; session.opencgaClient = _this; - // _this._notifySessionEvent("signingIn", "Updating User config"); - const userConfig = await this.updateUserConfigs({ + const userConfig = await this.updateUserConfig("IVA", { ...session.user.configs.IVA, lastAccess: new Date().getTime() }); @@ -382,7 +386,6 @@ export class OpenCGAClient { // Fetch authorised Projects and Studies console.log("Fetching projects and studies"); - // _this._notifySessionEvent("signingIn", "Fetching Projects and Studies"); _this.projects() .search({limit: 100}) .then(async function (response) { @@ -401,7 +404,6 @@ export class OpenCGAClient { for (const study of project.studies) { // We need to store the user permission for the all the studies fetched console.log("Fetching user permissions"); - // _this._notifySessionEvent("signingIn", "Fetching User permissions"); let acl = null; const admins = study.groups.find(g => g.id === "@admins"); @@ -414,7 +416,6 @@ export class OpenCGAClient { // Fetch all the cohort console.log("Fetching cohorts"); - // _this._notifySessionEvent("signingIn", "Fetching Cohorts"); const cohortsResponse = await _this.cohorts() .search({study: study.fqn, exclude: "samples", limit: 100}); study.cohorts = cohortsResponse.responses[0].results @@ -456,7 +457,7 @@ export class OpenCGAClient { version: project.cellbase.version.startsWith("v") ? project.cellbase.version : "v" + project.cellbase.version, species: "hsapiens", }); - // https://ws.zettagenomics.com/cellbase/webservices/rest/v5.1/meta/hsapiens/dataReleases + // Call to: https://ws.zettagenomics.com/cellbase/webservices/rest/v5.1/meta/hsapiens/dataReleases const promise = cellbaseClient.getMeta("dataReleases"); cellbaseSourcesPromises.push(promise); indexesMap.push(i); @@ -477,7 +478,6 @@ export class OpenCGAClient { // Fetch the Disease Panels for each Study console.log("Fetching disease panels"); - // _this._notifySessionEvent("signingIn", "Fetching Disease Panels"); const panelPromises = []; for (const study of studies) { const promise = _this.panels().search({ @@ -517,29 +517,6 @@ export class OpenCGAClient { }); } - // async _fetchCellBaseSources(project) { - // if (project.cellbase?.url && project.cellbase.version !== "v5" && project.cellbase.version !== "v4") { - // const cellbaseClient = new CellBaseClient({ - // host: project.cellbase.url, - // version: project.cellbase.version.startsWith("v") ? project.cellbase.version : "v" + project.cellbase.version, - // species: "hsapiens", - // }); - // console.log(project.cellbase) - // // https://ws.zettagenomics.com/cellbase/webservices/rest/v5.1/meta/hsapiens/dataReleases - // return cellbaseClient.getMeta("dataReleases"); - // } - // } - - _notifySessionEvent(id, message) { - globalThis.dispatchEvent(new CustomEvent(id, - { - detail: { - value: message - } - } - )); - } - getConfig() { return this._config; } @@ -557,22 +534,18 @@ export class OpenCGAClient { return this.users().configs(this._config.userId, "IVA"); } - updateUserConfigs(data) { - // TODO remove this nasty nested bug fix - if (data?.IVA) { - delete data.IVA; - } - const userIvaConfig = this.users().updateConfigs(this._config.userId, { - id: "IVA", - configuration: { - ...data - } - }); - // Update opencgaSession object - // if (opencgaSession?.user?.configs) { - // opencgaSession.user.configs.IVA = userIvaConfig.responses[0].results[0]; - // } - return userIvaConfig; + // Nacho (22/10/2023): This method needs a config ID and VALUE now, + // different sites or apps may need to store configurations. + updateUserConfig(id, newConfig) { + return this.users() + .updateConfigs(this._config.userId, { + id: id, + configuration: { + ...newConfig, + date: UtilsNew.getDatetime(), + version: "v2" + } + }); } } diff --git a/src/sites/api/api-app.js b/src/sites/api/api-app.js index 9d30e7ef64..a1c4e8bb15 100644 --- a/src/sites/api/api-app.js +++ b/src/sites/api/api-app.js @@ -260,9 +260,9 @@ class ApiApp extends LitElement { console.error(e); this.notificationManager.error("Error creating session", e.message); }).finally(() => { - this.signingIn = false; - this.requestUpdate(); - }); + this.signingIn = false; + this.requestUpdate(); + }); } // TODO turn this into a Promise @@ -343,35 +343,6 @@ class ApiApp extends LitElement { window.clearInterval(this.intervalCheckSession); } - async saveLastStudy(newStudy) { - const userConfig = await this.opencgaClient.updateUserConfigs({ - ...this.opencgaSession.user.configs.IVA, - lastStudy: newStudy.fqn - }); - this.opencgaSession.user.configs.IVA = userConfig.responses[0].results[0]; - } - - onUrlChange(e) { - let hashFrag = e.detail.id; - if (UtilsNew.isNotUndefined(this.opencgaSession.project) && UtilsNew.isNotEmpty(this.opencgaSession.project.alias)) { - - hashFrag += "/" + this.opencgaSession.project.alias; - if (UtilsNew.isNotUndefined(this.opencgaSession.study) && UtilsNew.isNotEmpty(this.opencgaSession.study.alias)) { - hashFrag += "/" + this.opencgaSession.study.alias; - } - } - - const myQueryParams = []; - for (const key in e.detail.query) { - myQueryParams.push(key + "=" + e.detail.query[key]); - } - if (myQueryParams.length > 0) { - hashFrag += `?${myQueryParams.join("&")}`; - } - - window.location.hash = hashFrag; - } - checkSessionActive() { // We check if refresh token has updated session id cookie // let sid = Cookies.get(this.config.opencga.cookie.prefix + "_sid"); @@ -572,7 +543,7 @@ class ApiApp extends LitElement { if (studyFound) { // Update the lastStudy in config iff has changed - this.opencgaClient.updateUserConfigs({...this.opencgaSession.user.configs, lastStudy: studyFqn}); + this.opencgaClient.updateUserConfig("IVA", {...this.opencgaSession.user.configs["IVA"], lastStudy: studyFqn}); // Refresh the session this.opencgaSession = {...this.opencgaSession}; diff --git a/src/sites/iva/iva-app.js b/src/sites/iva/iva-app.js index d76fb5c4f8..d29e90d85b 100644 --- a/src/sites/iva/iva-app.js +++ b/src/sites/iva/iva-app.js @@ -659,34 +659,34 @@ class IvaApp extends LitElement { window.clearInterval(this.intervalCheckSession); } - async saveLastStudy(newStudy) { - const userConfig = await this.opencgaClient.updateUserConfigs({ - ...this.opencgaSession.user.configs.IVA, - lastStudy: newStudy.fqn - }); - this.opencgaSession.user.configs.IVA = userConfig.responses[0].results[0]; - } - - onUrlChange(e) { - let hashFrag = e.detail.id; - if (UtilsNew.isNotUndefined(this.opencgaSession.project) && UtilsNew.isNotEmpty(this.opencgaSession.project.alias)) { - - hashFrag += "/" + this.opencgaSession.project.alias; - if (UtilsNew.isNotUndefined(this.opencgaSession.study) && UtilsNew.isNotEmpty(this.opencgaSession.study.alias)) { - hashFrag += "/" + this.opencgaSession.study.alias; - } - } - - const myQueryParams = []; - for (const key in e.detail.query) { - myQueryParams.push(key + "=" + e.detail.query[key]); - } - if (myQueryParams.length > 0) { - hashFrag += `?${myQueryParams.join("&")}`; - } - - window.location.hash = hashFrag; - } + // async saveLastStudy(newStudy) { + // const userConfig = await this.opencgaClient.updateUserConfig({ + // ...this.opencgaSession.user.configs.IVA, + // lastStudy: newStudy.fqn + // }); + // this.opencgaSession.user.configs.IVA = userConfig.responses[0].results[0]; + // } + + // onUrlChange(e) { + // let hashFrag = e.detail.id; + // if (UtilsNew.isNotUndefined(this.opencgaSession.project) && UtilsNew.isNotEmpty(this.opencgaSession.project.alias)) { + // + // hashFrag += "/" + this.opencgaSession.project.alias; + // if (UtilsNew.isNotUndefined(this.opencgaSession.study) && UtilsNew.isNotEmpty(this.opencgaSession.study.alias)) { + // hashFrag += "/" + this.opencgaSession.study.alias; + // } + // } + // + // const myQueryParams = []; + // for (const key in e.detail.query) { + // myQueryParams.push(key + "=" + e.detail.query[key]); + // } + // if (myQueryParams.length > 0) { + // hashFrag += `?${myQueryParams.join("&")}`; + // } + // + // window.location.hash = hashFrag; + // } // TODO: we should move this code to an OpenCGA Utils checkSessionActive() { @@ -951,7 +951,7 @@ class IvaApp extends LitElement { if (studyFound) { // Update the lastStudy in config iff has changed - this.opencgaClient.updateUserConfigs({...this.opencgaSession.user.configs, lastStudy: studyFqn}); + this.opencgaClient.updateUserConfig("IVA", {...this.opencgaSession.user.configs["IVA"], lastStudy: studyFqn}); // Refresh the session and update cellbase this.opencgaSession = {...this.opencgaSession}; diff --git a/src/sites/test-app/clients/opencga-client-mock.js b/src/sites/test-app/clients/opencga-client-mock.js index 6f89c5db0b..2f9d7f606d 100644 --- a/src/sites/test-app/clients/opencga-client-mock.js +++ b/src/sites/test-app/clients/opencga-client-mock.js @@ -220,18 +220,16 @@ export class OpenCGAClientMock { return this.users().configs(this._config.userId, "IVA"); } - updateUserConfigs(data) { - // TODO remove this nasty nested bug fix - if (data?.IVA) { - delete data.IVA; - } - const userIvaConfig = this.users().updateConfigs(this._config.userId, { - id: "IVA", - configuration: { - ...data - } - }); - return userIvaConfig; + // Nacho (22/10/2023): This method needs a config ID and VALUE now, + // different sites or apps may need to store configurations. + updateUserConfig(id, newConfig) { + return this.users() + .updateConfigs(this._config.userId, { + id: id, + configuration: { + ...newConfig + } + }); } } diff --git a/src/webcomponents/clinical/clinical-analysis-browser.js b/src/webcomponents/clinical/clinical-analysis-browser.js index bd6cdae332..7d522e2678 100644 --- a/src/webcomponents/clinical/clinical-analysis-browser.js +++ b/src/webcomponents/clinical/clinical-analysis-browser.js @@ -281,7 +281,6 @@ export default class ClinicalAnalysisBrowser extends LitElement { } }; } - } customElements.define("clinical-analysis-browser", ClinicalAnalysisBrowser); diff --git a/src/webcomponents/cohort/cohort-browser.js b/src/webcomponents/cohort/cohort-browser.js index b6fc545b10..65873140c4 100644 --- a/src/webcomponents/cohort/cohort-browser.js +++ b/src/webcomponents/cohort/cohort-browser.js @@ -49,6 +49,7 @@ export default class CohortBrowser extends LitElement { } _init() { + this.TOOL_ID = "COHORT_BROWSER"; this._config = this.getDefaultConfig(); } @@ -60,37 +61,27 @@ export default class CohortBrowser extends LitElement { } settingsObserver() { - this._config = {...this.getDefaultConfig()}; - // merge filter list, canned filters, detail tabs + this._config = this.getDefaultConfig(); + + // Apply Study settings if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this._config.filter.result.grid = {...this._config.filter.result.grid, ...this.settings.table}; - // } + UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings.table }); - // if (this.settings?.table?.toolbar) { - // this._config.filter.result.grid.toolbar = {...this._config.filter.result.grid.toolbar, ...this.settings.table.toolbar}; - // } UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings.table?.toolbar }); - // if (this.opencgaSession.user?.configs?.IVA?.cohortBrowserCatalog?.grid) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.opencgaSession.user.configs.IVA.cohortBrowserCatalog.grid, - // }; - // } - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.cohortBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -155,13 +146,7 @@ export default class CohortBrowser extends LitElement { .query="${params.facetQuery}" .data="${params.facetResults}"> ` - }/* - { - id: "comparator-tab", - name: "Comparator", - icon: "fas fa-clone", - disabled: true - }*/ + } ], filter: { searchButton: false, @@ -362,7 +347,6 @@ export default class CohortBrowser extends LitElement { } }; } - } customElements.define("cohort-browser", CohortBrowser); diff --git a/src/webcomponents/cohort/cohort-grid.js b/src/webcomponents/cohort/cohort-grid.js index 0491c57cf3..65c1257ce0 100644 --- a/src/webcomponents/cohort/cohort-grid.js +++ b/src/webcomponents/cohort/cohort-grid.js @@ -89,7 +89,7 @@ export default class CohortGrid extends LitElement { // Config for the grid toolbar this.toolbarConfig = { - toolId: "cohortBrowser", + toolId: "COHORT_BROWSER", resource: "COHORT", columns: this._getDefaultColumns(), create: { @@ -315,13 +315,6 @@ export default class CohortGrid extends LitElement { halign: this._config.header.horizontalAlign, visible: this.gridCommons.isColumnVisible("creationDate") }, - // { - // id: "type", - // title: "Type", - // field: "type", - // halign: this._config.header.horizontalAlign, - // visible: this.gridCommons.isColumnVisible("type") - // } ]; if (this._config.annotations?.length > 0) { diff --git a/src/webcomponents/commons/catalog-browser-grid-config.js b/src/webcomponents/commons/catalog-browser-grid-config.js index f2e115fb0b..9b966dd04b 100644 --- a/src/webcomponents/commons/catalog-browser-grid-config.js +++ b/src/webcomponents/commons/catalog-browser-grid-config.js @@ -106,7 +106,7 @@ export default class CatalogBrowserGridConfig extends LitElement { } }); } else { - // it just one head: get a list of object + // it just one head: get a list of object columnsHead.forEach(column => { addColumnData(column); }); @@ -135,10 +135,18 @@ export default class CatalogBrowserGridConfig extends LitElement { } async onSubmit() { - // Update user configuration - // console.log("onGridConfigSave", this, "values", e.detail.value.columns); try { - await OpencgaCatalogUtils.updateGridConfig(this.opencgaSession, this.toolId, this.config); + // Update user configuration + await OpencgaCatalogUtils.updateGridConfig( + "IVA", + this.opencgaSession, + this.toolId, + { + pageSize: this.config.pageSize, + columns: this.config.columns, + highlights: this.config.highlights, + } + ); LitUtils.dispatchCustomEvent(this, "settingsUpdate"); NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_SUCCESS, { diff --git a/src/webcomponents/disease-panel/disease-panel-browser.js b/src/webcomponents/disease-panel/disease-panel-browser.js index 5aaed0ee19..22a63d96b2 100644 --- a/src/webcomponents/disease-panel/disease-panel-browser.js +++ b/src/webcomponents/disease-panel/disease-panel-browser.js @@ -17,8 +17,6 @@ import {LitElement, html} from "lit"; import UtilsNew from "../../core/utils-new.js"; import {construction} from "../commons/under-construction.js"; -import OpencgaCatalogUtils from "../../core/clients/opencga/opencga-catalog-utils.js"; -import NotificationUtils from "../commons/utils/notification-utils.js"; import "./disease-panel-gene-view.js"; import "./disease-panel-region-view.js"; import "./disease-panel-summary.js"; @@ -58,7 +56,8 @@ export default class DiseasePanelBrowser extends LitElement { } _init() { - this._config = this.getDefautlConfig(); + this.TOOL_ID = "DISEASE_PANEL_BROWSER"; + this._config = this.getDefaultConfig(); } update(changedProperties) { @@ -70,50 +69,29 @@ export default class DiseasePanelBrowser extends LitElement { settingsObserver() { this._config = { - ...this.getDefautlConfig(), + ...this.getDefaultConfig(), ...(this.config || {}), }; + // Apply Study settings if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.settings.table, - // }; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings?.table }); - // if (this.settings?.table?.toolbar) { - // this._config.filter.result.grid.toolbar = { - // ...this._config.filter.result.grid.toolbar, - // ...this.settings.table.toolbar, - // }; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings?.table?.toolbar }); - - // if (this.opencgaSession.user?.configs?.IVA?.diseasePanelBrowser?.grid) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.opencgaSession.user.configs.IVA.diseasePanelBrowser.grid, - // }; - // } - - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.diseasePanelBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -139,7 +117,7 @@ export default class DiseasePanelBrowser extends LitElement { `; } - getDefautlConfig() { + getDefaultConfig() { return { title: "Disease Panel Browser", icon: "fab fa-searchengin", @@ -245,11 +223,6 @@ export default class DiseasePanelBrowser extends LitElement { field: "tags", resource: "DISEASE_PANEL" }, - // { - // id: "date", - // name: "Date", - // description: "" - // } ] } ], @@ -315,7 +288,6 @@ export default class DiseasePanelBrowser extends LitElement { }, }; } - } customElements.define("disease-panel-browser", DiseasePanelBrowser); diff --git a/src/webcomponents/disease-panel/disease-panel-grid.js b/src/webcomponents/disease-panel/disease-panel-grid.js index f20a17cb04..7fbb61da2c 100644 --- a/src/webcomponents/disease-panel/disease-panel-grid.js +++ b/src/webcomponents/disease-panel/disease-panel-grid.js @@ -89,7 +89,7 @@ export default class DiseasePanelGrid extends LitElement { // Config for the grid toolbar this.toolbarConfig = { - toolId: "diseasePanelBrowser", + toolId: "DISEASE_PANEL_BROWSER", resource: "DISEASE_PANEL", columns: this._getDefaultColumns(), create: { diff --git a/src/webcomponents/family/family-browser.js b/src/webcomponents/family/family-browser.js index 78b3f003bf..61c8ee0495 100644 --- a/src/webcomponents/family/family-browser.js +++ b/src/webcomponents/family/family-browser.js @@ -16,8 +16,6 @@ import {LitElement, html} from "lit"; import UtilsNew from "../../core/utils-new.js"; -import OpencgaCatalogUtils from "../../core/clients/opencga/opencga-catalog-utils.js"; -import NotificationUtils from "../commons/utils/notification-utils.js"; import "../commons/opencga-browser.js"; import "../commons/facet-filter.js"; import "./family-grid.js"; @@ -45,12 +43,6 @@ export default class FamilyBrowser extends LitElement { query: { type: Object }, - /* facetQuery: { - type: Object - }, - selectedFacet: { - type: Object - },*/ settings: { type: Object } @@ -58,15 +50,14 @@ export default class FamilyBrowser extends LitElement { } _init() { - this._prefix = UtilsNew.randomString(8); + this.TOOL_ID = "FAMILY_BROWSER"; this._config = this.getDefaultConfig(); } update(changedProperties) { - if (changedProperties.has("settings") || changedProperties.has("config")) { + if (changedProperties.has("settings")) { this.settingsObserver(); } - super.update(changedProperties); } @@ -78,42 +69,20 @@ export default class FamilyBrowser extends LitElement { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.settings.table, - // }; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings.table }); - // if (this.settings?.table?.toolbar) { - // this._config.filter.result.grid.toolbar = { - // ...this._config.filter.result.grid.toolbar, - // ...this.settings.table.toolbar, - // }; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings.table?.toolbar }); - // Apply user configuration - // if (this.opencgaSession.user?.configs?.IVA?.familyBrowserCatalog?.grid) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.opencgaSession.user.configs.IVA.familyBrowserCatalog.grid, - // }; - // } - - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.familyBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -185,11 +154,6 @@ export default class FamilyBrowser extends LitElement { `, } - /* - { - id: "comparator-tab", - name: "Comparator" - }*/ ], filter: { searchButton: false, @@ -237,17 +201,7 @@ export default class FamilyBrowser extends LitElement { ] } ], - examples: [ - { - id: "Full", - query: { - id: "lp", - members: "hg", - phenotypes: "melanoma", - creationDate: "2020" - } - } - ], + examples: [], activeFilters: { complexFields: [ {id: "annotation", separator: ";"}, @@ -270,7 +224,6 @@ export default class FamilyBrowser extends LitElement { id: "family-view", name: "Overview", active: true, - // visible: render: (family, active, opencgaSession) => html` html` + render: (family, active) => html` diff --git a/src/webcomponents/family/family-grid.js b/src/webcomponents/family/family-grid.js index 863e1e940f..eac08e0255 100644 --- a/src/webcomponents/family/family-grid.js +++ b/src/webcomponents/family/family-grid.js @@ -88,7 +88,7 @@ export default class FamilyGrid extends LitElement { // Config for the grid toolbar this.toolbarConfig = { - toolId: "familyBrowser", + toolId: "FAMILY_BROWSER", resource: "FAMILY", columns: this._getDefaultColumns(), create: { diff --git a/src/webcomponents/file/file-browser.js b/src/webcomponents/file/file-browser.js index ead936a35d..1520469915 100644 --- a/src/webcomponents/file/file-browser.js +++ b/src/webcomponents/file/file-browser.js @@ -17,8 +17,6 @@ import {LitElement, html} from "lit"; import UtilsNew from "../../core/utils-new.js"; -import OpencgaCatalogUtils from "../../core/clients/opencga/opencga-catalog-utils.js"; -import NotificationUtils from "../commons/utils/notification-utils.js"; import "./file-preview.js"; import "./file-view.js"; import "../commons/opencga-browser.js"; @@ -48,12 +46,6 @@ export default class FileBrowser extends LitElement { query: { type: Object }, - /* facetQuery: { - type: Object - }, - selectedFacet: { - type: Object - },*/ settings: { type: Object } @@ -61,33 +53,10 @@ export default class FileBrowser extends LitElement { } _init() { - this._prefix = "fb" + UtilsNew.randomString(6); - - // These are for making the queries to server - /* this.facetFields = []; - this.facetRanges = []; - - this.facetFieldsName = []; - this.facetRangeFields = []; - - this.facets = new Set(); - this.facetFilters = []; - - this.facetActive = true; - this.selectedFacet = {}; - this.selectedFacetFormatted = {}; - this.errorState = false;*/ - + this.TOOL_ID = "FILE_BROWSER"; this._config = this.getDefaultConfig(); } - // connectedCallback() { - // super.connectedCallback(); - // this._config = {...this.getDefaultConfig(), ...this.config}; - // } - - // NOTE turn updated into update here reduces the number of remote requests from 2 to 1 as in the grid components propertyObserver() - // is executed twice in case there is external settings update(changedProperties) { if (changedProperties.has("settings")) { this.settingsObserver(); @@ -96,38 +65,27 @@ export default class FileBrowser extends LitElement { } settingsObserver() { - this._config = {...this.getDefaultConfig()}; - // merge filter list, canned filters, detail tabs + this._config = this.getDefaultConfig(); + + // Apply Study settings if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this._config.filter.result.grid = {...this._config.filter.result.grid, ...this.settings.table}; - // } + UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings.table }); - // if (this.settings?.table?.toolbar) { - // this._config.filter.result.grid.toolbar = {...this._config.filter.result.grid.toolbar, ...this.settings.table.toolbar}; - // } UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings.table?.toolbar }); - // if (this.opencgaSession.user?.configs?.IVA?.fileBrowserCatalog?.grid) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.opencgaSession.user.configs?.IVA?.fileBrowserCatalog.grid, - // }; - // } - - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.fileBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -240,18 +198,6 @@ export default class FileBrowser extends LitElement { placeholder: "Format ...", description: "" }, - // { - // id: "bioformat", - // name: "Bioformat", - // type: "category", - // multiple: true, - // allowedValues: ["MICROARRAY_EXPRESSION_ONECHANNEL_AGILENT", "MICROARRAY_EXPRESSION_ONECHANNEL_AFFYMETRIX", "MICROARRAY_EXPRESSION_ONECHANNEL_GENEPIX", - // "MICROARRAY_EXPRESSION_TWOCHANNELS_AGILENT", "MICROARRAY_EXPRESSION_TWOCHANNELS_GENEPIX", "DATAMATRIX_EXPRESSION", "IDLIST", "IDLIST_RANKED", - // "ANNOTATION_GENEVSANNOTATION", "OTHER_NEWICK", "OTHER_BLAST", "OTHER_INTERACTION", "OTHER_GENOTYPE", "OTHER_PLINK", "OTHER_VCF", "OTHER_PED", - // "VARIANT", "ALIGNMENT", "COVERAGE", "SEQUENCE", "PEDIGREE", "REFERENCE_GENOME", "NONE", "UNKNOWN"], - // placeholder: "ALIGNMENT,VARIANT...", - // description: "" - // }, { id: "internalVariantIndexStatus", name: "Variant Index Status", @@ -342,8 +288,7 @@ export default class FileBrowser extends LitElement { } }, aggregation: { - default: ["creationYear>>creationMonth", "format", "bioformat", "format>>bioformat", "status", "size[0..214748364800]:10737418240", "numSamples[0..10]:1"], - // default: ["type>>size[0..214748364800]:10737418240", "format>>avg(size)", "release"], + default: ["creationYear>>creationMonth", "format", "status", "size[0..214748364800]:10737418240", "numSamples[0..10]:1"], render: params => html ` ` } - /* - { - id: "comparator-tab", - name: "Comparator" - }*/ ], filter: { searchButton: false, @@ -243,13 +227,6 @@ export default class IndividualBrowser extends LitElement { placeholder: "White caucasian,asiatic...", description: "" }, - // { - // id: "lifeStatus", - // name: "Life Status", - // allowedValues: ["ALIVE", "ABORTED", "DECEASED", "UNBORN", "STILLBORN", "MISCARRIAGE", "UNKNOWN"], - // multiple: true, - // description: "" - // }, { id: "date", name: "Date", diff --git a/src/webcomponents/individual/individual-grid.js b/src/webcomponents/individual/individual-grid.js index d3aa7912df..3f54bc226c 100644 --- a/src/webcomponents/individual/individual-grid.js +++ b/src/webcomponents/individual/individual-grid.js @@ -88,7 +88,7 @@ export default class IndividualGrid extends LitElement { // Config for the grid toolbar this.toolbarConfig = { - toolId: "individualBrowser", + toolId: "INDIVIDUAL_BROWSER", resource: "INDIVIDUAL", columns: this._getDefaultColumns(), create: { @@ -527,21 +527,20 @@ export default class IndividualGrid extends LitElement { }, ]; - this._config.annotations = [ - { - title: "Cardiology Tests", - position: 6, - variableSetId: "cardiology_tests_checklist", - variables: ["ecg_test", "echo_test"] - }, - // { - // title: "Risk Assessment", - // position: 7, - // variableSetId: "risk_assessment", - // variables: ["vf_cardiac_arrest_events"] - // } - ]; - + // Example of custom annotation configuration: + // this._config.annotations = [ + // { + // title: "Cardiology Tests", + // position: 6, + // variableSetId: "cardiology_tests_checklist", + // variables: ["ecg_test", "echo_test"] + // }, + // { + // title: "Risk Assessment", + // position: 7, + // variableSetId: "risk_assessment", + // } + // ]; if (this._config.annotations?.length > 0) { this.gridCommons.addColumnsFromAnnotations(this._columns, CatalogGridFormatter.customAnnotationFormatter, this._config); } diff --git a/src/webcomponents/job/job-browser.js b/src/webcomponents/job/job-browser.js index 8267b69a24..b33768819c 100644 --- a/src/webcomponents/job/job-browser.js +++ b/src/webcomponents/job/job-browser.js @@ -16,8 +16,6 @@ import {LitElement, html} from "lit"; import UtilsNew from "../../core/utils-new.js"; -import OpencgaCatalogUtils from "../../core/clients/opencga/opencga-catalog-utils.js"; -import NotificationUtils from "../commons/utils/notification-utils.js"; import "../commons/opencga-browser.js"; import "../commons/opencb-facet-results.js"; import "../commons/facet-filter.js"; @@ -48,12 +46,6 @@ export default class JobBrowser extends LitElement { query: { type: Object, }, - /* facetQuery: { - type: Object - }, - selectedFacet: { - type: Object - },*/ settings: { type: Object, }, @@ -61,53 +53,39 @@ export default class JobBrowser extends LitElement { } _init() { + this.TOOL_ID = "FILE_BROWSER"; this._config = this.getDefaultConfig(); } - // NOTE turn updated into update here reduces the number of remote requests from 2 to 1 as in the grid components propertyObserver() - // is executed twice in case there is external settings update(changedProperties) { if (changedProperties.has("settings")) { this.settingsObserver(); } - super.update(changedProperties); } settingsObserver() { this._config = this.getDefaultConfig(); - // merge filter list, canned filters, detail tabs + + // Apply Study settings if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this._config.filter.result.grid = {...this._config.filter.result.grid, ...this.settings.table}; - // } UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings.table }); - // if (this.settings?.table?.toolbar) { - // this._config.filter.result.grid.toolbar = {...this._config.filter.result.grid.toolbar, ...this.settings.table.toolbar}; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings.table?.toolbar }); - // if (this.opencgaSession.user?.configs?.IVA?.jobBrowserCatalog?.grid) { - // this._config.filter.result.grid = { - // ...this._config.filter.result.grid, - // ...this.opencgaSession.user.configs.IVA.jobBrowserCatalog.grid, - // }; - // } - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.jobBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -478,7 +456,6 @@ export default class JobBrowser extends LitElement { }, }; } - } customElements.define("job-browser", JobBrowser); diff --git a/src/webcomponents/job/job-grid.js b/src/webcomponents/job/job-grid.js index 2880c3d9fe..e0f0bb08f6 100644 --- a/src/webcomponents/job/job-grid.js +++ b/src/webcomponents/job/job-grid.js @@ -95,7 +95,7 @@ export default class JobGrid extends LitElement { // Config for the grid toolbar this.toolbarConfig = { ...this.config?.toolbar, - toolId: "jobBrowser", + toolId: "JOB_BROWSER", resource: "JOB", columns: this._getDefaultColumns(), create: { diff --git a/src/webcomponents/sample/sample-browser.js b/src/webcomponents/sample/sample-browser.js index 73ab59ffb9..896c469587 100644 --- a/src/webcomponents/sample/sample-browser.js +++ b/src/webcomponents/sample/sample-browser.js @@ -50,11 +50,10 @@ export default class SampleBrowser extends LitElement { } _init() { + this.TOOL_ID = "SAMPLE_BROWSER"; this._config = this.getDefaultConfig(); } - // NOTE turn updated into update here reduces the number of remote requests from 2 to 1 as in the grid components propertyObserver() - // is executed twice in case there is external settings update(changedProperties) { if (changedProperties.has("settings")) { this.settingsObserver(); @@ -63,38 +62,27 @@ export default class SampleBrowser extends LitElement { } settingsObserver() { - this._config = {...this.getDefaultConfig()}; + this._config = this.getDefaultConfig(); + + // Apply Study settings if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } - // if (this.settings?.table) { - // this.config.filter.result.grid = {...this.config.filter.result.grid, ...this.settings.table}; - // } UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config?.filter?.result.grid, ...this.settings.table }); - // if (this.settings?.table?.toolbar) { - // this.config.filter.result.grid.toolbar = {...this.config.filter.result.grid.toolbar, ...this.settings.table.toolbar}; - // } - UtilsNew.setObjectValue(this._config, "filter.result.grid.toolbar", { ...this._config.filter?.result?.grid?.toolbar, ...this.settings.table?.toolbar }); - // if (this.opencgaSession.user?.configs?.IVA?.sampleBrowserCatalog?.grid) { - // this.config.filter.result.grid = { - // ...this.config.filter.result.grid, - // ...this.opencgaSession.user.configs.IVA.sampleBrowserCatalog.grid, - // }; - // } - // Apply user configuration + // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.sampleBrowser?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }); this.requestUpdate(); @@ -228,7 +216,6 @@ export default class SampleBrowser extends LitElement { showExport: true, showSettings: true, exportTabs: ["download", "link", "code"] - // columns list for the dropdown will be added in grid components based on settings.table.columns }, } }, @@ -457,8 +444,6 @@ export default class SampleBrowser extends LitElement { } }; } - } - customElements.define("sample-browser", SampleBrowser); diff --git a/src/webcomponents/sample/sample-grid.js b/src/webcomponents/sample/sample-grid.js index 1d3d193e2d..f59a372605 100644 --- a/src/webcomponents/sample/sample-grid.js +++ b/src/webcomponents/sample/sample-grid.js @@ -89,7 +89,7 @@ export default class SampleGrid extends LitElement { }; this.toolbarConfig = { - toolId: "sampleBrowser", + toolId: "SAMPLE_BROWSER", resource: "SAMPLE", columns: this._getDefaultColumns(), create: { diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js index 4b0503dbab..8d94841ea7 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js @@ -58,7 +58,7 @@ class VariantInterpreterBrowserCancer extends LitElement { } _init() { - this.COMPONENT_ID = "variant-interpreter-cancer-snv"; + this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_SNV"; this._prefix = UtilsNew.randomString(8); this.query = {}; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js index d541f7c37e..3410763407 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js @@ -55,7 +55,7 @@ class VariantInterpreterBrowserCNV extends LitElement { } _init() { - this.COMPONENT_ID = "variant-interpreter-cancer-cnv"; + this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_SNV"; this._prefix = UtilsNew.randomString(8); this.query = {}; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js index 27ce208b1f..4fe19d7929 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js @@ -58,7 +58,7 @@ class VariantInterpreterBrowserRd extends LitElement { } _init() { - this.COMPONENT_ID = "variant-interpreter-rd"; + this.COMPONENT_ID = "VARIANT_INTERPRETER_RD"; this._prefix = UtilsNew.randomString(8); this.query = {}; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-template.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-template.js index c3cd062699..e9588e05cf 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-template.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-template.js @@ -156,12 +156,18 @@ class VariantInterpreterBrowserTemplate extends LitElement { } // Check for user configuration - if (this.toolId && this.opencgaSession.user?.configs?.IVA?.[this.toolId]?.grid) { - this._config.filter.result.grid = { - ...this._config.filter.result.grid, - ...this.opencgaSession.user.configs.IVA[this.toolId].grid, - }; - } + // if (this.toolId && this.opencgaSession.user?.configs?.IVA?.[this.toolId]?.grid) { + // this._config.filter.result.grid = { + // ...this._config.filter.result.grid, + // ...this.opencgaSession.user.configs.IVA[this.toolId].grid, + // }; + // } + // Apply User grid configuration. Only 'pageSize', 'columns', 'geneSet', 'consequenceType' and 'populationFrequenciesConfig' are set + UtilsNew.setObjectValue(this._config, "filter.result.grid", { + ...this._config.filter?.result?.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.toolId]?.grid + }); + // FIXME For old users if (typeof this._config.filter.result.grid?.highlights === "string") { this._config.filter.result.grid.highlights = this.settings.table.highlights; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-grid-config.js b/src/webcomponents/variant/interpretation/variant-interpreter-grid-config.js index 8d05b40c29..109c9a8240 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-grid-config.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-grid-config.js @@ -97,9 +97,9 @@ export default class VariantInterpreterGridConfig extends LitElement { case "genotype.type": this.config.genotype.type = e.detail.value; break; - case "showHgvs": - this.config.showHgvs = e.detail.value; - break; + // case "showHgvs": + // this.config.showHgvs = e.detail.value; + // break; case "geneSet.ensembl": case "geneSet.refseq": case "consequenceType.all": @@ -142,16 +142,32 @@ export default class VariantInterpreterGridConfig extends LitElement { } async onSubmit() { - const newGridConfig = {...this.config}; - - // Remove highlights and copies configuration from new config - if (newGridConfig._highlights) { - delete newGridConfig._highlights; - } + // const newGridConfig = {...this.config}; + // + // // Remove highlights and copies configuration from new config + // if (newGridConfig._highlights) { + // delete newGridConfig._highlights; + // } - // Update user configuration try { - await OpencgaCatalogUtils.updateGridConfig(this.opencgaSession, this.toolId, newGridConfig); + // Update user configuration + await OpencgaCatalogUtils + .updateGridConfig( + "IVA", + this.opencgaSession, + this.toolId, + { + // All Variant Grids + pageSize: this.config.pageSize, + columns: this.config.columns, + geneSet: this.config.geneSet, + consequenceType: this.config.consequenceType, + populationFrequenciesConfig: this.config.populationFrequenciesConfig, + highlights: this.config.highlights, + // Only Variant Interpreter Grids + genotype: this.config.genotype, + } + ); LitUtils.dispatchCustomEvent(this, "settingsUpdate"); NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_SUCCESS, { @@ -278,15 +294,15 @@ export default class VariantInterpreterGridConfig extends LitElement { width: 6, } }, - { - title: "Show HGVS column", - field: "showHgvs", - type: "checkbox", - text: "Show HGVS", - display: { - width: 6, - } - } + // { + // title: "Show HGVS column", + // field: "showHgvs", + // type: "checkbox", + // text: "Show HGVS", + // display: { + // width: 6, + // } + // } ] }, { diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-grid.js b/src/webcomponents/variant/interpretation/variant-interpreter-grid.js index 9545c94231..c6fc75457c 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-grid.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-grid.js @@ -187,69 +187,6 @@ export default class VariantInterpreterGrid extends LitElement { this.gridCommons.onColumnChange(e); } - // FIXME Temporary code to check which variants are being interpreted or have been reported - // This should be implemented by OpenCGA - // fillReportedVariants(variants) { - // // Prepare queried variants to contain the interpretations - // this.queriedVariants = {}; - // return this.opencgaSession.opencgaClient.clinical().searchInterpretation({ - // primaryFindings: variants.map(variant => variant.id).join(","), - // study: this.opencgaSession.study.fqn, - // }) - // .then(interpretationSearchResponse => { - // const interpretations = interpretationSearchResponse.responses[0]?.results; - // if (interpretations?.length > 0) { - // variants.forEach(variant => this.queriedVariants[variant.id] = {...variant}); - // - // // Add interpretations to the variants to be returned - // for (const interpretation of interpretations) { - // for (const variant of interpretation.primaryFindings) { - // if (this.queriedVariants[variant.id]) { - // if (!this.queriedVariants[variant.id].interpretations) { - // this.queriedVariants[variant.id].interpretations = []; - // } - // this.queriedVariants[variant.id].interpretations.push(interpretation); - // } - // } - // } - // - // // Calculate stats - // for (const v of variants) { - // const variant = this.queriedVariants[v.id]; - // if (variant.interpretations) { - // variant.interpretationStats = { - // status: {}, - // tier: {}, - // clinicalSignificance: {}, - // }; - // for (const interpretation of variant.interpretations) { - // interpretation?.primaryFindings - // ?.filter(primaryFinding => primaryFinding.id === variant.id) - // .forEach(primaryFinding => { - // // Status stats - // if (!variant.interpretationStats.status[primaryFinding.status]) { - // variant.interpretationStats.status[primaryFinding.status] = 0; - // } - // variant.interpretationStats.status[primaryFinding.status]++; - // - // // Tier stats - // primaryFinding.evidences - // .filter(evidence => evidence.review.tier) - // .forEach(evidence => { - // if (!variant.interpretationStats.tier[evidence.review.tier]) { - // variant.interpretationStats.tier[evidence.review.tier] = 0; - // } - // variant.interpretationStats.tier[evidence.review.tier]++; - // }); - // }); - // } - // } - // } - // } - // return this.queriedVariants; - // }); - // } - renderVariants() { if (this._config.renderLocal) { // FIXME remove this ASAP @@ -699,7 +636,7 @@ export default class VariantInterpreterGrid extends LitElement { colspan: 1, formatter: (value, row) => VariantGridFormatter.hgvsFormatter(row, this._config), halign: "center", - visible: !!this._config.showHgvs && this.gridCommons.isColumnVisible("hgvs"), + visible: this.gridCommons.isColumnVisible("hgvs"), }, { id: "consequenceType", diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js b/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js index c972fe466d..9f95aab52f 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js @@ -197,14 +197,30 @@ export default class VariantInterpreterReviewPrimary extends LitElement { async onGridConfigSave(e) { const newGridConfig = {...e.detail.value}; - // Remove highlights and copies configuration from new config - delete newGridConfig.highlights; - // delete newConfig.copies; + // delete newGridConfig.highlights; // Update user configuration try { - await OpencgaCatalogUtils.updateGridConfig(this.opencgaSession, this.toolId, newGridConfig); + // await OpencgaCatalogUtils.updateGridConfig("IVA", this.opencgaSession, this.toolId, newGridConfig); + // Update user configuration + await OpencgaCatalogUtils + .updateGridConfig( + "IVA", + this.opencgaSession, + this.toolId, + { + // All Variant Grids + pageSize: newGridConfig.pageSize, + columns: newGridConfig.columns, + geneSet: newGridConfig.geneSet, + consequenceType: newGridConfig.consequenceType, + populationFrequenciesConfig: newGridConfig.populationFrequenciesConfig, + highlights: newGridConfig.highlights, + // Only Variant Interpreter Grids + genotype: newGridConfig.genotype, + } + ); this.settingsObserver(); this.requestUpdate(); diff --git a/src/webcomponents/variant/variant-browser-grid.js b/src/webcomponents/variant/variant-browser-grid.js index 2275e2ad2c..2a3918f4c0 100644 --- a/src/webcomponents/variant/variant-browser-grid.js +++ b/src/webcomponents/variant/variant-browser-grid.js @@ -146,13 +146,12 @@ export default class VariantBrowserGrid extends LitElement { }; this.toolbarConfig = { - toolId: "variantBrowser", + toolId: "VARIANT_BROWSER", resource: "VARIANT", disableCreate: true, showInterpreterConfig: true, columns: this._getDefaultColumns() }; - } onColumnChange(e) { @@ -791,7 +790,7 @@ export default class VariantBrowserGrid extends LitElement {
  • - Varsome @@ -801,14 +800,14 @@ export default class VariantBrowserGrid extends LitElement {
  • - + CellBase 5.0 ${this.opencgaSession?.project.cellbase.version === "v5" || this.opencgaSession.project.cellbase.version === "v5.0" ? "(current)" : ""}
  • - + CellBase 5.1 ${this.opencgaSession?.project.cellbase.version === "v5.1" ? "(current)" : ""}
    • diff --git a/src/webcomponents/variant/variant-browser.js b/src/webcomponents/variant/variant-browser.js index 9bd0f16712..7b6cb79515 100644 --- a/src/webcomponents/variant/variant-browser.js +++ b/src/webcomponents/variant/variant-browser.js @@ -87,13 +87,6 @@ export default class VariantBrowser extends LitElement { this.COMPONENT_ID = "variant-browser"; this._prefix = UtilsNew.randomString(8); - // These are for making the queries to server - /* this.facetFields = []; - this.facetRanges = []; - - this.facetFieldsName = []; - this.facetRangeFields = [];*/ - this.results = []; this._showInitMessage = true; @@ -130,12 +123,9 @@ export default class VariantBrowser extends LitElement { } settingsObserver() { - if (!this.opencgaSession) { - return; - } - this._config = this.getDefaultConfig(); + this._config = {...this.getDefaultConfig()}; - // filter list, canned filters, detail tabs + // Apply Study grid configuration if (this.settings?.menu) { this._config.filter = UtilsNew.mergeFiltersAndDetails(this._config?.filter, this.settings); } @@ -154,13 +144,11 @@ export default class VariantBrowser extends LitElement { }; } - // Apply user configuration - if (this.opencgaSession.user?.configs?.IVA?.[this.COMPONENT_ID]?.grid) { - this._config.filter.result.grid = { - ...this._config.filter.result.grid, - ...this.opencgaSession.user.configs.IVA[this.COMPONENT_ID].grid, - }; - } + // Apply User grid configuration. Only 'pageSize', 'columns', 'geneSet', 'consequenceType' and 'populationFrequenciesConfig' are set + UtilsNew.setObjectValue(this._config, "filter.result.grid", { + ...this._config.filter?.result?.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.VARIANT_BROWSER?.grid + }); this.requestUpdate(); } @@ -442,7 +430,7 @@ export default class VariantBrowser extends LitElement { .config="${this._config.filter.result.grid}" @queryComplete="${this.onQueryComplete}" @selectrow="${this.onSelectVariant}" - @gridconfigsave="${this.onGridConfigSave}"> + @settingsUpdate="${this.onSettingsUpdate}"> From d0c753805ff432adbe2c9af39d892d3a8aa976fc Mon Sep 17 00:00:00 2001 From: gpveronica Date: Fri, 27 Oct 2023 18:38:16 +0200 Subject: [PATCH 05/73] wc - Fixed bug disorder as array --- .../clinical/clinical-analysis-grid.js | 2 +- .../clinical/clinical-analysis-summary.js | 2 +- .../clinical/clinical-analysis-update.js | 2 +- .../clinical/clinical-analysis-view.js | 2 +- .../clinical-interpretation-editor.js | 18 +++++++++++++++--- .../commons/catalog-grid-formatter.js | 6 ++++-- src/webcomponents/family/family-view.js | 2 +- .../individual/individual-view.js | 2 +- .../variant-interpreter-qc-summary.js | 2 +- src/webcomponents/variant/variant-samples.js | 2 +- 10 files changed, 27 insertions(+), 13 deletions(-) diff --git a/src/webcomponents/clinical/clinical-analysis-grid.js b/src/webcomponents/clinical/clinical-analysis-grid.js index 02dc729fa2..0e31e798da 100644 --- a/src/webcomponents/clinical/clinical-analysis-grid.js +++ b/src/webcomponents/clinical/clinical-analysis-grid.js @@ -633,7 +633,7 @@ export default class ClinicalAnalysisGrid extends LitElement { formatter: (value, row) => { const panelHtml = row.panels?.length > 0 ? CatalogGridFormatter.panelFormatter(row.panels) : "-"; return ` -
    ${CatalogGridFormatter.disorderFormatter(value, row)}
    +
    ${CatalogGridFormatter.disorderFormatter([value], row)}
    ${panelHtml}
    `; }, diff --git a/src/webcomponents/clinical/clinical-analysis-summary.js b/src/webcomponents/clinical/clinical-analysis-summary.js index 6c0d41fc5f..982ef66f22 100644 --- a/src/webcomponents/clinical/clinical-analysis-summary.js +++ b/src/webcomponents/clinical/clinical-analysis-summary.js @@ -137,7 +137,7 @@ export default class ClinicalAnalysisSummary extends LitElement { field: "disorder", type: "custom", display: { - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), } }, { diff --git a/src/webcomponents/clinical/clinical-analysis-update.js b/src/webcomponents/clinical/clinical-analysis-update.js index 3bb9e60045..df07d845e1 100644 --- a/src/webcomponents/clinical/clinical-analysis-update.js +++ b/src/webcomponents/clinical/clinical-analysis-update.js @@ -213,7 +213,7 @@ export default class ClinicalAnalysisUpdate extends LitElement { field: "disorder", type: "custom", display: { - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), } }, { diff --git a/src/webcomponents/clinical/clinical-analysis-view.js b/src/webcomponents/clinical/clinical-analysis-view.js index af9b98d002..8a1f5bc337 100644 --- a/src/webcomponents/clinical/clinical-analysis-view.js +++ b/src/webcomponents/clinical/clinical-analysis-view.js @@ -239,7 +239,7 @@ export default class ClinicalAnalysisView extends LitElement { id: "type", type: "custom", display: { - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), }, }, { diff --git a/src/webcomponents/clinical/interpretation/clinical-interpretation-editor.js b/src/webcomponents/clinical/interpretation/clinical-interpretation-editor.js index c291754830..09ee8fb576 100644 --- a/src/webcomponents/clinical/interpretation/clinical-interpretation-editor.js +++ b/src/webcomponents/clinical/interpretation/clinical-interpretation-editor.js @@ -221,7 +221,7 @@ class ClinicalInterpretationEditor extends LitElement { field: "disorder", type: "custom", display: { - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)) + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])) } }, { @@ -322,7 +322,13 @@ class ClinicalInterpretationEditor extends LitElement { _updateOrDeleteComments(notify) { if (this.commentsUpdate?.updated?.length > 0) { - this.opencgaSession.opencgaClient.clinical().updateInterpretation(this.clinicalAnalysis.id, this.clinicalAnalysis.interpretation.id, {comments: this.commentsUpdate.updated}, {commentsAction: "REPLACE", study: this.opencgaSession.study.fqn}) + this.opencgaSession.opencgaClient.clinical() + .updateInterpretation( + this.clinicalAnalysis.id, + this.clinicalAnalysis.interpretation.id, + {comments: this.commentsUpdate.updated}, + {commentsAction: "REPLACE", study: this.opencgaSession.study.fqn} + ) .then(response => { if (notify && this.commentsUpdate?.deleted?.length === 0) { this._postUpdate(response); @@ -333,7 +339,13 @@ class ClinicalInterpretationEditor extends LitElement { }); } if (this.commentsUpdate?.deleted?.length > 0) { - this.opencgaSession.opencgaClient.clinical().updateInterpretation(this.clinicalAnalysis.id, this.clinicalAnalysis.interpretation.id, {comments: this.commentsUpdate.deleted}, {commentsAction: "REMOVE", study: this.opencgaSession.study.fqn}) + this.opencgaSession.opencgaClient.clinical() + .updateInterpretation( + this.clinicalAnalysis.id, + this.clinicalAnalysis.interpretation.id, + {comments: this.commentsUpdate.deleted}, + {commentsAction: "REMOVE", study: this.opencgaSession.study.fqn} + ) .then(response => { if (notify) { this._postUpdate(response); diff --git a/src/webcomponents/commons/catalog-grid-formatter.js b/src/webcomponents/commons/catalog-grid-formatter.js index 31452fe077..3b59c1c952 100644 --- a/src/webcomponents/commons/catalog-grid-formatter.js +++ b/src/webcomponents/commons/catalog-grid-formatter.js @@ -200,7 +200,8 @@ export default class CatalogGridFormatter { html += `
    ${variable}: ${annotationSet.annotations[variable]} -
    `; +
+ `; } } else { // This entity has not this variableSetId annotated @@ -215,7 +216,8 @@ export default class CatalogGridFormatter { html += `
${variable}: ${annotationSet.annotations[variable]} -
`; +
+ `; } } } else { diff --git a/src/webcomponents/family/family-view.js b/src/webcomponents/family/family-view.js index 274a8ae29d..b25a488834 100644 --- a/src/webcomponents/family/family-view.js +++ b/src/webcomponents/family/family-view.js @@ -247,7 +247,7 @@ export default class FamilyView extends LitElement { type: "list", display: { contentLayout: "vertical", - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), defaultValue: "N/A" } }, diff --git a/src/webcomponents/individual/individual-view.js b/src/webcomponents/individual/individual-view.js index 02e48f17ea..3477574278 100644 --- a/src/webcomponents/individual/individual-view.js +++ b/src/webcomponents/individual/individual-view.js @@ -249,7 +249,7 @@ export default class IndividualView extends LitElement { type: "list", display: { contentLayout: "vertical", - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), defaultValue: "N/A", }, }, diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-qc-summary.js b/src/webcomponents/variant/interpretation/variant-interpreter-qc-summary.js index ec07bd04b5..e2af840663 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-qc-summary.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-qc-summary.js @@ -182,7 +182,7 @@ class VariantInterpreterQcSummary extends LitElement { field: "disorder", type: "custom", display: { - render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter(disorder)), + render: disorder => UtilsNew.renderHTML(CatalogGridFormatter.disorderFormatter([disorder])), }, }, { diff --git a/src/webcomponents/variant/variant-samples.js b/src/webcomponents/variant/variant-samples.js index 7ddef92dd0..2676d61222 100644 --- a/src/webcomponents/variant/variant-samples.js +++ b/src/webcomponents/variant/variant-samples.js @@ -330,7 +330,7 @@ export default class VariantSamples extends LitElement { colspan: 1, rowspan: 1, formatter: disorders => { - const result = disorders?.map(disorder => CatalogGridFormatter.disorderFormatter(disorder)).join("
"); + const result = disorders?.map(disorder => CatalogGridFormatter.disorderFormatter([disorder])).join("
"); return result ? result : "-"; }, halign: "center" From e0e900d186f67a8725ecdbcfad995db331f0fb2c Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 15:33:48 +0100 Subject: [PATCH 06/73] wc - Added TOOL_ID to variant browser Signed-off-by: gpveronica --- src/webcomponents/variant/variant-browser.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/webcomponents/variant/variant-browser.js b/src/webcomponents/variant/variant-browser.js index 7b6cb79515..f228f6e44a 100644 --- a/src/webcomponents/variant/variant-browser.js +++ b/src/webcomponents/variant/variant-browser.js @@ -101,6 +101,7 @@ export default class VariantBrowser extends LitElement { this.variant = null; this.activeTab = "table-tab"; + this.TOOL_ID = "VARIANT_BROWSER"; this._config = this.getDefaultConfig(); } @@ -147,7 +148,7 @@ export default class VariantBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize', 'columns', 'geneSet', 'consequenceType' and 'populationFrequenciesConfig' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.VARIANT_BROWSER?.grid + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }); this.requestUpdate(); From 86a03a978d55162e4d031e1b26182446c9562af0 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 15:35:08 +0100 Subject: [PATCH 07/73] wc - Fixed user settings path in some browsers Signed-off-by: gpveronica --- .../clinical/clinical-analysis-browser.js | 3 ++- .../variant/custom/steiner-report.js | 16 ++++++++-------- .../variant-interpreter-review-primary.js | 4 ++-- 3 files changed, 12 insertions(+), 11 deletions(-) diff --git a/src/webcomponents/clinical/clinical-analysis-browser.js b/src/webcomponents/clinical/clinical-analysis-browser.js index 7d522e2678..f4266e0a7b 100644 --- a/src/webcomponents/clinical/clinical-analysis-browser.js +++ b/src/webcomponents/clinical/clinical-analysis-browser.js @@ -92,7 +92,7 @@ export default class ClinicalAnalysisBrowser extends LitElement { // Apply user configuration UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.[this._config.componentId]?.grid, + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this._config.componentId]?.grid, }); @@ -281,6 +281,7 @@ export default class ClinicalAnalysisBrowser extends LitElement { } }; } + } customElements.define("clinical-analysis-browser", ClinicalAnalysisBrowser); diff --git a/src/webcomponents/variant/custom/steiner-report.js b/src/webcomponents/variant/custom/steiner-report.js index 63aea807e0..d187370326 100644 --- a/src/webcomponents/variant/custom/steiner-report.js +++ b/src/webcomponents/variant/custom/steiner-report.js @@ -800,7 +800,7 @@ class SteinerReport extends LitElement { .filter(v => SUBSTITUTIONS_AND_INDELS_TYPES.indexOf(v.type) > -1); const gridConfig = { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.snv]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.snv]?.grid || {}), ...defaultGridConfig, somatic: false, variantTypes: ["SNV", "INDEL", "INSERTION", "DELETION"], @@ -832,7 +832,7 @@ class SteinerReport extends LitElement { .filter(v => REARRANGEMENTS_TYPES.indexOf(v.type) > -1); const gridConfig = { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.rearrangements]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.rearrangements]?.grid || {}), ...defaultGridConfig, somatic: false, variantTypes: ["BREAKEND"], @@ -880,7 +880,7 @@ class SteinerReport extends LitElement { .filter(v => v.confidence?.value === "HIGH"); return this.renderSomaticVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.snv]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.snv]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["SNV", "INDEL"], @@ -903,7 +903,7 @@ class SteinerReport extends LitElement { .filter(v => v.confidence?.value === "HIGH"); return this.renderSomaticRearrangementVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.rearrangements]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.rearrangements]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["BREAKEND"], @@ -926,7 +926,7 @@ class SteinerReport extends LitElement { .filter(v => v.confidence?.value === "HIGH"); return this.renderSomaticVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.cnv]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.cnv]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["COPY_NUMBER", "CNV"], @@ -958,7 +958,7 @@ class SteinerReport extends LitElement { .filter(v => !v.confidence?.value || v.confidence?.value !== "HIGH"); return this.renderSomaticVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.snv]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.snv]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["SNV", "INDEL"], @@ -979,7 +979,7 @@ class SteinerReport extends LitElement { .filter(v => !v.confidence?.value || v.confidence?.value !== "HIGH"); return this.renderSomaticRearrangementVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.rearrangements]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.rearrangements]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["BREAKEND"], @@ -1000,7 +1000,7 @@ class SteinerReport extends LitElement { .filter(v => !v.confidence?.value || v.confidence?.value !== "HIGH"); return this.renderSomaticVariantsGrid(filteredVariants, { - ...(this.opencgaSession?.user?.configs?.IVA?.[this.gridTypes.cnv]?.grid || {}), + ...(this.opencgaSession?.user?.configs?.IVA?.settings?.[this.gridTypes.cnv]?.grid || {}), ...defaultGridConfig, somatic: true, variantTypes: ["COPY_NUMBER", "CNV"], diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js b/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js index 9f95aab52f..ea78091e53 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-review-primary.js @@ -128,10 +128,10 @@ export default class VariantInterpreterReviewPrimary extends LitElement { } // Check for user configuration - if (this.toolId && this.opencgaSession.user?.configs?.IVA?.[this.toolId]?.grid) { + if (this.toolId && this.opencgaSession.user?.configs?.IVA?.settings?.[this.toolId]?.grid) { this._config.result.grid = { ...this._config.result.grid, - ...this.opencgaSession.user.configs.IVA[this.toolId].grid, + ...this.opencgaSession.user.configs.IVA.settings[this.toolId].grid, showGenomeBrowserLink: false, }; } From e3c4174c3c6308f812c963d28385b0f19ae16856 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 15:52:11 +0100 Subject: [PATCH 08/73] wc - Fixed visibility of columns Job ID and SampleIDs Signed-off-by: gpveronica --- src/webcomponents/file/file-grid.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/webcomponents/file/file-grid.js b/src/webcomponents/file/file-grid.js index 4286dd7d83..dfd840c2b7 100644 --- a/src/webcomponents/file/file-grid.js +++ b/src/webcomponents/file/file-grid.js @@ -320,7 +320,7 @@ export default class OpencgaFileGrid extends LitElement { return html; }, // halign: this._config.header.horizontalAlign, - // visible: this.gridCommons.isColumnVisible("sampleIds") + visible: this.gridCommons.isColumnVisible("sampleIds") }, { id: "jobId", @@ -333,7 +333,7 @@ export default class OpencgaFileGrid extends LitElement { return "-"; } }, - // visible: this.gridCommons.isColumnVisible("jobId") + visible: this.gridCommons.isColumnVisible("jobId") }, { id: "size", From 04de6dd314c24777bb44976d9be2ed25842e451c Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 17:57:28 +0100 Subject: [PATCH 09/73] wc - Fixed visibility of some columns Signed-off-by: gpveronica --- src/webcomponents/disease-panel/disease-panel-grid.js | 2 +- src/webcomponents/job/job-grid.js | 5 ++--- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/webcomponents/disease-panel/disease-panel-grid.js b/src/webcomponents/disease-panel/disease-panel-grid.js index 7fbb61da2c..cb56be683f 100644 --- a/src/webcomponents/disease-panel/disease-panel-grid.js +++ b/src/webcomponents/disease-panel/disease-panel-grid.js @@ -422,7 +422,7 @@ export default class DiseasePanelGrid extends LitElement { `; }, align: "center", - visible: true + visible: this.gridCommons.isColumnVisible("stats") }, { id: "source", diff --git a/src/webcomponents/job/job-grid.js b/src/webcomponents/job/job-grid.js index e0f0bb08f6..fa275f993f 100644 --- a/src/webcomponents/job/job-grid.js +++ b/src/webcomponents/job/job-grid.js @@ -430,7 +430,6 @@ export default class JobGrid extends LitElement { if (UtilsNew.isNotEmpty(params)) { html = "
"; for (const key of Object.keys(params)) { - typeof params[key] let nestedObject = ""; if (typeof params[key] === "object") { for (const subKey of Object.keys(params[key])) { @@ -455,7 +454,7 @@ export default class JobGrid extends LitElement { } return html; }, - // visible: this.gridCommons.isColumnVisible("params") + visible: this.gridCommons.isColumnVisible("params") }, { id: "output", @@ -511,7 +510,7 @@ export default class JobGrid extends LitElement { return ` ${duration.humanize()} `; } }, - // visible: this.gridCommons.isColumnVisible("executionR") + visible: this.gridCommons.isColumnVisible("executionR") }, { id: "executionD", From c017fa7a703cbbe00516faab04530d11ebd8f427 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 17:57:51 +0100 Subject: [PATCH 10/73] wc - Fixed exclude from Settings Annotations Signed-off-by: gpveronica --- .../commons/catalog-browser-grid-config.js | 11 ++++++++--- src/webcomponents/commons/grid-commons.js | 2 ++ 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/commons/catalog-browser-grid-config.js b/src/webcomponents/commons/catalog-browser-grid-config.js index 9b966dd04b..35fff4dd1b 100644 --- a/src/webcomponents/commons/catalog-browser-grid-config.js +++ b/src/webcomponents/commons/catalog-browser-grid-config.js @@ -61,9 +61,14 @@ export default class CatalogBrowserGridConfig extends LitElement { this.selectedColumns = []; // get all id columns visible const isColumnVisible = col => col.visible === undefined || col.visible; const addColumnData = col => { - this.selectColumnData.push({id: col.id, name: col.title}); - if (isColumnVisible(col)) { - this.selectedColumns.push(col.id); + if (!col.excludeFromSettings) { + this.selectColumnData.push({ + id: col.id, + name: col.title + }); + if (isColumnVisible(col)) { + this.selectedColumns.push(col.id); + } } }; diff --git a/src/webcomponents/commons/grid-commons.js b/src/webcomponents/commons/grid-commons.js index ed92530d8a..704c9a0c3e 100644 --- a/src/webcomponents/commons/grid-commons.js +++ b/src/webcomponents/commons/grid-commons.js @@ -306,6 +306,8 @@ export default class GridCommons { field: "annotationSets", formatter: annotationSets => formatter(annotationSets, annotation.variableSetId, annotation.variables), halign: gridConfig.header.horizontalAlign, + visible: true, + excludeFromSettings: true, // visible: this.gridCommons.isColumnVisible("annotations") }; columns.splice(annotation.position, 0, column); From fc541e63420b14f460d3458aab2449510700a311 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 30 Oct 2023 18:54:03 +0100 Subject: [PATCH 11/73] wc - Fixed settings path in test files for test-app Signed-off-by: gpveronica --- .../webcomponents/cohort-browser-grid-test.js | 2 +- .../disease-panel-browser-grid-test.js | 5 +++- .../webcomponents/family-browser-grid-test.js | 5 +++- .../webcomponents/file-browser-grid-test.js | 2 +- .../individual-browser-grid-test.js | 5 +++- .../webcomponents/job-browser-grid-test.js | 2 +- .../webcomponents/sample-browser-grid-test.js | 5 +++- .../variant-browser-grid-test.js | 25 +++---------------- .../variant-interpreter-grid-test.js | 5 +++- 9 files changed, 27 insertions(+), 29 deletions(-) diff --git a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js index a752248944..af0355373a 100644 --- a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js @@ -93,7 +93,7 @@ class CohortBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.cohortBrowser?.grid}; + this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.cohortBrowser?.grid}; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js index 3575e1617e..56066bfb94 100644 --- a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js @@ -113,7 +113,10 @@ class DiseasePanelBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = {...this.configGrid, ...this.opencgaSession?.user?.configs?.IVA?.diseasePanelBrowser?.grid}; + this.configGrid = { + ...this.configGrid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.diseasePanelBrowser?.grid + }; this.propertyObserver(); } diff --git a/src/sites/test-app/webcomponents/family-browser-grid-test.js b/src/sites/test-app/webcomponents/family-browser-grid-test.js index a54b0015db..607a06025a 100644 --- a/src/sites/test-app/webcomponents/family-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/family-browser-grid-test.js @@ -98,7 +98,10 @@ class FamilyBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this._config, ...this.opencgaSession?.user?.configs?.IVA?.familyBrowser?.grid}; + this._config = { + ...this._config, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.familyBrowser?.grid + }; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/file-browser-grid-test.js b/src/sites/test-app/webcomponents/file-browser-grid-test.js index de04944b5b..aaa5b3947d 100644 --- a/src/sites/test-app/webcomponents/file-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/file-browser-grid-test.js @@ -101,7 +101,7 @@ class FileBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.fileBrowser?.grid}; + this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.fileBrowser?.grid}; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 8d04df8499..190e1cb085 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -126,7 +126,10 @@ class IndividualBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = {...this.configGrid, ...this.opencgaSession?.user?.configs?.IVA?.individualBrowser?.grid}; + this.configGrid = { + ...this.configGrid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.individualBrowser?.grid + }; this.propertyObserver(); } diff --git a/src/sites/test-app/webcomponents/job-browser-grid-test.js b/src/sites/test-app/webcomponents/job-browser-grid-test.js index 3cdb4551f5..9329482ab7 100644 --- a/src/sites/test-app/webcomponents/job-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/job-browser-grid-test.js @@ -100,7 +100,7 @@ class JobBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.jobBrowser?.grid}; + this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.jobBrowser?.grid}; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index 3778893b19..c74538ead1 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -128,7 +128,10 @@ class SampleBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = {...this.configGrid, ...this.opencgaSession?.user?.configs?.IVA?.sampleBrowser?.grid}; + this.configGrid = { + ...this.configGrid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.sampleBrowser?.grid + }; this.propertyObserver(); } diff --git a/src/sites/test-app/webcomponents/variant-browser-grid-test.js b/src/sites/test-app/webcomponents/variant-browser-grid-test.js index cd5f50cbd4..ec906ffeff 100644 --- a/src/sites/test-app/webcomponents/variant-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/variant-browser-grid-test.js @@ -127,7 +127,10 @@ class VariantBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configVariantGrid = {...this.configVariantGrid, ...this.opencgaSession?.user?.configs?.IVA?.variantBrowser?.grid}; + this.configVariantGrid = { + ...this.configVariantGrid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.variantBrowser?.grid + }; this.opencgaSessionObserver(); } @@ -140,26 +143,6 @@ class VariantBrowserGridTest extends LitElement { Variant Browser (${this.testVariantFile?.split("-")?.at(-1)}) - - Date: Tue, 31 Oct 2023 09:45:51 +0100 Subject: [PATCH 12/73] wc - Fixed version variable Signed-off-by: gpveronica --- src/sites/test-app/clients/api-mock/Cohort.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sites/test-app/clients/api-mock/Cohort.js b/src/sites/test-app/clients/api-mock/Cohort.js index 7926c8dc85..f1955826d1 100644 --- a/src/sites/test-app/clients/api-mock/Cohort.js +++ b/src/sites/test-app/clients/api-mock/Cohort.js @@ -44,7 +44,7 @@ export default class Cohort { info(cohorts, params) { if (cohorts === "ALL") { - return UtilsNew.importJSONFile(`./test-data/2.11/cohorts-1000G.json`) + return UtilsNew.importJSONFile(`./test-data/${this._config.testDataVersion}/cohorts-1000G.json`) .then(data => ({ responses: [{results: [data[0]]}] })); From 41e317843fae4dfe84997d006ef6978b60a23cf5 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 10:16:42 +0100 Subject: [PATCH 13/73] wc - Fixed Job browser TOOL_ID Signed-off-by: gpveronica --- src/webcomponents/job/job-browser.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/webcomponents/job/job-browser.js b/src/webcomponents/job/job-browser.js index b33768819c..b7f2ab6018 100644 --- a/src/webcomponents/job/job-browser.js +++ b/src/webcomponents/job/job-browser.js @@ -53,7 +53,7 @@ export default class JobBrowser extends LitElement { } _init() { - this.TOOL_ID = "FILE_BROWSER"; + this.TOOL_ID = "JOB_BROWSER"; this._config = this.getDefaultConfig(); } @@ -456,6 +456,7 @@ export default class JobBrowser extends LitElement { }, }; } + } customElements.define("job-browser", JobBrowser); From 96851b161046a0aa02b45c70fc82e5ba59e52fb9 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 10:41:05 +0100 Subject: [PATCH 14/73] wc - Fixed *_SNV to *_CNV in component ID Signed-off-by: gpveronica --- .../variant/interpretation/variant-interpreter-browser-cnv.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js index 3410763407..ee80b900b0 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js @@ -55,7 +55,7 @@ class VariantInterpreterBrowserCNV extends LitElement { } _init() { - this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_SNV"; + this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_CNV"; this._prefix = UtilsNew.randomString(8); this.query = {}; From 43cefea518591cb0be195015463f601a1e145121 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 10:49:33 +0100 Subject: [PATCH 15/73] wc - Fixed tests path and tool id Signed-off-by: gpveronica --- .../webcomponents/cohort-browser-grid-test.js | 5 ++- .../disease-panel-browser-grid-test.js | 20 ++-------- .../webcomponents/family-browser-grid-test.js | 4 +- .../webcomponents/file-browser-grid-test.js | 5 ++- .../individual-browser-grid-test.js | 30 +++------------ .../webcomponents/job-browser-grid-test.js | 3 +- .../webcomponents/sample-browser-grid-test.js | 37 +++---------------- .../variant-browser-grid-test.js | 25 +++---------- 8 files changed, 32 insertions(+), 97 deletions(-) diff --git a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js index af0355373a..d36032f30d 100644 --- a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js @@ -58,6 +58,7 @@ class CohortBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "COHORT_BROWSER"; this.isLoading = false; this.data = []; this._config = {}; @@ -93,7 +94,9 @@ class CohortBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.cohortBrowser?.grid}; + this._config = { + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, + }; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js index 56066bfb94..8391be1712 100644 --- a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js @@ -53,6 +53,7 @@ class DiseasePanelBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "DISEASE_PANEL_BROWSER"; this._ready = false; this.FILES = [ "disease-panels-platinum.json", @@ -60,19 +61,7 @@ class DiseasePanelBrowserGridTest extends LitElement { this._data = []; this._selectedInstance = {}; - this.configGrid = { - pageSize: 10, - pageList: [10, 25, 50], - multiSelection: false, - showSelectCheckbox: false, - toolbar: { - showColumns: true, - showDownload: false, - showExport: false, - showSettings: false, - exportTabs: ["download", "link", "code"] - }, - }; + this._config = {}; } // TODO: The Sample Browser Test needs to test two things: @@ -113,9 +102,8 @@ class DiseasePanelBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = { - ...this.configGrid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.diseasePanelBrowser?.grid + this._config = { + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }; this.propertyObserver(); } diff --git a/src/sites/test-app/webcomponents/family-browser-grid-test.js b/src/sites/test-app/webcomponents/family-browser-grid-test.js index 607a06025a..1ebb8b0f39 100644 --- a/src/sites/test-app/webcomponents/family-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/family-browser-grid-test.js @@ -62,6 +62,7 @@ class FamilyBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "FAMILY_BROWSER"; this._ready = false; this.data = []; this._config = {}; @@ -99,8 +100,7 @@ class FamilyBrowserGridTest extends LitElement { onSettingsUpdate() { this._config = { - ...this._config, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.familyBrowser?.grid + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/file-browser-grid-test.js b/src/sites/test-app/webcomponents/file-browser-grid-test.js index aaa5b3947d..a58caaa0a7 100644 --- a/src/sites/test-app/webcomponents/file-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/file-browser-grid-test.js @@ -57,6 +57,7 @@ class FileBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "FILE_BROWSER"; this.isLoading = false; this.data = []; this._config = {}; @@ -101,7 +102,9 @@ class FileBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.fileBrowser?.grid}; + this._config = { + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, + }; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 190e1cb085..99101bfa7c 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -58,6 +58,7 @@ class IndividualBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "INDIVIDUAL_BROWSER"; this._ready = false; this.FILES = [ "individuals-platinum.json", @@ -65,27 +66,7 @@ class IndividualBrowserGridTest extends LitElement { this._data = []; this._selectedInstance = {}; - this.configGrid = { - pageSize: 10, - pageList: [10, 25, 50], - multiSelection: false, - showSelectCheckbox: false, - // FIXME: temporarily moved here - showColumns: false, // To clean-up? - showDownload: false, // To clean-up? - showExport: true, - showSettings: true, - showNew: true, - showCreate: true, - // FIXME\ - toolbar: { - showColumns: true, - showDownload: false, - showExport: false, - showSettings: false, - exportTabs: ["download", "link", "code"] - }, - }; + this._config = {}; } update(changedProperties) { @@ -126,9 +107,8 @@ class IndividualBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = { - ...this.configGrid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.individualBrowser?.grid + this._config = { + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL]?.grid, }; this.propertyObserver(); } @@ -186,7 +166,7 @@ class IndividualBrowserGridTest extends LitElement { diff --git a/src/sites/test-app/webcomponents/job-browser-grid-test.js b/src/sites/test-app/webcomponents/job-browser-grid-test.js index 9329482ab7..e543bab139 100644 --- a/src/sites/test-app/webcomponents/job-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/job-browser-grid-test.js @@ -57,6 +57,7 @@ class JobBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "JOB_BROWSER"; this.isLoading = false; this.data = []; this._config = {}; @@ -100,7 +101,7 @@ class JobBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.jobBrowser?.grid}; + this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid}; this.opencgaSessionObserver(); } diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index c74538ead1..d8b337df06 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -52,6 +52,7 @@ class SampleBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "SAMPLE_BROWSER"; this._ready = false; this.FILES = [ "samples-platinum.json", @@ -59,34 +60,7 @@ class SampleBrowserGridTest extends LitElement { this._data = []; this._selectedInstance = {}; - this.configGrid = { - pageSize: 10, - pageList: [10, 25, 50], - multiSelection: false, - showSelectCheckbox: false, - // FIXME: temporarily moved here - showColumns: false, // To clean-up? - showDownload: false, // To clean-up? - showExport: true, - showSettings: true, - showNew: true, - showCreate: true, - // FIXME\ - toolbar: { - // FIXME 20230830 Vero BUG: Toolbar configuration (and clientS configuration) is currently ignored. - // The configurations read in the following files for deciding whether the buttons are displayed or not, - // are not under the toolbar key but in the parent. I move this configuration temporarily to the parent. - // See clients browser.settings.js and getDefaultConfig() in: - // - sample-browser.js - // - sample-grid.js - // - opencb-grid-toolbar.js - showColumns: true, - showDownload: false, - showExport: false, - showSettings: false, - exportTabs: ["download", "link", "code"] - }, - }; + this._config = {}; } // TODO: The Sample Browser Test needs to test two things: @@ -128,9 +102,8 @@ class SampleBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configGrid = { - ...this.configGrid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.sampleBrowser?.grid + this._config = { + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }; this.propertyObserver(); } @@ -195,7 +168,7 @@ class SampleBrowserGridTest extends LitElement { diff --git a/src/sites/test-app/webcomponents/variant-browser-grid-test.js b/src/sites/test-app/webcomponents/variant-browser-grid-test.js index ec906ffeff..4819d4f1ba 100644 --- a/src/sites/test-app/webcomponents/variant-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/variant-browser-grid-test.js @@ -53,25 +53,12 @@ class VariantBrowserGridTest extends LitElement { } #init() { + this.TOOL_ID = "VARIANT_BROWSER"; this.isLoading = false; this.variants = []; this._dataFormConfig = DATA_FORM_EXAMPLE; - this.configVariantGrid = { - pageSize: 10, - pageList: [10, 25, 50], - multiSelection: false, - showSelectCheckbox: false, - toolbar: { - // showNew: true, - showColumns: true, - showDownload: false, - showExport: false, - showSettings: false, - exportTabs: ["download", "link", "code"] - // columns list for the dropdown will be added in grid webcomponents based on settings.table.columns - }, - }; + this._config = {}; } #setLoading(value) { @@ -127,9 +114,9 @@ class VariantBrowserGridTest extends LitElement { } onSettingsUpdate() { - this.configVariantGrid = { - ...this.configVariantGrid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.variantBrowser?.grid + this._config = { + ...this._config, + ...this._config?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }; this.opencgaSessionObserver(); } @@ -146,7 +133,7 @@ class VariantBrowserGridTest extends LitElement { From c0b99f74592e4fdba92940c5770a8fbb889a6f84 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 10:49:59 +0100 Subject: [PATCH 16/73] wc - Added tool id Signed-off-by: gpveronica --- src/webcomponents/variant/variant-browser.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/variant/variant-browser.js b/src/webcomponents/variant/variant-browser.js index f228f6e44a..e4f3b97920 100644 --- a/src/webcomponents/variant/variant-browser.js +++ b/src/webcomponents/variant/variant-browser.js @@ -84,6 +84,7 @@ export default class VariantBrowser extends LitElement { } _init() { + this.TOOL_ID = "VARIANT_BROWSER"; this.COMPONENT_ID = "variant-browser"; this._prefix = UtilsNew.randomString(8); @@ -101,7 +102,6 @@ export default class VariantBrowser extends LitElement { this.variant = null; this.activeTab = "table-tab"; - this.TOOL_ID = "VARIANT_BROWSER"; this._config = this.getDefaultConfig(); } From 7b497c30aec50b47f77692e73d21b9b4cd69c465 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 11:52:55 +0100 Subject: [PATCH 17/73] wc - Fixed cohort grid tests Signed-off-by: gpveronica --- cypress/e2e/iva/cohort-browser-grid.cy.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/cypress/e2e/iva/cohort-browser-grid.cy.js b/cypress/e2e/iva/cohort-browser-grid.cy.js index ce32243cff..5613965ce6 100644 --- a/cypress/e2e/iva/cohort-browser-grid.cy.js +++ b/cypress/e2e/iva/cohort-browser-grid.cy.js @@ -214,8 +214,8 @@ context("Cohort Browser Grid", () => { }); }); - it("should hidden columns [Date,Type]",() => { - const columns = ["Cohort ID","Date","Type"]; + it("should hidden columns [Cohort ID,Creation Date]",() => { + const columns = ["Cohort ID","Creation Date"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); @@ -301,10 +301,10 @@ context("Cohort Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Cohort ID") + BrowserTest.getColumnIndexByHeader("Cohort ID"); cy.get("@indexColumn") .then((indexColumn) => { - const indexRow = 2 + const indexRow = 2; // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`tbody tr`) .eq(indexRow) @@ -312,7 +312,7 @@ context("Cohort Browser Grid", () => { .find("td") .eq(indexColumn) .invoke("text") - .as("textRow") + .as("textRow"); }); cy.get("@textRow") @@ -321,7 +321,7 @@ context("Cohort Browser Grid", () => { .invoke("text") .then((text) => { const textTab = text.trim().split(" "); - expect(textRow).to.equal(textTab[1].trim()); + expect(textRow.trim()).to.equal(textTab[1].trim()); }); }); }); From b91cf3340dac9a08245f1ed1be7906ffa0a5a395 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 15:56:35 +0100 Subject: [PATCH 18/73] wc - Fixed extensions for disease panel, no multicolumn anymore Signed-off-by: gpveronica --- src/sites/test-app/extensions/extensions.js | 29 +-------------------- 1 file changed, 1 insertion(+), 28 deletions(-) diff --git a/src/sites/test-app/extensions/extensions.js b/src/sites/test-app/extensions/extensions.js index 752665dd83..48d7d73216 100644 --- a/src/sites/test-app/extensions/extensions.js +++ b/src/sites/test-app/extensions/extensions.js @@ -82,6 +82,7 @@ window.IVA_EXTENSIONS = { "individual-grid", "job-grid", "sample-grid", + "disease-panel-grid", ], maintainer: "", version: "", @@ -99,34 +100,6 @@ window.IVA_EXTENSIONS = { }, ], }, - { - id: "catalog-columns-multiple", - name: "Catalog Columns", - description: "Example columns for Catalog Grids", - type: "column", - components: [ - "disease-panel-grid", - ], - maintainer: "", - version: "", - compatibleWith: "", - columns: [ - [ - { - // position: 0, - config: { - id: "new-column-1", - title: "Extra column", - field: "", - align: "center", - rowspan: 2, - colspan: 1, - formatter: (value, row, index) => `Row ${index}`, - }, - }, - ], - ], - }, { id: "catalog-detail", name: "New Catalog Tab", From 5fd9776edf483be5bb917ef59926f2cd1020a334 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 17:03:28 +0100 Subject: [PATCH 19/73] wc - Fixed tests for disease panel Signed-off-by: gpveronica --- .../e2e/iva/disease-panel-browser-grid.cy.js | 6 +- .../test-app/clients/api-mock/DiseasePanel.js | 2 +- src/sites/test-app/test-app.js | 2 +- .../disease-panel-browser-grid-test.js | 79 +++++++++++-------- 4 files changed, 52 insertions(+), 37 deletions(-) diff --git a/cypress/e2e/iva/disease-panel-browser-grid.cy.js b/cypress/e2e/iva/disease-panel-browser-grid.cy.js index 413f56351c..62daa6b8b7 100644 --- a/cypress/e2e/iva/disease-panel-browser-grid.cy.js +++ b/cypress/e2e/iva/disease-panel-browser-grid.cy.js @@ -345,7 +345,7 @@ context("Disease Panel Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Panel ID"); + BrowserTest.getColumnIndexByHeader("Panel"); cy.get("@indexColumn") .then(indexColumn => { const indexRow = 2; @@ -362,11 +362,13 @@ context("Disease Panel Browser Grid", () => { cy.get("@textRow") .then((textRow) => { const textRowTrimmed = textRow.trim(); + const lastLineMatch = textRowTrimmed.match(/(?:^|\n)([^\n]+)$/); + const id = lastLineMatch ? lastLineMatch[1].trim() : textRowTrimmed; cy.get("detail-tabs > div.panel") .invoke("text") .then((text) => { const textTab = text.trim().split(" "); - expect(textRowTrimmed).to.equal(textTab[2].trim()); + expect(id).to.equal(textTab[2].trim()); }); }); }); diff --git a/src/sites/test-app/clients/api-mock/DiseasePanel.js b/src/sites/test-app/clients/api-mock/DiseasePanel.js index cf7027d9bf..8cde94b0e1 100644 --- a/src/sites/test-app/clients/api-mock/DiseasePanel.js +++ b/src/sites/test-app/clients/api-mock/DiseasePanel.js @@ -35,7 +35,7 @@ export default class DiseasePanel { } info(panels, params) { - // Mocked response for Sample update test + // Mocked response for Disease Panel update test if (panels === "Early_onset_dystonia-PanelAppId-192") { return UtilsNew.importJSONFile(`./test-data/${this._config.testDataVersion}/disease-panels-platinum.json`) .then(data => ({ diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index 0722eee441..a7ba03620f 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -733,7 +733,7 @@ class TestApp extends LitElement { ${this.config.enabledComponents["disease-panel-browser-grid"] ? html`
diff --git a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js index 8391be1712..93666cda1f 100644 --- a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js @@ -61,7 +61,19 @@ class DiseasePanelBrowserGridTest extends LitElement { this._data = []; this._selectedInstance = {}; - this._config = {}; + this._config = { + pageSize: 10, + pageList: [10, 25, 50], + multiSelection: false, + showSelectCheckbox: false, + toolbar: { + showColumns: true, + showDownload: false, + showExport: false, + showSettings: false, + exportTabs: ["download", "link", "code"] + }, + }; } // TODO: The Sample Browser Test needs to test two things: @@ -103,40 +115,11 @@ class DiseasePanelBrowserGridTest extends LitElement { onSettingsUpdate() { this._config = { + ...this._config, ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }; - this.propertyObserver(); - } - - getDefaultTabsConfig() { - return { - title: "Disease Panel", - showTitle: true, - items: [ - { - id: "disease-panel-view", - name: "Summary", - active: true, - render: (diseasePanel, _active, opencgaSession) => html` - - - `, - }, - { - id: "json-view", - name: "JSON Data", - render: (diseasePanel, active) => html` - - - `, - }, - ] - }; + this.propertyObserver(); } mutate() { @@ -168,7 +151,7 @@ class DiseasePanelBrowserGridTest extends LitElement { @@ -181,6 +164,36 @@ class DiseasePanelBrowserGridTest extends LitElement { `; } + getDefaultTabsConfig() { + return { + title: "Disease Panel", + showTitle: true, + items: [ + { + id: "disease-panel-view", + name: "Summary", + active: true, + render: (diseasePanel, _active, opencgaSession) => html` + + + `, + }, + { + id: "json-view", + name: "JSON Data", + render: (diseasePanel, active) => html` + + + `, + }, + ] + }; + } + } customElements.define("disease-panel-browser-grid-test", DiseasePanelBrowserGridTest); From dba3ba18b306f4439449a56df32c03a2ec35617e Mon Sep 17 00:00:00 2001 From: gpveronica Date: Tue, 31 Oct 2023 17:15:10 +0100 Subject: [PATCH 20/73] wc - Fixed test for file Signed-off-by: gpveronica --- cypress/e2e/iva/file-browser-grid.cy.js | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/cypress/e2e/iva/file-browser-grid.cy.js b/cypress/e2e/iva/file-browser-grid.cy.js index 0588932068..a90a149733 100644 --- a/cypress/e2e/iva/file-browser-grid.cy.js +++ b/cypress/e2e/iva/file-browser-grid.cy.js @@ -22,7 +22,7 @@ context("File Browser Grid", () => { const browserDetail = "file-detail"; beforeEach(() => { - cy.visit("#file-browser-grid") + cy.visit("#file-browser-grid"); cy.waitUntil(() => { return cy.get(browserGrid) .should("be.visible"); @@ -151,8 +151,8 @@ context("File Browser Grid", () => { }); }); - it("should hidden columns [Directory,Format,Bioformat]",() => { - const columns = ["Directory","Format","Bioformat"]; + it("should hidden columns [Name,Format]",() => { + const columns = ["Name","Format"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); @@ -242,7 +242,6 @@ context("File Browser Grid", () => { }); }); - context("detail tab", () => { it("should render", () => { cy.get(browserDetail) @@ -250,10 +249,10 @@ context("File Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Name") + BrowserTest.getColumnIndexByHeader("Name"); cy.get("@indexColumn") .then((indexColumn) => { - const indexRow = 2 + const indexRow = 2; // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`tbody tr`) .eq(indexRow) @@ -261,7 +260,7 @@ context("File Browser Grid", () => { .find("td") .eq(indexColumn) .invoke("text") - .as("textRow") + .as("textRow"); }); cy.get("@textRow") @@ -269,8 +268,12 @@ context("File Browser Grid", () => { cy.get("detail-tabs > div.panel") .invoke("text") .then((text) => { + const textRowTrimmed = textRow.trim(); + const lastLineMatch = textRowTrimmed.match(/^([^\n]+)/); + const id = lastLineMatch ? lastLineMatch[1].trim() : textRowTrimmed; + const textTab = text.split(":"); - expect(textRow).to.equal(textTab[1].trim()); + expect(id).to.equal(textTab[1].trim()); }); }); }); From f27562a041d56eb9888450a66e320223995cba12 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 11:13:03 +0100 Subject: [PATCH 21/73] wc - Fixed test for individual Signed-off-by: gpveronica --- cypress/e2e/iva/individual-browser-grid.cy.js | 22 ++++++++++--------- .../individual-browser-grid-test.js | 7 +++--- 2 files changed, 16 insertions(+), 13 deletions(-) diff --git a/cypress/e2e/iva/individual-browser-grid.cy.js b/cypress/e2e/iva/individual-browser-grid.cy.js index 4925d0150a..07066acfdc 100644 --- a/cypress/e2e/iva/individual-browser-grid.cy.js +++ b/cypress/e2e/iva/individual-browser-grid.cy.js @@ -326,7 +326,7 @@ context("Individual Browser Grid", () => { cy.get("@body") .find(`td:nth-child(${creationDateIndex})`) .each(td => { - const regExp = /^(([0-9])|([0-2][0-9])|([3][0-1])) (Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d{4}$/ + const regExp = /^(([0-9])|([0-2][0-9])|([3][0-1])) (Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d{4}$/; expect(td.text()).to.match(regExp); }); }); @@ -350,17 +350,15 @@ context("Individual Browser Grid", () => { .as("row"); }); - }); context("extension", () => { it("should display 'Extra Column' column", () => { cy.get("thead th") .contains("Extra column") - .should('be.visible') - }) - }) - + .should('be.visible'); + }); + }); }); @@ -378,10 +376,10 @@ context("Individual Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Individual") + BrowserTest.getColumnIndexByHeader("Individual"); cy.get("@indexColumn") .then(indexColumn => { - const indexRow = 2 + const indexRow = 2; // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`tbody tr`) .eq(indexRow) @@ -389,7 +387,7 @@ context("Individual Browser Grid", () => { .find("td") .eq(indexColumn) .invoke("text") - .as("textRow") + .as("textRow"); }); cy.get("@textRow") @@ -397,8 +395,12 @@ context("Individual Browser Grid", () => { cy.get("detail-tabs > div.panel") .invoke("text") .then((text) => { + const textRowTrimmed = textRow.trim(); + const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); + const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; + const textTab = text.trim().split(" "); - expect(textRow).to.equal(textTab[1].trim()); + expect(id).to.equal(textTab[1].trim()); }); }); }); diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 99101bfa7c..d4b47c4508 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -83,7 +83,7 @@ class IndividualBrowserGridTest extends LitElement { } propertyObserver() { - if (this.opencgaSession?.cellbaseClient && this.testDataVersion) { + if (this.opencgaSession && this.testDataVersion) { const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); @@ -108,9 +108,10 @@ class IndividualBrowserGridTest extends LitElement { onSettingsUpdate() { this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL]?.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, }; - this.propertyObserver(); + // this.propertyObserver(); + this.requestUpdate(); } getDefaultTabsConfig() { From 8b7f43771f2f7d1306b7f11eec9bc206222f69e8 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 11:16:41 +0100 Subject: [PATCH 22/73] wc - Fixed test for job Signed-off-by: gpveronica --- cypress/e2e/iva/job-browser-grid.cy.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/cypress/e2e/iva/job-browser-grid.cy.js b/cypress/e2e/iva/job-browser-grid.cy.js index ff5858f123..2f99a3359e 100644 --- a/cypress/e2e/iva/job-browser-grid.cy.js +++ b/cypress/e2e/iva/job-browser-grid.cy.js @@ -269,8 +269,12 @@ context("Job Browser Grid", () => { cy.get("detail-tabs > div.panel") .invoke("text") .then((text) => { + const textRowTrimmed = textRow.trim(); + const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); + const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; + const textTab = text.trim().split(" "); - expect(textRow).to.equal(textTab[1].trim()); + expect(id).to.equal(textTab[1].trim()); }); }); }); From 059bed1472d0d2104834587c9e11268368320cf3 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 13:19:40 +0100 Subject: [PATCH 23/73] wc - Fixed test for variant browser cancer Signed-off-by: gpveronica --- cypress/e2e/iva/variant-browser-grid-cancer.cy.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/cypress/e2e/iva/variant-browser-grid-cancer.cy.js b/cypress/e2e/iva/variant-browser-grid-cancer.cy.js index bf53596132..3c8778ce10 100644 --- a/cypress/e2e/iva/variant-browser-grid-cancer.cy.js +++ b/cypress/e2e/iva/variant-browser-grid-cancer.cy.js @@ -94,13 +94,11 @@ context("Variant Browser Grid Cancer", () => { tag:"div", elementId: "SettingModal" }).as("settingModal"); + cy.get("@settingModal") .contains("button", "OK") .click(); - cy.get("@headerColumns") - .should("not.exist"); - cy.get("@headerColumns") - .should("exist"); + cy.get("@headerColumns") .should($header => { const _columns = Array.from($header, th => th.textContent?.trim()); From b53557512161e16d92d22e5fd818185bc98b24a7 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 15:19:16 +0100 Subject: [PATCH 24/73] wc - Fixed test for variant interpreter grid germline Signed-off-by: gpveronica --- cypress/e2e/iva/variant-interpreter-grid-germline.cy.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js b/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js index 8ff4d37102..2392e85498 100644 --- a/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js +++ b/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js @@ -98,10 +98,6 @@ context("Variant Interpreter Grid Germiline", () => { cy.get("@settingModal") .contains("button", "OK") .click(); - cy.get("@headerColumns") - .should("not.exist"); - cy.get("@headerColumns") - .should("exist"); cy.get("@headerColumns") .should($header => { const _columns = Array.from($header, th => th.textContent.trim()); From f865e644da3d49e50589f77f4e4cfaa7c22e564a Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 16:30:49 +0100 Subject: [PATCH 25/73] wc - Fixed test for sample Signed-off-by: gpveronica --- cypress/e2e/iva/sample-browser-grid.cy.js | 29 +++++++++++++---------- 1 file changed, 17 insertions(+), 12 deletions(-) diff --git a/cypress/e2e/iva/sample-browser-grid.cy.js b/cypress/e2e/iva/sample-browser-grid.cy.js index 8b5d5e4044..5bd84daa05 100644 --- a/cypress/e2e/iva/sample-browser-grid.cy.js +++ b/cypress/e2e/iva/sample-browser-grid.cy.js @@ -300,24 +300,25 @@ context("Sample Browser Grid", () => { it("should move modal setting", () => { cy.get("button[data-action='settings']") - .click() + .click(); BrowserTest.getElementByComponent({ selector: 'sample-grid opencb-grid-toolbar', tag:'div', elementId: 'SettingModal' - }).as("settingModal") + }).as("settingModal"); cy.get("@settingModal") .then(($modal) => { const startPosition = $modal.offset(); cy.log("start Position:", startPosition); // Drag the modal to a new position using Cypress's drag command + // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get("@settingModal") .find('.modal-header') .trigger('mousedown', { which: 1 }) // Trigger mouse down event .trigger('mousemove', { clientX: 100, clientY: 100 }) // Move the mouse - .trigger('mouseup') // Release the mouse + .trigger('mouseup'); // Release the mouse // Get the final position of the modal cy.get(`@settingModal`) @@ -359,7 +360,7 @@ context("Sample Browser Grid", () => { .then(i => { creationDateIndex = i + 1; cy.get("@body") - .find(`td:nth-child(${i})`) + .find(`td:nth-child(${creationDateIndex})`) .each(td => { cy.wrap(td) .should("not.be.empty"); @@ -371,7 +372,7 @@ context("Sample Browser Grid", () => { cy.get("@body") .find(`td:nth-child(${creationDateIndex})`) .each(td => { - const regExp = /^(([0-9])|([0-2][0-9])|([3][0-1])) (Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d{4}$/ + const regExp = /^(([0-9])|([0-2][0-9])|([3][0-1])) (Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d{4}$/; expect(td.text()).to.match(regExp); }); }); @@ -400,9 +401,9 @@ context("Sample Browser Grid", () => { it("should display 'Extra Column' column", () => { cy.get("thead th") .contains("Extra column") - .should('be.visible') - }) - }) + .should('be.visible'); + }); + }); }); @@ -420,10 +421,10 @@ context("Sample Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Sample ID") + BrowserTest.getColumnIndexByHeader("Sample ID"); cy.get("@indexColumn") .then(indexColumn => { - const indexRow = 2 + const indexRow = 2; // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`tbody tr`) .eq(indexRow) @@ -431,7 +432,7 @@ context("Sample Browser Grid", () => { .find("td") .eq(indexColumn) .invoke("text") - .as("textRow") + .as("textRow"); }); cy.get("@textRow") @@ -439,8 +440,12 @@ context("Sample Browser Grid", () => { cy.get("detail-tabs > div.panel") .invoke("text") .then((text) => { + const textRowTrimmed = textRow.trim(); + const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); + const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; + const textTab = text.trim().split(" "); - expect(textRow).to.equal(textTab[1].trim()); + expect(id).to.equal(textTab[1].trim()); }); }); }); From 202ab91d843cc790c112195af50785490d769e9d Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 16:54:57 +0100 Subject: [PATCH 26/73] wc - Fixed test variant browser grid Signed-off-by: gpveronica --- cypress/e2e/iva/variant-browser-grid-germline.cy.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/cypress/e2e/iva/variant-browser-grid-germline.cy.js b/cypress/e2e/iva/variant-browser-grid-germline.cy.js index 63da1634a6..7d8d43a5aa 100644 --- a/cypress/e2e/iva/variant-browser-grid-germline.cy.js +++ b/cypress/e2e/iva/variant-browser-grid-germline.cy.js @@ -97,10 +97,6 @@ context("Variant Browser Grid Germline", () => { cy.get("@settingModal") .contains("button", "OK") .click(); - cy.get("@headerColumns") - .should("not.exist"); - cy.get("@headerColumns") - .should("exist"); cy.get("@headerColumns") .then($header => { const _columns = Array.from($header, th => th.textContent.trim()); From 45513a0972098a5350bd3a7dd2444753e66f2834 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 2 Nov 2023 17:13:24 +0100 Subject: [PATCH 27/73] wc - Fixed test variant browser grid and minor improvements Signed-off-by: gpveronica --- cypress/e2e/iva/file-browser-grid.cy.js | 4 ++-- .../test-app/webcomponents/disease-panel-browser-grid-test.js | 2 +- src/sites/test-app/webcomponents/sample-browser-grid-test.js | 2 +- src/sites/test-app/webcomponents/variant-browser-grid-test.js | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/cypress/e2e/iva/file-browser-grid.cy.js b/cypress/e2e/iva/file-browser-grid.cy.js index a90a149733..26304e2be7 100644 --- a/cypress/e2e/iva/file-browser-grid.cy.js +++ b/cypress/e2e/iva/file-browser-grid.cy.js @@ -269,8 +269,8 @@ context("File Browser Grid", () => { .invoke("text") .then((text) => { const textRowTrimmed = textRow.trim(); - const lastLineMatch = textRowTrimmed.match(/^([^\n]+)/); - const id = lastLineMatch ? lastLineMatch[1].trim() : textRowTrimmed; + const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); + const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; const textTab = text.split(":"); expect(id).to.equal(textTab[1].trim()); diff --git a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js index 93666cda1f..21310d09e9 100644 --- a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js @@ -91,7 +91,7 @@ class DiseasePanelBrowserGridTest extends LitElement { } propertyObserver() { - if (this.opencgaSession?.cellbaseClient && this.testDataVersion) { + if (this.opencgaSession && this.testDataVersion) { const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index d8b337df06..324e562b3f 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -78,7 +78,7 @@ class SampleBrowserGridTest extends LitElement { } propertyObserver() { - if (this.opencgaSession?.cellbaseClient && this.testDataVersion) { + if (this.opencgaSession && this.testDataVersion) { const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); diff --git a/src/sites/test-app/webcomponents/variant-browser-grid-test.js b/src/sites/test-app/webcomponents/variant-browser-grid-test.js index 4819d4f1ba..4d1a55762a 100644 --- a/src/sites/test-app/webcomponents/variant-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/variant-browser-grid-test.js @@ -116,7 +116,7 @@ class VariantBrowserGridTest extends LitElement { onSettingsUpdate() { this._config = { ...this._config, - ...this._config?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid }; this.opencgaSessionObserver(); } From 8b967617600f4e4044975e0c60f867643c2601d0 Mon Sep 17 00:00:00 2001 From: Josemi Date: Fri, 3 Nov 2023 14:17:16 +0100 Subject: [PATCH 28/73] wc: fix COMPONENT_ID format in interpreter browsers #TASK-5194 --- .../interpretation/variant-interpreter-browser-cancer.js | 2 +- .../variant/interpretation/variant-interpreter-browser-cnv.js | 2 +- .../variant/interpretation/variant-interpreter-browser-rd.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js index 8d94841ea7..4b0503dbab 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cancer.js @@ -58,7 +58,7 @@ class VariantInterpreterBrowserCancer extends LitElement { } _init() { - this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_SNV"; + this.COMPONENT_ID = "variant-interpreter-cancer-snv"; this._prefix = UtilsNew.randomString(8); this.query = {}; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js index ee80b900b0..d541f7c37e 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-cnv.js @@ -55,7 +55,7 @@ class VariantInterpreterBrowserCNV extends LitElement { } _init() { - this.COMPONENT_ID = "VARIANT_INTERPRETER_CANCER_CNV"; + this.COMPONENT_ID = "variant-interpreter-cancer-cnv"; this._prefix = UtilsNew.randomString(8); this.query = {}; diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js b/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js index 4fe19d7929..27ce208b1f 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-browser-rd.js @@ -58,7 +58,7 @@ class VariantInterpreterBrowserRd extends LitElement { } _init() { - this.COMPONENT_ID = "VARIANT_INTERPRETER_RD"; + this.COMPONENT_ID = "variant-interpreter-rd"; this._prefix = UtilsNew.randomString(8); this.query = {}; From 4687d14519c46c0a049036f1d547219021ca0fda Mon Sep 17 00:00:00 2001 From: Josemi Date: Fri, 3 Nov 2023 14:17:42 +0100 Subject: [PATCH 29/73] wc: minor fixes in interpreter grid #TASK-5194 --- .../variant/interpretation/variant-interpreter-grid.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/variant/interpretation/variant-interpreter-grid.js b/src/webcomponents/variant/interpretation/variant-interpreter-grid.js index 1a45a48236..7c4af986e7 100644 --- a/src/webcomponents/variant/interpretation/variant-interpreter-grid.js +++ b/src/webcomponents/variant/interpretation/variant-interpreter-grid.js @@ -70,7 +70,7 @@ export default class VariantInterpreterGrid extends LitElement { } #init() { - this.COMPONENT_ID = this.toolId + "-grid"; + this.COMPONENT_ID = ""; this._prefix = UtilsNew.randomString(8); this.gridId = this._prefix + "VariantBrowserGrid"; this.checkedVariants = new Map(); From 84bdf1e2e643280e90c5b7aed5a67f1a6f56ea90 Mon Sep 17 00:00:00 2001 From: Josemi Date: Fri, 3 Nov 2023 14:25:12 +0100 Subject: [PATCH 30/73] wc: add toolId to clinical-analysis-group #TASK-5194 --- src/webcomponents/clinical/clinical-analysis-group.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/webcomponents/clinical/clinical-analysis-group.js b/src/webcomponents/clinical/clinical-analysis-group.js index 99c124fcc3..b3283585c5 100644 --- a/src/webcomponents/clinical/clinical-analysis-group.js +++ b/src/webcomponents/clinical/clinical-analysis-group.js @@ -15,6 +15,9 @@ export default class ClinicalAnalysisGroup extends LitElement { static get properties() { return { + toolId: { + type: String, + }, opencgaSession: { type: Object, }, @@ -31,6 +34,7 @@ export default class ClinicalAnalysisGroup extends LitElement { } #init() { + this.COMPONENT_ID = "clinical-analysis-group"; this._prefix = UtilsNew.randomString(8); this._config = this.getDefaultConfig(); this.activeGroup = this._config.groups[0]; @@ -134,6 +138,7 @@ export default class ClinicalAnalysisGroup extends LitElement { + ${item || this.activeGroup.display.emptyTitle} + + + + +
+ `; + } + render() { return html`
@@ -130,27 +155,7 @@ export default class ClinicalAnalysisGroup extends LitElement {
- ${this.groups.map(item => html` -
-

- - ${item || this.activeGroup.display.emptyTitle} - -

- - -
- `)} + ${this.groups.map(item => this.renderGroupItem(item))}
`; } From 369df4b3f55675f0c32463f04f385287857761f1 Mon Sep 17 00:00:00 2001 From: Josemi Date: Fri, 3 Nov 2023 14:28:45 +0100 Subject: [PATCH 32/73] wc: fix toolId in clinical analysis browser and grid #TASK-5194 --- src/webcomponents/clinical/clinical-analysis-browser.js | 6 ++++-- src/webcomponents/clinical/clinical-analysis-grid.js | 4 ++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/webcomponents/clinical/clinical-analysis-browser.js b/src/webcomponents/clinical/clinical-analysis-browser.js index f4266e0a7b..2b478b3df7 100644 --- a/src/webcomponents/clinical/clinical-analysis-browser.js +++ b/src/webcomponents/clinical/clinical-analysis-browser.js @@ -54,6 +54,7 @@ export default class ClinicalAnalysisBrowser extends LitElement { } #init() { + this.COMPONENT_ID = "clinical-analysis-browser"; this._prefix = UtilsNew.randomString(8); this._config = this.getDefaultConfig(); } @@ -92,7 +93,7 @@ export default class ClinicalAnalysisBrowser extends LitElement { // Apply user configuration UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this._config.componentId]?.grid, + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, }); @@ -143,7 +144,7 @@ export default class ClinicalAnalysisBrowser extends LitElement { active: true, render: params => html ` html` Date: Fri, 3 Nov 2023 14:33:53 +0100 Subject: [PATCH 33/73] wc: fix toolId observer in clinical analysis grid #TASK-5194 --- src/webcomponents/clinical/clinical-analysis-grid.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/webcomponents/clinical/clinical-analysis-grid.js b/src/webcomponents/clinical/clinical-analysis-grid.js index 4e0ed7329c..26d7c19a8c 100644 --- a/src/webcomponents/clinical/clinical-analysis-grid.js +++ b/src/webcomponents/clinical/clinical-analysis-grid.js @@ -65,7 +65,10 @@ export default class ClinicalAnalysisGrid extends LitElement { } updated(changedProperties) { - if ((changedProperties.has("opencgaSession") || changedProperties.has("query") || changedProperties.has("config") || + if ((changedProperties.has("opencgaSession") || + changedProperties.has("toolId") || + changedProperties.has("query") || + changedProperties.has("config") || changedProperties.has("active")) && this.active) { this.propertyObserver(); } From fb32792c74a4e2815bbadb76f04ff265a8f3d31e Mon Sep 17 00:00:00 2001 From: Josemi Date: Fri, 3 Nov 2023 14:34:55 +0100 Subject: [PATCH 34/73] wc: fix toolId in cohort browser and grid #TASK-5194 --- src/webcomponents/cohort/cohort-browser.js | 6 ++++-- src/webcomponents/cohort/cohort-grid.js | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/cohort/cohort-browser.js b/src/webcomponents/cohort/cohort-browser.js index 65873140c4..1a25c9524c 100644 --- a/src/webcomponents/cohort/cohort-browser.js +++ b/src/webcomponents/cohort/cohort-browser.js @@ -49,7 +49,7 @@ export default class CohortBrowser extends LitElement { } _init() { - this.TOOL_ID = "COHORT_BROWSER"; + this.COMPONENT_ID = "cohort-browser"; this._config = this.getDefaultConfig(); } @@ -81,7 +81,7 @@ export default class CohortBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -118,6 +118,7 @@ export default class CohortBrowser extends LitElement { active: true, render: params => html ` Date: Fri, 3 Nov 2023 14:40:28 +0100 Subject: [PATCH 35/73] wc: fix toolId in disease panel browser and grid #TASK-5194 --- src/webcomponents/disease-panel/disease-panel-browser.js | 6 ++++-- src/webcomponents/disease-panel/disease-panel-grid.js | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/disease-panel/disease-panel-browser.js b/src/webcomponents/disease-panel/disease-panel-browser.js index 22a63d96b2..76fcf08803 100644 --- a/src/webcomponents/disease-panel/disease-panel-browser.js +++ b/src/webcomponents/disease-panel/disease-panel-browser.js @@ -56,7 +56,7 @@ export default class DiseasePanelBrowser extends LitElement { } _init() { - this.TOOL_ID = "DISEASE_PANEL_BROWSER"; + this.COMPONENT_ID = "disease-panel-browser"; this._config = this.getDefaultConfig(); } @@ -91,7 +91,7 @@ export default class DiseasePanelBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -129,6 +129,7 @@ export default class DiseasePanelBrowser extends LitElement { active: true, render: params => html` Date: Fri, 3 Nov 2023 14:43:16 +0100 Subject: [PATCH 36/73] wc: fix toolId in family browser and grid #TASK-5194 --- src/webcomponents/family/family-browser.js | 5 +++-- src/webcomponents/family/family-grid.js | 3 ++- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/family/family-browser.js b/src/webcomponents/family/family-browser.js index 61c8ee0495..348dac49ae 100644 --- a/src/webcomponents/family/family-browser.js +++ b/src/webcomponents/family/family-browser.js @@ -50,7 +50,7 @@ export default class FamilyBrowser extends LitElement { } _init() { - this.TOOL_ID = "FAMILY_BROWSER"; + this.COMPONENT_ID = "family-browser"; this._config = this.getDefaultConfig(); } @@ -82,7 +82,7 @@ export default class FamilyBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -124,6 +124,7 @@ export default class FamilyBrowser extends LitElement { active: true, render: params => html ` Date: Fri, 3 Nov 2023 14:45:30 +0100 Subject: [PATCH 37/73] wc: fix toolId in file browser and grid #TASK-5194 --- src/webcomponents/file/file-browser.js | 6 ++++-- src/webcomponents/file/file-grid.js | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/file/file-browser.js b/src/webcomponents/file/file-browser.js index 1520469915..8b35b5fb7e 100644 --- a/src/webcomponents/file/file-browser.js +++ b/src/webcomponents/file/file-browser.js @@ -53,7 +53,7 @@ export default class FileBrowser extends LitElement { } _init() { - this.TOOL_ID = "FILE_BROWSER"; + this.COMPONENT_ID = "file-browser"; this._config = this.getDefaultConfig(); } @@ -85,7 +85,7 @@ export default class FileBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -127,6 +127,7 @@ export default class FileBrowser extends LitElement { active: true, render: params => html` Date: Fri, 3 Nov 2023 14:47:45 +0100 Subject: [PATCH 38/73] wc: fix toolId in individual browser and grid #TASK-5194 --- src/webcomponents/individual/individual-browser.js | 5 +++-- src/webcomponents/individual/individual-grid.js | 6 +++++- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/individual/individual-browser.js b/src/webcomponents/individual/individual-browser.js index 25727d828e..46a8ab2b7c 100644 --- a/src/webcomponents/individual/individual-browser.js +++ b/src/webcomponents/individual/individual-browser.js @@ -56,7 +56,7 @@ export default class IndividualBrowser extends LitElement { } _init() { - this.TOOL_ID = "INDIVIDUAL_BROWSER"; + this.COMPONENT_ID = "individual-browser"; this._config = this.getDefaultConfig(); } @@ -88,7 +88,7 @@ export default class IndividualBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -130,6 +130,7 @@ export default class IndividualBrowser extends LitElement { active: true, render: params => html` Date: Fri, 3 Nov 2023 14:50:01 +0100 Subject: [PATCH 39/73] wc: fix toolId in job browser and grid #TASK-5194 --- src/webcomponents/job/job-browser.js | 5 +++-- src/webcomponents/job/job-grid.js | 6 +++++- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/job/job-browser.js b/src/webcomponents/job/job-browser.js index b7f2ab6018..14644d481c 100644 --- a/src/webcomponents/job/job-browser.js +++ b/src/webcomponents/job/job-browser.js @@ -53,7 +53,7 @@ export default class JobBrowser extends LitElement { } _init() { - this.TOOL_ID = "JOB_BROWSER"; + this.COMPONENT_ID = "job-browser"; this._config = this.getDefaultConfig(); } @@ -85,7 +85,7 @@ export default class JobBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -134,6 +134,7 @@ export default class JobBrowser extends LitElement { active: true, render: params => html` Date: Fri, 3 Nov 2023 14:51:41 +0100 Subject: [PATCH 40/73] wc: fix toolId in sample browser and grid #TASK-5194 --- src/webcomponents/sample/sample-browser.js | 6 ++++-- src/webcomponents/sample/sample-grid.js | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/webcomponents/sample/sample-browser.js b/src/webcomponents/sample/sample-browser.js index 896c469587..857b161bce 100644 --- a/src/webcomponents/sample/sample-browser.js +++ b/src/webcomponents/sample/sample-browser.js @@ -50,7 +50,7 @@ export default class SampleBrowser extends LitElement { } _init() { - this.TOOL_ID = "SAMPLE_BROWSER"; + this.COMPONENT_ID = "sample-browser"; this._config = this.getDefaultConfig(); } @@ -82,7 +82,7 @@ export default class SampleBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize' and 'columns' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid + ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid }); this.requestUpdate(); @@ -125,6 +125,7 @@ export default class SampleBrowser extends LitElement { render: params => { return html` Date: Fri, 3 Nov 2023 14:55:41 +0100 Subject: [PATCH 41/73] wc: fix toolId in variant browser and grid #TASK-5194 --- src/webcomponents/variant/variant-browser-grid.js | 7 +++++-- src/webcomponents/variant/variant-browser.js | 4 ++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/webcomponents/variant/variant-browser-grid.js b/src/webcomponents/variant/variant-browser-grid.js index 414188185f..2f8d3457e8 100644 --- a/src/webcomponents/variant/variant-browser-grid.js +++ b/src/webcomponents/variant/variant-browser-grid.js @@ -42,6 +42,9 @@ export default class VariantBrowserGrid extends LitElement { static get properties() { return { + toolId: { + type: String, + }, opencgaSession: { type: Object }, @@ -99,7 +102,7 @@ export default class VariantBrowserGrid extends LitElement { this.configObserver(); this.renderVariants(); } - if (changedProperties.has("config")) { + if (changedProperties.has("config") || changedProperties.has("toolId")) { this.configObserver(); this.requestUpdate(); this.renderVariants(); @@ -149,7 +152,7 @@ export default class VariantBrowserGrid extends LitElement { }; this.toolbarConfig = { - toolId: "VARIANT_BROWSER", + toolId: this.toolId, resource: "VARIANT", disableCreate: true, showInterpreterConfig: true, diff --git a/src/webcomponents/variant/variant-browser.js b/src/webcomponents/variant/variant-browser.js index e4f3b97920..fc552bdb28 100644 --- a/src/webcomponents/variant/variant-browser.js +++ b/src/webcomponents/variant/variant-browser.js @@ -84,7 +84,6 @@ export default class VariantBrowser extends LitElement { } _init() { - this.TOOL_ID = "VARIANT_BROWSER"; this.COMPONENT_ID = "variant-browser"; this._prefix = UtilsNew.randomString(8); @@ -148,7 +147,7 @@ export default class VariantBrowser extends LitElement { // Apply User grid configuration. Only 'pageSize', 'columns', 'geneSet', 'consequenceType' and 'populationFrequenciesConfig' are set UtilsNew.setObjectValue(this._config, "filter.result.grid", { ...this._config.filter?.result?.grid, - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, }); this.requestUpdate(); @@ -421,6 +420,7 @@ export default class VariantBrowser extends LitElement {
Date: Fri, 3 Nov 2023 17:24:24 +0100 Subject: [PATCH 42/73] test: fix COMPONENT_ID in all catalog and variant browsers #TASK-5194 --- .../test-app/webcomponents/cohort-browser-grid-test.js | 5 +++-- .../webcomponents/disease-panel-browser-grid-test.js | 7 ++++--- .../test-app/webcomponents/family-browser-grid-test.js | 5 +++-- src/sites/test-app/webcomponents/file-browser-grid-test.js | 7 +++---- .../test-app/webcomponents/individual-browser-grid-test.js | 7 ++++--- src/sites/test-app/webcomponents/job-browser-grid-test.js | 2 -- .../test-app/webcomponents/sample-browser-grid-test.js | 5 +++-- .../test-app/webcomponents/variant-browser-grid-test.js | 5 +++-- 8 files changed, 23 insertions(+), 20 deletions(-) diff --git a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js index d36032f30d..abf65df515 100644 --- a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js @@ -58,7 +58,7 @@ class CohortBrowserGridTest extends LitElement { } #init() { - this.TOOL_ID = "COHORT_BROWSER"; + this.COMPONENT_ID = "cohort-browser"; this.isLoading = false; this.data = []; this._config = {}; @@ -95,7 +95,7 @@ class CohortBrowserGridTest extends LitElement { onSettingsUpdate() { this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, }; this.opencgaSessionObserver(); } @@ -166,6 +166,7 @@ class CohortBrowserGridTest extends LitElement { Catalog Browser Grid (${this.testFile}) Date: Fri, 3 Nov 2023 17:41:37 +0100 Subject: [PATCH 43/73] test: fix COMPONENT_ID in job browser test #TASK-5194 --- src/sites/test-app/webcomponents/job-browser-grid-test.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/sites/test-app/webcomponents/job-browser-grid-test.js b/src/sites/test-app/webcomponents/job-browser-grid-test.js index d6781bf2b2..c197e27527 100644 --- a/src/sites/test-app/webcomponents/job-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/job-browser-grid-test.js @@ -55,7 +55,7 @@ class JobBrowserGridTest extends LitElement { } #init() { - this.TOOL_ID = "JOB_BROWSER"; + this.COMPONENT_ID = "job-browser"; this.isLoading = false; this.data = []; this._config = {}; @@ -99,7 +99,7 @@ class JobBrowserGridTest extends LitElement { } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.TOOL_ID]?.grid}; + this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid}; this.opencgaSessionObserver(); } @@ -113,6 +113,7 @@ class JobBrowserGridTest extends LitElement { Catalog Browser Grid (${this.testFile}) Date: Mon, 6 Nov 2023 12:48:03 +0100 Subject: [PATCH 44/73] wc - Added annotation tests Signed-off-by: gpveronica --- cypress/e2e/iva/individual-browser-grid.cy.js | 63 ++++++ src/sites/test-app/test-app.js | 5 +- .../individual-browser-grid-test.js | 206 ++++++++++++++++-- 3 files changed, 258 insertions(+), 16 deletions(-) diff --git a/cypress/e2e/iva/individual-browser-grid.cy.js b/cypress/e2e/iva/individual-browser-grid.cy.js index 07066acfdc..ab57f071cb 100644 --- a/cypress/e2e/iva/individual-browser-grid.cy.js +++ b/cypress/e2e/iva/individual-browser-grid.cy.js @@ -171,6 +171,7 @@ context("Individual Browser Grid", () => { }); }); + // MODAL SETTINGS context("Modal Setting", () => { it("should move modal setting", () => { @@ -289,6 +290,7 @@ context("Individual Browser Grid", () => { }); }); + // 2. Data completeness in the grid context("data completeness", () => { let creationDateIndex = null; @@ -343,6 +345,7 @@ context("Individual Browser Grid", () => { }); + // 3. Data format context("data format", () => { beforeEach(() => { cy.get("@grid") @@ -352,6 +355,7 @@ context("Individual Browser Grid", () => { }); + // 4. Extensions context("extension", () => { it("should display 'Extra Column' column", () => { cy.get("thead th") @@ -360,8 +364,67 @@ context("Individual Browser Grid", () => { }); }); + // 5. Annotations + context("annotations", () => { + const annotations = [ + { + title: "Cardiology Tests", + position: 6, + variables: ["ecg_test", "echo_test"] + }, + { + title: "Risk Assessment", + position: 7, + variables: ["date_risk_assessment"] + } + ]; + + beforeEach(() => { + cy.get("@grid") + .find("table") + .as("table"); + }); + + // 5.1 Render each varSet title as column header + it("should render enabled varSet column titles", () => { + cy.wrap(annotations).each(annotation => { + cy.get("@table") + .contains("thead tr th", annotation.title); + }); + }); + // 5.2 Render each varSet column at the position configured in position + it("should have varSet index configured equal to index displayed on Risk Assessment", () => { + cy.wrap(annotations).each(annotation => { + cy.get("@table") + .contains("thead tr th", annotation.title) + .invoke("index") + .then(i => { + // 1. Test index column configured equals column index rendered + expect(i-1).equal(annotation.position); + }); + }); + }); + // 5.3 Render variables correctly + it("should have varSet index configured equal to index displayed on Risk Assessment", () => { + cy.wrap(annotations).each(annotation => { + cy.get("@table") + .contains("thead tr th", annotation.title) + .invoke("index") + .then(i => { + // 1. Test index column configured equals column index rendered + cy.get("tbody tr").first() + .find(`td:nth-child(${i+1})`).then(cell => { + const text = cell.text(); + expect(text).contains(annotation.variables[0]); + + }); + }); + }); + }); + }); }); + // DETAIL TABS context("Detail", () => { beforeEach(() => { diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index a7ba03620f..37d26f73b3 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -215,7 +215,8 @@ class TestApp extends LitElement { // this.opencgaSession = content; // this.requestUpdate(); // }); - this.opencgaSession = {}; + // this.opencgaSession = {}; + this.opencgaSession = null; this.initProjectMock(); } @@ -680,7 +681,7 @@ class TestApp extends LitElement {
diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 73f6ddb8c8..569b97f9de 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -46,20 +46,11 @@ class IndividualBrowserGridTest extends LitElement { testDataVersion: { type: String }, - _ready: { - type: Boolean, - state: true, - }, - _selectRow: { - type: Object, - state: true - }, }; } #init() { this.COMPONENT_ID = "individual-browser"; - this._ready = false; this.FILES = [ "individuals-platinum.json", ]; @@ -67,6 +58,13 @@ class IndividualBrowserGridTest extends LitElement { this._selectedInstance = {}; this._config = {}; + this.isLoading = false; + + } + + #setLoading(value) { + this.isLoading = value; + this.requestUpdate(); } update(changedProperties) { @@ -83,8 +81,8 @@ class IndividualBrowserGridTest extends LitElement { } propertyObserver() { + this.#setLoading(true); if (this.opencgaSession && this.testDataVersion) { - const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); @@ -101,7 +99,7 @@ class IndividualBrowserGridTest extends LitElement { .catch(error => { NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); }).finally(() => { - this._ready = true; + this.#setLoading(false); }); } } @@ -146,7 +144,187 @@ class IndividualBrowserGridTest extends LitElement { } mutate() { - return null; + // return null; + // Mutation 1: The first individual has annotations with the variable sets defined for the study + this._data[0].annotationSets = [ + { + id: "cardiology_tests_checklist_annotationset", + name: "cariodology_tests_checklist_annotationset", + variableSetId: "cardiology_tests_checklist", + annotations: { + ecg_exercise_test: "YES", + electrophysiological_study: "YES", + echo_test: "NO", + ecg_test: "YES" + }, + creationDate: "20231006101625", + release: 1, + attributes: [] + }, + { + id: "risk_assessment_annotationset", + name: "risk_assessment_annotationset", + variableSetId: "risk_assessment", + annotations: { + date_risk_assessment: "20-05-2022", + risk_score: 7, + vf_cardiac_arrest_events: "NO", + sdc_iad_family_history: "UNKNOWN", + }, + creationDate: "20231006101625", + release: 1, + attributes: [] + }, + ]; + // Mutation 2: This study has some variableSets defined + this.opencgaSession.study.variableSets = [ + { + "id": "cardiology_test_checklist", + "name": "Individual cardiology test checklist variableSet name", + "unique": true, + "confidential": false, + "internal": false, + "description": "Individual cardiology test checklist variableSet descriptino", + "variables": [ + { + "id": "echo_test", + "name": "echo_test variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "echo_test variable description", + "attributes": {} + }, + { + "id": "ecg_test", + "name": "ecg_test variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "ecg_test variable description", + "attributes": {} + }, + { + "id": "ecg_exercise_test", + "name": "ecg_exercise_test variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "ecg_exercise_test variable description", + "attributes": {} + }, + { + "id": "electrophysiological_study", + "name": "electrophysiological_study variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "electrophysiological_study variable description", + "attributes": {} + }, + + ], + + }, + { + "id": "risk_assessment", + "name": "Risk assessment variableSet name", + "unique": true, + "confidential": false, + "internal": false, + "description": "Risk assessment variableSet description", + "variables": [ + { + "id": "date_risk_assessment", + "name": "date_risk_assessment variable name", + "category": "", + "type": "DATE", + "required": false, + "multiValue": false, + "allowedValues": [], + "rank": 2, + "dependsOn": "", + "description": "date_risk_assessment variable description", + "attributes": {} + }, + { + "id": "risk_score", + "name": "risk_score variable name", + "category": "", + "type": "INTEGER", + "required": false, + "multiValue": false, + "allowedValues": [], + "rank": 2, + "dependsOn": "", + "description": "risk_score variable description", + "attributes": {} + }, + { + "id": "vf_cardiac_arrest_events", + "name": "vf_cardiac_arrest_events variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "vf_cardiac_arrest_events variable description", + "attributes": {} + }, + { + "id": "sdc_iad_family_history", + "name": "sdc_iad_family_history variable name", + "category": "", + "type": "CATEGORICAL", + "required": false, + "multiValue": false, + "allowedValues": ["YES", "NO", "UNKNOWN"], + "rank": 2, + "dependsOn": "", + "description": "sdc_iad_family_history variable description", + "attributes": {} + }, + + ], + + }, + ]; + + // Mutation 3: annotation columns enabled through the admin interface in filter.result.grid + // See example of use in browser.settings.js, INDIVIDUAL_BROWSER + this._config.annotations = [ + { + title: "Cardiology Tests", + position: 6, + variableSetId: "cardiology_tests_checklist", + variables: ["ecg_test", "echo_test"] + }, + { + title: "Risk Assessment", + position: 7, + variableSetId: "risk_assessment", + variables: ["date_risk_assessment"] + } + ]; + } selectInstance(e) { @@ -155,8 +333,8 @@ class IndividualBrowserGridTest extends LitElement { } render() { - if (!this._ready) { - return html `Processing`; + if (this.isLoading) { + return html``; } return html` From 838828d0b08bebb891737b43d3104d1ac3c00146 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 6 Nov 2023 12:48:33 +0100 Subject: [PATCH 45/73] wc - Added comment on how to use annotation tests Signed-off-by: gpveronica --- src/sites/iva/conf/browsers.settings.js | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/src/sites/iva/conf/browsers.settings.js b/src/sites/iva/conf/browsers.settings.js index dfaab64cb5..c7c7113d1e 100644 --- a/src/sites/iva/conf/browsers.settings.js +++ b/src/sites/iva/conf/browsers.settings.js @@ -22,10 +22,27 @@ const CATALOG_SETTINGS = { exportTabs: ["download", "link", "code"] }, // It is supported either columns[] or hiddenColumns[]. - columns: ["id", "samples", "father", "mother", "disorders", "phenotypes", "caseId", "sex", "ethnicity", "dateOfBirth", "creationDate", "actions"] + columns: ["id", "samples", "father", "mother", "disorders", "phenotypes", "caseId", "sex", "ethnicity", "dateOfBirth", "creationDate", "actions"], + + // Annotations Example: + // annotations: [ + // { + // title: "Cardiology Tests", + // position: 3, + // variableSetId: "cardiology_tests_checklist", + // variables: ["ecg_test", "echo_test"] + // }, + // { + // title: "Risk Assessment", + // position: 5, + // variableSetId: "risk_assessment", + // variables: ["vf_cardiac_arrest_events"] + // } + // ] + }, // merge criterium: uses this array as filter for internal 1D array. - details: ["individual-view", "clinical-analysis-grid", "individual-inferred-sex", "individual-mendelian-error", "json-view"] + details: ["individual-view", "clinical-analysis-grid", "individual-inferred-sex", "individual-mendelian-error", "json-view"], }, COHORT_BROWSER: { /** From 86d099264736739040265dea55aac1a08822d572 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 6 Nov 2023 13:40:00 +0100 Subject: [PATCH 46/73] wc - Individual Annotations minor improvement Signed-off-by: gpveronica --- cypress/e2e/iva/individual-browser-grid.cy.js | 17 ++++++++--------- .../individual-browser-grid-test.js | 18 ++++-------------- 2 files changed, 12 insertions(+), 23 deletions(-) diff --git a/cypress/e2e/iva/individual-browser-grid.cy.js b/cypress/e2e/iva/individual-browser-grid.cy.js index ab57f071cb..468252cd66 100644 --- a/cypress/e2e/iva/individual-browser-grid.cy.js +++ b/cypress/e2e/iva/individual-browser-grid.cy.js @@ -393,7 +393,7 @@ context("Individual Browser Grid", () => { }); }); // 5.2 Render each varSet column at the position configured in position - it("should have varSet index configured equal to index displayed on Risk Assessment", () => { + it("should have varSet position configured equal to the index of the corresponding column", () => { cy.wrap(annotations).each(annotation => { cy.get("@table") .contains("thead tr th", annotation.title) @@ -405,23 +405,22 @@ context("Individual Browser Grid", () => { }); }); // 5.3 Render variables correctly - it("should have varSet index configured equal to index displayed on Risk Assessment", () => { + it("should render annotations configured", () => { cy.wrap(annotations).each(annotation => { cy.get("@table") .contains("thead tr th", annotation.title) .invoke("index") .then(i => { // 1. Test index column configured equals column index rendered - cy.get("tbody tr").first() - .find(`td:nth-child(${i+1})`).then(cell => { - const text = cell.text(); - expect(text).contains(annotation.variables[0]); - + cy.get("tbody tr") + .first() + .find("td") + .eq(i) + .should("contain.text", annotation.variables[0]); }); - }); + }); }); }); - }); }); // DETAIL TABS diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 569b97f9de..b0b68b9e19 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -17,7 +17,6 @@ import {html, LitElement} from "lit"; import UtilsNew from "../../../core/utils-new.js"; -import "../../../webcomponents/loading-spinner.js"; import "../../../webcomponents/individual/individual-grid.js"; import "../../../webcomponents/individual/individual-detail.js"; import "../../../webcomponents/individual/individual-view.js"; @@ -54,17 +53,10 @@ class IndividualBrowserGridTest extends LitElement { this.FILES = [ "individuals-platinum.json", ]; - this._data = []; + this._data = null; this._selectedInstance = {}; this._config = {}; - this.isLoading = false; - - } - - #setLoading(value) { - this.isLoading = value; - this.requestUpdate(); } update(changedProperties) { @@ -81,7 +73,6 @@ class IndividualBrowserGridTest extends LitElement { } propertyObserver() { - this.#setLoading(true); if (this.opencgaSession && this.testDataVersion) { const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); @@ -98,8 +89,6 @@ class IndividualBrowserGridTest extends LitElement { }) .catch(error => { NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); - }).finally(() => { - this.#setLoading(false); }); } } @@ -322,6 +311,7 @@ class IndividualBrowserGridTest extends LitElement { position: 7, variableSetId: "risk_assessment", variables: ["date_risk_assessment"] + } ]; @@ -333,8 +323,8 @@ class IndividualBrowserGridTest extends LitElement { } render() { - if (this.isLoading) { - return html``; + if (!this._data) { + return html`Processing`; } return html` From b227d81e3f5b20ff4878c6bb80ab431c8c6b8345 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 16:37:13 +0100 Subject: [PATCH 47/73] test: improve component for testing sample browser TASK-4847 --- .../webcomponents/sample-browser-grid-test.js | 104 +++++++++--------- 1 file changed, 50 insertions(+), 54 deletions(-) diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index 9a1f431568..ccf0c8bf1a 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -44,23 +44,18 @@ class SampleBrowserGridTest extends LitElement { testDataVersion: { type: String }, - _ready: { - type: Boolean, - state: true, - } }; } #init() { this.COMPONENT_ID = "sample-browser"; - this._ready = false; this.FILES = [ "samples-platinum.json", ]; - this._data = []; + this._data = null; this._selectedInstance = {}; - this._config = {}; + this._config = this.getDefaultConfig(); } // TODO: The Sample Browser Test needs to test two things: @@ -79,7 +74,6 @@ class SampleBrowserGridTest extends LitElement { propertyObserver() { if (this.opencgaSession && this.testDataVersion) { - const promises = this.FILES.map(file => { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); @@ -95,50 +89,10 @@ class SampleBrowserGridTest extends LitElement { }) .catch(error => { NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); - }).finally(() => { - this._ready = true; }); } } - onSettingsUpdate() { - this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, - }; - this.propertyObserver(); - } - - getDefaultTabsConfig() { - return { - title: "Sample", - showTitle: true, - items: [ - { - id: "sample-view", - name: "Overview", - active: true, - render: (sample, active, opencgaSession) => html` - - - `, - }, - { - id: "json-view", - name: "JSON Data", - render: (sample, active) => html` - - - `, - } - ] - }; - } - mutate() { // 1. Mutations related to date // this._data[3].id = ""; @@ -150,14 +104,22 @@ class SampleBrowserGridTest extends LitElement { this._data = [...this._data]; } - selectInstance(e) { + onSettingsUpdate() { + this._config.grid = { + ...this._config.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, + }; + this.requestUpdate(); + } + + onSelectRow(e) { this._selectedInstance = e.detail.row; this.requestUpdate(); } render() { - if (!this._ready) { - return html `Processing`; + if (!this._data) { + return html`Processing...`; } return html` @@ -169,19 +131,53 @@ class SampleBrowserGridTest extends LitElement { .toolId="${this.COMPONENT_ID}" .samples="${this._data}" .opencgaSession="${this.opencgaSession}" - .config="${this._config}" + .config="${this._config?.grid}" @settingsUpdate="${() => this.onSettingsUpdate()}" - @selectrow="${this.selectInstance}"> + @selectrow="${e => this.onSelectRow(e)}"> + .config="${this._config?.detail}">
`; } + getDefaultConfig() { + return { + grid: {}, + detail: { + title: "Sample", + showTitle: true, + items: [ + { + id: "sample-view", + name: "Overview", + active: true, + render: (sample, active, opencgaSession) => html` + + + `, + }, + { + id: "json-view", + name: "JSON Data", + render: (sample, active) => html` + + + `, + } + ], + }, + }; + } + } customElements.define("sample-browser-grid-test", SampleBrowserGridTest); From 028e0795de24eaab973e945a7346f0179f23eba2 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 16:37:36 +0100 Subject: [PATCH 48/73] test: fix sample-browser-grid tests #TASK-4847 --- cypress/e2e/iva/sample-browser-grid.cy.js | 48 ++++++----------------- 1 file changed, 13 insertions(+), 35 deletions(-) diff --git a/cypress/e2e/iva/sample-browser-grid.cy.js b/cypress/e2e/iva/sample-browser-grid.cy.js index 5bd84daa05..e52c1abdf2 100644 --- a/cypress/e2e/iva/sample-browser-grid.cy.js +++ b/cypress/e2e/iva/sample-browser-grid.cy.js @@ -401,14 +401,12 @@ context("Sample Browser Grid", () => { it("should display 'Extra Column' column", () => { cy.get("thead th") .contains("Extra column") - .should('be.visible'); + .should("be.visible"); }); }); - }); context("Detail", () => { - beforeEach(() => { cy.get("@container") .find(`div[data-cy="sb-detail"]`) @@ -420,44 +418,24 @@ context("Sample Browser Grid", () => { .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Sample ID"); - cy.get("@indexColumn") - .then(indexColumn => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get(`tbody tr`) - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textRowTrimmed = textRow.trim(); - const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); - const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; - - const textTab = text.trim().split(" "); - expect(id).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const sample = "NA12889"; + cy.get(`tbody tr[data-uniqueid="${sample}"]`) + .find(`td:first`) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Sample ${sample}`); }); it("should display 'JSON Data' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get("@detail") .find("li") .contains("JSON Data") - .click() - .should('be.visible'); + .trigger("click"); + + cy.get("json-viewer") + .should("be.visible"); }); }); - }); From e67d6f5435a51636d378a6c2e3a4fd922acae192 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 16:38:18 +0100 Subject: [PATCH 49/73] wc: remove fallback properties for sample browser grid test #TASK-4847 --- src/sites/test-app/test-app.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index 37d26f73b3..9603b964a9 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -713,8 +713,8 @@ class TestApp extends LitElement {
From 28100ef2a9fca70ac8b201a94119b7d75d33a2c4 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 16:44:26 +0100 Subject: [PATCH 50/73] wc: remove properties fallback values in other catalog browsers tests #TASK-4847 --- src/sites/test-app/test-app.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index 9603b964a9..c87cfc2df2 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -669,8 +669,8 @@ class TestApp extends LitElement {
@@ -680,7 +680,7 @@ class TestApp extends LitElement {
@@ -691,8 +691,8 @@ class TestApp extends LitElement {
@@ -702,8 +702,8 @@ class TestApp extends LitElement {
@@ -724,8 +724,8 @@ class TestApp extends LitElement {
@@ -735,8 +735,8 @@ class TestApp extends LitElement {
From 13056f8e341875d94d4dde781d2ba74cf262d75c Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:02:56 +0100 Subject: [PATCH 51/73] test: fix detail tabs tests for individual browser #TASK-4847 --- cypress/e2e/iva/individual-browser-grid.cy.js | 46 ++++++------------- 1 file changed, 13 insertions(+), 33 deletions(-) diff --git a/cypress/e2e/iva/individual-browser-grid.cy.js b/cypress/e2e/iva/individual-browser-grid.cy.js index 468252cd66..fe9b2a2c96 100644 --- a/cypress/e2e/iva/individual-browser-grid.cy.js +++ b/cypress/e2e/iva/individual-browser-grid.cy.js @@ -425,7 +425,6 @@ context("Individual Browser Grid", () => { // DETAIL TABS context("Detail", () => { - beforeEach(() => { cy.get("@container") .find(`div[data-cy="ib-detail"]`) @@ -437,44 +436,25 @@ context("Individual Browser Grid", () => { .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Individual"); - cy.get("@indexColumn") - .then(indexColumn => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get(`tbody tr`) - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textRowTrimmed = textRow.trim(); - const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); - const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; - - const textTab = text.trim().split(" "); - expect(id).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const individual = "NA12877"; + cy.get(`tbody tr[data-uniqueid="${individual}"]`) + .find(`td`) + .eq(1) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Individual ${individual}`); }); it("should display 'JSON Data' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get("@detail") .find("li") .contains("JSON Data") - .click() - .should('be.visible'); + .trigger("click"); + + cy.get("json-viewer") + .should("be.visible"); }); }); - }); From 44898a12e0ddf7dda28ab847ff6b253a5ac8b2f6 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:03:24 +0100 Subject: [PATCH 52/73] wc: minor fixes in individual browser test component #TASK-4847 --- .../individual-browser-grid-test.js | 98 +++++++++---------- 1 file changed, 48 insertions(+), 50 deletions(-) diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index b0b68b9e19..a7ab3e071a 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -56,15 +56,10 @@ class IndividualBrowserGridTest extends LitElement { this._data = null; this._selectedInstance = {}; - this._config = {}; + this._config = this.getDefaultConfig(); } update(changedProperties) { - /* if (changedProperties.has("testFile") && - changedProperties.has("testDataVersion") && - changedProperties.has("opencgaSession")) { - this.opencgaSessionObserver(); - } */ if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.propertyObserver(); } @@ -93,45 +88,6 @@ class IndividualBrowserGridTest extends LitElement { } } - onSettingsUpdate() { - this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, - }; - // this.propertyObserver(); - this.requestUpdate(); - } - - getDefaultTabsConfig() { - return { - title: "Individual", - showTitle: true, - items: [ - { - id: "individual-view", - name: "Overview", - active: true, - render: (individual, active, opencgaSession) => html` - - - `, - }, - { - id: "json-view", - name: "JSON Data", - render: (individual, active, opencgaSession) => html` - - - `, - } - ] - }; - } - mutate() { // return null; // Mutation 1: The first individual has annotations with the variable sets defined for the study @@ -299,7 +255,7 @@ class IndividualBrowserGridTest extends LitElement { // Mutation 3: annotation columns enabled through the admin interface in filter.result.grid // See example of use in browser.settings.js, INDIVIDUAL_BROWSER - this._config.annotations = [ + this._config.grid.annotations = [ { title: "Cardiology Tests", position: 6, @@ -317,7 +273,15 @@ class IndividualBrowserGridTest extends LitElement { } - selectInstance(e) { + onSettingsUpdate() { + this._config.grid = { + ...this._config.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, + }; + this.requestUpdate(); + } + + onSelectRow(e) { this._selectedInstance = e.detail.row; this.requestUpdate(); } @@ -336,19 +300,53 @@ class IndividualBrowserGridTest extends LitElement { .toolId="${this.COMPONENT_ID}" .individuals="${this._data}" .opencgaSession="${this.opencgaSession}" - .config="${this._config}" + .config="${this._config.grid}" @settingsUpdate="${() => this.onSettingsUpdate()}" - @selectrow="${this.selectInstance}"> + @selectrow="${e => this.onSelectRow(e)}"> + .config="${this._config.detail}">
`; } + getDefaultConfig() { + return { + grid: {}, + detail: { + title: "Individual", + showTitle: true, + items: [ + { + id: "individual-view", + name: "Overview", + active: true, + render: (individual, active, opencgaSession) => html` + + + `, + }, + { + id: "json-view", + name: "JSON Data", + render: (individual, active, opencgaSession) => html` + + + `, + } + ], + }, + }; + } + } customElements.define("individual-browser-grid-test", IndividualBrowserGridTest); From 5335ffdad2279603a389b75992af573924375b9d Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:16:13 +0100 Subject: [PATCH 53/73] wc: fix cohort browser test component #TASK-4847 --- .../webcomponents/cohort-browser-grid-test.js | 175 ++++++++---------- 1 file changed, 78 insertions(+), 97 deletions(-) diff --git a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js index abf65df515..564d1ca4dc 100644 --- a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js @@ -17,7 +17,6 @@ import {html, LitElement} from "lit"; import UtilsNew from "../../../core/utils-new.js"; -import "../../../webcomponents/loading-spinner.js"; import "../../../webcomponents/cohort/cohort-grid.js"; import "../../../webcomponents/cohort/cohort-detail.js"; import "../../../webcomponents/cohort/cohort-view.js"; @@ -38,149 +37,131 @@ class CohortBrowserGridTest extends LitElement { static get properties() { return { - testFile: { - type: String - }, opencgaSession: { type: Object }, testDataVersion: { type: String }, - config: { - type: Object - }, - _selectRow: { - type: Object, - state: true - }, }; } #init() { this.COMPONENT_ID = "cohort-browser"; - this.isLoading = false; - this.data = []; - this._config = {}; - } - - #setLoading(value) { - this.isLoading = value; - this.requestUpdate(); + this.FILES = [ + "cohorts-1000G.json", + ]; + this._data = null; + this._selectedRow = null; + this._config = this.getDefaultConfig(); } update(changedProperties) { - if (changedProperties.has("testFile") && - changedProperties.has("testDataVersion") && - changedProperties.has("opencgaSession")) { + if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.opencgaSessionObserver(); } + super.update(changedProperties); } opencgaSessionObserver() { - this.#setLoading(true); - UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${this.testFile}.json`) - .then(content => { - this.cohorts = content; - this.mutate(); - }) - .catch(err => { - console.log(err); - }) - .finally(() => { - this.#setLoading(false); + if (this.opencgaSession && this.testDataVersion) { + const allPromises = this.FILES.map(file => { + return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); - } - - onSettingsUpdate() { - this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, - }; - this.opencgaSessionObserver(); - } - getDefaultTabsConfig() { - return { - title: "Cohort", - showTitle: true, - items: [ - { - id: "cohort-view", - name: "Overview", - active: true, - render: (cohort, active, opencgaSession) => { - return html` - - - `; - } - }, - // { - // id: "sample-view", - // name: "Samples", - // render: (cohort, active, opencgaSession) => { - // return html` - // - // - // `; - // } - // }, - { - id: "json-view", - name: "JSON Data", - render: (cohort, active, opencgaSession) => { - return html` - - - `; - } - } - ] - }; + Promise.all(allPromises) + .then(data => { + this._data = data[0]; + this._selectedRow = this._data[0]; + this.mutate(); + this.requestUpdate(); + }) + .catch(err => { + console.log(err); + }); + } } mutate() { return null; } - selectRow(e) { - this._selectRow = {...e.detail.row}; + onSettingsUpdate() { + this._config.grid = { + ...this._config.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, + }; + this.requestUpdate(); + } + + onSelectRow(e) { + this._selectedRow = e.detail.row; + this.requestUpdate(); } render() { - if (this.isLoading) { - return html``; + if (!this._data) { + return "Loading..."; } return html`

- Catalog Browser Grid (${this.testFile}) + Catalog Browser Grid (${this.FILES[0]})

+ @selectrow="${e => this.onSelectRow(e)}"> + .config="${this._config.detail}"> `; } + getDefaultConfig() { + return { + grid: {}, + detail: { + title: "Cohort", + showTitle: true, + items: [ + { + id: "cohort-view", + name: "Overview", + active: true, + render: (cohort, active, opencgaSession) => { + return html` + + + `; + } + }, + { + id: "json-view", + name: "JSON Data", + render: (cohort, active) => { + return html` + + + `; + } + } + ], + }, + }; + } + } customElements.define("cohort-browser-grid-test", CohortBrowserGridTest); From 2910386c10fbaa8f54d9207bc2d44723796050da Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:16:29 +0100 Subject: [PATCH 54/73] test: fix tests for cohort browser #TASK-4847 --- cypress/e2e/iva/cohort-browser-grid.cy.js | 43 ++++++++--------------- 1 file changed, 14 insertions(+), 29 deletions(-) diff --git a/cypress/e2e/iva/cohort-browser-grid.cy.js b/cypress/e2e/iva/cohort-browser-grid.cy.js index 5613965ce6..15e58475d1 100644 --- a/cypress/e2e/iva/cohort-browser-grid.cy.js +++ b/cypress/e2e/iva/cohort-browser-grid.cy.js @@ -290,49 +290,34 @@ context("Cohort Browser Grid", () => { .find("li") .contains("New Catalog Tab") .click() - .should('be.visible'); + .should("be.visible"); }); }); context("detail tab", () => { it("should render", () => { - cy.get(browserDetail) + cy.get("detail-tabs") .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Cohort ID"); - cy.get("@indexColumn") - .then((indexColumn) => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get(`tbody tr`) - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textTab = text.trim().split(" "); - expect(textRow.trim()).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const cohort = "FIN"; + cy.get(`tbody tr[data-uniqueid="${cohort}"]`) + .find(`td:first`) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Cohort ${cohort}`); }); it("should display 'JSON Data' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`detail-tabs > div.detail-tabs > ul`) .find("li") .contains("JSON Data") - .click() - .should('be.visible'); + .trigger("click"); + + cy.get("json-viewer") + .should("be.visible"); }); }); }); From 6e361133b1fe5e2f448a1cc411177aed301ae6fb Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:16:50 +0100 Subject: [PATCH 55/73] wc: remove unused properties passed to cohort browser test #TASK-4847 --- src/sites/test-app/test-app.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index c87cfc2df2..be24aaf515 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -701,10 +701,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["cohort-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} From 735f57c47546174557f8def3de637b2033b6b1d9 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:18:02 +0100 Subject: [PATCH 56/73] wc: rename selected row variable in sample and individual browsers components tests #TASK-4847 --- .../webcomponents/individual-browser-grid-test.js | 8 ++++---- .../test-app/webcomponents/sample-browser-grid-test.js | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index a7ab3e071a..55b0c8c93f 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -54,7 +54,7 @@ class IndividualBrowserGridTest extends LitElement { "individuals-platinum.json", ]; this._data = null; - this._selectedInstance = {}; + this._selectedRow = {}; this._config = this.getDefaultConfig(); } @@ -77,7 +77,7 @@ class IndividualBrowserGridTest extends LitElement { Promise.all(promises) .then(data => { this._data = data[0]; - this._selectedInstance = this._data[0]; + this._selectedRow = this._data[0]; // Mutate data and update this.mutate(); this.requestUpdate(); @@ -282,7 +282,7 @@ class IndividualBrowserGridTest extends LitElement { } onSelectRow(e) { - this._selectedInstance = e.detail.row; + this._selectedRow = e.detail.row; this.requestUpdate(); } @@ -305,7 +305,7 @@ class IndividualBrowserGridTest extends LitElement { @selectrow="${e => this.onSelectRow(e)}"> diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index ccf0c8bf1a..8b144e581d 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -53,7 +53,7 @@ class SampleBrowserGridTest extends LitElement { "samples-platinum.json", ]; this._data = null; - this._selectedInstance = {}; + this._selectedRow = {}; this._config = this.getDefaultConfig(); } @@ -82,7 +82,7 @@ class SampleBrowserGridTest extends LitElement { Promise.all(promises) .then(data => { this._data = data[0]; - this._selectedInstance = this._data[0]; + this._selectedRow = this._data[0]; // Mutate data and update this.mutate(); this.requestUpdate(); @@ -113,7 +113,7 @@ class SampleBrowserGridTest extends LitElement { } onSelectRow(e) { - this._selectedInstance = e.detail.row; + this._selectedRow = e.detail.row; this.requestUpdate(); } @@ -136,7 +136,7 @@ class SampleBrowserGridTest extends LitElement { @selectrow="${e => this.onSelectRow(e)}"> From ee9adeb968e93ed9fdf5395b160b23df9be976d4 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:29:57 +0100 Subject: [PATCH 57/73] wc: fix disease panels browser test component #TASK-4847 --- .../disease-panel-browser-grid-test.js | 141 +++++++----------- 1 file changed, 58 insertions(+), 83 deletions(-) diff --git a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js index d9b1751444..e7af4241e3 100644 --- a/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/disease-panel-browser-grid-test.js @@ -15,16 +15,12 @@ */ import {html, LitElement} from "lit"; - import UtilsNew from "../../../core/utils-new.js"; - import "../../../webcomponents/disease-panel/disease-panel-grid.js"; import "../../../webcomponents/disease-panel/disease-panel-detail.js"; import "../../../webcomponents/disease-panel/disease-panel-create.js"; import "../../../webcomponents/disease-panel/disease-panel-update.js"; -import NotificationUtils from "../../../webcomponents/commons/utils/notification-utils.js"; - class DiseasePanelBrowserGridTest extends LitElement { @@ -45,43 +41,19 @@ class DiseasePanelBrowserGridTest extends LitElement { testDataVersion: { type: String }, - _ready: { - type: Boolean, - state: true, - } }; } #init() { this.COMPONENT_ID = "disease-panel-browser"; - this._ready = false; this.FILES = [ "disease-panels-platinum.json", ]; - this._data = []; - this._selectedInstance = {}; - - this._config = { - pageSize: 10, - pageList: [10, 25, 50], - multiSelection: false, - showSelectCheckbox: false, - toolbar: { - showColumns: true, - showDownload: false, - showExport: false, - showSettings: false, - exportTabs: ["download", "link", "code"] - }, - }; + this._data = null; + this._selectedRow = {}; + this._config = this.getDefaultConfig(); } - // TODO: The Sample Browser Test needs to test two things: - // 1. The view: - // - The sample browser: table grid and details - // - The sample browser facet - // 2. The filters - update(changedProperties) { if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.propertyObserver(); @@ -96,51 +68,39 @@ class DiseasePanelBrowserGridTest extends LitElement { return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); - // Import all files Promise.all(promises) .then(data => { this._data = data[0]; - this._selectedInstance = this._data[0]; - // Mutate data and update + this._selectedRow = this._data[0]; this.mutate(); this.requestUpdate(); }) .catch(error => { - NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); - }).finally(() => { - this._ready = true; + console.error(error); }); } } + mutate() { + return null; + } + onSettingsUpdate() { - this._config = { - ...this._config, + this._config.grid = { + ...this._config.grid, ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, }; - - this.propertyObserver(); - } - - mutate() { - // 1. Mutations related to date - // this._data[3].id = ""; - // this._data[1].creationDate = ""; - // this._data[2].creationDate = "20540101"; // No valid format - // this._data[2].creationDate = "20210527101416"; // Valid format - - // Finally, we update samples mem address to force a rendering - // this._data = [...this._data]; + this.requestUpdate(); } - selectInstance(e) { - this._selectedInstance = e.detail.row; + onSelectRow(e) { + this._selectedRow = e.detail.row; this.requestUpdate(); } render() { - if (!this._ready) { - return html `Processing`; + if (!this._data) { + return "Loading..."; } return html` @@ -152,46 +112,61 @@ class DiseasePanelBrowserGridTest extends LitElement { .toolId="${this.COMPONENT_ID}" .diseasePanels="${this._data}" .opencgaSession="${this.opencgaSession}" - .config="${this._config}" + .config="${this._config.grid}" @settingsUpdate="${() => this.onSettingsUpdate()}" - @selectrow="${e => this.selectInstance(e)}"> + @selectrow="${e => this.onSelectRow(e)}"> + .config="${this._config.detail}">
`; } - getDefaultTabsConfig() { + getDefaultConfig() { return { - title: "Disease Panel", - showTitle: true, - items: [ - { - id: "disease-panel-view", - name: "Summary", - active: true, - render: (diseasePanel, _active, opencgaSession) => html` - - - `, + grid: { + pageSize: 10, + pageList: [10, 25, 50], + multiSelection: false, + showSelectCheckbox: false, + toolbar: { + showColumns: true, + showDownload: false, + showExport: false, + showSettings: false, + exportTabs: ["download", "link", "code"] }, - { - id: "json-view", - name: "JSON Data", - render: (diseasePanel, active) => html` - html` + + + `, + }, + { + id: "json-view", + name: "JSON Data", + render: (diseasePanel, active) => html` + - - `, - }, - ] + + `, + }, + ] + }, }; } From 235ea9b6bfc4eb18070d0d49c805715e0643db81 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:30:12 +0100 Subject: [PATCH 58/73] test: fix tests for disease panels browser #TASK-4847 --- .../e2e/iva/disease-panel-browser-grid.cy.js | 39 +++++-------------- 1 file changed, 10 insertions(+), 29 deletions(-) diff --git a/cypress/e2e/iva/disease-panel-browser-grid.cy.js b/cypress/e2e/iva/disease-panel-browser-grid.cy.js index 62daa6b8b7..9debecebd5 100644 --- a/cypress/e2e/iva/disease-panel-browser-grid.cy.js +++ b/cypress/e2e/iva/disease-panel-browser-grid.cy.js @@ -345,42 +345,23 @@ context("Disease Panel Browser Grid", () => { }); it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Panel"); - cy.get("@indexColumn") - .then(indexColumn => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get("tbody tr") - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - const textRowTrimmed = textRow.trim(); - const lastLineMatch = textRowTrimmed.match(/(?:^|\n)([^\n]+)$/); - const id = lastLineMatch ? lastLineMatch[1].trim() : textRowTrimmed; - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textTab = text.trim().split(" "); - expect(id).to.equal(textTab[2].trim()); - }); - }); + const panel = "Familial_non_syndromic_congenital_heart_disease-PanelAppId-212"; + cy.get(`tbody tr[data-uniqueid="${panel}"]`) + .find(`td:first`) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Disease Panel ${panel}`); }); it("should display 'JSON Data' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get("@detail") .find("li") .contains("JSON Data") - .click() + .trigger("click"); + + cy.get("json-viewer") .should("be.visible"); }); }); - }); From b8df8398c6059c615521e18ae1750fa650eb9ee7 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:46:09 +0100 Subject: [PATCH 59/73] wc: fix family browser test component #TASK-4847 --- .../webcomponents/family-browser-grid-test.js | 185 +++++++++--------- 1 file changed, 88 insertions(+), 97 deletions(-) diff --git a/src/sites/test-app/webcomponents/family-browser-grid-test.js b/src/sites/test-app/webcomponents/family-browser-grid-test.js index 5a14687361..9276604d92 100644 --- a/src/sites/test-app/webcomponents/family-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/family-browser-grid-test.js @@ -17,7 +17,6 @@ import {html, LitElement} from "lit"; import UtilsNew from "../../../core/utils-new.js"; -import "../../../webcomponents/loading-spinner.js"; import "../../../webcomponents/family/family-grid.js"; import "../../../webcomponents/family/family-detail.js"; import "../../../webcomponents/family/family-view.js"; @@ -38,139 +37,131 @@ class FamilyBrowserGridTest extends LitElement { static get properties() { return { - testFile: { - type: String - }, opencgaSession: { type: Object }, testDataVersion: { type: String }, - config: { - type: Object - }, - _selectRow: { - type: Object, - state: true - }, - _ready: { - type: Boolean, - state: true - } }; } #init() { this.COMPONENT_ID = "family-browser"; - this._ready = false; - this.data = []; - this._config = {}; + this.FILES = [ + "families-platinum.json", + ]; + this._data = null; + this._selectedRow = null; + this._config = this.getDefaultConfig(); } - update(changedProperties) { - if (changedProperties.has("testFile") && - changedProperties.has("testDataVersion") && - changedProperties.has("opencgaSession")) { + if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.opencgaSessionObserver(); } - super.update(changedProperties); - } - #setLoading(value) { - this.isLoading = value; - this.requestUpdate(); + super.update(changedProperties); } opencgaSessionObserver() { - this.#setLoading(true); - UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${this.testFile}.json`) - .then(content => { - this.families = content; - this.mutate(); - }) - .catch(err => { - console.log(err); - }) - .finally(() => { - this.#setLoading(false); + if (this.opencgaSession && this.testDataVersion) { + const allPromises = this.FILES.map(file => { + return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); - } - - onSettingsUpdate() { - this._config = { - ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, - }; - this.opencgaSessionObserver(); - } - getDefaultTabsConfig() { - return { - title: "Family", - showTitle: true, - items: [ - { - id: "family-view", - name: "Overview", - active: true, - // visible: - render: (family, active, opencgaSession) => html` - - - `, - }, - { - id: "json-view", - name: "JSON Data", - render: (family, active, opencgaSession) => html` - - - `, - } - ] - }; + Promise.all(allPromises) + .then(data => { + this._data = data[0]; + this._selectedRow = this._data[0]; + this.mutate(); + this.requestUpdate(); + }) + .catch(err => { + console.error(err); + }); + } } mutate() { return null; } - selectRow(e) { - this._selectRow = {...e.detail.row}; + onSettingsUpdate() { + this._config.grid = { + ...this._config.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, + }; + this.requestUpdate(); + } + + onSelectRow(e) { + this._selectedRow = e.detail.row; + this.requestUpdate(); } render() { - if (this.isLoading) { - return html``; + if (!this._data) { + return "Loading..."; } return html` -

- Catalog Browser Grid (${this.testFile}) -

- - - - +
+

+ Catalog Browser Grid (${this.FILES[0]}) +

+ + + + +
`; } + getDefaultConfig() { + return { + grid: {}, + detail: { + title: "Family", + showTitle: true, + items: [ + { + id: "family-view", + name: "Overview", + active: true, + render: (family, active, opencgaSession) => html` + + + `, + }, + { + id: "json-view", + name: "JSON Data", + render: (family, active) => html` + + + `, + } + ], + }, + }; + } + } customElements.define("family-browser-grid-test", FamilyBrowserGridTest); From d90a600c99e26706b5cacc18eb81f08ad8125c6f Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:46:51 +0100 Subject: [PATCH 60/73] test: fix detail tests in family browser #TASK-4847 --- cypress/e2e/iva/family-browser-grid.cy.js | 40 ++++++++--------------- 1 file changed, 13 insertions(+), 27 deletions(-) diff --git a/cypress/e2e/iva/family-browser-grid.cy.js b/cypress/e2e/iva/family-browser-grid.cy.js index f09a376eb7..018c0a2b72 100644 --- a/cypress/e2e/iva/family-browser-grid.cy.js +++ b/cypress/e2e/iva/family-browser-grid.cy.js @@ -298,44 +298,30 @@ context("Family Browser Grid", () => { }); }); - context("detail tab",{tags: ["@shortTask","@testTask"]}, () => { + context("detail tab", {tags: ["@shortTask","@testTask"]}, () => { it("should render", () => { cy.get(browserDetail) .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Family"); - cy.get("@indexColumn") - .then((indexColumn) => { - const indexRow = 1; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get("tbody tr") - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textTab = text.trim().split(" "); - expect(textRow).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const family = "919278"; + cy.get(`tbody tr[data-uniqueid="${family}"]`) + .find(`td`) + .eq(1) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Family ${family}`); }); it("should display 'JSON Data' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get("detail-tabs > div.detail-tabs > ul") .find("li") .contains("JSON Data") - .click() + .trigger("click"); + + cy.get("json-viewer") .should("be.visible"); }); }); From 42d64e5a467e136699bfd3dff1959526d5a086a3 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:57:29 +0100 Subject: [PATCH 61/73] test: fix detail tests for file browser #TASK-4847 --- cypress/e2e/iva/file-browser-grid.cy.js | 47 ++++++++----------------- 1 file changed, 14 insertions(+), 33 deletions(-) diff --git a/cypress/e2e/iva/file-browser-grid.cy.js b/cypress/e2e/iva/file-browser-grid.cy.js index 26304e2be7..00e3e85ebf 100644 --- a/cypress/e2e/iva/file-browser-grid.cy.js +++ b/cypress/e2e/iva/file-browser-grid.cy.js @@ -229,7 +229,7 @@ context("File Browser Grid", () => { it("should display 'Extra Column' column", () => { cy.get("thead th") .contains("Extra column") - .should('be.visible'); + .should("be.visible"); }); it("should display 'New Catalog Tab' Tab", () => { @@ -238,7 +238,7 @@ context("File Browser Grid", () => { .find("li") .contains("New Catalog Tab") .click() - .should('be.visible'); + .should("be.visible"); }); }); @@ -248,43 +248,24 @@ context("File Browser Grid", () => { .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Name"); - cy.get("@indexColumn") - .then((indexColumn) => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get(`tbody tr`) - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textRowTrimmed = textRow.trim(); - const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); - const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; - - const textTab = text.split(":"); - expect(id).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const file = "chinese:HG007_GRCh38_1_22_v4.2.1_benchmark.vcf.gz"; + cy.get(`tbody tr[data-uniqueid="${file}"]`) + .find(`td:first`) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `File ${file}`); }); it("should display 'Preview' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`detail-tabs > div.detail-tabs > ul`) .find("li") .contains("Preview") - .click() - .should('be.visible'); + .trigger("click"); + + cy.get("file-preview") + .should("be.visible"); }); }); }); From 42d329f81338595920051c7bc0327169ad756a94 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 17:57:59 +0100 Subject: [PATCH 62/73] wc: fix file browser test component #TASK-4847 --- .../webcomponents/file-browser-grid-test.js | 113 +++++++++--------- 1 file changed, 56 insertions(+), 57 deletions(-) diff --git a/src/sites/test-app/webcomponents/file-browser-grid-test.js b/src/sites/test-app/webcomponents/file-browser-grid-test.js index 28fddfe505..233322aed2 100644 --- a/src/sites/test-app/webcomponents/file-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/file-browser-grid-test.js @@ -17,7 +17,6 @@ import {html, LitElement} from "lit"; import UtilsNew from "../../../core/utils-new.js"; -import "../../../webcomponents/loading-spinner.js"; import "../../../webcomponents/file/file-grid.js"; import "../../../webcomponents/file/file-detail.js"; @@ -35,103 +34,103 @@ class FileBrowserGridTest extends LitElement { static get properties() { return { - testFile: { - type: String - }, opencgaSession: { type: Object }, testDataVersion: { type: String }, - config: { - type: Object - }, - _selectRow: { - type: Object, - state: true - }, }; } #init() { this.COMPONENT_ID = "file-browser"; - this.isLoading = false; - this.data = []; - this._config = {}; - } - - #setLoading(value) { - this.isLoading = value; - this.requestUpdate(); + this.FILES = [ + "files-chinese.json", + ]; + this._data = null; + this._selectedRow = null; + this._config = this.getDefaultConfig(); } update(changedProperties) { - if (changedProperties.has("testFile") && - changedProperties.has("testDataVersion") && - changedProperties.has("opencgaSession")) { + if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.opencgaSessionObserver(); } + super.update(changedProperties); } opencgaSessionObserver() { - this.#setLoading(true); - UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${this.testFile}.json`) - .then(content => { - this.files = content; - this.mutate(); - }) - .catch(err => { - console.log(err); - }) - .finally(() => { - this.#setLoading(false); + if (this.opencgaSession && this.testDataVersion) { + const allPromises = this.FILES.map(file => { + return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); - } + Promise.all(allPromises) + .then(data => { + this._data = data[0]; + this._selectedRow = this._data[0]; + this.mutate(); + this.requestUpdate(); + }) + .catch(err => { + console.error(err); + }); + } + } mutate() { return null; } - selectRow(e) { - this._selectRow = {...e.detail.row}; + onSelectRow(e) { + this._selectedRow = e.detail.row; + this.requestUpdate(); } onSettingsUpdate() { - this._config = { + this._config.grid = { + ...this._config.grid, ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, }; - this.opencgaSessionObserver(); + this.requestUpdate(); } - render() { - if (this.isLoading) { - return html``; + if (!this._data) { + return "Loading..."; } return html` -

- Catalog Browser Grid (${this.testFile}) -

- - - - - +
+

+ File Browser (${this.FILES[0]}) +

+ + + + +
`; } + getDefaultConfig() { + return { + grid: {}, + detail: {}, + }; + } + } customElements.define("file-browser-grid-test", FileBrowserGridTest); From 3c74c03b5899848ce96f0f283bdafd7c8a4b3bec Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:07:16 +0100 Subject: [PATCH 63/73] wc: fix job browser test component #TASK-4847 --- .../webcomponents/job-browser-grid-test.js | 112 +++++++++--------- 1 file changed, 58 insertions(+), 54 deletions(-) diff --git a/src/sites/test-app/webcomponents/job-browser-grid-test.js b/src/sites/test-app/webcomponents/job-browser-grid-test.js index c197e27527..60e2779f2f 100644 --- a/src/sites/test-app/webcomponents/job-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/job-browser-grid-test.js @@ -17,7 +17,6 @@ import {html, LitElement} from "lit"; import UtilsNew from "../../../core/utils-new.js"; -import "../../../webcomponents/loading-spinner.js"; import "../../../webcomponents/job/job-grid.js"; import "../../../webcomponents/job/job-detail.js"; @@ -35,98 +34,103 @@ class JobBrowserGridTest extends LitElement { static get properties() { return { - testFile: { - type: String - }, opencgaSession: { type: Object }, testDataVersion: { type: String }, - config: { - type: Object - }, - _selectRow: { - type: Object, - state: true - }, }; } #init() { this.COMPONENT_ID = "job-browser"; - this.isLoading = false; - this.data = []; - this._config = {}; - } - - #setLoading(value) { - this.isLoading = value; - this.requestUpdate(); + this.FILES = [ + "job-1000G.json", + ]; + this._data = null; + this._selectedRow = null; + this._config = this.getDefaultConfig(); } update(changedProperties) { - if (changedProperties.has("testFile") && - changedProperties.has("testDataVersion") && - changedProperties.has("opencgaSession")) { + if (changedProperties.has("testDataVersion") || changedProperties.has("opencgaSession")) { this.opencgaSessionObserver(); } + super.update(changedProperties); } opencgaSessionObserver() { - this.#setLoading(true); - UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${this.testFile}.json`) - .then(content => { - this.jobs = content; - this.mutate(); - }) - .catch(err => { - console.log(err); - }) - .finally(() => { - this.#setLoading(false); + if (this.opencgaSession && this.testDataVersion) { + const allPromises = this.FILES.map(file => { + return UtilsNew.importJSONFile(`./test-data/${this.testDataVersion}/${file}`); }); + + Promise.all(allPromises) + .then(data => { + this._data = data[0]; + this._selectedRow = this._data[0]; + this.mutate(); + this.requestUpdate(); + }) + .catch(err => { + console.log(err); + }); + } } mutate() { return null; } - selectRow(e) { - this._selectRow = {...e.detail.row}; + onSelectRow(e) { + this._selectedRow = e.detail.row; + this.requestUpdate(); } onSettingsUpdate() { - this._config = {...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid}; - this.opencgaSessionObserver(); + this._config.grid = { + ...this._config.grid, + ...this.opencgaSession?.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid, + }; + this.requestUpdate(); } render() { - if (this.isLoading) { - return html``; + if (!this._data) { + return "Loading..."; } return html` -

- Catalog Browser Grid (${this.testFile}) -

- - - - +
+

+ Job Browser (${this.FILES[0]}) +

+ + + + +
`; } + getDefaultConfig() { + return { + grid: {}, + detail: {}, + }; + } + } customElements.define("job-browser-grid-test", JobBrowserGridTest); From a0b4f0db78814029202a43157b89f8bdc1aa4071 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:07:35 +0100 Subject: [PATCH 64/73] test: fix detail tests for job browser #TASK-4847 --- cypress/e2e/iva/job-browser-grid.cy.js | 44 ++++++++------------------ 1 file changed, 13 insertions(+), 31 deletions(-) diff --git a/cypress/e2e/iva/job-browser-grid.cy.js b/cypress/e2e/iva/job-browser-grid.cy.js index 2f99a3359e..751f62298c 100644 --- a/cypress/e2e/iva/job-browser-grid.cy.js +++ b/cypress/e2e/iva/job-browser-grid.cy.js @@ -243,48 +243,30 @@ context("Job Browser Grid", () => { }); }); - context("detail tab",{tags: "@shortTask"}, () => { + context("detail tabs", {tags: "@shortTask"}, () => { it("should render", () => { cy.get(browserDetail) .should("be.visible"); }); - it("should display info from the selected row",() => { - BrowserTest.getColumnIndexByHeader("Job ID"); - cy.get("@indexColumn") - .then((indexColumn) => { - const indexRow = 2; - // eslint-disable-next-line cypress/unsafe-to-chain-command - cy.get(`tbody tr`) - .eq(indexRow) - .click() // select the row - .find("td") - .eq(indexColumn) - .invoke("text") - .as("textRow"); - }); - - cy.get("@textRow") - .then((textRow) => { - cy.get("detail-tabs > div.panel") - .invoke("text") - .then((text) => { - const textRowTrimmed = textRow.trim(); - const firstLineMatch = textRowTrimmed.match(/^([^\n]+)/); - const id = firstLineMatch ? firstLineMatch[1].trim() : textRowTrimmed; - - const textTab = text.trim().split(" "); - expect(id).to.equal(textTab[1].trim()); - }); - }); + it("should display info from the selected row", () => { + const job = "pedigree-graph-init.20230530144950.FWjipG"; + cy.get(`tbody tr[data-uniqueid="${job}"]`) + .find(`td`) + .eq(1) + .trigger("click"); + + cy.get(`detail-tabs h3`) + .should("contain.text", `Job ${job}`); }); it("should display 'Logs' Tab", () => { - // eslint-disable-next-line cypress/unsafe-to-chain-command cy.get(`detail-tabs > div.detail-tabs > ul`) .find("li") .contains("Logs") - .click() + .trigger("click"); + + cy.get("job-detail-log") .should("be.visible"); }); }); From 3fd72c5bb64d2050af79681c9026ffdd3e3eff53 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:07:52 +0100 Subject: [PATCH 65/73] wc: removed unused properties in catalog browsers tests #TASK-4847 --- src/sites/test-app/test-app.js | 24 ++++++------------------ 1 file changed, 6 insertions(+), 18 deletions(-) diff --git a/src/sites/test-app/test-app.js b/src/sites/test-app/test-app.js index be24aaf515..22160850eb 100644 --- a/src/sites/test-app/test-app.js +++ b/src/sites/test-app/test-app.js @@ -668,10 +668,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["file-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} @@ -679,10 +677,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["individual-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} @@ -690,10 +686,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["family-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} @@ -710,10 +704,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["sample-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} @@ -721,10 +713,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["job-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} @@ -732,10 +722,8 @@ class TestApp extends LitElement { ${this.config.enabledComponents["disease-panel-browser-grid"] ? html`
+ .opencgaSession="${this.opencgaSession}">
` : nothing} From 866e6ebbc14f69ef954e9af6b70257e53464ccb4 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:09:51 +0100 Subject: [PATCH 66/73] wc: minor fixes in catalog browsers test components #TASK-4847 --- .../webcomponents/cohort-browser-grid-test.js | 34 ++++++++++--------- .../webcomponents/family-browser-grid-test.js | 2 +- .../webcomponents/file-browser-grid-test.js | 2 +- .../webcomponents/job-browser-grid-test.js | 2 +- 4 files changed, 21 insertions(+), 19 deletions(-) diff --git a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js index 564d1ca4dc..de4960e3fe 100644 --- a/src/sites/test-app/webcomponents/cohort-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/cohort-browser-grid-test.js @@ -106,22 +106,24 @@ class CohortBrowserGridTest extends LitElement { } return html` -

- Catalog Browser Grid (${this.FILES[0]}) -

- - - - +
+

+ Cohort Browser Grid (${this.FILES[0]}) +

+ + + + +
`; } diff --git a/src/sites/test-app/webcomponents/family-browser-grid-test.js b/src/sites/test-app/webcomponents/family-browser-grid-test.js index 9276604d92..f5091368e1 100644 --- a/src/sites/test-app/webcomponents/family-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/family-browser-grid-test.js @@ -108,7 +108,7 @@ class FamilyBrowserGridTest extends LitElement { return html`

- Catalog Browser Grid (${this.FILES[0]}) + Family Browser Grid (${this.FILES[0]})

- File Browser (${this.FILES[0]}) + File Browser Grid (${this.FILES[0]})

- Job Browser (${this.FILES[0]}) + Job Browser Grid (${this.FILES[0]})

Date: Mon, 6 Nov 2023 18:10:23 +0100 Subject: [PATCH 67/73] wc: remove unused variable in individual browser test component #TASK-4847 --- .../test-app/webcomponents/individual-browser-grid-test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index 55b0c8c93f..e4486587eb 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -335,7 +335,7 @@ class IndividualBrowserGridTest extends LitElement { { id: "json-view", name: "JSON Data", - render: (individual, active, opencgaSession) => html` + render: (individual, active) => html` From d48667b18e918849f56f679130593fc9a044d293 Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:11:43 +0100 Subject: [PATCH 68/73] test: fix typo in a test name #TASK-4847 --- cypress/e2e/iva/cohort-browser-grid.cy.js | 2 +- cypress/e2e/iva/disease-panel-browser-grid.cy.js | 2 +- cypress/e2e/iva/family-browser-grid.cy.js | 2 +- cypress/e2e/iva/file-browser-grid.cy.js | 2 +- cypress/e2e/iva/individual-browser-grid.cy.js | 2 +- cypress/e2e/iva/job-browser-grid.cy.js | 2 +- cypress/e2e/iva/sample-browser-grid.cy.js | 2 +- cypress/e2e/iva/variant-browser-grid-cancer.cy.js | 2 +- cypress/e2e/iva/variant-browser-grid-germline.cy.js | 2 +- cypress/e2e/iva/variant-interpreter-grid-cancer-cnv.cy.js | 2 +- cypress/e2e/iva/variant-interpreter-grid-cancer.cy.js | 2 +- cypress/e2e/iva/variant-interpreter-grid-germline.cy.js | 2 +- 12 files changed, 12 insertions(+), 12 deletions(-) diff --git a/cypress/e2e/iva/cohort-browser-grid.cy.js b/cypress/e2e/iva/cohort-browser-grid.cy.js index 15e58475d1..fa9d3b4602 100644 --- a/cypress/e2e/iva/cohort-browser-grid.cy.js +++ b/cypress/e2e/iva/cohort-browser-grid.cy.js @@ -214,7 +214,7 @@ context("Cohort Browser Grid", () => { }); }); - it("should hidden columns [Cohort ID,Creation Date]",() => { + it("should hide columns [Cohort ID,Creation Date]",() => { const columns = ["Cohort ID","Creation Date"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/disease-panel-browser-grid.cy.js b/cypress/e2e/iva/disease-panel-browser-grid.cy.js index 9debecebd5..51ed666d74 100644 --- a/cypress/e2e/iva/disease-panel-browser-grid.cy.js +++ b/cypress/e2e/iva/disease-panel-browser-grid.cy.js @@ -210,7 +210,7 @@ context("Disease Panel Browser Grid", () => { }); }); - it("should hidden columns [Disorders,Source,Extra column]",() => { + it("should hide columns [Disorders,Source,Extra column]",() => { const columns = ["Disorders","Source","Extra column"]; cy.get("disease-panel-grid thead th") .as("headerColumns"); diff --git a/cypress/e2e/iva/family-browser-grid.cy.js b/cypress/e2e/iva/family-browser-grid.cy.js index 018c0a2b72..bd355297b0 100644 --- a/cypress/e2e/iva/family-browser-grid.cy.js +++ b/cypress/e2e/iva/family-browser-grid.cy.js @@ -211,7 +211,7 @@ context("Family Browser Grid", () => { }); }); - it("should hidden columns [Case ID,Phenotypes]",() => { + it("should hide columns [Case ID,Phenotypes]",() => { const columns = ["Case ID","Phenotypes"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/file-browser-grid.cy.js b/cypress/e2e/iva/file-browser-grid.cy.js index 00e3e85ebf..a5e8a2140e 100644 --- a/cypress/e2e/iva/file-browser-grid.cy.js +++ b/cypress/e2e/iva/file-browser-grid.cy.js @@ -151,7 +151,7 @@ context("File Browser Grid", () => { }); }); - it("should hidden columns [Name,Format]",() => { + it("should hide columns [Name,Format]",() => { const columns = ["Name","Format"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/individual-browser-grid.cy.js b/cypress/e2e/iva/individual-browser-grid.cy.js index fe9b2a2c96..69b9a267aa 100644 --- a/cypress/e2e/iva/individual-browser-grid.cy.js +++ b/cypress/e2e/iva/individual-browser-grid.cy.js @@ -212,7 +212,7 @@ context("Individual Browser Grid", () => { }); }); - it("should hidden columns [Disorders,Case ID,Ethnicity]",() => { + it("should hide columns [Disorders,Case ID,Ethnicity]",() => { const columns = ["Disorders","Case ID","Ethnicity"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/job-browser-grid.cy.js b/cypress/e2e/iva/job-browser-grid.cy.js index 751f62298c..a99bfcad91 100644 --- a/cypress/e2e/iva/job-browser-grid.cy.js +++ b/cypress/e2e/iva/job-browser-grid.cy.js @@ -151,7 +151,7 @@ context("Job Browser Grid", () => { }); }); - it("should hidden columns [Status,Output Files,Runtime]",() => { + it("should hide columns [Status,Output Files,Runtime]",() => { const columns = ["Status","Output Files","Runtime"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/sample-browser-grid.cy.js b/cypress/e2e/iva/sample-browser-grid.cy.js index e52c1abdf2..8d2af424d8 100644 --- a/cypress/e2e/iva/sample-browser-grid.cy.js +++ b/cypress/e2e/iva/sample-browser-grid.cy.js @@ -214,7 +214,7 @@ context("Sample Browser Grid", () => { }); }); - it("should hidden columns [Collection Method,Preparation Method]",() => { + it("should hide columns [Collection Method,Preparation Method]",() => { const columns = ["Collection Method", "Preparation Method"]; cy.get(`${browserGrid} thead th`) .as("headerColumns"); diff --git a/cypress/e2e/iva/variant-browser-grid-cancer.cy.js b/cypress/e2e/iva/variant-browser-grid-cancer.cy.js index 3c8778ce10..d1feb85e3e 100644 --- a/cypress/e2e/iva/variant-browser-grid-cancer.cy.js +++ b/cypress/e2e/iva/variant-browser-grid-cancer.cy.js @@ -69,7 +69,7 @@ context("Variant Browser Grid Cancer", () => { }); }); - it("should hidden columns [Variant,Gene,Type]",() => { + it("should hide columns [Variant,Gene,Type]",() => { const columns = ["Variant","Gene","Type"]; cy.get("variant-browser-grid thead th") .as("headerColumns"); diff --git a/cypress/e2e/iva/variant-browser-grid-germline.cy.js b/cypress/e2e/iva/variant-browser-grid-germline.cy.js index 7d8d43a5aa..fd586c02d4 100644 --- a/cypress/e2e/iva/variant-browser-grid-germline.cy.js +++ b/cypress/e2e/iva/variant-browser-grid-germline.cy.js @@ -69,7 +69,7 @@ context("Variant Browser Grid Germline", () => { }); }); - it("should hidden columns [Type,Consequence Type,Gene]",() => { + it("should hide columns [Type,Consequence Type,Gene]",() => { const columns = ["Type","Consequence Type","Gene"]; cy.get("variant-browser-grid thead th") .as("headerColumns"); diff --git a/cypress/e2e/iva/variant-interpreter-grid-cancer-cnv.cy.js b/cypress/e2e/iva/variant-interpreter-grid-cancer-cnv.cy.js index 5f641ec015..69a0d24e5c 100644 --- a/cypress/e2e/iva/variant-interpreter-grid-cancer-cnv.cy.js +++ b/cypress/e2e/iva/variant-interpreter-grid-cancer-cnv.cy.js @@ -64,7 +64,7 @@ context("Variant Interpreter Grid Cancer CNV", () => { }); }); - it("should hidden columns [Type,Role in Cancer,Cohort Stats]",() => { + it("should hide columns [Type,Role in Cancer,Cohort Stats]",() => { const columns = ["Type","Role in Cancer","Cohort Stats"]; cy.get("variant-interpreter-grid thead th").as("headerColumns"); columns.forEach(col => { diff --git a/cypress/e2e/iva/variant-interpreter-grid-cancer.cy.js b/cypress/e2e/iva/variant-interpreter-grid-cancer.cy.js index fcacff7031..03ba4ecceb 100644 --- a/cypress/e2e/iva/variant-interpreter-grid-cancer.cy.js +++ b/cypress/e2e/iva/variant-interpreter-grid-cancer.cy.js @@ -68,7 +68,7 @@ context("Variant Interpreter Grid Cancer", () => { }); }); - it("should hidden columns [Type,Consequence Type,Gene]",() => { + it("should hide columns [Type,Consequence Type,Gene]",() => { const columns = ["Consequence Type","Gene"]; cy.get("variant-interpreter-grid thead th") .as("headerColumns"); diff --git a/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js b/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js index 2392e85498..692c424bbf 100644 --- a/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js +++ b/cypress/e2e/iva/variant-interpreter-grid-germline.cy.js @@ -70,7 +70,7 @@ context("Variant Interpreter Grid Germiline", () => { }); }); - it("should hidden columns [Type,Consequence Type,Gene]",() => { + it("should hide columns [Type,Consequence Type,Gene]",() => { const columns = ["Type","Consequence Type","Gene"]; cy.get("variant-interpreter-grid thead th") .as("headerColumns"); From 23c00561466444826b9334a4b6d72069032a887f Mon Sep 17 00:00:00 2001 From: Josemi Date: Mon, 6 Nov 2023 18:14:06 +0100 Subject: [PATCH 69/73] wc: remove unused imports in some browser test components #TASK-4847 --- .../test-app/webcomponents/individual-browser-grid-test.js | 3 +-- src/sites/test-app/webcomponents/sample-browser-grid-test.js | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/sites/test-app/webcomponents/individual-browser-grid-test.js b/src/sites/test-app/webcomponents/individual-browser-grid-test.js index e4486587eb..efc9224f7d 100644 --- a/src/sites/test-app/webcomponents/individual-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/individual-browser-grid-test.js @@ -21,7 +21,6 @@ import "../../../webcomponents/individual/individual-grid.js"; import "../../../webcomponents/individual/individual-detail.js"; import "../../../webcomponents/individual/individual-view.js"; import "../../../webcomponents/commons/json-viewer.js"; -import NotificationUtils from "../../../webcomponents/commons/utils/notification-utils.js"; import "../../../webcomponents/individual/individual-update.js"; import "../../../webcomponents/individual/individual-create.js"; @@ -83,7 +82,7 @@ class IndividualBrowserGridTest extends LitElement { this.requestUpdate(); }) .catch(error => { - NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); + console.error(error); }); } } diff --git a/src/sites/test-app/webcomponents/sample-browser-grid-test.js b/src/sites/test-app/webcomponents/sample-browser-grid-test.js index 8b144e581d..85e255b27b 100644 --- a/src/sites/test-app/webcomponents/sample-browser-grid-test.js +++ b/src/sites/test-app/webcomponents/sample-browser-grid-test.js @@ -20,7 +20,6 @@ import UtilsNew from "../../../core/utils-new.js"; import "../../../webcomponents/sample/sample-grid.js"; import "../../../webcomponents/sample/sample-detail.js"; -import NotificationUtils from "../../../webcomponents/commons/utils/notification-utils.js"; import "../../../webcomponents/sample/sample-update.js"; import "../../../webcomponents/sample/sample-create.js"; @@ -88,7 +87,7 @@ class SampleBrowserGridTest extends LitElement { this.requestUpdate(); }) .catch(error => { - NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_RESPONSE, error); + console.error(error); }); } } From e2cfb63647ea6088bc2925e73c81da175500d4d7 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Mon, 6 Nov 2023 18:51:38 +0100 Subject: [PATCH 70/73] wc - Minor change Signed-off-by: gpveronica --- src/webcomponents/file/file-browser.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/file/file-browser.js b/src/webcomponents/file/file-browser.js index 8b35b5fb7e..36768ace18 100644 --- a/src/webcomponents/file/file-browser.js +++ b/src/webcomponents/file/file-browser.js @@ -218,7 +218,7 @@ export default class FileBrowser extends LitElement { { id: "annotations", name: "File Annotations", - description: "" + description: "", } ] } From dbdd5fe147f2c3674bc2701c6df448b2420acf1f Mon Sep 17 00:00:00 2001 From: gpveronica Date: Thu, 9 Nov 2023 18:13:31 +0100 Subject: [PATCH 71/73] wc - Fixed defect, optional chaining in annotations Signed-off-by: gpveronica --- src/webcomponents/commons/grid-commons.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/commons/grid-commons.js b/src/webcomponents/commons/grid-commons.js index 704c9a0c3e..72acf5f344 100644 --- a/src/webcomponents/commons/grid-commons.js +++ b/src/webcomponents/commons/grid-commons.js @@ -305,7 +305,7 @@ export default class GridCommons { title: annotation.title || "Custom Annotation", field: "annotationSets", formatter: annotationSets => formatter(annotationSets, annotation.variableSetId, annotation.variables), - halign: gridConfig.header.horizontalAlign, + halign: gridConfig.header?.horizontalAlign || "center", visible: true, excludeFromSettings: true, // visible: this.gridCommons.isColumnVisible("annotations") From b5f1352cde2a969cb5863eb2c667d7b4bdbffed4 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Fri, 10 Nov 2023 05:51:50 +0100 Subject: [PATCH 72/73] wc - Fixed cohort query, added annotationSets to include --- src/webcomponents/cohort/cohort-grid.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/cohort/cohort-grid.js b/src/webcomponents/cohort/cohort-grid.js index 43002156ff..b8e3ce116e 100644 --- a/src/webcomponents/cohort/cohort-grid.js +++ b/src/webcomponents/cohort/cohort-grid.js @@ -221,7 +221,7 @@ export default class CohortGrid extends LitElement { limit: params.data.limit, skip: params.data.offset || 0, count: !this.table.bootstrapTable("getOptions").pageNumber || this.table.bootstrapTable("getOptions").pageNumber === 1, - include: "id,creationDate,status,type,numSamples", + include: "id,creationDate,status,type,numSamples,annotationSets", ...this.query }; // Store the current filters From 42dd9b7889ae4d35f5dfc457190194dc84dc9113 Mon Sep 17 00:00:00 2001 From: gpveronica Date: Fri, 10 Nov 2023 10:29:41 +0100 Subject: [PATCH 73/73] wc - Fixed annotationSets added to query in file and job Signed-off-by: gpveronica --- src/webcomponents/file/file-grid.js | 2 +- src/webcomponents/job/job-grid.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/webcomponents/file/file-grid.js b/src/webcomponents/file/file-grid.js index ad8f1ff173..88c7dcc2c0 100644 --- a/src/webcomponents/file/file-grid.js +++ b/src/webcomponents/file/file-grid.js @@ -159,7 +159,7 @@ export default class OpencgaFileGrid extends LitElement { limit: params.data.limit, skip: params.data.offset || 0, count: !this.table.bootstrapTable("getOptions").pageNumber || this.table.bootstrapTable("getOptions").pageNumber === 1, - include: "id,name,path,uuid,sampleIds,jobId,status,format,bioformat,size,creationDate,modificationDate,internal", + include: "id,name,path,uuid,sampleIds,jobId,status,format,bioformat,size,creationDate,modificationDate,internal,annotationSets", ...this.query }; // When searching by directory we must also show directories diff --git a/src/webcomponents/job/job-grid.js b/src/webcomponents/job/job-grid.js index 345e45ad3a..7e50215632 100644 --- a/src/webcomponents/job/job-grid.js +++ b/src/webcomponents/job/job-grid.js @@ -243,7 +243,7 @@ export default class JobGrid extends LitElement { order: -1, limit: params.data.limit || this.table.bootstrapTable("getOptions").pageSize, skip: params.data.offset || 0, - include: "id,userId,tool,priority,tags,creationDate,visited,dependsOn,outDir,internal,execution,params,input,output", + include: "id,userId,tool,priority,tags,creationDate,visited,dependsOn,outDir,internal,execution,params,input,output,annotationSets", ...this.query };