Merge pull request #339 from MoTrPAC/306_JZ_PreCAWG_Data_Download

Connects to #306. PreCAWG data download.

src/AnalysisPage/GeneCentricViewRat/geneCentricViewPage.jsx

@@ -11,6 +11,7 @@ import GeneCentricTrainingResultsTable from './geneCentricTrainingResultsTable';
 import GeneCentricSearchResultFilters from './geneCentricSearchResultFilters';
 import AnimatedLoadingIcon from '../../lib/ui/loading';
 import { genes } from '../../data/genes';
+import { trackEvent } from '../../GoogleAnalytics/googleAnalytics';
 
 function GeneCentricView({
   geneSearchResults,
@@ -22,6 +23,7 @@ function GeneCentricView({
   geneSearchChangeFilter,
   scope,
   hasResultFilters,
+  profile,
 }) {
   const [multiSelections, setMultiSelections] = useState([]);
   const inputRef = useRef(null);
@@ -140,7 +142,18 @@ function GeneCentricView({
                     handleGeneCentricSearch(
                       geneSearchParams,
                       formatSearchInput(),
-                      'all'
+                      'all',
+                    );
+                    // track event in Google Analytics 4
+                    trackEvent(
+                      'Gene-centric View Search',
+                      'keyword_search',
+                      profile && profile.userid
+                        ? profile.userid.substring(
+                            profile.userid.indexOf('|') + 1,
+                          )
+                        : 'anonymous',
+                      formatSearchInput(),
                     );
                   }}
                 >
@@ -254,6 +267,10 @@ GeneCentricView.propTypes = {
     assay: PropTypes.object,
     tissue: PropTypes.object,
   }),
+  profile: PropTypes.shape({
+    userid: PropTypes.string,
+    user_metadata: PropTypes.object,
+  }),
 };
 
 GeneCentricView.defaultProps = {
@@ -263,16 +280,18 @@ GeneCentricView.defaultProps = {
   geneSearchParams: { ...defaultGeneSearchParams },
   scope: 'all',
   hasResultFilters: {},
+  profile: {},
 };
 
 const mapStateToProps = (state) => ({
   ...state.analysis,
+  ...state.auth,
 });
 
 const mapDispatchToProps = (dispatch) => ({
   handleGeneCentricSearch: (params, geneInputValue, scope) =>
     dispatch(
-      AnalysisActions.handleGeneCentricSearch(params, geneInputValue, scope)
+      AnalysisActions.handleGeneCentricSearch(params, geneInputValue, scope),
     ),
   geneSearchReset: (scope) => dispatch(AnalysisActions.geneSearchReset(scope)),
   geneSearchChangeFilter: (field, value) =>

src/App/App.jsx

@@ -95,6 +95,12 @@ function App({ history = History }) {
               />
               <Route
                 path="/data-download"
+                exact
+                component={withTracker(BrowseDataPageConnected)}
+              />
+              <Route
+                path="/data-download/file-browser"
+                exact
                 component={withTracker(BrowseDataPageConnected)}
               />
               <Route

src/App/__test__/App.test.jsx

@@ -23,7 +23,7 @@ describe('<App />', () => {
   });
 
   test('It should contain fifteen <Route /> children', () => {
-    expect(component.find('Route').length).toBe(21);
+    expect(component.find('Route').length).toBe(22);
   });
 
   test('It should contain four <PrivateRoute /> children', () => {

src/BrowseDataPage/browseDataActions.js

@@ -18,6 +18,9 @@ const DATA_FETCH_REQUESTED = 'DATA_FETCH_REQUESTED';
 const DATA_FETCH_SUCCESS = 'DATA_FETCH_SUCCESS';
 const DATA_FETCH_FAILURE = 'DATA_FETCH_FAILURE';
 const RESET_BROWSE_STATE = 'RESET_BROWSE_STATE';
+const SELECT_PASS1B_06_DATA = 'SELECT_PASS1B_06_DATA';
+const SELECT_PASS1A_06_DATA = 'SELECT_PASS1A_06_DATA';
+const SELECT_HUMAN_PRECOVID_SED_ADU_DATA = 'SELECT_HUMAN_PRECOVID_SED_ADU_DATA';
 
 export const types = {
   CHANGE_FILTER,
@@ -37,6 +40,9 @@ export const types = {
   DATA_FETCH_SUCCESS,
   DATA_FETCH_FAILURE,
   RESET_BROWSE_STATE,
+  SELECT_PASS1B_06_DATA,
+  SELECT_PASS1A_06_DATA,
+  SELECT_HUMAN_PRECOVID_SED_ADU_DATA,
 };
 
 function changeFilter(category, filter) {
@@ -154,6 +160,24 @@ function resetBrowseState() {
   };
 }
 
+function selectPass1B06Data() {
+  return {
+    type: SELECT_PASS1B_06_DATA,
+  };
+}
+
+function selectPass1A06Data() {
+  return {
+    type: SELECT_PASS1A_06_DATA,
+  };
+}
+
+function selectHumanPreCovidSedAduData() {
+  return {
+    type: SELECT_HUMAN_PRECOVID_SED_ADU_DATA,
+  };
+}
+
 // Mock Async Getting List
 const files = [];
 
@@ -330,6 +354,9 @@ const actions = {
   handleDownloadRequest,
   handleDataFetch,
   resetBrowseState,
+  selectPass1B06Data,
+  selectPass1A06Data,
+  selectHumanPreCovidSedAduData,
 };
 
 export default actions;

src/BrowseDataPage/browseDataFilter.jsx

@@ -1,27 +1,53 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import browseDataFilters, { tissueList } from '../lib/browseDataFilters';
+import { useSelector } from 'react-redux';
+import browseDataFilters, { tissues, omes } from '../lib/browseDataFilters';
+import assayList from '../lib/assayList';
 
-// build list of PASS1B-06 tissues
-const pass1bTissues = tissueList.filter((item) => item !== 'Aorta');
+function BrowseDataFilter({ activeFilters, onChangeFilter, onResetFilters }) {
+  const dataDownload = useSelector((state) => state.browseData);
 
-function BrowseDataFilter({
-  activeFilters,
-  onChangeFilter,
-  onResetFilters,
-  userType,
-}) {
   const fileFilters = [...browseDataFilters];
-  if (!userType || (userType && userType !== 'internal')) {
-    fileFilters.forEach((item) => {
-      if (item.keyName === 'study') {
-        item.filters = ['Endurance Training'];
+  // Remove phenotype filter if human-precovid-sed-adu data tab is selected
+  if (dataDownload.humanPrecovidSedAduDataSelected) {
+    fileFilters.splice(4, 1);
+  }
+
+  fileFilters.forEach((item) => {
+    if (item.keyName === 'tissue_name') {
+      if (dataDownload.pass1b06DataSelected) {
+        item.filters = tissues.pass1b_06;
       }
-      if (item.keyName === 'tissue_name') {
-        item.filters = pass1bTissues;
+      if (dataDownload.pass1a06DataSelected) {
+        item.filters = tissues.pass1a_06;
       }
-    });
-  }
+      if (dataDownload.humanPrecovidSedAduDataSelected) {
+        item.filters = tissues.human_sed_adu;
+      }
+    }
+    if (item.keyName === 'omics') {
+      if (dataDownload.pass1b06DataSelected) {
+        item.filters = omes.pass1b_06;
+      }
+      if (dataDownload.pass1a06DataSelected) {
+        item.filters = omes.pass1a_06;
+      }
+      if (dataDownload.humanPrecovidSedAduDataSelected) {
+        item.filters = omes.human_sed_adu;
+      }
+    }
+    if (item.keyName === 'assay') {
+      if (dataDownload.pass1b06DataSelected) {
+        item.filters = assayList.pass1b_06;
+      }
+      if (dataDownload.pass1a06DataSelected) {
+        item.filters = assayList.pass1a_06;
+      }
+      if (dataDownload.humanPrecovidSedAduDataSelected) {
+        item.filters = assayList.human_sed_adu;
+      }
+    }
+  });
   const filters = fileFilters.map((item) => (
     <div key={item.name} className="card filter-module mb-4">
       <div className="card-header font-weight-bold d-flex align-items-center">
@@ -52,15 +78,9 @@ function BrowseDataFilter({
               key={filter}
               type="button"
               className={`btn filterBtn ${
-                isActiveFilter ||
-                (filter === 'Endurance Training' && userType !== 'internal')
-                  ? 'activeFilter'
-                  : ''
+                isActiveFilter ? 'activeFilter' : ''
               }`}
               onClick={() => onChangeFilter(item.keyName, filter)}
-              disabled={
-                filter === 'Endurance Training' && userType !== 'internal'
-              }
             >
               {filter}
             </button>
@@ -95,7 +115,6 @@ BrowseDataFilter.propTypes = {
   }),
   onChangeFilter: PropTypes.func.isRequired,
   onResetFilters: PropTypes.func.isRequired,
-  userType: PropTypes.string,
 };
 BrowseDataFilter.defaultProps = {
   activeFilters: {
@@ -104,7 +123,6 @@ BrowseDataFilter.defaultProps = {
     tissue_name: [],
     category: [],
   },
-  userType: null,
 };
 
 export default BrowseDataFilter;

src/BrowseDataPage/browseDataPage.jsx

@@ -1,17 +1,12 @@
 import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
-import { Link } from 'react-router-dom';
 import { Helmet } from 'react-helmet';
-import PageTitle from '../lib/ui/pageTitle';
-import BrowseDataTable from './browseDataTable';
 import actions from './browseDataActions';
 import BrowseDataFilter from './browseDataFilter';
-import BootstrapSpinner from '../lib/ui/spinner';
-import OpenAccessBrowseDataSummary from './components/openAccessSummary';
-import AuthAccessBrowseDataSummary from './components/authAccessSummary';
 import dataDownloadStructuredData from '../lib/searchStructuredData/dataDownload';
 import UserSurveyModal from '../UserSurvey/userSurveyModal';
+import DataDownloadsMain from './components/dataDownloadsMain';
 
 export function BrowseDataPage({
   profile,
@@ -25,10 +20,9 @@ export function BrowseDataPage({
   waitingForResponse,
   showUserSurveyModal,
   surveyId,
+  surveySubmitted,
+  downloadedData,
 }) {
-  // anonymous user or authenticated user
-  const userType = profile.user_metadata && profile.user_metadata.userType;
-
   useEffect(() => {
     if (showUserSurveyModal) {
       const userSurveyModalRef = document.querySelector('body');
@@ -45,58 +39,25 @@ export function BrowseDataPage({
           {JSON.stringify(dataDownloadStructuredData)}
         </script>
       </Helmet>
-      <PageTitle
-        title={
-          userType && userType === 'internal'
-            ? 'Endurance Training and Acute Exercise Young Adult Rats Data'
-            : 'Endurance Exercise Training Young Adult Rats (6 months) Data'
+      <DataDownloadsMain
+        profile={profile}
+        filteredFiles={filteredFiles}
+        fetching={fetching}
+        activeFilters={activeFilters}
+        onChangeFilter={onChangeFilter}
+        onResetFilters={onResetFilters}
+        handleDownloadRequest={handleDownloadRequest}
+        downloadRequestResponse={downloadRequestResponse}
+        waitingForResponse={waitingForResponse}
+        surveySubmitted={surveySubmitted}
+        downloadedData={downloadedData}
+      />
+      <UserSurveyModal
+        userID={profile && profile.email ? profile.email : (surveyId ? surveyId : 'anonymous')}
+        dataContext={
+          downloadRequestResponse.length ? 'selected_files' : 'bundled_files'
         }
       />
-      {!userType || (userType && userType === 'external') ? (
-        <OpenAccessBrowseDataSummary profile={profile} />
-      ) : null}
-      {userType && userType === 'internal' ? (
-        <AuthAccessBrowseDataSummary />
-      ) : null}
-      <div className="browse-data-container row">
-        <BrowseDataFilter
-          activeFilters={activeFilters}
-          onChangeFilter={onChangeFilter}
-          onResetFilters={onResetFilters}
-          userType={userType}
-        />
-        {fetching && (
-          <div className="col-md-9">
-            <BootstrapSpinner isFetching={fetching} />
-          </div>
-        )}
-        {!fetching && !filteredFiles.length && (
-          <div className="browse-data-table-wrapper col-md-9">
-            <p className="mt-4">
-              <span>
-                No matches found for the selected filters. Please refer to the{' '}
-                <Link to="/summary">Summary Table</Link> for data that are
-                available.
-              </span>
-            </p>
-          </div>
-        )}
-        {!fetching && filteredFiles.length && (
-          <BrowseDataTable
-            filteredFiles={filteredFiles}
-            handleDownloadRequest={handleDownloadRequest}
-            downloadRequestResponse={downloadRequestResponse}
-            waitingForResponse={waitingForResponse}
-            profile={profile}
-          />
-        )}
-        <UserSurveyModal
-          userID={profile && profile.email ? profile.email : (surveyId ? surveyId : 'anonymous')}
-          dataContext={
-            downloadRequestResponse.length ? 'selected_files' : 'bundled_files'
-          }
-        />
-      </div>
     </div>
   );
 }
@@ -120,19 +81,25 @@ BrowseDataPage.propTypes = {
   waitingForResponse: PropTypes.bool.isRequired,
   showUserSurveyModal: PropTypes.bool,
   surveyId: PropTypes.string,
+  surveySubmitted: PropTypes.bool,
+  downloadedData: PropTypes.bool,
 };
 
 BrowseDataPage.defaultProps = {
   profile: {},
   showUserSurveyModal: false,
   surveyId: '',
+  surveySubmitted: false,
+  downloadedData: false,
 };
 
 const mapStateToProps = (state) => ({
   ...state.browseData,
   profile: state.auth.profile,
   showUserSurveyModal: state.userSurvey.showUserSurveyModal,
   surveyId: state.userSurvey.surveyId,
+  surveySubmitted: state.userSurvey.surveySubmitted,
+  downloadedData: state.userSurvey.downloadedData,
 });
 
 const mapDispatchToProps = (dispatch) => ({