Skip to content

Commit 19dd2ad

Browse files
Merge pull request #43 from CivicTechAtlanta/steve-fixes
Steve Edits
2 parents d33b7d2 + 5bfadf9 commit 19dd2ad

36 files changed

+4170
-131
lines changed

src/app/calculator-flow/components/ChlorineWeightFlow.tsx

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@ import {
1010
CalculatorFlowSharedStateData
1111
} from "./Interfaces";
1212

13+
import modalData from '@/app/modals/chlorine-weight-modal-data';
14+
import { formatSig2 } from "@/app/utils/format";
15+
1316
export default function ChlorineWeightFormula({ onCalculate, sharedState }: { onCalculate: (data: any) => void, sharedState: CalculatorFlowSharedStateData }) {
1417
const { t } = useTranslation();
1518

@@ -18,8 +21,6 @@ export default function ChlorineWeightFormula({ onCalculate, sharedState }: { on
1821

1922
const [showModal, setShowModal] = useState(null as string | null);
2023

21-
console.log('ChlorineWeightFormula sharedState', sharedState);
22-
2324
const [formData, setFormData] = useState({
2425
motherSolution: sharedState.msVolume || '',
2526
waterIngress: sharedState.reservoirIngress || '',
@@ -28,8 +29,9 @@ export default function ChlorineWeightFormula({ onCalculate, sharedState }: { on
2829
chlorinePercentage: sharedState.chlorinePercentage || '',
2930
});
3031

31-
//Calculate the weight of chlorine needed
32-
const chlorineWeight = .36 * ((Number(formData.motherSolution) * Number(formData.waterIngress) * Number(formData.desiredConcentration)) / (Number(formData.dripRate) * Number(formData.chlorinePercentage)))
32+
// Calculate with chlorine percentage given as a whole number (e.g., 70 => 0.70)
33+
const chlorinePct = (Number(formData.chlorinePercentage) || 0) / 100;
34+
const chlorineWeight = .36 * ((Number(formData.motherSolution) * Number(formData.waterIngress) * Number(formData.desiredConcentration)) / (Number(formData.dripRate) * chlorinePct))
3335

3436
const handleClick = () => {
3537
if (
@@ -116,7 +118,7 @@ export default function ChlorineWeightFormula({ onCalculate, sharedState }: { on
116118
label={`${t('Chlorine Percentage')}`}
117119
name='chlorinePercentage'
118120
value={formData.chlorinePercentage}
119-
placeholder='0.7'
121+
placeholder='70'
120122
handleChange={handleChange}
121123
/>
122124

@@ -125,7 +127,7 @@ export default function ChlorineWeightFormula({ onCalculate, sharedState }: { on
125127
<button className="button" onClick={handleClear}>{t('Clear')}</button>
126128

127129
{showText ? (
128-
<p>{`${t('The weight of chlorine needed is')}: ${chlorineWeight} ${t('grams')}`}</p>
130+
<p>{`${t('The weight of chlorine needed is')}: ${formatSig2(chlorineWeight)} ${t('grams')}`}</p>
129131
) : (
130132
<button className="button primary" onClick={handleClick}>{t('Submit')}</button>
131133
)}
@@ -134,8 +136,8 @@ export default function ChlorineWeightFormula({ onCalculate, sharedState }: { on
134136
<Modal
135137
show={showModal === 'info'}
136138
closeModal={() => setShowModal(null)}
137-
headerText='How to Determine Chlorine Weight Formula'
138-
imageKey='CHLORINE_WEIGHT'/>
139+
modalPageData={modalData}
140+
/>
139141

140142
</div>
141143
);

src/app/calculator-flow/components/DripRateCalculatorFlow.tsx

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@ import {
1010
CalculatorFlowSharedStateData
1111
} from "./Interfaces";
1212

13+
import modalData from "@/app/modals/drip-rate-modal-data";
14+
import { formatSig2 } from "@/app/utils/format";
15+
1316
export default function DripRateFormula({ onCalculate, sharedState }: {
1417
onCalculate: (data: any) => void,
1518
sharedState: CalculatorFlowSharedStateData
@@ -64,16 +67,14 @@ export default function DripRateFormula({ onCalculate, sharedState }: {
6467
{t('Submit')}
6568
</button>
6669

67-
<h2>{`${t('Drip Rate is')}: ${dripRate.toFixed(2)} ${t('milliliters')}/${t('minute')}`}</h2>
70+
<h2>{`${t('Drip Rate is')}: ${formatSig2(dripRate)} ${t('milliliters')}/${t('minute')}`}</h2>
6871
</div>
6972

70-
<Modal
71-
show={showModal === 'info'}
72-
closeModal={() => setShowModal(null)}
73-
headerText={['Drip Rate']}
74-
modalText={[t('RechargeText1')]}
75-
imageKey={[null, 'CHLORINE_WEIGHT']}
76-
/>
73+
<Modal
74+
show={showModal === 'info'}
75+
closeModal={() => setShowModal(null)}
76+
modalPageData={modalData}
77+
/>
7778
</div>
7879
);
7980
}

src/app/calculator-flow/components/Interfaces.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,6 @@ export interface CalculatorFlowSharedStateData {
3131
desiredDripRate: number | null,
3232
msConcentration: number | null
3333
desiredConcentration: number | null
34+
refillTime : number | null,
35+
3436
}

src/app/calculator-flow/components/MotherSolutionConcentrationFlow.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ import Form from "../../mother-solution-concentration/components/Form";
88

99
import "../../mother-solution-concentration/styles/Main.css";
1010

11+
import modalData from "../../modals/mother-solution-concentration-modal-data";
12+
import { formatSig2 } from "@/app/utils/format";
13+
1114
export default function MotherSolutionConcentrationFormula({ onCalculate, sharedState }: { onCalculate: (data: any) => void, sharedState: object }) {
1215
const { t } = useTranslation();
1316

@@ -34,14 +37,14 @@ export default function MotherSolutionConcentrationFormula({ onCalculate, shared
3437
<h2>{`${t('The concentration of the mother solution is')}:`}</h2>
3538

3639
<p className="answer">
37-
{`${concentratedMotherSolution.toFixed(2)} ${t('mg')}/${t('L')}`}
40+
{`${formatSig2(concentratedMotherSolution)} ${t('mg')}/${t('L')}`}
3841
</p>
3942
</div>
4043
<Modal
4144
show={showModal === 'info'}
4245
closeModal={() => setShowModal(null)}
43-
headerText='How to Determine Chlorine Weight Formula'
44-
imageKey='CHLORINE_WEIGHT'/>
46+
modalPageData={modalData}
47+
/>
4548
</div>
4649

4750
);

src/app/calculator-flow/components/MotherTankMaximumWeightFlow.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import "../styles/Main.css";
1111
import {
1212
CalculatorFlowSharedStateData
1313
} from "./Interfaces";
14+
import modalData from "@/app/modals/flow-rate-modal-data";
15+
import { formatSig2 } from "@/app/utils/format";
1416

1517
export default function MotherTankMaximumWeightFormula({ onCalculate, sharedState }: { onCalculate: (data: any) => void, sharedState: CalculatorFlowSharedStateData }) {
1618
const { t } = useTranslation();
@@ -41,15 +43,15 @@ export default function MotherTankMaximumWeightFormula({ onCalculate, sharedStat
4143
<div className="result-wrapper">
4244
<h2>{`${t('The maximum weight of the mother tank is')}:`}</h2>
4345
<p className="answer">
44-
{`${Math.trunc(motherWeightMaximumWeightSolution)} ${t('grams')}`} {`(${(motherWeightMaximumWeightSolution / 1000).toFixed(1)} ${t('kilograms')})`}
46+
{`${formatSig2(motherWeightMaximumWeightSolution)} ${t('grams')}`} {`(${formatSig2(motherWeightMaximumWeightSolution / 1000)} ${t('kilograms')})`}
4547
</p>
4648
</div>
4749

4850
<Modal
4951
show={showModal === 'info'}
5052
closeModal={() => setShowModal(null)}
51-
headerText='How to Determine Maximum Mother Tank Weight'
52-
imageKey='CHLORINE_WEIGHT'></Modal>
53+
modalPageData={modalData}
54+
/>
5355
</div>
5456
);
5557
}

src/app/calculator-flow/components/ReservoirIngressFlow.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import Modal from '../../components/Modal/Modal';
77
import Form from "../../reservoir-ingress/components/Form";
88

99
import "../../reservoir-ingress/styles/Main.css";
10+
import modalData from "@/app/modals/drip-rate-modal-data";
11+
import { formatSig2 } from "@/app/utils/format";
1012

1113
export default function ReservoirIngressFormula({ onCalculate, sharedState }: { onCalculate: (data: any) => void, sharedState: any }) {
1214
const { t } = useTranslation();
@@ -34,15 +36,15 @@ export default function ReservoirIngressFormula({ onCalculate, sharedState }: {
3436
<h2>{t('The flow rate for the reservoir ingress is')}:</h2>
3537

3638
<p className="answer">
37-
{ingress.toFixed(2)} {t('L')}/{t('s')}
39+
{formatSig2(ingress)} {t('L')}/{t('s')}
3840
</p>
3941

4042
</div>
4143
<Modal
4244
show={showModal === 'info'}
4345
closeModal={() => setShowModal(null)}
44-
headerText='How to Determine Chlorine Weight Formula'
45-
imageKey='CHLORINE_WEIGHT'/>
46+
modalPageData={modalData}
47+
/>
4648
</div>
4749
);
4850
}
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
"use client";
2+
3+
import { useState } from "react";
4+
import { useTranslation } from "react-i18next";
5+
import Modal from '../../components/Modal/Modal';
6+
7+
import Form from "../../mother-solution-concentration/components/Form";
8+
9+
import "../../mother-solution-concentration/styles/Main.css";
10+
11+
import modalData from "../../modals/mother-solution-concentration-modal-data";
12+
import { formatSig2 } from "@/app/utils/format";
13+
14+
export default function SaveConfigurationPage({ onCalculate, sharedState }: { onCalculate: (data: any) => void, sharedState: object }) {
15+
const { t } = useTranslation();
16+
17+
const [concentratedMotherSolution, setConcentratedMotherSolution] =
18+
useState(0);
19+
20+
const [showModal, setShowModal] = useState(null as string | null);
21+
const handleCalculate = (calculatedValue: number) => {
22+
setConcentratedMotherSolution(calculatedValue);
23+
onCalculate(calculatedValue);
24+
};
25+
26+
return (
27+
<div className="center">
28+
<div className="pageHeader">
29+
<h1>{t('Mother Solution Concentration Formula')}
30+
<svg onClick={() => setShowModal('info')} fill="#288DCE" viewBox="0 0 50 50"><path d="M 25 2 C 12.309295 2 2 12.309295 2 25 C 2 37.690705 12.309295 48 25 48 C 37.690705 48 48 37.690705 48 25 C 48 12.309295 37.690705 2 25 2 z M 25 4 C 36.609824 4 46 13.390176 46 25 C 46 36.609824 36.609824 46 25 46 C 13.390176 46 4 36.609824 4 25 C 4 13.390176 13.390176 4 25 4 z M 25 11 A 3 3 0 0 0 22 14 A 3 3 0 0 0 25 17 A 3 3 0 0 0 28 14 A 3 3 0 0 0 25 11 z M 21 21 L 21 23 L 22 23 L 23 23 L 23 36 L 22 36 L 21 36 L 21 38 L 22 38 L 23 38 L 27 38 L 28 38 L 29 38 L 29 36 L 28 36 L 27 36 L 27 21 L 26 21 L 22 21 L 21 21 z" /></svg>
31+
</h1>
32+
</div>
33+
34+
<Form onCalculate={handleCalculate} sharedState={sharedState} />
35+
36+
<div className="result-wrapper">
37+
<h2>{`${t('The concentration of the mother solution is')}:`}</h2>
38+
39+
<p className="answer">
40+
{`${formatSig2(concentratedMotherSolution)} ${t('mg')}/${t('L')}`}
41+
</p>
42+
</div>
43+
<Modal
44+
show={showModal === 'info'}
45+
closeModal={() => setShowModal(null)}
46+
modalPageData={modalData}
47+
/>
48+
</div>
49+
50+
);
51+
}

0 commit comments

Comments
 (0)