Skip to content

Commit 65e16ea

Browse files
valearnavalearna
committed
feat: update free text comments to conditionally render based on checkbox state
1 parent 90818e2 commit 65e16ea

File tree

6 files changed

+104
-91
lines changed

6 files changed

+104
-91
lines changed

‎src/frontend/submission_form/src/main_layout/Menu.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ const Menu = ({urlQuery, onMenuItemClick = () => {}, history}) => {
139139
// If no unsaved changes, navigate directly
140140
if (!hasChanges) {
141141
dispatch(setSelectedWidget(targetMenuIndex));
142-
history.push(targetPath + urlQuery);
142+
history.push('/' + targetPath + urlQuery);
143143
onMenuItemClick();
144144
window.scrollTo(0, 0);
145145
return;
@@ -159,7 +159,7 @@ const Menu = ({urlQuery, onMenuItemClick = () => {}, history}) => {
159159
dispatch(saveAllUnsavedWidgets());
160160
setTimeout(() => {
161161
dispatch(setSelectedWidget(pendingNavigation.menuIndex));
162-
history.push(pendingNavigation.path + urlQuery);
162+
history.push('/' + pendingNavigation.path + urlQuery);
163163
onMenuItemClick();
164164
window.scrollTo(0, 0);
165165
setShowUnsavedModal(false);

‎src/frontend/submission_form/src/widgets/Expression.js‎

Lines changed: 32 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -82,47 +82,51 @@ const Expression = () =>{
8282
overlay={tooltip}>
8383
<Glyphicon glyph="question-sign"/></OverlayTrigger> <AutoDetectedBadge/>
8484
</Checkbox>
85-
<FormControl type="text" placeholder="E.g.: unc-47 is expressed in GABAergic motor neurons."
86-
onClick={() => dispatch(setExpression(true, expression.details))}
87-
value={expression.details}
88-
onChange={(event) => {
89-
dispatch(setExpression(true, event.target.value));
90-
}}
91-
/>
85+
{expression.checked && (
86+
<FormControl type="text" placeholder="E.g.: unc-47 is expressed in GABAergic motor neurons."
87+
value={expression.details}
88+
onChange={(event) => {
89+
dispatch(setExpression(true, event.target.value));
90+
}}
91+
/>
92+
)}
9293
<Checkbox checked={siteOfAction.checked} onClick={() => dispatch(toggleSiteOfAction())}>
9394
<strong>Site of action data</strong> <OverlayTrigger placement="top"
9495
overlay={siteTooltip}>
9596
<Glyphicon glyph="question-sign"/></OverlayTrigger>
9697
</Checkbox>
97-
<FormControl type="text" placeholder="E.g.: Expressing AVR-14 specifically in AVA sufficed to rescue AVA inhibition following tail stimulation."
98-
onClick={() => dispatch(setSiteOfAction(true, siteOfAction.details))}
99-
value={siteOfAction.details}
100-
onChange={(event) => {
101-
dispatch(setSiteOfAction(true, event.target.value));
102-
}}
103-
/>
98+
{siteOfAction.checked && (
99+
<FormControl type="text" placeholder="E.g.: Expressing AVR-14 specifically in AVA sufficed to rescue AVA inhibition following tail stimulation."
100+
value={siteOfAction.details}
101+
onChange={(event) => {
102+
dispatch(setSiteOfAction(true, event.target.value));
103+
}}
104+
/>
105+
)}
104106
<Checkbox checked={timeOfAction.checked} onClick={() => dispatch(toggleTimeOfAction())}>
105107
<strong>Time of action data</strong> <OverlayTrigger placement="top"
106108
overlay={timeTooltip}>
107109
<Glyphicon glyph="question-sign"/></OverlayTrigger>
108110
</Checkbox>
109-
<FormControl type="text" placeholder="E.g.: CDK-4 regulates size during L3 larval stage in seam cells."
110-
onClick={() => dispatch(setTimeOfAction(true, timeOfAction.details))}
111-
value={timeOfAction.details}
112-
onChange={(event) => {
113-
dispatch(setTimeOfAction(true, event.target.value));
114-
}}
115-
/>
111+
{timeOfAction.checked && (
112+
<FormControl type="text" placeholder="E.g.: CDK-4 regulates size during L3 larval stage in seam cells."
113+
value={timeOfAction.details}
114+
onChange={(event) => {
115+
dispatch(setTimeOfAction(true, event.target.value));
116+
}}
117+
/>
118+
)}
116119
<Checkbox checked={additionalExpr.checked} onClick={() => dispatch(toggleAdditionalExpr())}>
117120
<strong>Additional type of expression data</strong>
118121
</Checkbox>
119-
<FormControl type="text" placeholder="E.g., qPCR, Proteomics"
120-
onClick={() => dispatch(setAdditionalExpr(true, additionalExpr.details))}
121-
value={additionalExpr.details}
122-
onChange={(event) => {
123-
dispatch(setAdditionalExpr(true, event.target.value));
124-
}}
125-
/>
122+
{additionalExpr.checked && (
123+
<FormControl type="text" placeholder="E.g., qPCR, Proteomics"
124+
value={additionalExpr.details}
125+
onChange={(event) => {
126+
dispatch(setAdditionalExpr(true, event.target.value));
127+
}}
128+
/>
129+
)}
126130
</Form>
127131
</div>
128132
</Panel.Body>

‎src/frontend/submission_form/src/widgets/Interactions.js‎

Lines changed: 21 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -67,32 +67,35 @@ const Interactions = () => {
6767
<strong>Genetic Interactions</strong> <OverlayTrigger placement="top" overlay={geneticIntTooltip}>
6868
<Glyphicon glyph="question-sign"/></OverlayTrigger> <AutoDetectedBadge/>
6969
</Checkbox>
70-
<FormControl type="text" placeholder="E.g.: emb-4(n1256) suppressed the egg laying defect of lin-12 mutants."
71-
onClick={() => dispatch(setGeneticInteractions(true, geneint.details))}
72-
value={geneint.details}
73-
onChange={(event) => {
74-
dispatch(setGeneticInteractions(true, event.target.value));
75-
}}/>
70+
{geneint.checked && (
71+
<FormControl type="text" placeholder="E.g.: emb-4(n1256) suppressed the egg laying defect of lin-12 mutants."
72+
value={geneint.details}
73+
onChange={(event) => {
74+
dispatch(setGeneticInteractions(true, event.target.value));
75+
}}/>
76+
)}
7677
<Checkbox checked={geneprod.checked} onClick={() => dispatch(togglePhysicalInteractions())}>
7778
<strong>Physical Interactions</strong> <OverlayTrigger placement="top" overlay={physicalIntTooltip}>
7879
<Glyphicon glyph="question-sign"/></OverlayTrigger> <AutoDetectedBadge/>
7980
</Checkbox>
80-
<FormControl type="text" placeholder="E.g.: Yeast two-hybrid assay shows LIN-12 physically interacts with SEL-10."
81-
onClick={() => dispatch(setPhysicalInteractions(true, geneprod.details))}
82-
value={geneprod.details}
83-
onChange={(event) => {
84-
dispatch(setPhysicalInteractions(true, event.target.value));
85-
}}/>
81+
{geneprod.checked && (
82+
<FormControl type="text" placeholder="E.g.: Yeast two-hybrid assay shows LIN-12 physically interacts with SEL-10."
83+
value={geneprod.details}
84+
onChange={(event) => {
85+
dispatch(setPhysicalInteractions(true, event.target.value));
86+
}}/>
87+
)}
8688
<Checkbox checked={genereg.checked} onClick={() => dispatch(toggleRegulatoryInteractions())}>
8789
<strong>Regulatory Interactions</strong> <OverlayTrigger placement="top" overlay={regulatoryIntTooltip}>
8890
<Glyphicon glyph="question-sign"/></OverlayTrigger> <AutoDetectedBadge/>
8991
</Checkbox>
90-
<FormControl type="text" placeholder="E.g.: fat-5 expression was reduced by 66% in the nhr-80 mutants."
91-
onClick={() => dispatch(setRegulatoryInteractions(true, genereg.details))}
92-
value={genereg.details}
93-
onChange={(event) => {
94-
dispatch(setRegulatoryInteractions(true, event.target.value));
95-
}}/>
92+
{genereg.checked && (
93+
<FormControl type="text" placeholder="E.g.: fat-5 expression was reduced by 66% in the nhr-80 mutants."
94+
value={genereg.details}
95+
onChange={(event) => {
96+
dispatch(setRegulatoryInteractions(true, event.target.value));
97+
}}/>
98+
)}
9699
<FormControl.Feedback />
97100
</FormGroup>
98101
</Form>

‎src/frontend/submission_form/src/widgets/Overview.js‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -172,17 +172,18 @@ const Overview = ({hideGenes, toggleEntityVisibilityCallback}) => {
172172
<strong>Gene model correction/update</strong></Checkbox>
173173
</div>
174174
</div>
175-
<div className="row">
176-
<div className="col-sm-12">
177-
<FormControl type="text" placeholder="E.g.: We found a new variant of Y71H2B.8 with a different splice site."
178-
value={geneModel.details}
179-
onClick={() => dispatch(setGeneModel(true, geneModel.details))}
180-
onChange={(event) => {
181-
dispatch(setGeneModel(true, event.target.value))
182-
}}
183-
/>
175+
{geneModel.checked && (
176+
<div className="row">
177+
<div className="col-sm-12">
178+
<FormControl type="text" placeholder="E.g.: We found a new variant of Y71H2B.8 with a different splice site."
179+
value={geneModel.details}
180+
onChange={(event) => {
181+
dispatch(setGeneModel(true, event.target.value))
182+
}}
183+
/>
184+
</div>
184185
</div>
185-
</div>
186+
)}
186187
<div className="row">
187188
<div className="col-sm-12">&nbsp;</div>
188189
</div>

‎src/frontend/submission_form/src/widgets/Phenotypes.js‎

Lines changed: 32 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -149,26 +149,28 @@ const Phenotypes = () => {
149149
<Checkbox checked={chemPheno.checked} onClick={() => dispatch(toggleChemicalPhenotype())}>
150150
<strong>Chemical Induced Phenotype</strong>
151151
</Checkbox>
152-
<FormControl type="text" placeholder="E.g.: Exposure to 7% EtOH progressively flattened the body-bend amplitudes of the worms until they died at the L1 stage"
153-
onClick={() => dispatch(setChemicalPhenotype(true, chemPheno.details))}
154-
value={chemPheno.details}
155-
onChange={(event) => {
156-
dispatch(setChemicalPhenotype(true, event.target.value));
157-
}}
158-
/>
152+
{chemPheno.checked && (
153+
<FormControl type="text" placeholder="E.g.: Exposure to 7% EtOH progressively flattened the body-bend amplitudes of the worms until they died at the L1 stage"
154+
value={chemPheno.details}
155+
onChange={(event) => {
156+
dispatch(setChemicalPhenotype(true, event.target.value));
157+
}}
158+
/>
159+
)}
159160
<FormControl.Feedback />
160161
</FormGroup>
161162
<FormGroup>
162163
<Checkbox checked={envPheno.checked} onClick={() => dispatch(toggleEnvironmentalPhenotype())}>
163164
<strong>Environmental Induced Phenotype</strong>
164165
</Checkbox>
165-
<FormControl type="text" placeholder="E.g.: hsf-1 mutants are hypersensitive to elevated temperature."
166-
onClick={() => dispatch(setEnvironmentalPhenotype(true, envPheno.details))}
167-
value={envPheno.details}
168-
onChange={(event) => {
169-
dispatch(setEnvironmentalPhenotype(true, event.target.value));
170-
}}
171-
/>
166+
{envPheno.checked && (
167+
<FormControl type="text" placeholder="E.g.: hsf-1 mutants are hypersensitive to elevated temperature."
168+
value={envPheno.details}
169+
onChange={(event) => {
170+
dispatch(setEnvironmentalPhenotype(true, event.target.value));
171+
}}
172+
/>
173+
)}
172174
<FormControl.Feedback />
173175
</FormGroup>
174176
</Form>
@@ -186,13 +188,14 @@ const Phenotypes = () => {
186188
<Checkbox checked={enzymaticAct.checked} onClick={() => dispatch(toggleEnzymaticActivity())}>
187189
<strong>Enzymatic Activity</strong> <AutoDetectedBadge/>
188190
</Checkbox>
189-
<FormControl type="text" placeholder="E.g.: AIR-2 phosphorylates REC-8 in vitro."
190-
onClick={() => dispatch(setEnzymaticActivity(true, enzymaticAct.details))}
191-
value={enzymaticAct.details}
192-
onChange={(event) => {
193-
dispatch(setEnzymaticActivity(true, event.target.value));
194-
}}
195-
/>
191+
{enzymaticAct.checked && (
192+
<FormControl type="text" placeholder="E.g.: AIR-2 phosphorylates REC-8 in vitro."
193+
value={enzymaticAct.details}
194+
onChange={(event) => {
195+
dispatch(setEnzymaticActivity(true, event.target.value));
196+
}}
197+
/>
198+
)}
196199
<FormControl.Feedback />
197200
</FormGroup>
198201
<FormGroup>
@@ -201,13 +204,14 @@ const Phenotypes = () => {
201204
<Glyphicon glyph="question-sign"/>
202205
</OverlayTrigger>
203206
</Checkbox>
204-
<FormControl type="text" placeholder="E.g.: AAT-9 transports amino acids when expressed alone in Xenopus oocytes."
205-
onClick={() => dispatch(setOthergenefunc(true, othergenefunc.details))}
206-
value={othergenefunc.details}
207-
onChange={(event) => {
208-
dispatch(setOthergenefunc(true, event.target.value));
209-
}}
210-
/>
207+
{othergenefunc.checked && (
208+
<FormControl type="text" placeholder="E.g.: AAT-9 transports amino acids when expressed alone in Xenopus oocytes."
209+
value={othergenefunc.details}
210+
onChange={(event) => {
211+
dispatch(setOthergenefunc(true, event.target.value));
212+
}}
213+
/>
214+
)}
211215
<FormControl.Feedback />
212216
</FormGroup>
213217
</Form>

0 commit comments

Comments
 (0)