Fix a bug in the logic used to calculate the percentage of logged macros

Also, use the common getter in the plan class
wger-project · Oct 16, 2023 · 1075c9b · 1075c9b
1 parent 816ff0d
commit 1075c9b
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 15 deletions.
diff --git a/src/components/Dashboard/NutritionCard.tsx b/src/components/Dashboard/NutritionCard.tsx
@@ -136,6 +136,7 @@ export const NutritionCard = () => {
                             )}
                         </List>
                         <NutritionalValuesDashboardChart
+                            percentage={planQuery.data!.percentageValuesLoggedToday}
                             planned={planQuery.data!.plannedNutritionalValues}
                             logged={planQuery.data!.loggedNutritionalValuesToday}
                         />

diff --git a/src/components/Nutrition/models/nutritionalPlan.ts b/src/components/Nutrition/models/nutritionalPlan.ts
@@ -44,7 +44,7 @@ export class NutritionalPlan {
     /*
      * Returns the nutritional values for the planned meals
      */
-    get plannedNutritionalValues(): NutritionalValues {
+    get plannedNutritionalValues() {
         if (this.hasAnyGoals) {
             return new NutritionalValues({
                 energy: this.goalEnergy!,
@@ -101,12 +101,12 @@ export class NutritionalPlan {
         }, new Map<string, GroupedDiaryEntries>());
     }
 
-    get percentages() {
-        return {
-            protein: this.plannedNutritionalValues.protein / this.loggedNutritionalValuesToday.protein * 100,
-            carbohydrates: this.plannedNutritionalValues.carbohydrates / this.loggedNutritionalValuesToday.carbohydrates * 100,
-            fat: this.plannedNutritionalValues.fat / this.loggedNutritionalValuesToday.fat * 100,
-        };
+    get percentageValuesLoggedToday() {
+        return new NutritionalValues({
+            protein: this.loggedNutritionalValuesToday.protein / this.plannedNutritionalValues.protein * 100,
+            carbohydrates: this.loggedNutritionalValuesToday.carbohydrates / this.plannedNutritionalValues.carbohydrates * 100,
+            fat: this.loggedNutritionalValuesToday.fat / this.plannedNutritionalValues.fat * 100,
+        });
     }
 
     /*

diff --git a/src/components/Nutrition/widgets/PlanSidebar.tsx b/src/components/Nutrition/widgets/PlanSidebar.tsx
@@ -10,7 +10,7 @@ export const PlanSidebar = (props: { plan: NutritionalPlan }) => {
 
     const planned = props.plan.plannedNutritionalValues;
     const loggedToday = props.plan.loggedNutritionalValuesToday;
-    const percentages = props.plan.percentages;
+    const percentages = props.plan.percentageValuesLoggedToday;
 
 
     return <>

diff --git a/src/components/Nutrition/widgets/charts/NutritionalValuesDashboardChart.tsx b/src/components/Nutrition/widgets/charts/NutritionalValuesDashboardChart.tsx
@@ -8,17 +8,14 @@ import { numberLocale } from "utils/numbers";
 
 
 export const NutritionalValuesDashboardChart = (props: {
+    percentage: NutritionalValues,
     logged: NutritionalValues,
     planned: NutritionalValues,
 }) => {
 
     const energyPercentage = props.planned.energy > 0 ? props.logged.energy / props.planned.energy * 100 : 100;
     const energyDiff = props.planned.energy > 0 ? props.planned.energy - props.logged.energy : props.logged.energy;
 
-    const proteinPercentage = props.logged.protein / props.planned.protein * 100;
-    const carbohydratesPercentage = props.logged.carbohydrates / props.planned.carbohydrates * 100;
-    const fatPercentage = props.logged.fat / props.planned.fat * 100;
-
     const theme = useTheme();
     const [t, i18n] = useTranslation();
     const data = [
@@ -66,19 +63,19 @@ export const NutritionalValuesDashboardChart = (props: {
         <Stack width={'50%'} spacing={1}>
             <LinearPlannedLoggedChart
                 title={t('nutrition.protein')}
-                percentage={proteinPercentage}
+                percentage={props.percentage.protein}
                 logged={props.logged.protein}
                 planned={props.planned.protein}
             />
             <LinearPlannedLoggedChart
                 title={t('nutrition.carbohydrates')}
-                percentage={carbohydratesPercentage}
+                percentage={props.percentage.carbohydrates}
                 logged={props.logged.carbohydrates}
                 planned={props.planned.carbohydrates}
             />
             <LinearPlannedLoggedChart
                 title={t('nutrition.fat')}
-                percentage={fatPercentage}
+                percentage={props.percentage.fat}
                 logged={props.logged.fat}
                 planned={props.planned.fat}
             />