[DT-788] Footer: Apply for Access to selected Studies and Datasets #2723
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
rjohanek
requested review from
pshapiro4broad and
cinyecai
and removed request for
a team
# Conflicts: # src/components/data_search/DatasetSearchTable.jsx
|
LGTM - thx |
cinyecai
approved these changes
Nov 12, 2024
fboulnois
reviewed
Nov 12, 2024
| border: '1px solid #DEDEDE', | ||
| alignItems: 'center' | ||
| }}> | ||
| {selectedDatasets.length > 1 && selectedStudies.length > 1 && (<div style={{paddingRight: 15}}> {selectedDatasets.length} Datasets selected from {selectedStudies.length} Studies </div>)} |
There was a problem hiding this comment.
How about something like:
// at top of component
const datasetText = selectedDatasets.length > 1 ? 'datasets' : 'dataset';
const studyText = selectedStudies.length > 1 ? 'studies' : 'study';
{selectedDatasets.length > 0 && (<div>{selectedDatasets.length} {datasetText} selected from {selectedStudies.length} {studyText}</div>)}
rushtong
reviewed
Nov 13, 2024
| @@ -0,0 +1,51 @@ | |||
| import {Styles} from '../../libs/theme'; | |||
|
|
|||
| export const styles = { | |||
There was a problem hiding this comment.
Another approach to this is to use modular css. We have several examples in the codebase for this. If the style objects are being manipulated by components, then I think that approach wouldn't work.
rjohanek
commented
Nov 14, 2024
| @@ -1,6 +1,6 @@ | |||
| import React from 'react'; | |||
| import style from '../../pages/DACDatasets.module.css'; | |||
| import {styles} from './DACDatasetsTable'; | |||
| import {styles} from './DACDatasetConstants'; | |||
There was a problem hiding this comment.
removing circular dependency discovered when testing
rjohanek
commented
Nov 14, 2024
| @@ -79,7 +79,7 @@ export const makeStudyTableHeaders = (datasets: DatasetTerm[], selected: number[ | |||
| const selectableDatasetIds = datasets.filter(isSelectable).map(dataset => dataset.datasetId); | |||
| return [ | |||
| { | |||
| label: <Checkbox checked={datasets.length === selected.length} | |||
| label: <Checkbox id='header-checkbox' checked={datasets.length === selected.length} | |||
There was a problem hiding this comment.
added the id here so the element is easily retrievable in testing
rushtong
approved these changes
Nov 14, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Addresses
https://broadworkbench.atlassian.net/browse/DT-788
Summary
Moves the apply for access button to the new footer component that is optionally rendered if any datasets/studies are selected. Also displays text about the number of datasets and studies selected.
footer.mov
Have you read Terra's Contributing Guide lately? If not, do that first.