gramene-search 1.4.1 → 1.4.3

package/.parcel-cache/snapshot-369948a06d23ec44.txt

@@ -1,2 +1,2 @@
-55356909
-1711747095464480000
+102761389
+1713371873174671000

package/dist/{Study.b2ce28e8.js → Study.5ff9518c.js}

@@ -36,12 +36,17 @@ const $5833a2eeefc77457$var$metaRenderer = (params)=>{
     });
     return params.value.label;
 };
+const $5833a2eeefc77457$var$sampleRenderer = (params)=>{
+    const sampleMeta = params.value;
+    return JSON.stringify(sampleMeta, null, 2);
+};
 const $5833a2eeefc77457$var$Study = (props)=>{
     let samples = props.expressionSamples[props.id];
     let sampleMetadata = [];
     let metadataFields = [
         {
-            field: "sampleId"
+            field: "sampleId",
+            cellRenderer: $5833a2eeefc77457$var$sampleRenderer
         }
     ];
     let isFactor = {};
@@ -72,7 +77,7 @@ const $5833a2eeefc77457$var$Study = (props)=>{
             metadataFields.push(characteristics);
         }
         let s_info = {
-            sampleId: sample.group
+            sampleId: sample
         };
         sample.factor.forEach((factor)=>{
             s_info[factor.type] = {
@@ -124,9 +129,9 @@ const $5833a2eeefc77457$var$Study = (props)=>{
         ]
     });
 };
-var $5833a2eeefc77457$export$2e2bcd8739ae039 = (0, $eTR7Q$reduxbundlerreact.connect)("selectExpressionSamples", $5833a2eeefc77457$var$Study);
+var $5833a2eeefc77457$export$2e2bcd8739ae039 = (0, $eTR7Q$reduxbundlerreact.connect)("selectExpressionSamples", "doToggleExpressionSample", $5833a2eeefc77457$var$Study);
 
 });
 
 
-//# sourceMappingURL=Study.b2ce28e8.js.map
+//# sourceMappingURL=Study.5ff9518c.js.map

package/dist/Study.5ff9518c.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,MAAM,qCAAe,CAAA;IACnB,IAAI,OAAO,KAAK,CAAC,QAAQ,EACvB,qBAAO,gCAAC;QAAE,MAAM,CAAC,+BAA+B,EAAE,OAAO,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,KAAI,KAAK,CAAC;QAAE,QAAO;kBAAU,OAAO,KAAK,CAAC,KAAK;;IAE3H,OAAO,OAAO,KAAK,CAAC,KAAK;AAC3B;AACA,MAAM,uCAAiB,CAAA;IACrB,MAAM,aAAa,OAAO,KAAK;IAC/B,OAAO,KAAK,SAAS,CAAC,YAAW,MAAK;AACxC;AACA,MAAM,8BAAQ,CAAA;IACZ,IAAI,UAAU,MAAM,iBAAiB,CAAC,MAAM,EAAE,CAAC;IAC/C,IAAI,iBAAiB,EAAE;IACvB,IAAI,iBAAiB;QAAC;YAAE,OAAO;YAAY,cAAc;QAAe;KAAE;IAC1E,IAAI,WAAS,CAAC;IACd,QAAQ,OAAO,CAAC,CAAC,QAAQ;QACvB,IAAI,QAAQ,GAAG;YACb,IAAI,UAAU;gBACZ,YAAY;gBACZ,UAAU,EAAE;YACd;YACA,OAAO,MAAM,CAAC,OAAO,CAAC,CAAA;gBACpB,QAAQ,QAAQ,CAAC,IAAI,CAAC;oBAAC,OAAO,OAAO,IAAI;oBAAE,cAAc;gBAAY;gBACrE,QAAQ,CAAC,OAAO,IAAI,CAAC,GAAG;YAC1B;YACA,eAAe,IAAI,CAAC;YACpB,IAAI,kBAAkB;gBACpB,YAAY;gBACZ,UAAU,EAAE;YACd;YACA,OAAO,cAAc,CAAC,OAAO,CAAC,CAAA;gBAC5B,IAAI,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,EACpB,gBAAgB,QAAQ,CAAC,IAAI,CAAC;oBAAC,OAAO,GAAG,IAAI;oBAAE,cAAc;gBAAY;YAE7E;YACA,eAAe,IAAI,CAAC;QACtB;QACA,IAAI,SAAS;YAAC,UAAU;QAAM;QAC9B,OAAO,MAAM,CAAC,OAAO,CAAC,CAAA;YACpB,MAAM,CAAC,OAAO,IAAI,CAAC,GAAG;gBAAC,OAAO,OAAO,KAAK;YAAA;YAC1C,IAAI,OAAO,QAAQ,EAAE;gBACnB,MAAM,CAAC,OAAO,IAAI,CAAC,CAAC,WAAW,GAAG,OAAO,QAAQ;gBACjD,MAAM,CAAC,OAAO,IAAI,CAAC,CAAC,KAAK,GAAG,OAAO,EAAE;YACvC;QACF;QACA,OAAO,cAAc,CAAC,OAAO,CAAC,CAAA;YAC5B,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG;gBAAC,OAAO,GAAG,KAAK;YAAA;YAClC,IAAI,GAAG,QAAQ,EAAE;gBACf,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC,WAAW,GAAG,GAAG,QAAQ;gBACzC,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC,KAAK,GAAG,GAAG,EAAE;YAC/B;QACF;QACA,eAAe,IAAI,CAAC;IACtB;IACA,MAAM,CAAC,SAAS,WAAW,GAAG,CAAA,GAAA,qBAAO,EAAE;IACvC,MAAM,CAAC,SAAS,WAAW,GAAG,CAAA,GAAA,qBAAO,EAAE;IACvC,MAAM,gBAAgB,CAAA,GAAA,oBAAM,EAAE;QAC5B,OAAO;YACL,QAAQ;QACV;IACF,GAAG,EAAE;IACL,qBACE,iCAAC;;0BACC,gCAAC;gBAAI,WAAU;gBAAkB,OAAO;oBAAC,QAAQ,CAAC,EAAE,KAAM,CAAA,QAAQ,MAAM,GAAG,CAAA,EAAG,EAAE,CAAC;gBAAA;0BAC/E,cAAA,gCAAC,CAAA,GAAA,8BAAU;oBAAE,SAAS;oBAAS,YAAY;oBAAS,eAAe;;;0BAErE,iCAAC;gBAAE,MAAM,CAAC,sCAAsC,EAAE,MAAM,EAAE,CAAC,CAAC;;oBAAE;oBAAuB,MAAM,EAAE;;;;;AAGnG;IACA,2CAAe,CAAA,GAAA,gCAAM,EACnB,2BACA,4BACA","sources":["src/components/results/Study.js"],"sourcesContent":["import React, { useState, useMemo } from 'react'\nimport {connect} from \"redux-bundler-react\";\nimport { AgGridReact } from \"ag-grid-react\";\nimport \"ag-grid-community/styles/ag-grid.css\";\nimport \"ag-grid-community/styles/ag-theme-quartz.css\";\n\nconst metaRenderer = params => {\n  if (params.value.ontology) {\n    return <a href={`http://purl.obolibrary.org/obo/${params.value.id.replace(\":\",\"_\")}`} target='_blank'>{params.value.label}</a>\n  }\n  return params.value.label\n}\nconst sampleRenderer = params => {\n  const sampleMeta = params.value;\n  return JSON.stringify(sampleMeta,null,2);\n}\nconst Study = props => {\n  let samples = props.expressionSamples[props.id];\n  let sampleMetadata = [];\n  let metadataFields = [{ field: \"sampleId\", cellRenderer: sampleRenderer }];\n  let isFactor={};\n  samples.forEach((sample, idx) => {\n    if (idx === 0) {\n      let factors = {\n        headerName: 'Experimental Variables',\n        children: []\n      }\n      sample.factor.forEach(factor => {\n        factors.children.push({field: factor.type, cellRenderer: metaRenderer})\n        isFactor[factor.type] = true;\n      });\n      metadataFields.push(factors);\n      let characteristics = {\n        headerName: 'Sample Characteristics',\n        children: []\n      }\n      sample.characteristic.forEach(ch => {\n        if (!isFactor[ch.type]) {\n          characteristics.children.push({field: ch.type, cellRenderer: metaRenderer})\n        }\n      });\n      metadataFields.push(characteristics)\n    }\n    let s_info = {sampleId: sample}\n    sample.factor.forEach(factor => {\n      s_info[factor.type] = {label: factor.label};\n      if (factor.ontology) {\n        s_info[factor.type]['ontology'] = factor.ontology\n        s_info[factor.type]['id'] = factor.id;\n      }\n    })\n    sample.characteristic.forEach(ch => {\n      s_info[ch.type] = {label: ch.label};\n      if (ch.ontology) {\n        s_info[ch.type]['ontology'] = ch.ontology\n        s_info[ch.type]['id'] = ch.id;\n      }\n    })\n    sampleMetadata.push(s_info)\n  })\n  const [rowData, setRowData] = useState(sampleMetadata);\n  const [colDefs, setColDefs] = useState(metadataFields);\n  const defaultColDef = useMemo(() => {\n    return {\n      filter: true\n    }\n  }, []);\n  return (\n    <div>\n      <div className=\"ag-theme-quartz\" style={{height: `${44 * (samples.length + 2)}px`}}>\n        <AgGridReact rowData={rowData} columnDefs={colDefs} defaultColDef={defaultColDef}/>\n      </div>\n      <a href={`https://www.ebi.ac.uk/gxa/experiments/${props.id}`}>EBI Atlas Experiment: {props.id}</a>\n    </div>\n  );\n};\nexport default connect(\n  'selectExpressionSamples',\n  'doToggleExpressionSample',\n  Study);\n"],"names":[],"version":3,"file":"Study.5ff9518c.js.map"}

package/dist/index.js

@@ -72,7 +72,7 @@ if (parcelRequire == null) {
 
 var parcelRegister = parcelRequire.register;
 parcelRegister("7u0Mi", function(module, exports) {
-module.exports = Promise.resolve(require("./Study.b2ce28e8.js")).then(()=>parcelRequire("7zuJ6"));
+module.exports = Promise.resolve(require("./Study.5ff9518c.js")).then(()=>parcelRequire("7zuJ6"));
 
 });
 
@@ -1282,7 +1282,8 @@ const $24971af0a229e0e3$var$grameneViews = {
                     id: "expression",
                     name: "Gene expression",
                     show: "off",
-                    shouldScroll: false
+                    shouldScroll: false,
+                    desiredSamples: {}
                 },
                 {
                     id: "attribs",
@@ -1360,6 +1361,7 @@ const $671312b287158a8a$var$grameneDocs = {
             rnaSequences: {},
             pepSequences: {},
             studies: {},
+            desiredSamples: {},
             consequences: {}
         };
         return (state = initialState, { type: type, payload: payload })=>{
@@ -1465,10 +1467,23 @@ const $671312b287158a8a$var$grameneDocs = {
                     newState.expression = Object.assign({}, state.expression);
                     newState.expression[payload.id] = payload.paralogs;
                     return newState;
+                case "EXPRESSION_SAMPLE_TOGGLED":
+                    newState = Object.assign({}, state);
+                    newState.desiredSamples = Object.assign({}, state.desiredSamples);
+                    if (newState.desiredSamples.hasOwnProperty(payload)) delete newState.desiredSamples[payload];
+                    else newState.desiredSamples[payload] = {
+                        status: "need"
+                    };
             }
             return state;
         };
     },
+    doToggleExpressionSample: (id)=>({ dispatch: dispatch })=>{
+            dispatch({
+                type: "EXPRESSION_SAMPLE_TOGGLED",
+                payload: id
+            });
+        },
     doRequestVEP: (id)=>({ dispatch: dispatch, store: store })=>{
             const consequences = store.selectGrameneConsequences();
             if (!consequences.hasOwnProperty(id)) {
@@ -1711,7 +1726,8 @@ const $671312b287158a8a$var$grameneDocs = {
     selectGeneSequences: (state)=>state.grameneDocs.sequences,
     selectRnaSequences: (state)=>state.grameneDocs.rnaSequences,
     selectPepSequences: (state)=>state.grameneDocs.pepSequences,
-    selectAtlasStudies: (state)=>state.grameneDocs.studies
+    selectAtlasStudies: (state)=>state.grameneDocs.studies,
+    selectDesiredSamples: (state)=>state.grameneDocs.desiredSamples
 };
 var $671312b287158a8a$export$2e2bcd8739ae039 = $671312b287158a8a$var$grameneDocs;
 
@@ -2165,6 +2181,56 @@ var $541b8b0d8c5501d2$export$2e2bcd8739ae039 = (0, $gXNCa$reduxbundlerreact.conn
 
 
 
+function $9e29a4f60318db7a$var$DynamicIframe(props) {
+    // Create a ref for the iframe element
+    const iframeRef = (0, $gXNCa$react.useRef)(null);
+    // Function to resize iframe height
+    const resizeIframe = ()=>{
+        if (iframeRef.current) {
+            const iframe = iframeRef.current;
+            const innerDoc = iframe.contentDocument || iframe.contentWindow.document;
+            iframe.style.height = 44 + innerDoc.body.scrollHeight + "px";
+        }
+    };
+    // Resize iframe when content loads
+    (0, $gXNCa$react.useEffect)(()=>{
+        resizeIframe();
+    }, []); // Empty dependency array ensures it only runs once after initial render
+    // Optional: Resize iframe when window is resized
+    (0, $gXNCa$react.useEffect)(()=>{
+        window.addEventListener("resize", resizeIframe);
+        return ()=>{
+            window.removeEventListener("resize", resizeIframe);
+        };
+    }, []); // Empty dependency array ensures it only runs once after initial render
+    // Resize iframe when content changes
+    (0, $gXNCa$react.useEffect)(()=>{
+        const iframe = iframeRef.current;
+        if (!iframe) return;
+        const observer = new MutationObserver(resizeIframe);
+        const checkElement = ()=>{
+            const innerDoc = iframe.contentDocument || iframe.contentWindow.document;
+            const targetElement = innerDoc.querySelector("#heatmapContainer");
+            if (targetElement) observer.observe(targetElement, {
+                attributes: true,
+                childList: true,
+                subtree: true
+            });
+            else setTimeout(checkElement, 200); // Check again after 100 milliseconds
+        };
+        checkElement();
+        return ()=>observer.disconnect();
+    }, []);
+    return /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)("iframe", {
+        ref: iframeRef,
+        src: props.url,
+        title: "Dynamic Iframe",
+        style: {
+            width: "100%",
+            border: "none"
+        }
+    });
+}
 const $9e29a4f60318db7a$var$Detail = (props)=>{
     const gene = props.geneDocs[props.searchResult.id];
     let paralogs_url;
@@ -2175,34 +2241,28 @@ const $9e29a4f60318db7a$var$Detail = (props)=>{
     } else props.doRequestParalogExpression(gene._id);
     return /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Tabs), {
         children: [
-            (0, $gXNCa$grameneefpbrowser.haveBAR)(gene) && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Tab), {
-                tabClassName: "eFP",
-                eventKey: "eFP",
-                title: "eFP Browser",
-                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, ($parcel$interopDefault($gXNCa$grameneefpbrowser))), {
-                    gene: gene
+            paralogs_url && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Tab), {
+                tabClassName: "gxa",
+                eventKey: "paralogs",
+                title: "Reference Study (all paralogs)",
+                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)($9e29a4f60318db7a$var$DynamicIframe, {
+                    url: paralogs_url
                 })
             }),
             /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Tab), {
                 tabClassName: "gxa",
                 eventKey: "gene",
                 title: "All Studies",
-                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)("iframe", {
-                    src: gene_url,
-                    frameBorder: "0",
-                    width: "100%",
-                    height: "500px"
+                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)($9e29a4f60318db7a$var$DynamicIframe, {
+                    url: gene_url
                 })
             }),
-            paralogs_url && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Tab), {
-                tabClassName: "gxa",
-                eventKey: "paralogs",
-                title: "Reference Study (all paralogs)",
-                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)("iframe", {
-                    src: paralogs_url,
-                    frameBorder: "0",
-                    width: "100%",
-                    height: "500px"
+            (0, $gXNCa$grameneefpbrowser.haveBAR)(gene) && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Tab), {
+                tabClassName: "eFP",
+                eventKey: "eFP",
+                title: "eFP Browser",
+                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, ($parcel$interopDefault($gXNCa$grameneefpbrowser))), {
+                    gene: gene
                 })
             })
         ]
@@ -3385,7 +3445,7 @@ const $283508ffcf8a47c4$var$Detail = (props)=>{
                             href: `${props.configuration.ensemblURL}/${gene.system_name}/Gene/Variation_Gene/Image?db=core;g=${props.searchResult.id}`,
                             children: "Variant image"
                         }),
-                        " page on the Ensembl site."
+                        " page in the Ensembl genome browser."
                     ]
                 }),
                 /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)("div", {
@@ -5099,34 +5159,50 @@ const $261baeb81c4d4d8a$var$Expression = (props)=>{
         taxon_id_facet.filter((tid, idx)=>idx % 2 === 0).forEach((tid)=>searchTaxa[tid] = true);
     }
     const availableTaxa = Object.keys(props.expressionStudies).filter((tid)=>searchTaxa[tid] || searchTaxa[tid + "001"]).sort((a, b)=>props.grameneMaps[a + "001"].left_index - props.grameneMaps[b + "001"].left_index);
-    return availableTaxa && props.grameneTaxonomy && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Accordion), {
-        alwaysOpen: true,
-        defaultActiveKey: availableTaxa.length === 1 ? "tax_0" : undefined,
-        children: availableTaxa.map((tid, idx)=>{
-            const n = props.expressionStudies[tid].length;
-            return /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Accordion).Item, {
-                eventKey: "tax_" + idx,
+    return availableTaxa && props.grameneTaxonomy && /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)("div", {
+        children: [
+            /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)("div", {
                 children: [
-                    /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Accordion).Header, {
+                    "This is where you can launch a component for the selected samples. props.desiredSamples lists them. This component can request the data from the API organize samples by factor metadata? One big table with all the studies?",
+                    /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Button), {
                         children: [
-                            props.grameneTaxonomy[tid].name,
-                            " - ",
-                            n,
-                            " ",
-                            n === 1 ? "study" : "studies"
+                            "Show Samples (",
+                            Object.keys(props.desiredSamples).length,
+                            " selected)"
                         ]
-                    }),
-                    /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Accordion).Body, {
-                        children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)($261baeb81c4d4d8a$var$StudyList, {
-                            studies: props.expressionStudies[tid]
-                        })
                     })
                 ]
-            }, idx);
-        })
+            }),
+            /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Accordion), {
+                alwaysOpen: true,
+                defaultActiveKey: availableTaxa.length === 1 ? "tax_0" : undefined,
+                children: availableTaxa.map((tid, idx)=>{
+                    const n = props.expressionStudies[tid].length;
+                    return /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Accordion).Item, {
+                        eventKey: "tax_" + idx,
+                        children: [
+                            /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsxs)((0, $gXNCa$reactbootstrap.Accordion).Header, {
+                                children: [
+                                    props.grameneTaxonomy[tid].name,
+                                    " - ",
+                                    n,
+                                    " ",
+                                    n === 1 ? "study" : "studies"
+                                ]
+                            }),
+                            /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)((0, $gXNCa$reactbootstrap.Accordion).Body, {
+                                children: /*#__PURE__*/ (0, $gXNCa$reactjsxruntime.jsx)($261baeb81c4d4d8a$var$StudyList, {
+                                    studies: props.expressionStudies[tid]
+                                })
+                            })
+                        ]
+                    }, idx);
+                })
+            })
+        ]
     });
 };
-var $261baeb81c4d4d8a$export$2e2bcd8739ae039 = (0, $gXNCa$reduxbundlerreact.connect)("selectConfiguration", "selectGrameneSearch", "selectGrameneTaxonomy", "selectGrameneMaps", "selectExpressionStudies", $261baeb81c4d4d8a$var$Expression);
+var $261baeb81c4d4d8a$export$2e2bcd8739ae039 = (0, $gXNCa$reduxbundlerreact.connect)("selectConfiguration", "selectGrameneSearch", "selectGrameneTaxonomy", "selectGrameneMaps", "selectExpressionStudies", "selectDesiredSamples", $261baeb81c4d4d8a$var$Expression);