From 7cee557aa55c346bdbb91c3c22b6f803fd77bbde Mon Sep 17 00:00:00 2001
From: francoisdillinger <elmojester@gmail.com>
Date: Mon, 17 Apr 2023 06:22:06 -0500
Subject: [PATCH] updated chart data and desired temp

---
 frontend/src/App.js             | 7 +++++--
 frontend/src/DesiredTemp.js     | 2 +-
 frontend/src/chartComponent.js  | 5 +++--
 frontend/src/costsCollection.js | 8 ++++----
 4 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 7fec7f5..76b30f6 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -20,6 +20,9 @@ function App() {
   const [theme, setTheme] = useState(false);
   const [rotateValues, setRotateValues] = useState({ rotateX: 0, rotateY: 0 });
 
+  const [previousMonthlyCost, setPreviousMonthlyCost] = useState(0);
+  const [currentMonthlyCost, setCurrentMonthlyCost] = useState(0);
+
   const handleDarkModeToggle = () => {
     setTheme(prevState => !prevState)
   }
@@ -98,8 +101,8 @@ function App() {
               <DesiredTemp />
             </Slide>
             <Slide index={1}>
-              <ChartComponent />
-              <CostsCollection />
+              <ChartComponent setPreviousMonthlyCost={setPreviousMonthlyCost} setCurrentMonthlyCost={setCurrentMonthlyCost} />
+              <CostsCollection previousMonthlyCost={previousMonthlyCost} currentMonthlyCost={currentMonthlyCost} />
             </Slide>
             <Slide index={2}>
               <ForecastCollection />
diff --git a/frontend/src/DesiredTemp.js b/frontend/src/DesiredTemp.js
index e653b34..558ef85 100644
--- a/frontend/src/DesiredTemp.js
+++ b/frontend/src/DesiredTemp.js
@@ -20,7 +20,7 @@ const DesiredTemp = (props) => {
             <div id="currentTemp" className='temps'>
             <p className='title'>Desired</p>
             <p className='title'>Temperature</p>
-            <p className='temperatures'>{desiredTemp} &deg;F</p>
+            <p className='temperatures' >{desiredTemp} &deg;F</p>
             </div>
             <IncreaseTempButton handleIncreaseTempClick={handleIncreaseTempClick}/>
         </div>
diff --git a/frontend/src/chartComponent.js b/frontend/src/chartComponent.js
index 7495e32..71fa1ab 100644
--- a/frontend/src/chartComponent.js
+++ b/frontend/src/chartComponent.js
@@ -49,6 +49,8 @@ const ChartComponent = (props) => {
       
       const chartData = await response.json();
       setChartData(chartData);
+      props.setPreviousMonthlyCost((chartData[chartData.length - 2][2]).toFixed(2))
+      props.setCurrentMonthlyCost((chartData[chartData.length - 1][2]).toFixed(2))
     } catch (error) {
       console.error('There was a problem with the fetch operation:', error);
     }
@@ -63,7 +65,7 @@ const ChartComponent = (props) => {
     datasets: [
       {
         label: 'Power Usage (MW)',
-        data: chartData ? chartData.map(data => (data[1] / 1000)) : [],
+        data: chartData ? chartData.map(data => (data[1] / 100000)) : [],
         borderColor: 'red',
         backgroundColor: 'red',
       },
@@ -81,7 +83,6 @@ const ChartComponent = (props) => {
       },
     ],
   };
-
   return (
     <div id="chart">
       {chartData && <Line options={options} data={data} />}
diff --git a/frontend/src/costsCollection.js b/frontend/src/costsCollection.js
index 460505a..623387d 100644
--- a/frontend/src/costsCollection.js
+++ b/frontend/src/costsCollection.js
@@ -8,20 +8,20 @@ const CostsCollection = (props) => {
         <p className='title'>Previous</p>
         <p className='title'>Monthly</p>
         <p className='title'>Cost</p>
-        <p className='amounts'>81.00</p>
+        <p className='amounts' style={{letterSpacing: '3px'}}>{props.previousMonthlyCost}</p>
         </div>
         <div id="comfortTemp" className='costs'>
         <p className='title'>Current</p>
         <p className='title'>Monthly</p>
         <p className='title'>Cost</p>
-        <p className='amounts'>81.00</p>
+        <p className='amounts' style={{letterSpacing: '3px'}}>{props.currentMonthlyCost}</p>
         </div>
-        <div id="outsideTemp" className='costs'>
+        {/* <div id="outsideTemp" className='costs'>
         <p className='title'>Predicted</p>
         <p className='title'>Monthly</p>
         <p className='title'>Cost</p>
         <p className='amounts'>81.00</p>
-        </div>
+        </div> */}
         {/* <div id="outsideTemp" className='costs'>
         <p className='title'>Total</p>
         <p className='title'>Monthly</p>
-- 
GitLab