Spending report error fix with some visual changes (#2809)

* spending error fix with some visual changes * notes
actualbudget · May 29, 2024 · e4bc0ca · e4bc0ca
1 parent c3783b6
commit e4bc0ca
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 33 deletions.
diff --git a/packages/desktop-client/src/components/reports/graphs/SpendingGraph.tsx b/packages/desktop-client/src/components/reports/graphs/SpendingGraph.tsx
@@ -200,7 +200,7 @@ export function SpendingGraph({
                 height={height}
                 data={data.intervalData}
                 margin={{
-                  top: 0,
+                  top: 10,
                   right: 0,
                   left: 0,
                   bottom: 0,

diff --git a/packages/desktop-client/src/components/reports/reports/Spending.tsx b/packages/desktop-client/src/components/reports/reports/Spending.tsx
@@ -61,6 +61,10 @@ export function Spending() {
     data.intervalData[27].months[
       monthUtils.subMonths(monthUtils.currentDay(), 3)
     ].daily !== 0;
+  const todayDay =
+    monthUtils.getDay(monthUtils.currentDay()) - 1 >= 28
+      ? 27
+      : monthUtils.getDay(monthUtils.currentDay()) - 1;
 
   return (
     <Page
@@ -173,14 +177,7 @@ export function Spending() {
                       <Text>
                         <PrivacyFilter blurIntensity={5}>
                           {amountToCurrency(
-                            Math.abs(
-                              data.intervalData[
-                                monthUtils.getDay(monthUtils.currentDay()) >= 29
-                                  ? 28
-                                  : monthUtils.getDay(monthUtils.currentDay()) -
-                                    1
-                              ].thisMonth,
-                            ),
+                            Math.abs(data.intervalData[todayDay].thisMonth),
                           )}
                         </PrivacyFilter>
                       </Text>
@@ -192,14 +189,7 @@ export function Spending() {
                       <Text>
                         <PrivacyFilter blurIntensity={5}>
                           {amountToCurrency(
-                            Math.abs(
-                              data.intervalData[
-                                monthUtils.getDay(monthUtils.currentDay()) >= 29
-                                  ? 28
-                                  : monthUtils.getDay(monthUtils.currentDay()) -
-                                    1
-                              ].lastMonth,
-                            ),
+                            Math.abs(data.intervalData[todayDay].lastMonth),
                           )}
                         </PrivacyFilter>
                       </Text>
@@ -212,16 +202,7 @@ export function Spending() {
                         <Text>
                           <PrivacyFilter blurIntensity={5}>
                             {amountToCurrency(
-                              Math.abs(
-                                data.intervalData[
-                                  monthUtils.getDay(monthUtils.currentDay()) >=
-                                  29
-                                    ? 28
-                                    : monthUtils.getDay(
-                                        monthUtils.currentDay(),
-                                      ) - 1
-                                ].average,
-                              ),
+                              Math.abs(data.intervalData[todayDay].average),
                             )}
                           </PrivacyFilter>
                         </Text>

diff --git a/packages/desktop-client/src/components/reports/reports/SpendingCard.tsx b/packages/desktop-client/src/components/reports/reports/SpendingCard.tsx
@@ -5,6 +5,7 @@ import { amountToCurrency } from 'loot-core/src/shared/util';
 
 import { useCategories } from '../../../hooks/useCategories';
 import { styles } from '../../../style/styles';
+import { theme } from '../../../style/theme';
 import { Block } from '../../common/Block';
 import { View } from '../../common/View';
 import { PrivacyFilter } from '../../PrivacyFilter';
@@ -27,11 +28,14 @@ export function SpendingCard() {
   }, [categories]);
 
   const data = useReport('default', getGraphData);
+  const todayDay =
+    monthUtils.getDay(monthUtils.currentDay()) - 1 >= 28
+      ? 27
+      : monthUtils.getDay(monthUtils.currentDay()) - 1;
   const difference =
     data &&
-    data.intervalData[monthUtils.getDay(monthUtils.currentDay()) - 1].average -
-      data.intervalData[monthUtils.getDay(monthUtils.currentDay()) - 1]
-        .thisMonth;
+    data.intervalData[todayDay].lastMonth -
+      data.intervalData[todayDay].thisMonth;
 
   return (
     <ReportCard flex="1" to="/reports/spending">
@@ -60,10 +64,17 @@ export function SpendingCard() {
                   ...styles.mediumText,
                   fontWeight: 500,
                   marginBottom: 5,
+                  color: !difference
+                    ? 'inherit'
+                    : difference <= 0
+                      ? theme.noticeTextLight
+                      : theme.errorText,
                 }}
               >
                 <PrivacyFilter activationFilters={[!isCardHovered]}>
-                  {data && amountToCurrency(difference)}
+                  {data &&
+                    (difference && difference > 0 ? '+' : '') +
+                      amountToCurrency(difference)}
                 </PrivacyFilter>
               </Block>
             </View>
@@ -75,7 +86,7 @@ export function SpendingCard() {
             style={{ flex: 1 }}
             compact={true}
             data={data}
-            mode="average"
+            mode="lastMonth"
           />
         ) : (
           <LoadingIndicator />

diff --git a/packages/desktop-client/src/components/reports/spreadsheets/spending-spreadsheet.ts b/packages/desktop-client/src/components/reports/spreadsheets/spending-spreadsheet.ts
@@ -151,10 +151,12 @@ export function createSpendingSpreadsheet({
           a.cumulative < b.cumulative ? a : b,
         ).cumulative;
 
+        const totalDaily = data.reduce((a, v) => (a = a + v.totalTotals), 0);
+
         return {
           date: data[0].date,
           cumulative: maxCumulative,
-          daily: data[0].totalTotals,
+          daily: totalDaily,
           month: month.month,
         };
       });

diff --git a/upcoming-release-notes/2809.md b/upcoming-release-notes/2809.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [carkom]
+---
+
+Fixes a crashing bug that happens when the current day of the month is greater than 28.