Kpmp 5366 change tissue type to enrollment category

data/schema.graphql

@@ -1,15 +1,15 @@
 type Query {
   autocomplete(searchTerm: String): [AutoCompleteResult]
   cellTypeHierarchy: CellTypeHierarchy
-  geneExpressionSummary(dataType: String, geneSymbol: String, cellType: String, tissueType: String) : [GeneExpressionSummary]
+  geneExpressionSummary(dataType: String, geneSymbol: String, cellType: String, enrollmentCategory: String) : [GeneExpressionSummary]
   getClusterHieararchies(cellType: String!): [ClusterHierarchy]
-  getUmapPlotData(dataType: String!, geneSymbol: String!, tissueType: String): PlotData
+  getUmapPlotData(dataType: String!, geneSymbol: String!, enrollmentCategory: String): PlotData
   dataTypesForConcept(geneSymbol: String, clusterName: String): [String]
   getDataTypeSummaryInformation: [getDataTypeSummaryInformation]
   getRTGeneExpressionByTissue(comparisonType: String, geneSymbol: String): RTGeneExpressionByTissue
   getRTGeneExpressionByStructure(structure: String): [RTGeneExpression]
   getDataSummary(dataType: String): [SummaryData]
-  getTissueTypeSummaryData: [getTissueTypeSummaryData]
+  getEnrollmentCategorySummaryData: [getEnrollmentCategorySummaryData]
   getAtlasSummaryRows: [getAtlasSummaryRows]
 }
 
@@ -32,7 +32,7 @@ type LinkInformation{
   linkValue: String
 }
 
-type getTissueTypeSummaryData{
+type getEnrollmentCategorySummaryData{
   akiCount: Long,
   ckdCount: Long,
   hrtCount: Long,
@@ -78,7 +78,7 @@ type CellType {
 
 type GeneExpressionSummary {
     id: ID
-    tissueType: String
+    enrollmentCategory: String
     gene: String
     pVal: Float
     pValAdj: Float
@@ -134,7 +134,7 @@ type RTGeneExpression {
     pVal: Float
     stdDev: Float
     pValLog10: Float
-    tissueType: String
+    enrollmentCategory: String
     sampleCount: Int
 }
 

src/actions/EnrollmentCategory/enrollmentCategoryActions.js

@@ -0,0 +1,8 @@
+import actionNames from '../actionNames'
+
+export const setEnrollmentCategory = (enrollmentCategory) => {
+    return {
+        type: actionNames.SET_ENROLLMENT_CATEGORY,
+        payload: enrollmentCategory
+    }
+};

src/actions/actionNames.js

@@ -3,7 +3,7 @@ const actionNames = {
   RESET_STATE: 'RESET_STATE',
   SET_SELECTED_CONCEPT: 'SET_SELECTED_CONCEPT',
   SET_DATA_TYPE: 'SET_DATA_TYPE',
-  SET_TISSUE_TYPE: 'SET_TISSUE_TYPE',
+  SET_ENROLLMENT_CATEGORY: 'SET_ENROLLMENT_CATEGORY',
   SET_CLUSTER: 'SET_CLUSTER',
   SET_CELL_TYPE: 'SET_CELL_TYPE',
   SET_GENE: 'SET_GENE',

src/components/DataViz/DataTypeSelector.js

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import Select from "react-select";
 import { Row, Col, Container} from 'reactstrap';
 import ConceptSelectContainer from '../ConceptSelect/ConceptSelectContainer';
-import { getTissueTypeOptions, getAllDataTypeOptions, getDataTypeOptionsWithTissueType } from "../../helpers/Utils";
+import { getEnrollmentCategoryOptions, getAllDataTypeOptions, getDataTypeOptionsWithEnrollmentCategory } from "../../helpers/Utils";
 import { fetchDataTypeSummaryInformation } from '../../helpers/ApolloClient';
 import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper';
 import { faChevronDown, faChevronUp } from "@fortawesome/free-solid-svg-icons";
@@ -13,7 +13,7 @@ class DataTypeSelector extends Component {
     constructor(props) {
         super(props);
         this.state = {
-            tissueInputValue: this.props.tissueType ? this.props.tissueType : "all",
+            tissueInputValue: this.props.enrollmentCategory ? this.props.enrollmentCategory : "all",
             isDatasetSummaryLoading: false,
             tissueValue: null,
             dataTypeInputValue: null,
@@ -33,7 +33,7 @@ class DataTypeSelector extends Component {
     componentDidUpdate(prevProps) {
         if ((this.props.gene.symbol !== prevProps.gene.symbol
             || this.props.dataType !== prevProps.dataType
-            || this.props.tissueType !== prevProps.tissueType)) {
+            || this.props.enrollmentCategory !== prevProps.enrollmentCategory)) {
             if (this.props.gene.symbol) {
                 this.reloadPageData(this.props.gene.symbol);
             } else {
@@ -44,11 +44,11 @@ class DataTypeSelector extends Component {
 
     componentDidMount() {
         let options = getAllDataTypeOptions()
-        let tissueTypeOptions = getTissueTypeOptions(this.state.selectedDataset, this.props.gene.symbol);
+        let enrollmentCategoryOptions = getEnrollmentCategoryOptions(this.state.selectedDataset, this.props.gene.symbol);
 
         let selectedOption = options.find(item => this.props.dataType === item.value);
-        let selectedTissueType = tissueTypeOptions.find(item => this.state.tissueInputValue === item.value)
-        this.setState({ dataTypeOptions: options, dataTypeInputValue: selectedOption, tissueValue: selectedTissueType })
+        let selectedEnrollmentCategory = enrollmentCategoryOptions.find(item => this.state.tissueInputValue === item.value)
+        this.setState({ dataTypeOptions: options, dataTypeInputValue: selectedOption, tissueValue: selectedEnrollmentCategory })
 
         if (this.props.gene.symbol) {
             this.reloadPageData(this.props.gene.symbol);
@@ -61,14 +61,14 @@ class DataTypeSelector extends Component {
         // Coming from homepage search (no datatype yet)
         if (!dataTypeShort && availableData && availableData.length > 0) {
             this.props.setDataType(availableData[0].dataTypeShort);
-            this.props.setTissueType(this.props.tissueType ? this.props.tissueType : "all");
+            this.props.setEnrollmentCategory(this.props.enrollmentCategory ? this.props.enrollmentCategory : "all");
             this.setState({ selectedDataset: availableData[0], tissueInputValue: "all"})
             return
         }
         // Coming from search on viz page (has datatype)
         for (const [, dataset] of availableData.entries()) {
             if (dataset["dataTypeShort"] === dataTypeShort) {
-                this.props.setTissueType(this.props.tissueType ? this.props.tissueType : "all");
+                this.props.setEnrollmentCategory(this.props.enrollmentCategory ? this.props.enrollmentCategory : "all");
                 this.setState({ selectedDataset: dataset, })
                 return
             }
@@ -117,13 +117,13 @@ class DataTypeSelector extends Component {
                 if (datasetSummary) {
                     datasetSummary = this.formatGeneDataset(datasetSummary)
                     this.setSelectedDatasetSummary(this.props.dataType, datasetSummary)
-                    getDataTypeOptionsWithTissueType(this.props.gene.symbol, "", datasetSummary, this.props.tissueType).then(
+                    getDataTypeOptionsWithEnrollmentCategory(this.props.gene.symbol, "", datasetSummary, this.props.enrollmentCategory).then(
                         (options) => {
                             let selectedOption = options.find(item => this.props.dataType === item.value);
-                            let tissueTypeOptions = getTissueTypeOptions(this.state.selectedDataset, this.props.gene.symbol);
+                            let enrollmentCategoryOptions = getEnrollmentCategoryOptions(this.state.selectedDataset, this.props.gene.symbol);
 
-                            let selectedTissueType = tissueTypeOptions.find(item => this.state.tissueInputValue === item.value)
-                            this.setState({ dataTypeOptions: options, dataTypeInputValue: selectedOption, availableData: datasetSummary, tissueValue: selectedTissueType })
+                            let selectedEnrollmentCategory = enrollmentCategoryOptions.find(item => this.state.tissueInputValue === item.value)
+                            this.setState({ dataTypeOptions: options, dataTypeInputValue: selectedOption, availableData: datasetSummary, tissueValue: selectedEnrollmentCategory })
                         },
                         (error) => {
                             this.setState({ dataTypeOptions: [] });
@@ -149,8 +149,8 @@ class DataTypeSelector extends Component {
 
 
     handleTissueSelect = (selected, actionMeta) => {
-        handleGoogleAnalyticsEvent('Explorer', 'Filter', `tissueType: ${selected.value}`);
-        this.props.setTissueType(selected.value);
+        handleGoogleAnalyticsEvent('Explorer', 'Filter', `enrollmentCategory: ${selected.value}`);
+        this.props.setEnrollmentCategory(selected.value);
         this.setState({ tissueValue: selected });
     };
 
@@ -163,7 +163,7 @@ class DataTypeSelector extends Component {
     };
 
     getInputValue = () => {
-        let options = getTissueTypeOptions(this.state.selectedDataset, this.props.gene.symbol);
+        let options = getEnrollmentCategoryOptions(this.state.selectedDataset, this.props.gene.symbol);
         try {
             return options.find(element => element.value === this.state.tissueInputValue).label
         } catch (e) {
@@ -222,7 +222,7 @@ class DataTypeSelector extends Component {
                             <span className='d-table-cell text-bigger pe-2'>in:</span>
                             <Select
                                 allowClear
-                                options={getTissueTypeOptions(this.state.selectedDataset, this.props.gene.symbol, this.props.dataType)}
+                                options={getEnrollmentCategoryOptions(this.state.selectedDataset, this.props.gene.symbol, this.props.dataType)}
                                 onChange={this.handleTissueSelect}
                                 value={this.state.tissueValue}
                                 inputValue={this.getInputValue()}

src/components/DataViz/DataTypeSelectorContainer.js

@@ -1,21 +1,21 @@
 import { connect } from 'react-redux';
 import DataTypeSelector from './DataTypeSelector';
 import { withRouter } from 'react-router';
-import { setTissueType } from '../../actions/TissueType/tissueTypeActions'
+import { setEnrollmentCategory } from '../../actions/EnrollmentCategory/enrollmentCategoryActions'
 import { setDataType } from "../../actions/DataType/dataTypeActions";
 
 const mapStateToProps = (state, props) =>
 ({
-    tissueType: state.tissueType,
+    enrollmentCategory: state.enrollmentCategory,
     dataType: state.dataType,
     gene: state.gene,
     isLoadingUmap: props.isLoadingUmap
 });
 
 const mapDispatchToProps = (dispatch, props) =>
 ({
-    setTissueType(tissueType) {
-        dispatch(setTissueType(tissueType));
+    setEnrollmentCategory(enrollmentCategory) {
+        dispatch(setEnrollmentCategory(enrollmentCategory));
     },
     setDataType(dataType) {
         dispatch(setDataType(dataType));

src/components/DataViz/RNASeqViz.js

@@ -31,29 +31,29 @@ class RNASeqViz extends Component {
         const queryParam = queryString.parse(this.props.location.search);
         if (this.props.gene.symbol !== undefined && this.props.gene.symbol !== '' && (!queryParam || !queryParam.dataType)) {
             await this.fetchDataType(this.props.gene.symbol)
-            if (!this.props.tissueType) {
-                this.props.setTissueType('all')
+            if (!this.props.enrollmentCategory) {
+                this.props.setEnrollmentCategory('all')
             }
             if (this.props.dataType) {
-                this.getGeneExpression(this.props.dataType, this.props.gene.symbol, "", this.props.tissueType, 'network-only');
-                this.getUmapPoints(this.props.dataType, this.props.gene.symbol, this.props.tissueType, 'network-only');
+                this.getGeneExpression(this.props.dataType, this.props.gene.symbol, "", this.props.enrollmentCategory, 'network-only');
+                this.getUmapPoints(this.props.dataType, this.props.gene.symbol, this.props.enrollmentCategory, 'network-only');
             }
         } else {
             this.setState({ isLoading: false, isLoadingUmap: false })
         }
     }
 
     async componentDidUpdate(prevProps) {
-        if (this.props.tissueType !== prevProps.tissueType
+        if (this.props.enrollmentCategory !== prevProps.enrollmentCategory
             || this.props.dataType !== prevProps.dataType
             || this.props.gene.symbol !== prevProps.gene.symbol) {
             if (this.props.gene.symbol && this.props.dataType) {
                 this.setState({ plotData: [], geneExpressionData: [], isLoading: true, isLoadingUmap: true });
-                if (!this.props.tissueType) {
-                    this.props.setTissueType('all')
+                if (!this.props.enrollmentCategory) {
+                    this.props.setEnrollmentCategory('all')
                 }
-                this.getGeneExpression(this.props.dataType, this.props.gene.symbol, "", this.props.tissueType);
-                this.getUmapPoints(this.props.dataType, this.props.gene.symbol, this.props.tissueType);
+                this.getGeneExpression(this.props.dataType, this.props.gene.symbol, "", this.props.enrollmentCategory);
+                this.getUmapPoints(this.props.dataType, this.props.gene.symbol, this.props.enrollmentCategory);
             }
         }
     }
@@ -79,14 +79,14 @@ class RNASeqViz extends Component {
         }
     }
 
-    getGeneExpression = async (dataType, gene, cellType, tissueType, fetchPolicy) => {
-        const results = await fetchGeneExpression(dataType, gene, cellType, tissueType, fetchPolicy);
+    getGeneExpression = async (dataType, gene, cellType, enrollmentCategory, fetchPolicy) => {
+        const results = await fetchGeneExpression(dataType, gene, cellType, enrollmentCategory, fetchPolicy);
         const cleanResults = this.cleanResults(results);
         this.setState({ geneExpressionData: cleanResults, isLoading: false });
     }
 
-    getUmapPoints = async (dataType, gene, tissueType, fetchPolicy) => {
-        const results = await fetchPlotlyData(dataType, gene, tissueType, fetchPolicy);
+    getUmapPoints = async (dataType, gene, enrollmentCategory, fetchPolicy) => {
+        const results = await fetchPlotlyData(dataType, gene, enrollmentCategory, fetchPolicy);
         this.setState({ plotData: results, isLoadingUmap: false });
     };
 
@@ -107,7 +107,7 @@ class RNASeqViz extends Component {
                             </Row>
                             <Row>
                                 <Col lg='6' className="umapPlot-container">
-                                    <UMAPPlot data={this.state.plotData} dataType={this.props.dataType ? this.props.dataType : 'sc'} tissueType={this.props.tissueType} />
+                                    <UMAPPlot data={this.state.plotData} dataType={this.props.dataType ? this.props.dataType : 'sc'} enrollmentCategory={this.props.enrollmentCategory} />
                                 </Col>
                             </Row>
                         </Col>
@@ -120,7 +120,7 @@ class RNASeqViz extends Component {
                             </Row>
                             <Row className={(!this.state.isLoadingUmap && !this.props.gene.symbol && this.state.plotData.length >= 0) ? 'featurePlot-loader-background' : ''}>
                                 <Col lg='12' className="featurePlot-container">
-                                    <FeaturePlot data={this.state.plotData} dataType={this.props.dataType} isLoading={this.state.isLoadingUmap} gene={this.props.gene.symbol} tissueType={this.props.tissueType} />
+                                    <FeaturePlot data={this.state.plotData} dataType={this.props.dataType} isLoading={this.state.isLoadingUmap} gene={this.props.gene.symbol} enrollmentCategory={this.props.enrollmentCategory} />
                                 </Col>
                             </Row>
                         </Col>
@@ -130,7 +130,7 @@ class RNASeqViz extends Component {
                             {(!this.state.isLoading && this.state.geneExpressionData.length > 0) && <hr />}
                         </Col>
                     </Row>
-                    <ExpressionXCellType dataType={this.props.dataType} data={this.state.geneExpressionData} isLoading={this.state.isLoading} gene={this.props.gene.symbol} tissueType={this.props.tissueType} />
+                    <ExpressionXCellType dataType={this.props.dataType} data={this.state.geneExpressionData} isLoading={this.state.isLoading} gene={this.props.gene.symbol} enrollmentCategory={this.props.enrollmentCategory} />
                 </Container>
             </Container>
             </div>

src/components/DataViz/RNASeqVizContainer.js

@@ -1,6 +1,6 @@
 import { connect } from "react-redux";
 import RNASeqViz from "./RNASeqViz";
-import { setTissueType } from '../../actions/TissueType/tissueTypeActions'
+import { setEnrollmentCategory } from '../../actions/EnrollmentCategory/enrollmentCategoryActions'
 import { setDataType } from "../../actions/DataType/dataTypeActions";
 import { resetState } from "../../actions/resetAction";
 
@@ -9,16 +9,16 @@ const mapStateToProps = (state, props) =>
     conceptSummary: state.conceptSummary,
     gene: state.gene,
     dataType: state.dataType,
-    tissueType: state.tissueType
+    enrollmentCategory: state.enrollmentCategory
 });
 
 const mapDispatchToProps = (dispatch, props) =>
 ({
     setDataType(dataType) {
         dispatch(setDataType(dataType));
     },
-    setTissueType(tissueType) {
-        dispatch(setTissueType(tissueType));
+    setEnrollmentCategory(enrollmentCategory) {
+        dispatch(setEnrollmentCategory(enrollmentCategory));
     },
     resetState() {
         dispatch(resetState());