Merge branch 'develop' into TASK-4158

cypress/e2e/iva/file-browser-grid.cy.js

@@ -191,17 +191,17 @@ context("File Browser Grid", () => {
         });
     });
 
-    context("Grid",{tags: "@shortTask"}, () => {
-        it("should render", () => {
-            cy.get(browserGrid)
-                .should("be.visible");
-        });
-
-        it("should change page", () => {
-            UtilsTest.changePage(browserGrid,2);
-            UtilsTest.changePage(browserGrid,3);
-        });
-    });
+    // context("Grid",{tags: "@shortTask"}, () => {
+    //     it("should render", () => {
+    //         cy.get(browserGrid)
+    //             .should("be.visible");
+    //     });
+    //
+    //     it("should change page", () => {
+    //         UtilsTest.changePage(browserGrid,2);
+    //         UtilsTest.changePage(browserGrid,3);
+    //     });
+    // });
 
     context("Row", () => {
         it("should display row #3 as selected", () => {

cypress/e2e/iva/job-browser-grid.cy.js

@@ -255,7 +255,7 @@ context("Job Browser Grid", () => {
                 .find(`td`)
                 .eq(1)
                 .trigger("click");
-        
+
             cy.get(`detail-tabs h3`)
                 .should("contain.text", `Job ${job}`);
         });
@@ -265,7 +265,7 @@ context("Job Browser Grid", () => {
                 .find("li")
                 .contains("Logs")
                 .trigger("click");
-            
+
             cy.get("job-detail-log")
                 .should("be.visible");
         });

src/sites/iva/conf/browsers.settings.js

@@ -124,6 +124,8 @@ const CATALOG_SETTINGS = {
         },
         table: {
             // merge criterium: spread operator
+            pageSize: 10,
+            pageList: [10, 25],
             toolbar: {
                 showSettings: true,
                 showColumns: false,
@@ -380,7 +382,7 @@ const CATALOG_SETTINGS = {
             toolbar: {
                 showSettings: true,
                 showColumns: false,
-                showCreate: false,
+                showCreate: true,
                 showExport: true,
                 showDownload: false,
                 // columns list for the dropdown will be added in grid components based on settings.table.columns

src/sites/iva/conf/config.js

@@ -26,8 +26,8 @@ const hosts = [
         url: "https://demo.app.zettagenomics.com/opencga"
     },
     {
-        id: "testteam",
-        url: "https://test.app.zettagenomics.com/testteam/opencga"
+        id: "reference",
+        url: "https://test.app.zettagenomics.com/reference/opencga"
     },
 ];
 

src/sites/iva/extensions/extensions.js

@@ -1,8 +1,8 @@
-window.IVA_EXTENSIONS = {
-    id: "opencb",
-    name: "OpenCB",
-    description: "",
-    commercial: false,
-    license: "",
-    extensions: [],
-};
+// window.IVA_EXTENSIONS.push({
+//     id: "opencb",
+//     name: "OpenCB",
+//     description: "",
+//     commercial: false,
+//     license: "",
+//     extensions: [],
+// });

src/sites/iva/index.html

@@ -185,6 +185,10 @@
     <!-- /build -->
     <!-- LitElement assets -->
     <!-- build:void[] -->
+    <script type="text/javascript">
+        // We need to initialize IVA_EXTENSIONS as an empty array
+        window.IVA_EXTENSIONS = [];
+    </script>
     <script src="{{ IVA_EXTENSIONS_PATH }}/extensions.js"></script>
     <script type="module" src="./iva-app.js"></script>
     <!-- /build -->

src/sites/test-app/extensions/extensions.js

@@ -1,4 +1,4 @@
-window.IVA_EXTENSIONS = {
+window.IVA_EXTENSIONS.push({
     id: "opencb",
     name: "OpenCB",
     description: "",
@@ -125,4 +125,4 @@ window.IVA_EXTENSIONS = {
             },
         },
     ],
-};
+});

src/sites/test-app/index.html

@@ -157,14 +157,18 @@
     <!-- /build -->
     <!-- LitElement assets -->
     <!-- build:void[] -->
+    <script type="text/javascript">
+        // We need to initialize IVA_EXTENSIONS as an empty array
+        window.IVA_EXTENSIONS = [];
+    </script>
     <script src="{{ TEST_APP_EXTENSIONS_PATH }}/extensions.js"></script>
     <script type="module" src="./test-app.js"></script>
     <!-- /build -->
 
 </head>
 
 <body>
-    <script type="module">
+    <script type="text/javascript">
         $(function(){
             document.title = SUITE.name;
             // Back to top button

src/sites/test-app/webcomponents/variant-interpreter-grid-test.js

@@ -71,11 +71,6 @@ class VariantInterpreterGridTest extends LitElement {
             nucleotideGenotype: true,
             alleleStringLengthMax: 10,
 
-            header: {
-                horizontalAlign: "center",
-                verticalAlign: "bottom"
-            },
-
             quality: {
                 qual: 30,
                 dp: 20

src/webcomponents/alignment/gene-coverage-grid.js

@@ -108,7 +108,6 @@ export default class GeneCoverageGrid extends LitElement {
             pageList: this._config.pageList,
             showExport: this._config.showExport,
             detailView: this._config.detailView,
-            detailFormatter: this.detailFormatter,
             gridContext: this,
             formatLoadingMessage: () =>"<div><loading-spinner></loading-spinner></div>",
             onClickRow: (row, selectedElement, field) => this.gridCommons.onClickRow(row.id, row, selectedElement),
@@ -320,10 +319,6 @@ export default class GeneCoverageGrid extends LitElement {
             nucleotideGenotype: true,
             alleleStringLengthMax: 15,
             showToolbar: true,
-            header: {
-                horizontalAlign: "center",
-                verticalAlign: "bottom"
-            }
         };
     }
 

src/webcomponents/clinical/analysis/rd-tiering-analysis.js

@@ -15,8 +15,7 @@
  */
 
 import {LitElement, html} from "lit";
-import FormUtils from "../../commons/forms/form-utils";
-import AnalysisUtils from "../../commons/analysis/analysis-utils";
+import AnalysisUtils from "../../commons/analysis/analysis-utils.js";
 import UtilsNew from "../../../core/utils-new.js";
 import "../../commons/forms/data-form.js";
 import "../../commons/filters/catalog-search-autocomplete.js";
@@ -87,15 +86,15 @@ export default class RdTieringAnalysis extends LitElement {
         return null;
     }
 
-    onFieldChange(e, field) {
+    onFieldChange() {
         this.toolParams = {...this.toolParams};
         this.requestUpdate();
     }
 
     onSubmit() {
         const toolParams = {
             clinicalAnalysis: this.toolParams.clinicalAnalysis || "",
-            panels: this.toolParams.panels.split(",") || [],
+            panels: (this.toolParams.panels || "").split(","),
         };
         const params = {
             study: this.opencgaSession.study.fqn,
@@ -138,12 +137,12 @@ export default class RdTieringAnalysis extends LitElement {
                 elements: [
                     {
                         title: "Clinical Analysis ID",
-                        field: "clinicalAnalysisId",
+                        field: "clinicalAnalysis",
                         type: "custom",
                         display: {
-                            render: (clinicalAnalysisId, dataFormFilterChange, updateParams, clinicalAnalysis) => html`
+                            render: (clinicalAnalysis, dataFormFilterChange) => html`
                                 <catalog-search-autocomplete
-                                    .value="${clinicalAnalysisId}"
+                                    .value="${clinicalAnalysis}"
                                     .resource="${"CLINICAL_ANALYSIS"}"
                                     .opencgaSession="${this.opencgaSession}"
                                     .config="${{multiple: false, disabled: !!clinicalAnalysis}}"
@@ -157,17 +156,16 @@ export default class RdTieringAnalysis extends LitElement {
                         //   - Once the clinical analysis id is selected, query its panels?
                         //   - All the studies have panels?
                         title: "Disease Panels",
-                        field: "panels.id",
+                        field: "panels",
                         type: "custom",
                         display: {
                             render: (panels, dataFormFilterChange) => {
-                                // Todo: check if its working
                                 // Get whether disease panels can be modified or are fixed
-                                const casePanelLock = !!this.clinicalAnalysisId;
+                                const casePanelLock = !!this.clinicalAnalysis;
                                 // Get the list of disease panels for the dropdown
                                 let diseasePanels = [];
                                 if (casePanelLock) {
-                                    for (const panelId of panels.split(",")) {
+                                    for (const panelId of (panels || "").split(",")) {
                                         const diseasePanel = this.opencgaSession.study?.panels?.find(p => p.id === panelId);
                                         if (diseasePanel) {
                                             diseasePanels.push(diseasePanel);
@@ -177,15 +175,15 @@ export default class RdTieringAnalysis extends LitElement {
                                     diseasePanels = this.opencgaSession.study?.panels;
                                 }
                                 return html`
-                                    <disease-panel-filter
-                                        .opencgaSession="${this.opencgaSession}"
-                                        .diseasePanels="${diseasePanels}"
-                                        .panel="${this.diseasePanelIds}"
-                                        .showExtendedFilters="${false}"
-                                        .showSelectedPanels="${false}"
+                                    <select-field-filter
+                                        .data="${diseasePanels}"
+                                        .value=${panels || ""}
+                                        .liveSearch=${diseasePanels?.length > 5}
+                                        .multiple="${true}"
                                         .disabled="${casePanelLock}"
+                                        separator="\n"
                                         @filterChange="${e => dataFormFilterChange(e.detail.value)}">
-                                    </disease-panel-filter>
+                                    </select-field-filter>
                                 `;
                             },
                         }

src/webcomponents/clinical/clinical-analysis-browser.js

@@ -80,14 +80,12 @@ export default class ClinicalAnalysisBrowser extends LitElement {
         }
 
         if (this.settings?.table) {
-            this._config.filter.result.grid = {
+            const {toolbar, ...otherTableProps} = this.settings.table;
+            UtilsNew.setObjectValue(this._config, "filter.result.grid", {
                 ...this._config.filter.result.grid,
-                ...this.settings.table,
-                toolbar: {
-                    ...this._config.filter.result.grid.toolbar,
-                    ...(this.settings.table.toolbar || {}),
-                },
-            };
+                ...otherTableProps,
+                ...toolbar,
+            });
         }
 
         // Apply user configuration
@@ -96,14 +94,6 @@ export default class ClinicalAnalysisBrowser extends LitElement {
             ...this.opencgaSession.user?.configs?.IVA?.settings?.[this.COMPONENT_ID]?.grid,
         });
 
-
-        // if (this.opencgaSession.user?.configs?.IVA?.clinicalAnalysisBrowserCatalog?.grid) {
-        //     this._config.filter.result.grid = {
-        //         ...this._config.filter.result.grid,
-        //         ...this.opencgaSession.user.configs.IVA.clinicalAnalysisBrowserCatalog.grid,
-        //     };
-        // }
-
         this.requestUpdate();
     }
 
@@ -248,9 +238,7 @@ export default class ClinicalAnalysisBrowser extends LitElement {
                         detailView: false,
                         multiSelection: false,
                         showActions: true,
-                        toolbar: {
-                            showCreate: false,
-                        },
+                        showCreate: false,
                     }
                 },
                 detail: {
@@ -274,13 +262,6 @@ export default class ClinicalAnalysisBrowser extends LitElement {
             // TODO recheck (they come from clinical-analysis-browser and used in opencga-clinical-analysis-filter and opencga-clinical-analysis-grid now they have been moved in config)
             analyses: [],
             analysis: {},
-
-            gridComparator: {
-                pageSize: 5,
-                pageList: [5, 10],
-                detailView: true,
-                multiSelection: true
-            }
         };
     }