fix: differentiate icons for custom and standard export formats#88157
fix: differentiate icons for custom and standard export formats#88157lakchote merged 11 commits into
Conversation
|
@aimane-chnaif 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] |
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Updates export-related UI to visually distinguish standard export templates from custom templates by using a dedicated “table-pencil” icon for custom templates across search filters, bulk actions, and report export menus.
Changes:
- Added a new
TablePencilSVG asset and wired it into the lazy expensify icon chunk. - Updated export template pickers/menus (search filters, bulk actions, report header) to choose
TablevsTablePencilbased on whether the template is standard. - Updated the “Exported to” search list cell to render the new icon for template-based exports.
Reviewed changes
Copilot reviewed 7 out of 8 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersExportedToPage.tsx | Chooses Table vs TablePencil for export template filter items. |
| src/hooks/useSelectedTransactionsActions.ts | Differentiates icon per export template in selected-transactions export options. |
| src/hooks/useSearchBulkActions.ts | Differentiates icon per export template in bulk export options. |
| src/components/Search/SearchList/ListItem/ExportedIconCell.tsx | Adds rendering for custom-template export icon in the “Exported to” column. |
| src/components/Search/FilterDropdowns/ExportedToSelectPopup.tsx | Chooses Table vs TablePencil in exported-to multi-select popup items. |
| src/components/MoneyReportHeader.tsx | Differentiates icon per export template in report header export menu. |
| src/components/Icon/chunks/expensify-icons.chunk.ts | Registers TablePencil in the expensify icon bundle. |
| assets/images/table-pencil.svg | New icon asset used for custom export templates. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
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.
|
|
Videos are looking good to me 👍 |
|
Are all of those default templates? |
|
We should be updating it everywhere any of these options show up. |
@flaviadefaria we implemented this change in bulk action as well. screen_1776444830931.mp4 |
|
Awesome, thanks for confirming @samranahm! |
|
@samranahm looks like you picked up a conflict here. @aimane-chnaif can you review the PR? |
|
Resolving merge conflict. |
|
@aimane-chnaif 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] |
|
Welp, that didn't work. |
|
We did not find an internal engineer to review this PR, trying to assign a random engineer to #88096 as well as to this PR... Please reach out for help on Slack if no one gets assigned! |
|
🚧 @lakchote has triggered a test Expensify/App build. You can view the workflow run here. |
This comment has been minimized.
This comment has been minimized.
lakchote
left a comment
There was a problem hiding this comment.
@samranahm @trjExpensify there is an issue
Repro steps:
- Export report A with a custom/IS export template.
- Export report B with a standard template, like All Data - Expense Level Export
- Go to Reports search.
- Press Display > Edit columns.
- Select Exported to and save.
- Look at the Exported to column for both reports.
Expected: report A shows the table-pencil icon, report B shows the plain table icon.
Actual result: report B shows the table-pencil icon, report A shows the plain table icon.
Screen.Recording.2026-04-30.at.09.55.26.mov
…-export-template-icon
|
@lakchote Please have another look, the issue is resolved. |
lakchote
left a comment
There was a problem hiding this comment.
Looks good to me. I re-checked the exported-to cell path against the backend export labels, and the latest change now separates standard template labels from custom template labels correctly.
|
🚧 @lakchote has triggered a test Expensify/App build. You can view the workflow run here. |
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
🚀 Deployed to staging by https://github.com/lakchote in version: 9.3.65-0 🚀
Bundle Size Analysis (Sentry): |
|
I reviewed the changes in this PR and the help site articles under No help site changes are required. This PR adds a |
|
@trjExpensify @samranahm @lakchote Could you please clarify how to perform step 1 |
|
Bump on this one @trjExpensify @lakchote @aimane-chnaif |
|
🚀 Deployed to production by https://github.com/mountiny in version: 9.3.65-6 🚀
|
@jponikarchuk Please sign in with above mentioned emails from this comment #85885 (comment) you should get the IS export template. |
|
Sorry, I was OOO. We all good? |

Explanation of Change
Fixed Issues
$ #88096
Tests
Exported to: Valuebutton next to search inputOffline tests
Same as test
QA Steps
Same as test
// TODO: These must be filled out, or the issue title must include "[No QA]."
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
Android.Native.mp4
Android: mWeb Chrome
Android.mWeb.Chrome.mp4
iOS: Native
IOS.Native.mp4
iOS: mWeb Safari
IOS.mWeb.Safari.mp4
MacOS: Chrome / Safari
macOS.Chrome.mp4