Skip to content

[Payment due @truph01] Add natural language filter entry point to Spend page (re-PR with deploy blocker fixes) - #102237

Open
marcaaron wants to merge 23 commits into
mainfrom
marcaaron-nl-filters-ui
Open

marcaaron wants to merge 23 commits into
mainfrom
marcaaron-nl-filters-ui

Conversation

@marcaaron

@marcaaron marcaaron commented Sep 25, 2026 •

Copy link
Copy Markdown
Contributor

Explanation of Change

Re-PR of the NL filters feature that was reverted from staging after QA found 9 deploy blockers. This addresses the 4 App-side blockers; 5 backend parsing fixes land in a companion Web-Expensify PR (https://github.com/Expensify/Web-Expensify/pull/56459).

Changes from the original reverted version:

Fixed Issues

$ https://github.com/Expensify/Expensify/issues/647828
$ #102200
$ https://github.com//Expensify/App/issues/102174

Tests

  1. Sign in with an account on the nlFilters beta.
  2. Navigate to the Spend page and open Advanced Filters.
  3. Verify "Describe your search" appears at the top of the filter list.
  4. Click "Describe your search" and verify the Apply button is disabled while the input is empty.
  5. Type any text and verify Apply becomes enabled.
  6. On web, press Enter and verify the filter submits with no newline added to the input.
  7. On mobile, rotate to landscape and verify the input area scrolls and Apply is reachable.
  8. Sign in with an account NOT on the nlFilters beta.
  9. Open Advanced Filters and verify "Describe your search" does not appear.
  • Verify that no errors appear in the JS console

Offline tests

No offline behavior to test -- the NL filter requires a network call to parse the query; that already shows a loading state and the button is disabled while loading.

QA Steps

Scenario 1: Feature hidden for non-beta users

  1. Sign in with an account that does not have the nlFilters beta enabled.
  2. Navigate to Spend.
  3. Open Advanced Filters.
  4. Verify "Describe your search" does not appear.

Scenario 2: Apply button disabled when input is empty

  1. Sign in with an account on the nlFilters beta.
  2. Open "Describe your search".
  3. Verify the Apply button is disabled.
  4. Type text.
  5. Verify Apply is enabled.
  6. Clear all text.
  7. Verify Apply is disabled again.

Scenario 3: Enter key submits on web

  1. Open "Describe your search" in a web browser.
  2. Type "card spend last month".
  3. Press Enter.
  4. Verify results appear with no newline added to the input.

Scenario 4: Landscape scroll on mobile

  1. Rotate device to landscape.
  2. Open "Describe your search".
  3. Verify the input and description text are scrollable and the Apply button is visible and tappable.
  • Verify that no errors appear in the JS console

PR Author Checklist

  • I linked the correct issue in the ### Fixed Issues section above
  • I wrote clear testing steps that cover the changes made in this PR
    • I added steps for local testing in the Tests section
    • I added steps for the expected offline behavior in the Offline steps section
    • I added steps for Staging and/or Production testing in the QA steps section
    • I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
    • I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
    • I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).
  • I included screenshots or videos for tests on all platforms
  • I ran the tests on all platforms & verified they passed on:
    • Android: Native
    • Android: mWeb Chrome
    • iOS: Native
    • iOS: mWeb Safari
    • MacOS: Chrome / Safari
  • I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
  • I followed proper code patterns (see Reviewing the code)
    • I verified that comments were added to code that is not self explanatory
    • I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
    • I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
  • If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
  • I followed the guidelines as stated in the Review Guidelines
  • I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
  • If a new CSS style is added I verified that:
    • A similar style doesn't already exist
    • The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))
  • If new assets were added or existing ones were modified, I verified that:
    • The assets are optimized and compressed (for SVG files, run npm run compress-svg)
    • The assets load correctly across all supported platforms.
  • If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
  • If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
  • If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
  • If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
  • If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:
    • I verified that all the inputs inside a form are aligned with each other.
    • I added Design label and/or tagged @Expensify/design so the design team can review the changes.
  • I added unit tests for any new feature or bug fix in this PR to help automatically prevent regressions in this user flow.
  • If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.

Screenshots/Videos

Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari

Scenario 1 — non-beta: no Describe your search

Scenario 1 — beta enabled: Describe your search visible

Scenario 2a — Apply disabled when input empty

Scenario 2b — Apply enabled after typing

Scenario 3 — Enter submits, card+date filters applied

Scenario 4 — Landscape: input and Apply visible and accessible

- Add CONST.BETAS.NL_FILTERS and gate the "Describe your search" entry point
  in the popup and full-screen page so only opted-in users see the feature
- Disable the Apply button when the input is empty (#102200)
- Call e.preventDefault() on Enter to stop newline insertion on web (#102174)
- Wrap input section in ScrollView so the page scrolls in landscape (#102186)
Wrap new URL() in a try-catch so a malformed searchURL shows a proper
error message instead of propagating to the outer catch handler and
showing the generic "Something went wrong" toast.
# Conflicts:
#	src/components/Search/FilterComponents/AdvancedFilters/SearchNLFilterContent.tsx
#	src/components/Search/FilterDropdowns/SearchAdvancedFiltersPopup/index.tsx
#	src/pages/Search/SearchNLFilterPage.tsx
@marcaaron marcaaron self-assigned this Sep 25, 2026
@codecov

codecov Bot commented Sep 25, 2026 •

Copy link
Copy Markdown

Codecov Report

❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.

Files with missing lines Coverage Δ
src/CONST/index.ts 95.90% <ø> (ø)
src/ROUTES.ts 32.67% <ø> (ø)
src/SCREENS.ts 100.00% <ø> (ø)
src/libs/API/types.ts 100.00% <ø> (ø)
src/libs/Navigation/linkingConfig/config.ts 62.50% <ø> (ø)
...h/SearchPageHeader/SearchAdvancedFiltersButton.tsx 68.00% <0.00%> (ø)
...gation/AppNavigator/ModalStackNavigators/index.tsx 7.48% <0.00%> (-0.01%) ⬇️
src/libs/actions/Search.ts 66.89% <0.00%> (-0.38%) ⬇️
...hAdvancedFiltersPage/SearchAdvancedFiltersBase.tsx 0.00% <0.00%> (ø)
...lterDropdowns/SearchAdvancedFiltersPopup/index.tsx 86.48% <68.96%> (-11.67%) ⬇️
... and 2 more
... and 7 files with indirect coverage changes

…d main

The merge with main (which had the NL filters revert) removed:
- parseExpenseFilters function and PARSE_EXPENSE_FILTERS command from API types
- ParseExpenseFiltersParams type
- search.filters.describeSearch translation keys
- Imports, hook calls, and helpers in SearchAdvancedFiltersPopup
- closeOverlay prop threading through SearchAdvancedFiltersButton

Re-adds all of the above so typecheck passes.
@OSBotify

This comment has been minimized.

Adds SEARCH_NL_FILTER route and NL_FILTER_RHP screen, registers the
page in the modal navigator, adds linking config, updates nav types,
and adds a beta-gated "Describe your search" button to the mobile
advanced filters page.
@marcaaron
marcaaron requested a review from truph01 September 25, 2026 07:19
@marcaaron
marcaaron marked this pull request as ready for review September 25, 2026 07:19
@marcaaron
marcaaron requested review from a team as code owners September 25, 2026 07:19
@melvin-bot
melvin-bot Bot requested review from JmillsExpensify and marufsharifi and removed request for a team September 25, 2026 07:20
@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Sep 25, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-09-25T07:37:16.655387Z 0e79064 Draft marked ready
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@marcaaron marcaaron changed the title Add natural language filter entry point to Spend page (re-PR with deploy blocker fixes) [HOLD Web-Expensify/pull/56459] Add natural language filter entry point to Spend page (re-PR with deploy blocker fixes) Sep 25, 2026
@marcaaron
marcaaron removed the request for review from marufsharifi September 25, 2026 07:20
@Expensify Expensify deleted a comment from melvin-bot Bot Sep 25, 2026
Comment thread src/components/Search/FilterDropdowns/SearchAdvancedFiltersPopup/index.tsx Outdated

@JmillsExpensify JmillsExpensify left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 0e790645b6

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread src/libs/actions/Search.ts Outdated
@truph01

truph01 commented Oct 12, 2026

Copy link
Copy Markdown
Contributor

I am unable to press on "describe your search" row in Android:

Screen.Recording.2026-10-12.at.16.12.45.mov

@JmillsExpensify

Copy link
Copy Markdown
Contributor

Let's try to increase the urgency on addressing these reviews if possible. We gotta get to this one to the finish line.

@marcaaron

Copy link
Copy Markdown
Contributor Author

@truph01 Can you provide more details? Which device are you using? I couldn't reproduce this problem last time I tested.

@marcaaron

Copy link
Copy Markdown
Contributor Author
2026-10-16_09-25-50.mp4

row highlighting issue still there but that seems minor...

Match FilterItem pattern: use function-style style prop for pressed background,
render-prop children for ArrowRight icon fill, and remove role={CONST.ROLE.BUTTON}
which is absent from the filter rows below it.
@github-actions

Copy link
Copy Markdown
Contributor

🚧 marcaaron has triggered a test Expensify/App build. You can view the workflow run here.

@github-actions

This comment has been minimized.

@github-actions

Copy link
Copy Markdown
Contributor

🚧 marcaaron has triggered a test Expensify/App build. You can view the workflow run here.

@github-actions

This comment has been minimized.

1 similar comment
@github-actions

This comment has been minimized.

Copy link
Copy Markdown
Contributor

Agree that's minor. TBH, can we address these in a follow-up potentially, specifically that ones that we can reproduce. I don't think we should hold the PR up on those.

@OSBotify

Copy link
Copy Markdown
Contributor

🦜 Polyglot Parrot! 🦜

Squawk! Looks like you added some shiny new English strings. Allow me to parrot them back to you in other tongues:

View the translation diff
diff --git a/src/languages/de.ts b/src/languages/de.ts
index c0740392..a564d132 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -10193,10 +10193,10 @@ Fügen Sie weitere Ausgabelimits hinzu, um den Cashflow Ihres Unternehmens zu sc
                 customDay: 'Benutzerdefinierter Tag',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Beschreiben Sie Ihre Suche',
+                description: 'Beschreiben Sie in einfachem Englisch, welche Ausgaben Sie sehen möchten, und wir wenden automatisch die richtigen Filter an.',
+                inputLabel: 'Beschreiben Sie Ihre Suche',
+                buttonText: 'Anwenden',
             },
             status: 'Status',
             keyword: 'Schlüsselwort',
diff --git a/src/languages/el.ts b/src/languages/el.ts
index a13bd7a9..0a4a0bdf 100644
--- a/src/languages/el.ts
+++ b/src/languages/el.ts
@@ -10395,10 +10395,10 @@ ${reportName}`,
                 customDay: 'Προσαρμοσμένη ημέρα',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Περιγράψτε την αναζήτησή σας',
+                description: 'Περιγράψτε στα απλά αγγλικά ποιες δαπάνες θέλετε να δείτε και θα εφαρμόσουμε αυτόματα τα κατάλληλα φίλτρα.',
+                inputLabel: 'Περιγράψτε την αναζήτησή σας',
+                buttonText: 'Εφαρμογή',
             },
             status: 'Κατάσταση',
             keyword: 'Λέξη-κλειδί',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index d167b36b..3836d73c 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -10040,10 +10040,10 @@ ${reportName}`,
                 customDay: 'Día personalizado',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Describe tu búsqueda',
+                description: 'Describe en un inglés sencillo qué gastos quieres ver y aplicaremos los filtros adecuados automáticamente.',
+                inputLabel: 'Describe tu búsqueda',
+                buttonText: 'Aplicar',
             },
             status: 'Estado',
             keyword: 'Palabra clave',
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index fb8fc13b..c4eb738c 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -10219,10 +10219,10 @@ Ajoutez davantage de règles de dépenses pour protéger la trésorerie de l’e
                 customDay: 'Jour personnalisé',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Décrivez votre recherche',
+                description: 'Décrivez en anglais simple les dépenses que vous souhaitez voir et nous appliquerons automatiquement les bons filtres.',
+                inputLabel: 'Décrivez votre recherche',
+                buttonText: 'Appliquer',
             },
             status: 'Statut',
             keyword: 'Mot-clé',
diff --git a/src/languages/it.ts b/src/languages/it.ts
index b0da7d3e..04f9b901 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -10145,10 +10145,10 @@ Aggiungi altre regole di spesa per proteggere il flusso di cassa aziendale.`,
                 customDay: 'Giorno personalizzato',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Descrivi la tua ricerca',
+                description: 'Descrivi in inglese semplice quali spese vuoi vedere e applicheremo automaticamente i filtri giusti.',
+                inputLabel: 'Descrivi la tua ricerca',
+                buttonText: 'Applica',
             },
             status: 'Stato',
             keyword: 'Parola chiave',
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 515d590f..7106048d 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -10002,10 +10002,10 @@ ${reportName}`,
                 customDay: 'カスタム日',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: '検索内容を入力してください',
+                description: '表示したい経費をわかりやすい英語で入力してください。適切なフィルターを自動的に適用します。',
+                inputLabel: '検索内容を入力してください',
+                buttonText: '適用',
             },
             status: 'ステータス',
             keyword: 'キーワード',
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index 2d576e3a..bf3d38bc 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -10111,10 +10111,10 @@ er bestedingsregels toe om de kasstroom van het bedrijf te beschermen.`,
                 customDay: 'Aangepaste dag',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Beschrijf je zoekopdracht',
+                description: 'Beschrijf in gewone taal welke uitgaven je wilt zien, dan passen wij automatisch de juiste filters toe.',
+                inputLabel: 'Beschrijf je zoekopdracht',
+                buttonText: 'Toepassen',
             },
             status: 'Status',
             keyword: 'Trefwoord',
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index 059924fd..99753c13 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -10128,10 +10128,10 @@ Dodaj więcej zasad wydatków, żeby chronić płynność finansową firmy.`,
                 customDay: 'Niestandardowy dzień',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Opisz swoje wyszukiwanie',
+                description: 'Opisz po prostu po angielsku, jakie wydatki chcesz zobaczyć, a my automatycznie zastosujemy odpowiednie filtry.',
+                inputLabel: 'Opisz swoje wyszukiwanie',
+                buttonText: 'Zastosuj',
             },
             status: 'Status',
             keyword: 'Słowo kluczowe',
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index bdcf0a35..6fa12a21 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -10109,10 +10109,10 @@ Adicione mais regras de gasto para proteger o fluxo de caixa da empresa.`,
                 customDay: 'Dia personalizado',
             },
             describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
+                title: 'Descreva sua pesquisa',
+                description: 'Descreva em inglês simples quais despesas você quer ver e nós aplicaremos os filtros certos automaticamente.',
+                inputLabel: 'Descreva sua pesquisa',
+                buttonText: 'Aplicar',
             },
             status: 'Status',
             keyword: 'Palavra-chave',
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 1ce2adfc..e259ce60 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -9732,12 +9732,7 @@ ${reportName}`,
                 },
                 customDay: '自定义日期',
             },
-            describeSearch: {
-                title: 'Describe your search',
-                description: "Describe what expenses you want to see in plain English, and we'll apply the right filters automatically.",
-                inputLabel: 'Describe your search',
-                buttonText: 'Apply',
-            },
+            describeSearch: {title: '描述你的搜索', description: '用简单的英文描述你想查看的报销记录,我们会自动为你应用合适的筛选条件。', inputLabel: '描述你的搜索', buttonText: '应用'},
             status: '状态',
             keyword: '关键词',
             keywords: '关键词',

Note

You can apply these changes to your branch by copying the patch to your clipboard, then running pbpaste | git apply 😉

View workflow run

@github-actions

Copy link
Copy Markdown
Contributor

🚧 marcaaron has triggered a test Expensify/App build. You can view the workflow run here.

@github-actions

Copy link
Copy Markdown
Contributor

@marcaaron

Copy link
Copy Markdown
Contributor Author
2026-10-16_11-24-06.mp4

@melvin-bot
melvin-bot Bot requested a review from neil-marcellini October 19, 2026 09:21
@melvin-bot

melvin-bot Bot commented Oct 19, 2026

Copy link
Copy Markdown

@neil-marcellini Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]

@melvin-bot melvin-bot Bot changed the title Add natural language filter entry point to Spend page (re-PR with deploy blocker fixes) [Payment due @truph01] Add natural language filter entry point to Spend page (re-PR with deploy blocker fixes) Oct 19, 2026
@melvin-bot

melvin-bot Bot commented Oct 19, 2026

Copy link
Copy Markdown

🎯 @truph01, thanks for reviewing and testing this PR! 🎉

A payment issue will be created for your review once this PR is deployed to production.
E/E issue linked to the PR - https://www.github.com/Expensify/Expensify/issues/647828.

If payment is not needed (e.g., regression PR review fix etc), react with 👎 to this comment to prevent the payment issue from being created.

@neil-marcellini

Copy link
Copy Markdown
Contributor

Re-assigning to @carlosmiceli because he reviewed the last PR and has context.

@neil-marcellini
neil-marcellini requested review from carlosmiceli and removed request for neil-marcellini October 19, 2026 18:20
@JmillsExpensify

Copy link
Copy Markdown
Contributor

@carlosmiceli would love your review as soon as you're able. We're trying to get round two of this PR in the hands of customers.

@carlosmiceli carlosmiceli left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we still need to implement the translations, no?

@truph01

truph01 commented Oct 20, 2026

Copy link
Copy Markdown
Contributor

Reviewer Checklist

  • I have verified the author checklist is complete (all boxes are checked off).
  • I verified the correct issue is linked in the ### Fixed Issues section above
  • I verified testing steps are clear and they cover the changes made in this PR
    • I verified the steps for local testing are in the Tests section
    • I verified the steps for Staging and/or Production testing are in the QA steps section
    • I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
    • I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
  • I checked that screenshots or videos are included for tests on all platforms
  • I included screenshots or videos for tests on all platforms
  • I verified that the composer does not automatically focus or open the keyboard on mobile unless explicitly intended. This includes checking that returning the app from the background does not unexpectedly open the keyboard.
  • I verified tests pass on all platforms & I tested again on:
    • Android: HybridApp
    • Android: mWeb Chrome
    • iOS: HybridApp
    • iOS: mWeb Safari
    • MacOS: Chrome / Safari
  • If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
  • I verified proper code patterns were followed (see Reviewing the code)
    • I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick).
    • I verified that comments were added to code that is not self explanatory
    • I verified that any new or modified comments were clear, correct English, and explained """"why"""" the code was doing something instead of only explaining """"what"""" the code was doing.
    • I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
  • If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
  • I verified that this PR follows the guidelines as stated in the Review Guidelines
  • I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar have been tested & I retested again)
  • If a new component is created I verified that:
    • A similar component doesn't exist in the codebase
    • All props are defined accurately and each prop has a /** comment above it */
    • The file is named correctly
    • The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
    • The only data being stored in the state is data necessary for rendering and nothing else
    • For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
    • Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
    • All JSX used for rendering exists in the render method
    • The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions
  • If any new file was added I verified that:
    • The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory
  • If a new CSS style is added I verified that:
    • A similar style doesn't already exist
    • The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG)
  • If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
  • If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
  • If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
  • If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
  • If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:
    • I verified that all the inputs inside a form are aligned with each other.
    • I added Design label and/or tagged @Expensify/design so the design team can review the changes.
  • For any bug fix or new feature in this PR, I verified that sufficient unit tests are included to prevent regressions in this flow.
  • If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
  • I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

Screenshots/Videos

Android: HybridApp
Screen.Recording.2026-10-20.at.08.45.33.mov
Android: mWeb Chrome
Screen.Recording.2026-10-20.at.08.47.43.mov
iOS: HybridApp
Screen.Recording.2026-10-20.at.08.37.25.mov
iOS: mWeb Safari
Screen.Recording.2026-10-20.at.08.39.29.mov
MacOS: Chrome / Safari
Screen.Recording.2026-10-20.at.08.20.33.mov

@melvin-bot
melvin-bot Bot requested a review from puneetlath October 20, 2026 01:49
@melvin-bot

melvin-bot Bot commented Oct 20, 2026

Copy link
Copy Markdown

@puneetlath Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants