Move Total column after Comment Indicator in expense report view#89757
Move Total column after Comment Indicator in expense report view#89757
Conversation
Swap the default column order so COMMENTS appears before TOTAL in the expense report table. Also ensure TOTAL is appended after COMMENTS in the custom columns flow when not explicitly placed by the user. Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
@MelvinBot Please apply this git diff to update the icon width |
|
@MelvinBot Please update the checklist and open the PR |
Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
Applied the diff — updated COMMENTS column width from |
|
Updated the PR Author Checklist (checked all applicable items for this change) and marked the PR as ready for review. Note: the Tests and QA Steps sections still need to be filled out by the human co-author. |
melvin-bot
Bot
requested review from
trjExpensify
and removed request for
a team and
trjExpensify
|
@cretadn22 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] |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 70f5991d5a
ℹ️ About Codex in GitHub
Codex has been enabled to automatically 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 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| switch (columnName) { | ||
| case CONST.SEARCH.TABLE_COLUMNS.COMMENTS: | ||
| columnWidth = {...getWidthStyle(variables.w36), ...styles.alignItemsCenter}; | ||
| columnWidth = {...getWidthStyle(variables.w20), ...styles.alignItemsCenter}; |
There was a problem hiding this comment.
Reducing the COMMENTS column width to w20 here without updating getTableMinWidth() leaves the layout math inconsistent (src/libs/SearchUIUtils.ts still adds 36px for COMMENTS). In views that gate horizontal scrolling on minTableWidth (e.g., money request report/search tables), this can incorrectly enable horizontal scroll on borderline viewport sizes because the table is overestimated by 16px whenever the comments indicator is shown.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
The review comment is valid. getTableMinWidth() at src/libs/SearchUIUtils.ts:5574 still adds 36px for COMMENTS, but the rendered width is now w20 (20px). This mismatch causes the min-width calculation to overestimate by 16px, which could incorrectly enable horizontal scrolling on borderline viewport sizes.
Should I update line 5574 to minWidth += 20 to match?
|
@MelvinBot Please complete the checklist |
| if (!addedColumns.has(CONST.SEARCH.TABLE_COLUMNS.TOTAL)) { | ||
| result.push(CONST.SEARCH.TABLE_COLUMNS.TOTAL); | ||
| } |
There was a problem hiding this comment.
@MelvinBot This might be outside the scope of the current task
|
The failing checks are not related to code changes in this PR:
All code-related checks (tests, ESLint, typecheck, Prettier, builds, perf-tests, Storybook) are passing. No fix needed. |
|
|
|
|
|
🚧 @shawnborton has triggered a test Expensify/App build. You can view the workflow run here. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
Hmm I still see it after the total: |
|
The only non-checklist failure is the review check, which was cancelled mid-run ( Re-running the |
…path When TOTAL is already in filteredVisibleColumns, COMMENTS was being appended after it. Use splice to insert COMMENTS before TOTAL instead. Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
Fixed — the COMMENTS column was being appended after TOTAL because |
|
@cretadn22 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] |
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
|
Let me know when this is ready for new builds |
| const totalIndex = result.indexOf(CONST.SEARCH.TABLE_COLUMNS.TOTAL); | ||
| if (totalIndex >= 0) { | ||
| result.splice(totalIndex, 0, CONST.SEARCH.TABLE_COLUMNS.COMMENTS); | ||
| } else { | ||
| result.push(CONST.SEARCH.TABLE_COLUMNS.COMMENTS); | ||
| } | ||
| } | ||
|
|
||
| if (!addedColumns.has(CONST.SEARCH.TABLE_COLUMNS.TOTAL)) { |
Reverts the splice insertion of COMMENTS before TOTAL, restoring the original push behavior. Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
Reverted the COMMENTS-before-TOTAL splice logic — restored the original |
|
The failing Failure: Evidence: This PR changes The other failing check ( Recommendation: Re-run the failed job to clear the flaky test. |
| if (!addedColumns.has(CONST.SEARCH.TABLE_COLUMNS.TOTAL)) { | ||
| result.push(CONST.SEARCH.TABLE_COLUMNS.TOTAL); |
There was a problem hiding this comment.
@MelvinBot Don't need to push TOTAL column in all cases
|
The failing Failure: Evidence: This PR only touches The other failing checks ( Recommendation: Re-run the failed |
COMMENTS is now spliced before TOTAL when TOTAL already exists in the result array. The unconditional TOTAL push is removed since TOTAL comes from filteredVisibleColumns. Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
Done — removed the unconditional TOTAL push and kept the splice logic to insert COMMENTS before TOTAL when it's already in the result array. |
|
MelvinBot has made 5 consecutive commits trying to fix CI failures. Automatic CI fix dispatches are now paused for this PR. Next steps: A human should review the recent commits and resolve the conflicting CI errors manually. |
|
@MelvinBot Could you revert all your changes and apply this diff? |
Swap COMMENTS before TOTAL in default column map and reduce COMMENTS column width from w36 to w20. Co-authored-by: cretadn22 <cretadn22@users.noreply.github.com>
|
Reverted all previous changes and applied the requested diff. The PR now only contains the two targeted changes:
|
|
@MelvinBot Please close this PR |
|
Closed as requested. |
3 participants
Explanation of Change
Move the Total column so it appears after the Comment Indicator in the expense report table view. This swaps the default column order (
COMMENTSnow comes beforeTOTAL) and ensures the custom columns flow also appendsTOTALafterCOMMENTSwhen a user hasn't explicitly placed it.Fixed Issues
$ #88967
Tests
// TODO: The human co-author must fill out the tests you ran before marking this PR as "ready for review"
// Please describe what tests you performed that validates your changed worked.
Offline tests
N/A — column ordering is static and does not depend on network state.
QA Steps
// TODO: The human co-author must fill out the QA tests you ran before marking this PR as "ready for review".
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: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari