processed data bucket context

webserver/src/App.jsx

@@ -20,7 +20,7 @@ import { createMuiTheme, ThemeProvider } from '@material-ui/core'
 import { Formik, Field, Form } from 'formik';
 import { TextField, Button, Grid, FormRow, Checkbox, Radio, FormControlLabel, FormControl, FormLabel, RadioGroup, IconButton, InputAdornment } from "@material-ui/core";
 import { AddCircleOutline, RemoveCircleOutline } from "@material-ui/icons";
-import { ProcessedDataProvider } from "./Pages/DashboardPage/ProcessedDataContext";
+import { ProcessedDataBucketProvider } from "./ProcessedDataBucketContext";
 
 
 
@@ -44,7 +44,7 @@ function App() {
     <div className="App">
       <ThemeProvider theme={darkTheme}>
         <DbProvider>
-          <ProcessedDataProvider>
+          <ProcessedDataBucketProvider>
             <Router>
               <Navigation />
               <Routes>
@@ -55,7 +55,7 @@ function App() {
                 <Route path="*" element={<NotFoundPage />} />
               </Routes>
             </Router>
-          </ProcessedDataProvider>
+          </ProcessedDataBucketProvider>
         </DbProvider>
       </ThemeProvider>
     </div>

webserver/src/DbContext.jsx

@@ -1,5 +1,6 @@
 import PouchDB from "pouchdb";
 import React, { useContext, useState } from "react";
+import { ProcessedDataBucketContext } from "./ProcessedDataBucketContext";
 
 const LocalDbContext = React.createContext();
 const RemoteDbContext = React.createContext();
@@ -40,7 +41,10 @@ export function DbProvider({ children }) {
       live: true,
       retry: true,
     })
-    .on("change", function (change) { })
+    .on("change", function (change) {
+      const pdb = React.useContext(ProcessedDataBucketContext);
+      console.log(pdb);
+    })
     .on("paused", function (info) { })
     .on("active", function (info) { })
     .on("error", function (err) {

webserver/src/Pages/DashboardPage/DashboardPage.jsx

@@ -3,67 +3,6 @@ import { useLocalDb } from "../../DbContext";
 import { Bar, Chart } from "react-chartjs-2";
 
 const DashboardPage = () => {
-  const localdb = useLocalDb();
-  let processed_data = {};
-  localdb
-    .allDocs({
-      include_docs: true,
-    })
-    .then((result) => {
-      console.log(result);
-      result.rows.forEach((dbentry) => {
-        let doc = dbentry.doc;
-        console.log(doc);
-        //if there's no processed data on a team yet, create a default data entry
-        if (typeof processed_data[doc.team_name] === "undefined") {
-          processed_data[doc.team_name] = {
-            team_name: doc.team_name,
-            alliance: doc.alliance,
-            games_played: 0,
-            climbs_none: 0,
-            climbs_low: 0,
-            climbs_mid: 0,
-            climbs_high: 0,
-            climbs_transverse: 0,
-            points: 0,
-            point_average: 0,
-            num_disables: 0,
-            disables_average: 0,
-            num_flips: 0,
-            flips_average: 0,
-            fouls: 0,
-            fouls_average: 0,
-            fouls_tech: 0,
-            fouls_tech_average: 0,
-          };
-        }
-
-        let team_data = processed_data[doc.team_name];
-        console.log(team_data);
-        let new_team_data = {
-          ...team_data,
-          games_played: team_data.games_played + 1,
-          num_climbs: team_data.num_climbs + (doc.climb == true ? 1 : 0),
-          num_disables: team_data.num_disables + (doc.disabled == true ? 1 : 0),
-          num_flips: team_data.num_flips + (doc.flipped_over == true ? 1 : 0),
-          fouls: team_data.fouls + parseInt(doc.fouls),
-          fouls_tech: team_data.fouls_tech + parseInt(doc.fouls_tech),
-          inner_port: team_data.inner_port + parseInt(doc.inner_port),
-          outer_port: team_data.outer_port + parseInt(doc.outer_port),
-          lower_port: team_data.lower_port + parseInt(doc.lower_port),
-        };
-        console.log(new_team_data);
-      });
-    })
-    .catch((err) => {
-      console.log("Error Fetching Docs from Database!");
-      console.log(err);
-    });
-  let datasets = [
-    {
-      data: [],
-    },
-  ];
   //https://react-charts.js.org/examples/column
   return <div></div>;
 };

webserver/src/Pages/DashboardPage/ProcessedDataContext.jsx

@@ -1,85 +0,0 @@
-import React, { useContext, useState } from "react";
-import { useLocalDb } from "../../DbContext";
-
-const ProcessedDataContext = React.createContext();
-export function useProcessedData() {
-    return useContext(processedDataContext);
-}
-
-export function ProcessedDataProvider({ children }) {
-    const [processedData, setProcessedData] = useState(
-        {
-            teamData: null,
-            matchData: null,
-            updateData: function () {
-                const localdb = useLocalDb();
-                // let processed_data = {};
-                localdb
-                    .allDocs({
-                        include_docs: true,
-                    })
-                    .then((result) => {
-                        console.log(result);
-                        result.rows.forEach((dbentry) => {
-                            let doc = dbentry.doc;
-                            console.log(doc);
-                            //if there's no processed data on a team yet, create a default data entry
-                            if (typeof teamData[doc.team_name] === "undefined") {
-                                teamData[doc.team_name] = {
-                                    team_name: doc.team_name,
-                                    alliance: doc.alliance,
-                                    games_played: 0,
-                                    climbs_none: 0,
-                                    climbs_low: 0,
-                                    climbs_mid: 0,
-                                    climbs_high: 0,
-                                    climbs_transverse: 0,
-                                    points: 0,
-                                    point_average: 0,
-                                    num_disables: 0,
-                                    disables_average: 0,
-                                    num_flips: 0,
-                                    flips_average: 0,
-                                    fouls: 0,
-                                    fouls_average: 0,
-                                    fouls_tech: 0,
-                                    fouls_tech_average: 0,
-                                };
-                            }
-
-                            let thisTeamData = teamData[doc.team_name];
-                            console.log(thisTeamData);
-                            let new_team_data = {
-                                ...team_data,
-                                games_played: team_data.games_played + 1,
-                                num_climbs: team_data.num_climbs + (doc.climb == true ? 1 : 0),
-                                num_disables: team_data.num_disables + (doc.disabled == true ? 1 : 0),
-                                num_flips: team_data.num_flips + (doc.flipped_over == true ? 1 : 0),
-                                fouls: team_data.fouls + parseInt(doc.fouls),
-                                fouls_tech: team_data.fouls_tech + parseInt(doc.fouls_tech),
-                                inner_port: team_data.inner_port + parseInt(doc.inner_port),
-                                outer_port: team_data.outer_port + parseInt(doc.outer_port),
-                                lower_port: team_data.lower_port + parseInt(doc.lower_port),
-                            };
-                            console.log(new_team_data);
-                        });
-                    })
-                    .catch((err) => {
-                        console.log("Error Fetching Docs from Database!");
-                        console.log(err);
-                    });
-                let datasets = [
-                    {
-                        data: [],
-                    },
-                ];
-            }
-        }
-    );
-    //https://react-charts.js.org/examples/column
-    return (
-        <ProcessedDataContext.ProcessedDataProvider value={processedData}>
-            {children}
-        </ProcessedDataContext.ProcessedDataProvider>
-    );
-};

webserver/src/ProcessedDataBucket.jsx

@@ -0,0 +1,65 @@
+export class ProcessedDataBucket {
+    constructor() {
+        this.teamData = null;
+        this.matchData = null;
+        this.updateData = (db) => {
+            db.allDocs({
+                include_docs: true,
+            })
+                .then((result) => {
+                    console.log(result);
+                    result.rows.forEach((dbentry) => {
+                        let doc = dbentry.doc;
+                        console.log(doc);
+                        //if there's no processed data on a team yet, create a default data entry
+                        if (typeof this.teamData[doc.team_name] === "undefined") {
+                            this.teamData[doc.team_name] = {
+                                team_name: doc.team_name,
+                                alliance: doc.alliance,
+                                games_played: 0,
+                                climbs_none: 0,
+                                climbs_low: 0,
+                                climbs_mid: 0,
+                                climbs_high: 0,
+                                climbs_transverse: 0,
+                                points: 0,
+                                point_average: 0,
+                                num_disables: 0,
+                                disables_average: 0,
+                                num_flips: 0,
+                                flips_average: 0,
+                                fouls: 0,
+                                fouls_average: 0,
+                                fouls_tech: 0,
+                                fouls_tech_average: 0,
+                            };
+                        }
+                        let thisTeamData = this.teamData[doc.team_name];
+                        console.log(thisTeamData);
+                        let new_team_data = {
+                            ...thisTeamData,
+                            games_played: thisTeamData.games_played + 1,
+                            num_climbs: thisTeamData.num_climbs + (doc.climb == true ? 1 : 0),
+                            num_disables: thisTeamData.num_disables + (doc.disabled == true ? 1 : 0),
+                            num_flips: thisTeamData.num_flips + (doc.flipped_over == true ? 1 : 0),
+                            fouls: thisTeamData.fouls + parseInt(doc.fouls),
+                            fouls_tech: thisTeamData.fouls_tech + parseInt(doc.fouls_tech),
+                            inner_port: thisTeamData.inner_port + parseInt(doc.inner_port),
+                            outer_port: thisTeamData.outer_port + parseInt(doc.outer_port),
+                            lower_port: thisTeamData.lower_port + parseInt(doc.lower_port),
+                        };
+                        console.log(new_team_data);
+                    });
+                })
+                .catch((err) => {
+                    console.log("Error Fetching Docs from Database!");
+                    console.log(err);
+                });
+            let datasets = [
+                {
+                    data: [],
+                },
+            ];
+        };
+    }
+}

webserver/src/ProcessedDataBucketContext.jsx

@@ -0,0 +1,18 @@
+import React, { useContext, useState } from "react";
+import { useLocalDb } from "./DbContext";
+import { ProcessedDataBucket } from "./ProcessedDataBucket.jsx"
+
+export const ProcessedDataBucketContext = React.createContext();
+export function useProcessedDataBucket() {
+    return useContext(ProcessedDataBucketContext);
+}
+
+export function ProcessedDataBucketProvider({ children }) {
+    //create the processed data bucket object
+    const [processedDataBucket, setProcessedDataBucket] = useState(new ProcessedDataBucket());
+    return (
+        <ProcessedDataBucketContext.Provider value={processedDataBucket}>
+            {children}
+        </ProcessedDataBucketContext.Provider>
+    );
+};