From 53df1a03a3e36870e5c601e190961faf1c9c3a4c Mon Sep 17 00:00:00 2001
From: Jed Fox <git@jedfox.com>
Date: Mon, 26 Jun 2023 09:13:20 -0400
Subject: [PATCH] Fix navigating to the per-category per-month page (#1182)
I checked through the other references to `navigate` and none of them
appeared to be affected.
---
packages/desktop-client/e2e/budget.test.js | 10 +++++++++
.../e2e/page-models/budget-page.js | 21 ++++++++++++++++---
.../src/components/budget/index.js | 3 +--
.../components/budget/report/components.tsx | 1 +
.../budget/rollover/rollover-components.tsx | 1 +
upcoming-release-notes/1182.md | 6 ++++++
6 files changed, 37 insertions(+), 5 deletions(-)
create mode 100644 upcoming-release-notes/1182.md
diff --git a/packages/desktop-client/e2e/budget.test.js b/packages/desktop-client/e2e/budget.test.js
index d1160a5bc..ebfd78d00 100644
--- a/packages/desktop-client/e2e/budget.test.js
+++ b/packages/desktop-client/e2e/budget.test.js
@@ -50,4 +50,14 @@ test.describe('Budget', () => {
balance: expect.any(Number),
});
});
+
+ test('clicking on spent amounts opens a transaction page', async () => {
+ let categoryName = await budgetPage.getCategoryNameForRow(1);
+ let accountPage = await budgetPage.clickOnSpentAmountForRow(1);
+ expect(page.url()).toContain('/accounts');
+ expect(await accountPage.accountName.textContent()).toMatch(
+ new RegExp(String.raw`${categoryName} \(\w+ \d+\)`),
+ );
+ await page.getByRole('button', { name: 'Back' }).click();
+ });
});
diff --git a/packages/desktop-client/e2e/page-models/budget-page.js b/packages/desktop-client/e2e/page-models/budget-page.js
index 3af42c338..86b168a2e 100644
--- a/packages/desktop-client/e2e/page-models/budget-page.js
+++ b/packages/desktop-client/e2e/page-models/budget-page.js
@@ -1,3 +1,5 @@
+import { AccountPage } from './account-page';
+
export class BudgetPage {
constructor(page) {
this.page = page;
@@ -46,12 +48,25 @@ export class BudgetPage {
);
}
- async transferAllBalance(fromIdx, toIdx) {
- const toName = await this.budgetTable
+ async getCategoryNameForRow(idx) {
+ return this.budgetTable
.getByTestId('row')
- .nth(toIdx)
+ .nth(idx)
.getByTestId('category-name')
.textContent();
+ }
+
+ async clickOnSpentAmountForRow(idx) {
+ await this.budgetTable
+ .getByTestId('row')
+ .nth(idx)
+ .getByTestId('category-month-spent')
+ .click();
+ return new AccountPage(this.page);
+ }
+
+ async transferAllBalance(fromIdx, toIdx) {
+ const toName = await this.getCategoryNameForRow(toIdx);
await this.budgetTable
.getByTestId('row')
diff --git a/packages/desktop-client/src/components/budget/index.js b/packages/desktop-client/src/components/budget/index.js
index b14ab0267..2436b32ef 100644
--- a/packages/desktop-client/src/components/budget/index.js
+++ b/packages/desktop-client/src/components/budget/index.js
@@ -332,8 +332,7 @@ class Budget extends PureComponent {
};
onShowActivity = (categoryName, categoryId, month) => {
- this.props.navigate({
- pathname: '/accounts',
+ this.props.navigate('/accounts', {
state: {
goBack: true,
filterName: `${categoryName} (${monthUtils.format(
diff --git a/packages/desktop-client/src/components/budget/report/components.tsx b/packages/desktop-client/src/components/budget/report/components.tsx
index dd663c6c1..f93467cb4 100644
--- a/packages/desktop-client/src/components/budget/report/components.tsx
+++ b/packages/desktop-client/src/components/budget/report/components.tsx
@@ -246,6 +246,7 @@ export const CategoryMonth = memo(function CategoryMonth({
style={{ textAlign: 'right' }}
>
<span
+ data-testid="category-month-spent"
onClick={() => onShowActivity(category.name, category.id, monthIndex)}
>
<CellValue
diff --git a/packages/desktop-client/src/components/budget/rollover/rollover-components.tsx b/packages/desktop-client/src/components/budget/rollover/rollover-components.tsx
index b9ec4d0f7..9cbc268aa 100644
--- a/packages/desktop-client/src/components/budget/rollover/rollover-components.tsx
+++ b/packages/desktop-client/src/components/budget/rollover/rollover-components.tsx
@@ -371,6 +371,7 @@ export const ExpenseCategoryMonth = memo(function ExpenseCategoryMonth({
style={{ textAlign: 'right' }}
>
<span
+ data-testid="category-month-spent"
onClick={() => onShowActivity(category.name, category.id, monthIndex)}
>
<CellValue
diff --git a/upcoming-release-notes/1182.md b/upcoming-release-notes/1182.md
new file mode 100644
index 000000000..0290813bd
--- /dev/null
+++ b/upcoming-release-notes/1182.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [j-f1]
+---
+
+Fix navigating to the per-category per-month page
--
GitLab