From 68e6ce3873c590cb26a7c1c79a27bd5b6f8eafb7 Mon Sep 17 00:00:00 2001
From: James Jansson <jamesjansson@gmail.com>
Date: Fri, 8 Nov 2024 10:46:59 +1100
Subject: [PATCH] Set initial values

---
 src/Savings.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/Savings.tsx b/src/Savings.tsx
index dd80e72..87545dd 100644
--- a/src/Savings.tsx
+++ b/src/Savings.tsx
@@ -38,9 +38,13 @@ function Savings() {
     };
   }
 
-  const [deposit, setDeposit] = useState(100);
-  const [interestRate, setInterestRate] = useState(3.5);
-  const [period, setPeriod] = useState(25);
+  const initialDeposit = 100;
+  const initialInterestRate = 3.5;
+  const initialPeriod = 25;
+
+  const [deposit, setDeposit] = useState(initialDeposit);
+  const [interestRate, setInterestRate] = useState(initialInterestRate);
+  const [period, setPeriod] = useState(initialPeriod);
   const [finalBalance, setFinalBalance] = useState(0);
   const [totalInterest, setTotalInterest] = useState(25);
   const [graphData, setGraphData] = useState(emptyGraphData());
@@ -113,6 +117,7 @@ function Savings() {
                 <Form.Control
                   aria-label="Weekly deposit amount"
                   onChange={depositEvent}
+                  defaultValue={initialDeposit}
                 />
                 <InputGroup.Text>per week</InputGroup.Text>
               </InputGroup>
@@ -121,6 +126,7 @@ function Savings() {
                 <Form.Control
                   aria-label="Interest rate"
                   onChange={interestRateEvent}
+                  defaultValue={initialInterestRate}
                 />
                 <InputGroup.Text>%</InputGroup.Text>
               </InputGroup>
@@ -129,6 +135,7 @@ function Savings() {
                 <Form.Control
                   aria-label="Savings period"
                   onChange={periodEvent}
+                  defaultValue={initialPeriod}
                 />
                 <InputGroup.Text>years</InputGroup.Text>
               </InputGroup>