From 153f77d19608091075df29a850977db1f0dab145 Mon Sep 17 00:00:00 2001 From: rlreamy <34109594+rlreamy@users.noreply.github.com> Date: Tue, 2 Jan 2024 11:44:49 -0500 Subject: [PATCH 01/25] Update package.json Updated version number --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 54ef20b..be8124b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hydra-web", - "version": "1.0.0", + "version": "1.3.0", "private": true, "homepage": "/repository", "baseURL": "/repository", From 3e5e4ddb21526fe467f3a0eba0dbd9ff397322b0 Mon Sep 17 00:00:00 2001 From: dert1129 Date: Thu, 11 Jan 2024 14:26:53 -0500 Subject: [PATCH 02/25] remove download column from array --- src/components/Repository/FileList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Repository/FileList.js b/src/components/Repository/FileList.js index c7e1232..26b219e 100644 --- a/src/components/Repository/FileList.js +++ b/src/components/Repository/FileList.js @@ -97,7 +97,7 @@ class FileList extends Component { const cards = this.getColumns().map((item, index) => { return {id: index, text: item.title, name: item.name, hideable: item.hideable, isSortField: item?.isSortField} }); - this.setCards(cards) + this.setCards(cards.slice(1)) }; getWorkflowTypeValue = (row) => { From bd4a480e2c52fba750bba9c5e4cc36e04e9c54a9 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Fri, 9 Feb 2024 15:13:35 -0500 Subject: [PATCH 03/25] KPMP-4959: Get rid of extra endpoint that was not needed --- src/helpers/Api.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/helpers/Api.js b/src/helpers/Api.js index 8094560..861cd3d 100644 --- a/src/helpers/Api.js +++ b/src/helpers/Api.js @@ -92,7 +92,7 @@ export const fetchParticipantDataTypeCounts = async (redcapId) => { export const fetchParticipantClinicalDataset = async (redcapId) => { const query = gql` query { - participantClinicalDataset(redcapId: "${redcapId}"){ + participantSummaryDataset(redcapId: "${redcapId}"){ clinicalData } }`; @@ -102,10 +102,10 @@ export const fetchParticipantClinicalDataset = async (redcapId) => { redcapId: redcapId } }); - if (response && response.data && response.data.participantClinicalDataset) { - return response.data.participantClinicalDataset; + if (response && response.data && response.data.participantSummaryDataset) { + return response.data.participantSummaryDataset; } else { - store.dispatch(sendMessageToBackend("Could not retrieve participantClinicalDataset: " + response.error)); + store.dispatch(sendMessageToBackend("Could not retrieve participantSummaryDataset (clinical data): " + response.error)); } }; From 1e939ed26dd5545cb01974760f94820436a0a410 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:15:03 -0500 Subject: [PATCH 04/25] KPMP-4959: Replace call to get experiment counts --- .../Experimental/experimentalDatasetAction.js | 4 +-- src/helpers/Api.js | 30 ++++++++++++++++++- 2 files changed, 31 insertions(+), 3 deletions(-) diff --git a/src/actions/Experimental/experimentalDatasetAction.js b/src/actions/Experimental/experimentalDatasetAction.js index 1e1833b..2105436 100644 --- a/src/actions/Experimental/experimentalDatasetAction.js +++ b/src/actions/Experimental/experimentalDatasetAction.js @@ -1,9 +1,9 @@ import actionNames from '../actionNames' -import {fetchParticipantExperimentCounts} from "../../helpers/Api"; +import {fetchParticipantExperimentStrategyFileCounts} from "../../helpers/Api"; export const fetchAndSetExperimentalDataCounts = (participant_id) => { return async (dispatch) => { - let experimentalDataCounts = await fetchParticipantExperimentCounts(participant_id); + let experimentalDataCounts = await fetchParticipantExperimentStrategyFileCounts(participant_id); dispatch(setExperimentalDataCounts(experimentalDataCounts)); } } diff --git a/src/helpers/Api.js b/src/helpers/Api.js index 861cd3d..58e797d 100644 --- a/src/helpers/Api.js +++ b/src/helpers/Api.js @@ -131,4 +131,32 @@ export const fetchParticipantTotalFileCount = async (redcapId) => { } else { store.dispatch(sendMessageToBackend("Could not retrieve getTotalParticipantFilesCount: " + response.error)); } -} \ No newline at end of file +} + +export const fetchParticipantExperimentStrategyFileCounts = async(redcapId) => { + const query = gql` + query { + getExperimentalStrategyCountsByParticipant(redcapId:"${redcapId}") { + dataType + count + linkInformation { + linkType + linkValue + } + } + } + ` + const response = await apolloClient.query({ + query: query, + variables: { + redcapId: redcapId + } + }); + if (response && response.data && response.data.getExperimentalStrategyCountsByParticipant) { + return response.data.getExperimentalStrategyCountsByParticipant; + } else { + store.dispatch(sendMessageToBackend("Could not retrieve getExperimentalStrategyCountsByParticipant: " + response.error)); + } + + } + From ebb25ec09bfe4cf6f2306cd234be40f3c1310b08 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:21:36 -0500 Subject: [PATCH 05/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 063c685..9b2e4d0 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -4,7 +4,7 @@ import '@devexpress/dx-react-grid-bootstrap4/dist/dx-react-grid-bootstrap4.css'; import { Grid, Table, TableColumnResizing, TableHeaderRow } from '@devexpress/dx-react-grid-bootstrap4'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faFile } from '@fortawesome/free-regular-svg-icons'; -import { dataToTableConverter, experimentalDataConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; +import { dataToTableConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper'; class ReportCard extends Component { @@ -104,20 +104,20 @@ class ReportCard extends Component { sortable: false, hideable: false, defaultHidden: false, - getCellValue: row => this.formatLinkableCellKey(row) + getCellValue: dataType }, { name: 'Files', sortable: false, hideable: false, defaultHidden: false, - getCellValue: row =>
{this.formatLinkableCellValue(row)}
+ getCellValue: count } ]; }; getRowSets = (dataset) => { - return experimentalDataConverter(dataset) + // return experimentalDataConverter(dataset) } getRows = (dataset) => { From d52d095db7af58b2bbf8d10597d8972926c0642b Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:23:44 -0500 Subject: [PATCH 06/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 9b2e4d0..81ca9db 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -104,14 +104,14 @@ class ReportCard extends Component { sortable: false, hideable: false, defaultHidden: false, - getCellValue: dataType + getCellValue: row => row.dataType }, { name: 'Files', sortable: false, hideable: false, defaultHidden: false, - getCellValue: count + getCellValue: row => row.count } ]; }; From b1821409b2e06f1a32c15899843697561740b4f6 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:26:23 -0500 Subject: [PATCH 07/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 81ca9db..00d4e0a 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -100,18 +100,18 @@ class ReportCard extends Component { getExperimentalLinkableColumns = () => { return [ { - name: 'Experimental Strategies', + name: 'dataType', sortable: false, hideable: false, defaultHidden: false, - getCellValue: row => row.dataType + }, { - name: 'Files', + name: 'count', sortable: false, hideable: false, defaultHidden: false, - getCellValue: row => row.count + } ]; }; From d5557eae74a11e191033dd816bcd0307253f9d2b Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:31:52 -0500 Subject: [PATCH 08/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 00d4e0a..abf126d 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -172,7 +172,7 @@ class ReportCard extends Component {
File Counts by Experimental Strategy
- + From 4f39c42d1638198425653d2afba8e7787a2dd248 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:36:50 -0500 Subject: [PATCH 09/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 21 +-------------------- 1 file changed, 1 insertion(+), 20 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index abf126d..b8dbd3b 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -77,25 +77,6 @@ class ReportCard extends Component { return( key ) } - formatLinkableCellValue = (row) => { - let link = '/' - if (row.tool === 'spatial-viewer') { - link = '/' + row.tool + '?filters[0][field]=datatype&filters[0][values][0]=' + row.key + '&filters[0][type]=any&filters[1][field]=redcapid&filters[1][values][0]=' + this.state.summaryDataset['Participant ID'] + '&filters[1][type]=any' - } else if (row.tool === 'explorer') { - link += row.tool; - if (row.key.includes('Single-cell')) { - link += '/dataViz?dataType=sc'; - } else if (row.key.includes('Single-nuc')) { - link += '/dataViz?dataType=sn'; - } else if (row.key.includes('Regional transcriptomics')) { - link +='/regionalviz?dataType=rt'; - } else if (row.key.includes('Regional proteomics')) { - link +='/regionalpro?dataType=rp'; - } - } - - return (row['value'] > 0 ? {row['value']} : {row['value']}) - } getExperimentalLinkableColumns = () => { return [ @@ -172,7 +153,7 @@ class ReportCard extends Component {
File Counts by Experimental Strategy
- +
From 491f956da1b163bb583723d1defb8187236482f0 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:41:47 -0500 Subject: [PATCH 10/25] KPMP-4959: Fixing report card --- src/helpers/dataHelper.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/helpers/dataHelper.js b/src/helpers/dataHelper.js index 4238bf2..fa58c40 100644 --- a/src/helpers/dataHelper.js +++ b/src/helpers/dataHelper.js @@ -10,11 +10,11 @@ export const resultConverter = (results) => { }; export const experimentalDataConverter = (data={}) => { - let spatialData = data.spatialViewerDataTypes; - let explorerData = data.explorerDataTypes; - let result = formatData(spatialData, [], 'spatial-viewer'); - result = formatData(explorerData, result, 'explorer'); - return result; + console.log(data) + return { + key: "stuff", + value: "stuff" + } } const formatData = (data=[], result=[], toolName='') => { From 911211fb14ec94afa728c2a0b5cf5b97a0f877a7 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:45:08 -0500 Subject: [PATCH 11/25] KPMP-4959: Fixing report card --- src/components/Repository/FileListContainer.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/components/Repository/FileListContainer.js b/src/components/Repository/FileListContainer.js index e708952..b2bba38 100644 --- a/src/components/Repository/FileListContainer.js +++ b/src/components/Repository/FileListContainer.js @@ -23,10 +23,15 @@ const mapDispatchToProps = (dispatch, props) => }, async setParticipantReport(participant_id) { await dispatch(fetchAndSetSummaryDatasets(participant_id)); + console.log("get summary datasets") await dispatch(fetchAndSetExperimentalDataCounts(participant_id)); + console.log("got experimental data") await dispatch(fetchAndSetDataTypeFileCounts(participant_id)); + console.log("got data type file counts") await dispatch(fetchAndSetClinicalDatasets(participant_id)); + console.log("got clinical data") await dispatch(fetchAndSetTotalFileCount(participant_id)); + console.log("got total file counts") }, setTableSettings(componentState) { dispatch(setTableSettings(componentState)) From 7f0e275bee39178745b9f7213a01568603e87e27 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:48:39 -0500 Subject: [PATCH 12/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index b8dbd3b..64d0c79 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -98,7 +98,7 @@ class ReportCard extends Component { }; getRowSets = (dataset) => { - // return experimentalDataConverter(dataset) + return experimentalDataConverter(dataset) } getRows = (dataset) => { @@ -106,6 +106,7 @@ class ReportCard extends Component { } render() { + this.getRowSets(this.state.experimentalDataCounts); return (
@@ -153,10 +154,10 @@ class ReportCard extends Component {
File Counts by Experimental Strategy
- + {/*
- + */} From f5cbe4ede3426affc08177b4721250fa2b998398 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 10:49:57 -0500 Subject: [PATCH 13/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 64d0c79..51b88ce 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -4,7 +4,7 @@ import '@devexpress/dx-react-grid-bootstrap4/dist/dx-react-grid-bootstrap4.css'; import { Grid, Table, TableColumnResizing, TableHeaderRow } from '@devexpress/dx-react-grid-bootstrap4'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faFile } from '@fortawesome/free-regular-svg-icons'; -import { dataToTableConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; +import { dataToTableConverter, experimentalDataConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper'; class ReportCard extends Component { From d5fd2f84430d283f2b5ead42e195316eeeab5fb2 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:05:53 -0500 Subject: [PATCH 14/25] KPMP-4959: Fixing report card --- .../ReportCard/FilesByExperimentType.js | 93 +++++++++++++++++++ src/components/ReportCard/ReportCard.js | 7 +- .../Repository/FileListContainer.js | 5 - 3 files changed, 95 insertions(+), 10 deletions(-) create mode 100644 src/components/ReportCard/FilesByExperimentType.js diff --git a/src/components/ReportCard/FilesByExperimentType.js b/src/components/ReportCard/FilesByExperimentType.js new file mode 100644 index 0000000..9d32a93 --- /dev/null +++ b/src/components/ReportCard/FilesByExperimentType.js @@ -0,0 +1,93 @@ +import React, {Component} from 'react'; +import { Grid, TableFixedColumns, TableHeaderRow, Table} from '@devexpress/dx-react-grid-bootstrap4'; +import { Row, Col } from 'reactstrap'; + +class FilesByExperimentType extends Component { + + constructor(props) { + super(props); + this.getColumns = this.getColumns.bind(this); + + this.state = { + filesByExperimentType: [] + }; + + } + + async componentDidMount(){ + + this.setState({filesByExperimentType: this.props.experimentalDataCounts}); + + } + + handleEmptyCounts(count, row){ + return count === 0 ? "" : this.formatDataTypeValueCell(count, row) + } + + handleDataTypeValueClick(row) { + let linkType = row.linkInformation.linkType; + let linkValue = row.linkInformation.linkValue.replace('&', '%26'); + let mapping = `/repository/?size=n_20_n&filters[0][field]=filters[0][type]=any&filters[1][field]=${linkType}&filters[1][values][0]=${linkValue}&filters[1][type]=any`; + if(linkType && linkValue){ + return encodeURI(mapping).replace('%2526', '%26'); + } else { + this.props.history.push('/oops'); + throw new Error('Datatype not found', row.dataType) + } + } + + formatDataTypeValueCell(value, row) { + return ( + + + {value} + + + ); + } + + + getColumnExtensions() { + + return [ + { columnName: 'dataType', width: 'auto'}, + { columnName: 'count', width: 'auto', align: 'center'}, + ] + } + + getColumns() { + return [ + { + title: Experimental Strategies, + name: 'dataType', + getCellValue: row =>
{row.omicsType}
+ + }, + { + title: + Files + , + name: 'count', + getCellValue: row =>
{this.handleEmptyCounts(row.count, row)}
+ } + ] + } + + render() { + return ( +
+ +
+ +
+ + + + + + + ); + } +} + +export default FilesByExperimentType; diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 51b88ce..b5efa7c 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -6,6 +6,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faFile } from '@fortawesome/free-regular-svg-icons'; import { dataToTableConverter, experimentalDataConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper'; +import FilesByExperimentType from './FilesByExperimentType'; class ReportCard extends Component { constructor(props) { @@ -106,7 +107,6 @@ class ReportCard extends Component { } render() { - this.getRowSets(this.state.experimentalDataCounts); return (
@@ -154,10 +154,7 @@ class ReportCard extends Component {
File Counts by Experimental Strategy
- {/* -
- - */} + diff --git a/src/components/Repository/FileListContainer.js b/src/components/Repository/FileListContainer.js index b2bba38..e708952 100644 --- a/src/components/Repository/FileListContainer.js +++ b/src/components/Repository/FileListContainer.js @@ -23,15 +23,10 @@ const mapDispatchToProps = (dispatch, props) => }, async setParticipantReport(participant_id) { await dispatch(fetchAndSetSummaryDatasets(participant_id)); - console.log("get summary datasets") await dispatch(fetchAndSetExperimentalDataCounts(participant_id)); - console.log("got experimental data") await dispatch(fetchAndSetDataTypeFileCounts(participant_id)); - console.log("got data type file counts") await dispatch(fetchAndSetClinicalDatasets(participant_id)); - console.log("got clinical data") await dispatch(fetchAndSetTotalFileCount(participant_id)); - console.log("got total file counts") }, setTableSettings(componentState) { dispatch(setTableSettings(componentState)) From 795d069d19c2263f0d0b22e86193d789037ebc31 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:09:53 -0500 Subject: [PATCH 15/25] KPMP-4959: Fixing report card --- src/components/ReportCard/FilesByExperimentType.js | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/src/components/ReportCard/FilesByExperimentType.js b/src/components/ReportCard/FilesByExperimentType.js index 9d32a93..ebcd818 100644 --- a/src/components/ReportCard/FilesByExperimentType.js +++ b/src/components/ReportCard/FilesByExperimentType.js @@ -7,17 +7,7 @@ class FilesByExperimentType extends Component { constructor(props) { super(props); this.getColumns = this.getColumns.bind(this); - - this.state = { - filesByExperimentType: [] - }; - - } - - async componentDidMount(){ - - this.setState({filesByExperimentType: this.props.experimentalDataCounts}); - + console.log(props) } handleEmptyCounts(count, row){ @@ -78,7 +68,7 @@ class FilesByExperimentType extends Component {
- +
From ecdebcdd7e1050493d230438c34bac9296732b3b Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:15:03 -0500 Subject: [PATCH 16/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 145 +++++++++--------- .../Repository/FileListContainer.js | 2 + 2 files changed, 78 insertions(+), 69 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index b5efa7c..f4ace1b 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -107,75 +107,82 @@ class ReportCard extends Component { } render() { - return ( -
- -
- -
- Participant Summary -
- -
- - - - - - - - - Files - - - - - - - - - - - - -
- File Counts by Data Type -
- -
- - - - - -
- File Counts by Experimental Strategy -
- - - - - - - -
- Clinical -
- -
- - - - - - - ) + if (this.state.isLoaded) { + return ( + +
+ +
+ +
+ Participant Summary +
+ +
+ + + + + + + + + Files + + + + + + + + + + + + +
+ File Counts by Data Type +
+ +
+ + + + + +
+ File Counts by Experimental Strategy +
+ + + + + + + +
+ Clinical +
+ +
+ + + + + + + ) + + } + else { + return "Loading"; + } } } diff --git a/src/components/Repository/FileListContainer.js b/src/components/Repository/FileListContainer.js index e708952..4203e2f 100644 --- a/src/components/Repository/FileListContainer.js +++ b/src/components/Repository/FileListContainer.js @@ -21,6 +21,7 @@ const mapDispatchToProps = (dispatch, props) => dispatch(setSelectedImageDataset(selectedImageDataset)); dispatch((dispatch) => props.history.push("/view")); }, + async setParticipantReport(participant_id) { await dispatch(fetchAndSetSummaryDatasets(participant_id)); await dispatch(fetchAndSetExperimentalDataCounts(participant_id)); @@ -28,6 +29,7 @@ const mapDispatchToProps = (dispatch, props) => await dispatch(fetchAndSetClinicalDatasets(participant_id)); await dispatch(fetchAndSetTotalFileCount(participant_id)); }, + setTableSettings(componentState) { dispatch(setTableSettings(componentState)) }, From 4819f8fa9747d9fc2a22bdad454f2bd9dfa947b6 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:16:37 -0500 Subject: [PATCH 17/25] KPMP-4959: Fixing report card --- src/components/ReportCard/FilesByExperimentType.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ReportCard/FilesByExperimentType.js b/src/components/ReportCard/FilesByExperimentType.js index ebcd818..20604c5 100644 --- a/src/components/ReportCard/FilesByExperimentType.js +++ b/src/components/ReportCard/FilesByExperimentType.js @@ -50,7 +50,7 @@ class FilesByExperimentType extends Component { { title: Experimental Strategies, name: 'dataType', - getCellValue: row =>
{row.omicsType}
+ getCellValue: row =>
{row.dataType}
}, { From 1cb3585da07da265037098bb0260822df8afc6a6 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:18:40 -0500 Subject: [PATCH 18/25] KPMP-4959: Fixing report card --- src/components/ReportCard/FilesByExperimentType.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/ReportCard/FilesByExperimentType.js b/src/components/ReportCard/FilesByExperimentType.js index 20604c5..71b3219 100644 --- a/src/components/ReportCard/FilesByExperimentType.js +++ b/src/components/ReportCard/FilesByExperimentType.js @@ -7,11 +7,10 @@ class FilesByExperimentType extends Component { constructor(props) { super(props); this.getColumns = this.getColumns.bind(this); - console.log(props) } handleEmptyCounts(count, row){ - return count === 0 ? "" : this.formatDataTypeValueCell(count, row) + return count === 0 ? "0" : this.formatDataTypeValueCell(count, row) } handleDataTypeValueClick(row) { From c3b2ccbac812de904437af44cdf19e599168515d Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:47:14 -0500 Subject: [PATCH 19/25] KPMP-4959: Fixing report card --- .../Experimental/experimentalDatasetAction.js | 10 +++++++ src/actions/actionNames.js | 3 +- .../ReportCard/FilesByExperimentType.js | 6 ++-- src/components/ReportCard/ReportCard.js | 28 ++----------------- .../Repository/FileListContainer.js | 5 ++-- .../experimentalDataCountReducer.js | 11 +++++++- src/helpers/dataHelper.js | 7 ----- src/reducers.js | 5 ++-- 8 files changed, 32 insertions(+), 43 deletions(-) diff --git a/src/actions/Experimental/experimentalDatasetAction.js b/src/actions/Experimental/experimentalDatasetAction.js index 2105436..7808d0c 100644 --- a/src/actions/Experimental/experimentalDatasetAction.js +++ b/src/actions/Experimental/experimentalDatasetAction.js @@ -1,6 +1,14 @@ import actionNames from '../actionNames' import {fetchParticipantExperimentStrategyFileCounts} from "../../helpers/Api"; + +export const setSelectedParticipant = (participant_id) => { + return { + type: actionNames.SET_SELECTED_PARTICIPANT, + payload: participant_id + } + } + export const fetchAndSetExperimentalDataCounts = (participant_id) => { return async (dispatch) => { let experimentalDataCounts = await fetchParticipantExperimentStrategyFileCounts(participant_id); @@ -13,5 +21,7 @@ export const setExperimentalDataCounts = (experimentalDataCounts) => { type: actionNames.SET_EXPERIMENTAL_DATASETS, payload: experimentalDataCounts } + + } diff --git a/src/actions/actionNames.js b/src/actions/actionNames.js index 9c045c4..03dcb27 100644 --- a/src/actions/actionNames.js +++ b/src/actions/actionNames.js @@ -6,7 +6,8 @@ const actionNames = { SET_CLINICAL_DATASETS: 'SET_CLINICAL_DATASETS', SET_EXPERIMENTAL_DATASETS: 'SET_EXPERIMENTAL_DATASETS', SET_DATA_TYPE_COUNTS: 'SET_DATA_TYPE_COUNTS', - SET_TOTAL_FILE_COUNT: 'SET_TOTAL_FILE_COUNT' + SET_TOTAL_FILE_COUNT: 'SET_TOTAL_FILE_COUNT', + SET_SELECTED_PARTICIPANT: 'SET_SELECTED_PARTICIPANT' }; export default actionNames; \ No newline at end of file diff --git a/src/components/ReportCard/FilesByExperimentType.js b/src/components/ReportCard/FilesByExperimentType.js index 71b3219..3c17d96 100644 --- a/src/components/ReportCard/FilesByExperimentType.js +++ b/src/components/ReportCard/FilesByExperimentType.js @@ -16,7 +16,7 @@ class FilesByExperimentType extends Component { handleDataTypeValueClick(row) { let linkType = row.linkInformation.linkType; let linkValue = row.linkInformation.linkValue.replace('&', '%26'); - let mapping = `/repository/?size=n_20_n&filters[0][field]=filters[0][type]=any&filters[1][field]=${linkType}&filters[1][values][0]=${linkValue}&filters[1][type]=any`; + let mapping = `/repository/?size=n_20_n&filters[0][field]=redcap_id&filters[0][values][0]=${this.props.participantId}&filters[0][type]=any&filters[1][field]=${linkType}&filters[1][values][0]=${linkValue}&filters[1][type]=any`; if(linkType && linkValue){ return encodeURI(mapping).replace('%2526', '%26'); } else { @@ -53,9 +53,7 @@ class FilesByExperimentType extends Component { }, { - title: - Files - , + title: Files, name: 'count', getCellValue: row =>
{this.handleEmptyCounts(row.count, row)}
} diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index f4ace1b..8bc2147 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -4,7 +4,7 @@ import '@devexpress/dx-react-grid-bootstrap4/dist/dx-react-grid-bootstrap4.css'; import { Grid, Table, TableColumnResizing, TableHeaderRow } from '@devexpress/dx-react-grid-bootstrap4'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faFile } from '@fortawesome/free-regular-svg-icons'; -import { dataToTableConverter, experimentalDataConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; +import { dataToTableConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; import { handleGoogleAnalyticsEvent } from '../../helpers/googleAnalyticsHelper'; import FilesByExperimentType from './FilesByExperimentType'; @@ -31,6 +31,7 @@ class ReportCard extends Component { dataTypeFileCounts: sessionStorage['dataTypeFileCounts']['repositoryDataTypes'], clinicalDataset: (sessionStorage['clinicalDatasets']['clinicalData']) ? JSON.parse(sessionStorage['clinicalDatasets']['clinicalData']) : {}, totalFileCount: sessionStorage['totalFileCount'], + participantId: sessionStorage['selectedParticipant'], isLoaded: true }) handleGoogleAnalyticsEvent("Repository", "Navigation", "Participant Information"); @@ -79,29 +80,6 @@ class ReportCard extends Component { } - getExperimentalLinkableColumns = () => { - return [ - { - name: 'dataType', - sortable: false, - hideable: false, - defaultHidden: false, - - }, - { - name: 'count', - sortable: false, - hideable: false, - defaultHidden: false, - - } - ]; - }; - - getRowSets = (dataset) => { - return experimentalDataConverter(dataset) - } - getRows = (dataset) => { return dataToTableConverter(dataset) } @@ -156,7 +134,7 @@ class ReportCard extends Component {
File Counts by Experimental Strategy
- + diff --git a/src/components/Repository/FileListContainer.js b/src/components/Repository/FileListContainer.js index 4203e2f..5978010 100644 --- a/src/components/Repository/FileListContainer.js +++ b/src/components/Repository/FileListContainer.js @@ -4,7 +4,7 @@ import {setSelectedImageDataset, setTableSettings} from "../../actions/Images/im import { fetchAndSetClinicalDatasets, fetchAndSetDataTypeFileCounts, fetchAndSetSummaryDatasets, fetchAndSetTotalFileCount } from '../../actions/Clinical/clinicalDatasetAction'; import FileListHolder from "./FileListHolder"; import { - fetchAndSetExperimentalDataCounts, + fetchAndSetExperimentalDataCounts, setSelectedParticipant } from "../../actions/Experimental/experimentalDatasetAction"; const mapStateToProps = (state, props) => @@ -21,15 +21,14 @@ const mapDispatchToProps = (dispatch, props) => dispatch(setSelectedImageDataset(selectedImageDataset)); dispatch((dispatch) => props.history.push("/view")); }, - async setParticipantReport(participant_id) { await dispatch(fetchAndSetSummaryDatasets(participant_id)); await dispatch(fetchAndSetExperimentalDataCounts(participant_id)); await dispatch(fetchAndSetDataTypeFileCounts(participant_id)); await dispatch(fetchAndSetClinicalDatasets(participant_id)); await dispatch(fetchAndSetTotalFileCount(participant_id)); + dispatch(setSelectedParticipant(participant_id)); }, - setTableSettings(componentState) { dispatch(setTableSettings(componentState)) }, diff --git a/src/components/Repository/experimentalDataCountReducer.js b/src/components/Repository/experimentalDataCountReducer.js index f65a72e..eee34b3 100644 --- a/src/components/Repository/experimentalDataCountReducer.js +++ b/src/components/Repository/experimentalDataCountReducer.js @@ -7,4 +7,13 @@ export const experimentalDataCounts = ( state = {}, action ) => { default: return state; } -}; \ No newline at end of file +}; + +export const selectedParticipant = ( state = "", action) => { + switch(action.type) { + case actionNames.SET_SELECTED_PARTICIPANT: + return action.payload; + default: + return state; + } +} \ No newline at end of file diff --git a/src/helpers/dataHelper.js b/src/helpers/dataHelper.js index fa58c40..b489cdb 100644 --- a/src/helpers/dataHelper.js +++ b/src/helpers/dataHelper.js @@ -9,13 +9,6 @@ export const resultConverter = (results) => { }) }; -export const experimentalDataConverter = (data={}) => { - console.log(data) - return { - key: "stuff", - value: "stuff" - } -} const formatData = (data=[], result=[], toolName='') => { data.forEach((datum) => { diff --git a/src/reducers.js b/src/reducers.js index eb99e92..f01aebb 100644 --- a/src/reducers.js +++ b/src/reducers.js @@ -2,7 +2,7 @@ import { combineReducers } from 'redux'; import { resetStateReducer } from './resetStateReducer'; import { selectedImageDataset, tableSettings } from "./components/Repository/fileListReducer"; import { summaryDatasets, clinicalDatasets, dataTypeFileCounts, totalFileCount } from "./components/Repository/clinicalDatasetReducer"; -import { experimentalDataCounts } from "./components/Repository/experimentalDataCountReducer"; +import { experimentalDataCounts, selectedParticipant } from "./components/Repository/experimentalDataCountReducer"; const appReducer = combineReducers({ @@ -13,7 +13,8 @@ const appReducer = combineReducers({ clinicalDatasets, experimentalDataCounts, dataTypeFileCounts, - totalFileCount + totalFileCount, + selectedParticipant }); export default appReducer; From c5e0b248fd568362414ea8756aaefb1af4718c71 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 14 Feb 2024 11:54:37 -0500 Subject: [PATCH 20/25] KPMP-4959: Fixing report card --- src/components/ReportCard/ReportCard.js | 8 +------- src/helpers/dataHelper.js | 8 -------- 2 files changed, 1 insertion(+), 15 deletions(-) diff --git a/src/components/ReportCard/ReportCard.js b/src/components/ReportCard/ReportCard.js index 8bc2147..59d6ba0 100644 --- a/src/components/ReportCard/ReportCard.js +++ b/src/components/ReportCard/ReportCard.js @@ -1,7 +1,7 @@ import { Component } from 'react'; import { Col, Container, Row } from "reactstrap"; import '@devexpress/dx-react-grid-bootstrap4/dist/dx-react-grid-bootstrap4.css'; -import { Grid, Table, TableColumnResizing, TableHeaderRow } from '@devexpress/dx-react-grid-bootstrap4'; +import { Grid, Table, TableColumnResizing } from '@devexpress/dx-react-grid-bootstrap4'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faFile } from '@fortawesome/free-regular-svg-icons'; import { dataToTableConverter, fileCountsToTableConverter, mapClinicalKeysToPresentationStyle } from '../../helpers/dataHelper'; @@ -74,12 +74,6 @@ class ReportCard extends Component { ]; }; - formatLinkableCellKey = (row) => { - let key = row['key']; - return( key ) - } - - getRows = (dataset) => { return dataToTableConverter(dataset) } diff --git a/src/helpers/dataHelper.js b/src/helpers/dataHelper.js index b489cdb..a64dfaa 100644 --- a/src/helpers/dataHelper.js +++ b/src/helpers/dataHelper.js @@ -9,14 +9,6 @@ export const resultConverter = (results) => { }) }; - -const formatData = (data=[], result=[], toolName='') => { - data.forEach((datum) => { - result.push({key: datum.dataType, value: datum.count, tool: toolName, isAggregated: datum.isAggregatedData}) - }); - return result; -} - export const dataToTableConverter = (data=[]) => { return Object.keys(data).map((key, index) => { return { From 02649e347e3e94522f0e7bff2e5cbc45ddc6236e Mon Sep 17 00:00:00 2001 From: Nathan Creger Date: Thu, 22 Feb 2024 10:14:51 -0500 Subject: [PATCH 21/25] edit size of accordions --- src/index.scss | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/src/index.scss b/src/index.scss index 6a429b6..421abac 100644 --- a/src/index.scss +++ b/src/index.scss @@ -9,6 +9,7 @@ $accordion-button-active-color: black; $accordion-button-color: black; $bs-border-color: #dee2e6; +$accordion-icon-width: .8125rem; //pass variable overrides @import "../node_modules/bootstrap/scss/variables"; @@ -573,6 +574,12 @@ td:hover { --bs-accordion-border-color: #dee2e6; } +.accordion-button{ + height: .25rem !important; + font-size: .8125rem !important; + --bs-accordion-body-padding-y: .25rem !important; +} + .accordion-item:first-of-type(.collapsed) .accordion-button { --bs-accordion-color: $accordion-button-color --bs-accorion-border-color: $accordion-button-color @@ -581,8 +588,8 @@ td:hover { .accordion-button:not(.collapsed)::after { background-color: #e7f1ff; - --bs-accordion-btn-color: $accordion-button-color - --bs-accordion-active-color: $accordion-button-active-color + --bs-accordion-btn-color: $accordion-button-color; + --bs-accordion-active-color: $accordion-button-active-color; } .action-button { From 610078a71c959b8326033e6a66c04ec0822272e4 Mon Sep 17 00:00:00 2001 From: Nathan Creger Date: Tue, 27 Feb 2024 11:07:03 -0500 Subject: [PATCH 22/25] upgrade components --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index be8124b..cff52a4 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,7 @@ "history": "5.1.0", "immutability-helper": "3.1.1", "isomorphic-unfetch": "3.1.0", - "kpmp-common-components": "1.2.12", + "kpmp-common-components": "1.2.13", "kpmp-common-styles": "1.0.13", "npm-run-all": "4.1.5", "pretty-bytes": "6.0.0", From 3a41f5dc3bb5fedf253a84acc79fb8b44f863a8e Mon Sep 17 00:00:00 2001 From: Zach Wright Date: Wed, 13 Mar 2024 10:44:10 -0400 Subject: [PATCH 23/25] KPMP-5222: file service config --- .env.example | 3 ++- src/components/Repository/FileList.js | 7 ++++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/.env.example b/.env.example index 1f1ff94..a06febf 100644 --- a/.env.example +++ b/.env.example @@ -1,2 +1,3 @@ REACT_APP_SEARCH_KEY= -REACT_APP_SEARCH_ENDPOINT="/spatial-viewer/search" \ No newline at end of file +REACT_APP_SEARCH_ENDPOINT="/spatial-viewer/search" +REACT_APP_FILE_ENDPOINT= \ No newline at end of file diff --git a/src/components/Repository/FileList.js b/src/components/Repository/FileList.js index 26b219e..82671ca 100644 --- a/src/components/Repository/FileList.js +++ b/src/components/Repository/FileList.js @@ -41,6 +41,11 @@ import "@elastic/react-search-ui-views/lib/styles/styles.css"; import { handleGoogleAnalyticsEvent } from "../../helpers/googleAnalyticsHelper"; import Api from '../../helpers/Api'; +let fileDownloadEndpoint = "https://" + window.location.hostname + "/api/v1/file/download" +if (process.env.REACT_APP_FILE_ENDPOINT) { + fileDownloadEndpoint = process.env.REACT_APP_FILE_ENDPOINT +} + class FileList extends Component { constructor(props) { @@ -256,7 +261,7 @@ class FileList extends Component { getCellValue: row => { return { row['access'] === 'controlled' ? this.toggleAccessAlertModal() : - this.downloadFile(`https://atlas.kpmp.org/api/v1/file/download/${row['package_id']}/${row['file_name']}`, row['file_name']) + this.downloadFile(`${fileDownloadEndpoint}/${row['package_id']}/${row['file_name']}`, row['file_name']) }} className="clickable download-btn"> From b2ab01a4677963fb4b972c186c996e4f7b1675f5 Mon Sep 17 00:00:00 2001 From: Becky Reamy Date: Wed, 13 Mar 2024 13:44:45 -0400 Subject: [PATCH 24/25] KPMP-5145: Change to enrollment category --- src/components/Repository/ParticipantFacet.js | 2 +- src/helpers/dataHelper.js | 4 ++-- src/helpers/dataHelper.test.js | 12 ++++++------ 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/components/Repository/ParticipantFacet.js b/src/components/Repository/ParticipantFacet.js index 5c0becf..dda7ad1 100644 --- a/src/components/Repository/ParticipantFacet.js +++ b/src/components/Repository/ParticipantFacet.js @@ -60,7 +60,7 @@ class ParticipantFacet extends Component { - Tissue Type + Enrollment Category diff --git a/src/helpers/dataHelper.js b/src/helpers/dataHelper.js index a64dfaa..8fb5a9a 100644 --- a/src/helpers/dataHelper.js +++ b/src/helpers/dataHelper.js @@ -38,7 +38,7 @@ export const removeUUID = (text) => { export const mapSummaryKeysToPresentationStyle = (data) => { const result = {}; result['Participant ID'] = ""; - result['Disease Type'] = ""; + result['Enrollment Category'] = ""; if (!data || data === {}) { return result; } @@ -47,7 +47,7 @@ export const mapSummaryKeysToPresentationStyle = (data) => { result['Participant ID'] = data['redcapId'] ? data['redcapId'] : ""; } if (data['tissueType']) { - result['Disease Type'] = data['tissueType'] ? data['tissueType'] : ""; + result['Enrollment Category'] = data['tissueType'] ? data['tissueType'] : ""; } return result; }; diff --git a/src/helpers/dataHelper.test.js b/src/helpers/dataHelper.test.js index 20113d9..f9750a3 100644 --- a/src/helpers/dataHelper.test.js +++ b/src/helpers/dataHelper.test.js @@ -11,7 +11,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(summaryUnmapped); let expectedSummaryMapping = { 'Participant ID': "test-redcapId", - 'Disease Type': "test-tissueType" + 'Enrollment Category': "test-tissueType" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }), @@ -23,7 +23,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(summaryUnmapped); let expectedSummaryMapping = { 'Participant ID': "test-redcapId", - 'Disease Type': "" + 'Enrollment Category': "" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }), @@ -35,7 +35,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(summaryUnmapped); let expectedSummaryMapping = { 'Participant ID': "", - 'Disease Type': "test-tissueType" + 'Enrollment Category': "test-tissueType" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }), @@ -44,7 +44,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(summaryUnmapped); let expectedSummaryMapping = { 'Participant ID': "", - 'Disease Type': "" + 'Enrollment Category': "" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }), @@ -53,7 +53,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(summaryUnmapped); let expectedSummaryMapping = { 'Participant ID': "", - 'Disease Type': "" + 'Enrollment Category': "" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }); @@ -61,7 +61,7 @@ describe('dataHelper', () => { let summaryMappingResult = mapSummaryKeysToPresentationStyle(); let expectedSummaryMapping = { 'Participant ID': "", - 'Disease Type': "" + 'Enrollment Category': "" } expect(summaryMappingResult).toEqual(expectedSummaryMapping); }); From 85f23063d0f80404c32460e7627217b07dd96dae Mon Sep 17 00:00:00 2001 From: Nathan Creger Date: Tue, 19 Mar 2024 14:06:11 -0400 Subject: [PATCH 25/25] add font-weight and increase padding --- src/index.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.scss b/src/index.scss index 421abac..01e3eec 100644 --- a/src/index.scss +++ b/src/index.scss @@ -577,7 +577,8 @@ td:hover { .accordion-button{ height: .25rem !important; font-size: .8125rem !important; - --bs-accordion-body-padding-y: .25rem !important; + --bs-accordion-body-padding-y: .5rem !important; + font-weight: 500; } .accordion-item:first-of-type(.collapsed) .accordion-button {