Bug/5679 payee filter (#6594)

* Fix filters, added tests

* Added release notes

* [autofix.ci] apply automated fixes

* Fix missing awaits in test, use placeholder locator

* Added release notes file

* Update VRT screenshots

Auto-generated by VRT workflow

PR: #6594

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

packages/desktop-client/e2e/transactions.test.ts

@@ -84,6 +84,78 @@ test.describe('Transactions', () => {
       );
       await expect(page).toMatchThemeScreenshots();
     });
+
+    test('by payee', async () => {
+      accountPage = await navigation.goToAccountPage('Capital One Checking');
+      const filterTooltip = await accountPage.filterBy('Payee');
+      const filtersMenuTooltip = page.getByTestId('filters-menu-tooltip');
+      await expect(filterTooltip.locator).toMatchThemeScreenshots();
+
+      // Type in the autocomplete box
+      const autocomplete = filtersMenuTooltip.getByLabel('Payee');
+      await expect(autocomplete).toMatchThemeScreenshots();
+
+      // Open the textbox, auto-open is currently broken for anything that's not "is not"
+      await autocomplete.click();
+
+      await page.getByTestId('Kroger-payee-item').click();
+      await filterTooltip.applyButton.click();
+
+      // Assert that all Payees are Kroger
+      for (let i = 0; i < 10; i++) {
+        await expect(accountPage.getNthTransaction(i).payee).toHaveText(
+          'Kroger',
+        );
+      }
+      await accountPage.removeFilter(0);
+
+      await accountPage.filterBy('Payee');
+      await filtersMenuTooltip
+        .getByRole('button', { name: 'contains' })
+        .click();
+      const textInput = filtersMenuTooltip.getByPlaceholder('nothing');
+
+      await textInput.fill('De');
+      await filterTooltip.applyButton.click();
+      // Assert that all Payees are Deposit
+      for (let i = 0; i < 9; i++) {
+        await expect(accountPage.getNthTransaction(i).payee).toHaveText(
+          'Deposit',
+        );
+      }
+
+      await accountPage.removeFilter(0);
+
+      await accountPage.filterBy('Payee');
+      await filtersMenuTooltip
+        .getByRole('button', { name: 'contains' })
+        .click();
+
+      await textInput.fill('l');
+      await filterTooltip.applyButton.click();
+      // Assert that both Payees contain the letter 'l'
+      for (let i = 0; i < 2; i++) {
+        await expect(accountPage.getNthTransaction(i).payee).toHaveText(/l/);
+      }
+
+      await accountPage.removeFilter(0);
+
+      await accountPage.filterBy('Payee');
+      await filtersMenuTooltip
+        .getByRole('button', { name: 'does not contain' })
+        .click();
+
+      await textInput.fill('l');
+      await filterTooltip.applyButton.click();
+      // Assert that all Payees DO NOT contain the letter 'l'
+      for (let i = 0; i < 19; i++) {
+        await expect(accountPage.getNthTransaction(i).payee).not.toHaveText(
+          /l/,
+        );
+      }
+
+      await expect(page).toMatchThemeScreenshots();
+    });
   });
 
   test('creates a test transaction', async () => {

packages/desktop-client/src/components/filters/FiltersMenu.tsx

@@ -126,6 +126,10 @@ function ConfigureField<T extends RuleConditionEntity>({
     return value;
   }, [value, field, subfield, dateFormat]);
 
+  // For ops that filter based on payeeId, those use PayeeFilter, otherwise we use GenericInput
+  const isPayeeIdOp = (op: T['op']) =>
+    ['is', 'is not', 'one of', 'not one of'].includes(op);
+
   return (
     <FocusScope>
       <View style={{ marginBottom: 10 }}>
@@ -260,7 +264,7 @@ function ConfigureField<T extends RuleConditionEntity>({
           });
         }}
       >
-        {type !== 'boolean' && field !== 'payee' && (
+        {type !== 'boolean' && (field !== 'payee' || !isPayeeIdOp(op)) && (
           <GenericInput
             ref={inputRef}
             // @ts-expect-error - fix me
@@ -292,7 +296,7 @@ function ConfigureField<T extends RuleConditionEntity>({
           />
         )}
 
-        {field === 'payee' && (
+        {field === 'payee' && isPayeeIdOp(op) && (
           <PayeeFilter
             // @ts-expect-error - fix me
             value={formattedValue}

upcoming-release-notes/6594.md

@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [RMcGhee]
+---
+
+Fix payee filter functionality to improve transaction filtering in the application.