diff --git a/src/Routes.js b/src/Routes.js index 755c80514..d6639a582 100644 --- a/src/Routes.js +++ b/src/Routes.js @@ -24,7 +24,7 @@ import NIHPilotInfo from './pages/NIHPilotInfo'; import {Status} from './pages/Status'; import {SummaryVotes} from './pages/SummaryVotes'; import BackgroundSignIn from './pages/BackgroundSignIn'; -import DataSharingLanguageTool from './pages/DataSharingLanguageTool'; +import ConsentTextGenerator from './pages/ConsentTextGenerator'; import AdminManageInstitutions from './pages/AdminManageInstitutions'; import AdminManageLC from './pages/AdminManageLC'; import DatasetStatistics from './pages/DatasetStatistics'; @@ -63,7 +63,7 @@ const Routes = (props) => ( - + diff --git a/src/pages/DataSharingLanguageTool.js b/src/pages/ConsentTextGenerator.js similarity index 84% rename from src/pages/DataSharingLanguageTool.js rename to src/pages/ConsentTextGenerator.js index 28e0a5bb1..606c912d3 100644 --- a/src/pages/DataSharingLanguageTool.js +++ b/src/pages/ConsentTextGenerator.js @@ -10,7 +10,7 @@ import {useState} from 'react'; const buttonStyle = { marginBottom: '2rem', color: '#777' }; const labelStyle = { fontFamily: 'Montserrat', fontSize: '15px' }; -export default function DataSharingLanguageTool() { +export default function ConsentTextGenerator() { const [general, setGeneral] = useState(false); const [hmb, setHmb] = useState(false); const [diseases, setDiseases] = useState(false); @@ -63,7 +63,7 @@ export default function DataSharingLanguageTool() { return ( div({style: {...Styles.PAGE, color: '#1f3b50' }}, [ div({style: {...Styles.TITLE, marginTop: '3.5rem'}}, [ - 'Standardized Data Sharing Language Tool' + 'Consent Text Generator' ]), div({style: {...Styles.SMALL, marginTop: '1rem'}}, [ 'This tool is made publicly available by the DUOS team for anyone' + @@ -83,9 +83,8 @@ export default function DataSharingLanguageTool() { ]), div({className: 'form-group', style: {marginTop: '1rem'}}, [ label({style: Styles.MEDIUM}, [ - '1. Choose the permitted data uses for your study\'s data ', br(), - span({style: Styles.MEDIUM_DESCRIPTION}, ['First, you must determine what type of secondary use is permitted for you study\'s data.' + - ' You do this by selecting one of the options in the following section:']), + '1. Permitted data uses', br(), + span({style: Styles.MEDIUM_DESCRIPTION}, ['Determine what type of secondary use is permitted for you study\'s data.']), ]), div({}, [ RadioButton({ @@ -94,7 +93,7 @@ export default function DataSharingLanguageTool() { onClick: () => { setGeneral(true), setHmb(false), setDiseases(false), setOther(false), setOntologies([]), clearOtherTextBox(); }, - label: 'General Research Use: ', + label: 'General Research Use (GRU): ', description: 'use is permitted for any research purpose', style: { fontFamily: 'Montserrat', color: '#1f3b50'} }), @@ -105,7 +104,7 @@ export default function DataSharingLanguageTool() { onClick: () => { setHmb(true), setGeneral(false), setDiseases(false), setOther(false), setOntologies([]), clearOtherTextBox(); }, - label: 'Health/Medical/Biomedical Use: ', + label: 'Health/Medical/Biomedical Use (HMB): ', description: 'use is permitted for any health, medical, or biomedical purpose', style: { fontFamily: 'Montserrat', color: '#1f3b50'} }), @@ -116,7 +115,7 @@ export default function DataSharingLanguageTool() { onClick: () => { setDiseases(true), setHmb(false), setGeneral(false), setOther(false), clearOtherTextBox(); }, - label: 'Disease-related studies: ', + label: 'Disease-related studies (DS): ', description: 'use is permitted for research on the specified disease', style: { fontFamily: 'Montserrat', color: '#1f3b50'} }), @@ -161,8 +160,8 @@ export default function DataSharingLanguageTool() { div({className: 'form-group', style: {marginTop: '2rem'}}, [ label({style: {...Styles.MEDIUM, marginBottom: '5px'}}, [ - '2. Choose any additional constraints you need to put on future uses of your data', br(), - span({style: Styles.MEDIUM_DESCRIPTION}, ['Then if necessary, you may choose additional terms on your study\'s data to govern it\'s use by adding requirements or limitations.']), + '2. Additional constraints', br(), + span({style: Styles.MEDIUM_DESCRIPTION}, ['If necessary, choose any additional terms on your study\'s data to govern its use.']), ]), div({}, [ @@ -266,26 +265,23 @@ export default function DataSharingLanguageTool() { ]) ]), - div({className: 'form-group'}, [ - label({style: Styles.MEDIUM}, [ - '3. Generate your suggested Standardized Data Sharing Language below', br(), - span({style: Styles.MEDIUM_DESCRIPTION}, ['If your selections above are complete, press generate and the suggested consent form text ' + - 'based on the GA4GH Data Use Ontology and Machine Readable Consent Guidance will appear below.']), - button({ - style: {...Styles.TABLE.TABLE_TEXT_BUTTON, marginBottom: '2rem'}, - className: 'button', - onClick: () => generate(), - }, ['Generate Standardized Data Sharing Language']), - textarea({ - defaultValue: sdsl, - className: 'form-control', - rows: '12', - required: false, - readOnly: true, - style: {backgroundColor: '#fff'} - }) - ]), - ]) + button({ + style: {...Styles.TABLE.TABLE_TEXT_BUTTON, marginBottom: '2rem'}, + className: 'button', + onClick: () => generate(), + }, ['Generate']), + + textarea({ + defaultValue: sdsl, + className: 'form-control', + rows: '12', + required: false, + readOnly: true, + style: {backgroundColor: '#fff'} + }), + + div({style: {marginBottom: '2rem'}}) + ]) ); }