Merge branch 'master' into LinkProps

actualbudget · Apr 7, 2024 · 3929636 · 3929636
2 parents 044ac25 + 9030596
commit 3929636
Show file tree

Hide file tree

Showing 12 changed files with 338 additions and 120 deletions.
diff --git a/packages/desktop-client/src/components/mobile/transactions/TransactionEdit.jsx b/packages/desktop-client/src/components/mobile/transactions/TransactionEdit.jsx
@@ -495,10 +495,10 @@ const TransactionEditInner = memo(function TransactionEditInner({
   };
 
   const onSave = async () => {
-    const [transaction] = unserializedTransactions;
+    const [unserializedTransaction] = unserializedTransactions;
 
     const onConfirmSave = async () => {
-      const { account: accountId } = transaction;
+      const { account: accountId } = unserializedTransaction;
       const account = accountsById[accountId];
 
       if (unserializedTransactions.find(t => t.account == null)) {
@@ -516,7 +516,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
       navigate(`/accounts/${account.id}`, { replace: true });
     };
 
-    if (transaction.reconciled) {
+    if (unserializedTransaction.reconciled) {
       // On mobile any save gives the warning.
       // On the web only certain changes trigger a warning.
       // Should we bring that here as well? Or does the nature of the editing form
@@ -536,31 +536,22 @@ const TransactionEditInner = memo(function TransactionEditInner({
     onSave();
   };
 
-  const onEdit = async (transaction, name, value) => {
-    const newTransaction = { ...transaction, [name]: value };
+  const onEdit = async (serializedTransaction, name, value) => {
+    const newTransaction = { ...serializedTransaction, [name]: value };
     await props.onEdit(newTransaction);
     onClearActiveEdit();
   };
 
   const onClick = (transactionId, name) => {
     onRequestActiveEdit?.(getFieldName(transaction.id, name), () => {
-      const transaction = unserializedTransactions.find(
-        t => t.id === transactionId,
-      );
+      const transactionToEdit = transactions.find(t => t.id === transactionId);
       switch (name) {
         case 'category':
           dispatch(
             pushModal('category-autocomplete', {
               categoryGroups,
               onSelect: categoryId => {
-                // This is a deficiency of this API, need to fix. It
-                // assumes that it receives a serialized transaction,
-                // but we only have access to the raw transaction
-                onEdit(
-                  serializeTransaction(transaction, dateFormat),
-                  name,
-                  categoryId,
-                );
+                onEdit(transactionToEdit, name, categoryId);
               },
               onClose: () => {
                 onClearActiveEdit();
@@ -572,14 +563,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
           dispatch(
             pushModal('account-autocomplete', {
               onSelect: accountId => {
-                // This is a deficiency of this API, need to fix. It
-                // assumes that it receives a serialized transaction,
-                // but we only have access to the raw transaction
-                onEdit(
-                  serializeTransaction(transaction, dateFormat),
-                  name,
-                  accountId,
-                );
+                onEdit(transactionToEdit, name, accountId);
               },
               onClose: () => {
                 onClearActiveEdit();
@@ -591,14 +575,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
           dispatch(
             pushModal('payee-autocomplete', {
               onSelect: payeeId => {
-                // This is a deficiency of this API, need to fix. It
-                // assumes that it receives a serialized transaction,
-                // but we only have access to the raw transaction
-                onEdit(
-                  serializeTransaction(transaction, dateFormat),
-                  name,
-                  payeeId,
-                );
+                onEdit(transactionToEdit, name, payeeId);
               },
               onClose: () => {
                 onClearActiveEdit();
@@ -611,14 +588,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
             pushModal('edit-field', {
               name,
               onSubmit: (name, value) => {
-                // This is a deficiency of this API, need to fix. It
-                // assumes that it receives a serialized transaction,
-                // but we only have access to the raw transaction
-                onEdit(
-                  serializeTransaction(transaction, dateFormat),
-                  name,
-                  value,
-                );
+                onEdit(transactionToEdit, name, value);
               },
               onClose: () => {
                 onClearActiveEdit();
@@ -631,26 +601,26 @@ const TransactionEditInner = memo(function TransactionEditInner({
   };
 
   const onDelete = id => {
-    const [transaction, ..._childTransactions] = unserializedTransactions;
+    const [unserializedTransaction] = unserializedTransactions;
 
     const onConfirmDelete = () => {
       props.onDelete(id);
 
-      if (transaction.id !== id) {
+      if (unserializedTransaction.id !== id) {
         // Only a child transaction was deleted.
         onClearActiveEdit();
         return;
       }
 
-      const { account: accountId } = transaction;
+      const { account: accountId } = unserializedTransaction;
       if (accountId) {
         navigate(`/accounts/${accountId}`, { replace: true });
       } else {
         navigate(-1);
       }
     };
 
-    if (transaction.reconciled) {
+    if (unserializedTransaction.reconciled) {
       dispatch(
         pushModal('confirm-transaction-edit', {
           onConfirm: onConfirmDelete,
@@ -683,9 +653,11 @@ const TransactionEditInner = memo(function TransactionEditInner({
   };
 
   useEffect(() => {
-    const noAmountTransaction = childTransactions.find(t => t.amount === 0);
-    if (noAmountTransaction) {
-      scrollChildTransactionIntoView(noAmountTransaction.id);
+    const noAmountChildTransaction = childTransactions.find(
+      t => t.amount === 0,
+    );
+    if (noAmountChildTransaction) {
+      scrollChildTransactionIntoView(noAmountChildTransaction.id);
     }
   }, [childTransactions]);
 

diff --git a/packages/desktop-client/src/components/reports/ReportSidebar.jsx b/packages/desktop-client/src/components/reports/ReportSidebar.jsx
@@ -11,14 +11,10 @@ import { View } from '../common/View';
 import { Tooltip } from '../tooltips';
 
 import { CategorySelector } from './CategorySelector';
+import { getLiveRange } from './getLiveRange';
 import { ModeButton } from './ModeButton';
 import { ReportOptions } from './ReportOptions';
-import {
-  getSpecificRange,
-  validateEnd,
-  validateRange,
-  validateStart,
-} from './reportRanges';
+import { validateEnd, validateStart } from './reportRanges';
 
 export function ReportSidebar({
   customReportItems,
@@ -48,38 +44,7 @@ export function ReportSidebar({
   const onSelectRange = cond => {
     onReportChange({ type: 'modify' });
     setDateRange(cond);
-    let dateStart;
-    let dateEnd;
-    switch (cond) {
-      case 'All time':
-        onChangeDates(earliestTransaction, monthUtils.currentDay());
-        break;
-      case 'Year to date':
-        [dateStart, dateEnd] = validateRange(
-          earliestTransaction,
-          monthUtils.getYearStart(monthUtils.currentMonth()) + '-01',
-          monthUtils.currentDay(),
-        );
-        onChangeDates(dateStart, dateEnd);
-        break;
-      case 'Last year':
-        [dateStart, dateEnd] = validateRange(
-          earliestTransaction,
-          monthUtils.getYearStart(
-            monthUtils.prevYear(monthUtils.currentMonth()),
-          ) + '-01',
-          monthUtils.getYearEnd(monthUtils.prevYear(monthUtils.currentDate())) +
-            '-31',
-        );
-        onChangeDates(dateStart, dateEnd);
-        break;
-      default:
-        [dateStart, dateEnd] = getSpecificRange(
-          ReportOptions.dateRangeMap.get(cond),
-          cond === 'Last month' ? 0 : null,
-        );
-        onChangeDates(dateStart, dateEnd);
-    }
+    onChangeDates(...getLiveRange(cond, earliestTransaction));
   };
 
   const onChangeMode = cond => {

diff --git a/packages/desktop-client/src/components/reports/getLiveRange.ts b/packages/desktop-client/src/components/reports/getLiveRange.ts
@@ -0,0 +1,44 @@
+import * as monthUtils from 'loot-core/src/shared/months';
+
+import { ReportOptions } from './ReportOptions';
+import { getSpecificRange, validateRange } from './reportRanges';
+
+export function getLiveRange(cond: string, earliestTransaction: string) {
+  let dateStart;
+  let dateEnd;
+  const rangeName = ReportOptions.dateRangeMap.get(cond);
+  switch (rangeName) {
+    case 'yearToDate':
+      [dateStart, dateEnd] = validateRange(
+        earliestTransaction,
+        monthUtils.getYearStart(monthUtils.currentMonth()) + '-01',
+        monthUtils.currentDay(),
+      );
+      break;
+    case 'lastYear':
+      [dateStart, dateEnd] = validateRange(
+        earliestTransaction,
+        monthUtils.getYearStart(
+          monthUtils.prevYear(monthUtils.currentMonth()),
+        ) + '-01',
+        monthUtils.getYearEnd(monthUtils.prevYear(monthUtils.currentDate())) +
+          '-31',
+      );
+      break;
+    case 'allMonths':
+      dateStart = earliestTransaction;
+      dateEnd = monthUtils.currentDay();
+      break;
+    default:
+      if (typeof rangeName === 'number') {
+        [dateStart, dateEnd] = getSpecificRange(
+          rangeName,
+          cond === 'Last month' ? 0 : null,
+        );
+      } else {
+        break;
+      }
+  }
+
+  return [dateStart, dateEnd];
+}
diff --git a/packages/desktop-client/src/components/reports/reportRanges.ts b/packages/desktop-client/src/components/reports/reportRanges.ts
@@ -115,7 +115,7 @@ function boundedRange(
   return [start, end];
 }
 
-export function getSpecificRange(offset: number, addNumber: number) {
+export function getSpecificRange(offset: number, addNumber: number | null) {
   const currentDay = monthUtils.currentDay();
   const dateStart = monthUtils.subMonths(currentDay, offset) + '-01';
   const dateEnd = monthUtils.getMonthEnd(

diff --git a/packages/desktop-client/src/components/reports/reports/CustomReport.jsx b/packages/desktop-client/src/components/reports/reports/CustomReport.jsx
@@ -21,6 +21,7 @@ import { AppliedFilters } from '../../filters/AppliedFilters';
 import { PrivacyFilter } from '../../PrivacyFilter';
 import { ChooseGraph } from '../ChooseGraph';
 import { defaultsList, disabledList } from '../disabledList';
+import { getLiveRange } from '../getLiveRange';
 import { Header } from '../Header';
 import { LoadingIndicator } from '../LoadingIndicator';
 import { ReportLegend } from '../ReportLegend';
@@ -93,18 +94,6 @@ export function CustomReport() {
     location.state ? (location.state.report ? 'saved' : 'new') : 'new',
   );
 
-  useEffect(() => {
-    const format =
-      ReportOptions.intervalMap.get(interval).toLowerCase() + 'FromDate';
-
-    const dateStart = monthUtils[format](startDate);
-    const dateEnd = monthUtils[format](endDate);
-
-    setIntervals(
-      monthUtils[ReportOptions.intervalRange.get(interval)](dateStart, dateEnd),
-    );
-  }, [interval, startDate, endDate]);
-
   useEffect(() => {
     if (selectedCategories === undefined && categories.list.length !== 0) {
       setSelectedCategories(categories.list);
@@ -138,10 +127,31 @@ export function CustomReport() {
         .reverse();
 
       setAllIntervals(allInter);
+
+      if (!isDateStatic) {
+        const [dateStart, dateEnd] = getLiveRange(
+          dateRange,
+          trans ? trans.date : monthUtils.currentDay(),
+        );
+        setStartDate(dateStart);
+        setEndDate(dateEnd);
+      }
     }
     run();
   }, [interval]);
 
+  useEffect(() => {
+    const format =
+      ReportOptions.intervalMap.get(interval).toLowerCase() + 'FromDate';
+
+    const dateStart = monthUtils[format](startDate);
+    const dateEnd = monthUtils[format](endDate);
+
+    setIntervals(
+      monthUtils[ReportOptions.intervalRange.get(interval)](dateStart, dateEnd),
+    );
+  }, [interval, startDate, endDate]);
+
   const balanceTypeOp = ReportOptions.balanceTypeMap.get(balanceType);
   const payees = usePayees();
   const accounts = useAccounts();

diff --git a/packages/desktop-client/src/components/reports/reports/CustomReportListCards.tsx b/packages/desktop-client/src/components/reports/reports/CustomReportListCards.tsx
@@ -1,6 +1,7 @@
-import React, { createRef, useMemo, useState } from 'react';
+import React, { createRef, useEffect, useMemo, useState } from 'react';
 
 import { send, sendCatch } from 'loot-core/platform/client/fetch/index';
+import * as monthUtils from 'loot-core/src/shared/months';
 import { type CustomReportEntity } from 'loot-core/types/models/reports';
 
 import { useAccounts } from '../../../hooks/useAccounts';
@@ -72,6 +73,7 @@ export function CustomReportListCards({
   const [err, setErr] = useState('');
   const [name, setName] = useState('');
   const inputRef = createRef<HTMLInputElement>();
+  const [earliestTransaction, setEarliestTransaction] = useState('');
 
   const payees = usePayees();
   const accounts = useAccounts();
@@ -85,6 +87,14 @@ export function CustomReportListCards({
     onDeleteMenuOpen(reportData === undefined ? '' : reportData, false);
   };
 
+  useEffect(() => {
+    async function run() {
+      const trans = await send('get-earliest-transaction');
+      setEarliestTransaction(trans ? trans.date : monthUtils.currentDay());
+    }
+    run();
+  }, []);
+
   const onAddUpdate = async ({
     reportData,
   }: {
@@ -216,6 +226,7 @@ export function CustomReportListCards({
                         payees={payees}
                         accounts={accounts}
                         categories={categories}
+                        earliestTransaction={earliestTransaction}
                       />
                     </View>
                   </ReportCard>