Release v2.3.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pegasus-web",
-  "version": "1.7.0",
+  "version": "2.3.1",
   "private": true,
   "homepage": "/",
   "dependencies": {
@@ -32,7 +32,7 @@
     "history": "5.0.0",
     "html-react-parser": "1.4.0",
     "isomorphic-unfetch": "3.1.0",
-    "kpmp-common-components": "1.2.13",
+    "kpmp-common-components": "1.2.14",
     "kpmp-common-styles": "1.0.13",
     "material-table": "1.69.3",
     "npm-run-all": "4.1.5",

src/actions/DataType/dataTypeActions.js

@@ -57,6 +57,9 @@ export const setDataTypeAndRedirect = (dataType, props) => {
             case "st":
                 window.open('/spatial-viewer/?size=n_20_n&filters[0][field]=datatype&filters[0][values][0]=Spatial Transcriptomics&filters[0][type]=any', '_self')
                 break
+            case "imc":
+                window.open("/spatial-viewer/?size=n_20_n&filters%5B0%5D%5Bfield%5D=datatype&filters%5B0%5D%5Bvalues%5D%5B0%5D=Imaging%20Mass%20Cytometry&filters%5B0%5D%5Btype%5D=any", "_self")
+                break;
             case "sm":
                 window.open('https://metaspace2020.eu/datasets?prj=0d9a6710-8389-11eb-96db-73c89a357a89&q=_SM_', '_blank');
                 break

src/components/DataViz/CellXGeneDropdown.js

@@ -19,12 +19,12 @@ class CellXGeneDropdown extends Component {
             <Dropdown isOpen={this.state.dropdownOpen} toggle={this.toggle} direction="down" className="cellxgene-dropdown">
                 <DropdownToggle caret className='float-end' color='primary'>View DiffEx in CellXGene</DropdownToggle>
                 <DropdownMenu>
+                    <DropdownItem tag="a" target="_blank" rel="noopener noreferrer" href={this.props.v1_5}>
+                        Version 1.5
+                    </DropdownItem>
                     <DropdownItem tag="a" target="_blank" rel="noopener noreferrer" href={this.props.v1}>
                         Version 1.0 (Nature 2023)
                     </DropdownItem>
-                    <DropdownItem disabled>
-                        Version 1.5 (Coming Soon)
-                    </DropdownItem>
                 </DropdownMenu>
             </Dropdown>
         )

src/components/DataViz/DataTypeSelector.js

@@ -263,10 +263,12 @@ class DataTypeSelector extends Component {
                                     : <span className="a-button" onClick={this.toggleDataset}>Hide dataset details <FontAwesomeIcon icon={faChevronUp} /></span>
                                 }
                                 {(this.props.dataType === 'sc' ) &&
-                                    <CellXGeneDropdown v1="https://cellxgene.cziscience.com/e/32b9bdce-2481-4c85-ba1b-6ad5fcea844c.cxg/"/>
+                                    <CellXGeneDropdown v1="https://cellxgene.cziscience.com/e/32b9bdce-2481-4c85-ba1b-6ad5fcea844c.cxg/"
+                                                       v1_5="https://cellxgene.cziscience.com/e/dea717d4-7bc0-4e46-950f-fd7e1cc8df7d.cxg/"/>
                                 }
                                 { (this.props.dataType === 'sn') &&
-                                    <CellXGeneDropdown v1="https://cellxgene.cziscience.com/e/07854d9c-5375-4a9b-ac34-fa919d3c3686.cxg/"/>
+                                    <CellXGeneDropdown v1="https://cellxgene.cziscience.com/e/07854d9c-5375-4a9b-ac34-fa919d3c3686.cxg/"
+                                                       v1_5="https://cellxgene.cziscience.com/e/a12ccb9b-4fbe-457d-8590-ac78053259ef.cxg/"/>
                                 }
                             </div>
                             }

src/components/Explorer/SamplesByDataTypeTable.js

@@ -54,7 +54,8 @@ class SamplesByDataTypeTable extends Component {
             'Spatial Metabolomics': 'sm',
             'Spatial Lipidomics': 'sl',
             'Spatial N-glycomics': 'sng',
-            'Spatial Transcriptomics': 'st'
+            'Spatial Transcriptomics': 'st',
+            "Imaging Mass Cytometry": 'imc',
         };
         if (dataLinkageMapping[dataType]) {
             this.props.setSelectedConcept(dataLinkageMapping[dataType], this.props);
@@ -158,7 +159,7 @@ class SamplesByDataTypeTable extends Component {
                 </Row>
                 <Row>
                     <Col xs='12'>
-                        <small><span style={{color: 'red'}}>*</span> Additional information available in <a rel='noreferrer' target='_blank' href='https://cellxgene.cziscience.com/collections/bcb61471-2a44-4d00-a0af-ff085512674c'>cellxgene</a></small>
+                        <small><span style={{color: 'red'}}>*</span> Additional information available in <a rel='noreferrer' target='_blank' href='https://cellxgene.cziscience.com/collections/0f528c8a-a25c-4840-8fa3-d156fa11086f?utm_campaign=partner&utm_source=publisher'>cellxgene</a></small>
                     </Col>
                 </Row>
             </article>

src/components/Home/DataSummary.js

@@ -20,7 +20,7 @@ class DataSummary extends Component {
         return (
             <Container className="landing mt-3 mb-4 rounded border p-3 shadow-sm">
                 <Row><h2 className="data-summary">Atlas Data Summary</h2></Row>
-                <Row><p>IMPORTANT: Please follow this <a href="https://www.kpmp.org/help-docs/study-overview?tabname=citingkpmpdata">citation guideline</a> when presenting or publishing data from the Kidney Tissue Atlas.</p></Row>
+                <Row><p>IMPORTANT: Please follow this <a href="https://www.kpmp.org/help-docs/study-overview?tabname=citingkpmpdata" target="_blank" rel='noreferrer'>citation guideline</a> when presenting or publishing data from the Kidney Tissue Atlas.</p></Row>
 
                 <h3 className="centered kpmp-color-dark"><span><FontAwesomeIcon className='kpmp-color-dark pe-2' icon={faPerson} /></span>PARTICIPANTS</h3>
                 <ParticipantSummary/>

src/components/Home/Home.js

@@ -13,6 +13,8 @@ class Home extends Component {
           <Col md='12' lg='12'>
             <TopContent/>
           </Col>
+        </Row>
+        <Row>
           <Col md='12' lg='4'>
             <LeftContent />
           </Col>

src/components/Home/LeftContent.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { Container, Row, Button } from 'reactstrap';
+import { Container, Button } from 'reactstrap';
 import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper';
 
 class LeftContent extends Component {
@@ -13,7 +13,7 @@ class LeftContent extends Component {
   }
   render() {
     return (
-      <Row>
+      <div id="leftcontent">
         <Container className="mt-3 rounded border p-3 shadow-sm">
           <h5>Explorer</h5>
           <div>
@@ -60,7 +60,7 @@ class LeftContent extends Component {
             <Button className="w-100" color='primary' href='https://www.kpmp.org/collaboration' size='lg' block onClick={() => { this.handleGoogleAnalyticsEvent('Atlas Home', 'Navigation', 'collaborate') }}>Collaborate with us</Button>
           </div>
         </Container>
-      </Row>
+      </div>
     );
   }
 }

src/components/Home/SamplesByDataTypeTable.js

@@ -56,7 +56,8 @@ class SamplesByDataTypeTable extends Component {
             'Spatial Metabolomics': 'sm',
             'Spatial Lipidomics': 'sl',
             'Spatial N-glycomics': 'sng',
-            'Spatial Transcriptomics': 'st'
+            'Spatial Transcriptomics': 'st',
+            'Imaging Mass Cytometry': 'imc'
         };
         if (dataLinkageMapping[dataType]) {
             this.props.setDataType(dataLinkageMapping[dataType], this.props);
@@ -67,6 +68,7 @@ class SamplesByDataTypeTable extends Component {
     }
 
     formatDataTypeCell(row) {
+
         let value = row.dataType;
         if (value === 'Explorer' || value === 'Spatial Viewer') {
             return (
@@ -184,4 +186,4 @@ class SamplesByDataTypeTable extends Component {
     }
 }
 
-export default SamplesByDataTypeTable;
+export default SamplesByDataTypeTable;

src/index.scss

@@ -440,7 +440,7 @@ tr.MuiTableRow-root:nth-child(even) {
 }
 
 .expanded-search-container {
-  height: 94%;
+  height: 97.5%;
 }
 
 .buttonhref {
@@ -457,9 +457,8 @@ tr.MuiTableRow-root:nth-child(even) {
 
 #homepage {
   @media (min-width: 990px) {
-    .container-expanded {
-      max-width: 98.75%;
-      margin-left: 15px;
+    .container {
+      max-width: 100%;
     }
   }
   @media (max-width: 635px) {
@@ -958,4 +957,10 @@ tr.MuiTableRow-root:nth-child(even) {
 
 .cellxgene-dropdown {
   margin-top: -21px;
+}
+
+#leftcontent {
+  @media (min-width: 992px) {
+    margin-right: 15px;
+  }
 }