Repository navigation
[HOLD for payment 2025-02-05] Udpate the padding of the search router results to the edge of the screen #55775
Description
Problem
Right now, the Search results in the router have more padding than the LHN chats, which is mainly noticeable on phone as there is less space for the search results. This does not look very good.
Solution
Let's explore, but I would suggest we update the Search router design so the padding of the search results is identical to the LHN chats.
Activity
melvin-bot commentedon Jan 27, 2025
Triggered auto assignment to @sakluger (
Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.melvin-bot commentedon Jan 27, 2025
Triggered auto assignment to @shawnborton (
Design), see these Stack Overflow questions for more details.mountiny commentedon Jan 27, 2025
@shawnborton Would you be able to chime on this one and maybe provide the exact padding we would like in the search results too? Thanks!
nkdengineer commentedon Jan 27, 2025
Proposal
Please re-state the problem that we are trying to solve in this issue.
Udpate the padding of the search router results to the edge of the screen
What is the root cause of that problem?
In small screen, we are setting the padding of the LHN to 20px
and in search results it's 32px
What changes do you think we should make in order to solve the problem?
We should make it has the same padding by remove
shouldUseNarrowLayouthereApp/src/components/Search/SearchRouter/SearchRouterList.tsx
Line 482 in b59f23b
Some minor style can be discussed in PR phase
What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?
None
What alternative solutions did you explore? (Optional)
OR we can update the padding of the LHN to 32px
Result
Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.
shawnborton commentedon Jan 27, 2025
I think a simple approach would be to just change the paddingHorizontal from 20px to 12px on the container that wraps the results on mobile. That should make them look identical to the LHN rows:
Thoughts @Expensify/design?
Also just to confirm @mountiny - we're cool with how these results currently look like on desktop, right?
dannymcclain commentedon Jan 27, 2025
No real thoughts from me. The simplest way to accomplish them looking the same works for me!
sakluger commentedon Jan 27, 2025
It sounds like this will be a very simple change. @mountiny do you mind setting the price once we settle on the padding we'd like?
mountiny commentedon Jan 27, 2025
Yeah desktop/ web looks fine, its just the difference that is noticeable in mobile when the search page open over the LHN.
mountiny commentedon Jan 27, 2025
sounds good, I am happy with simple change
dubielzyk-expensify commentedon Jan 28, 2025
Chiming in late, but looks good to me 👍
[-]Udpate the padding of the search router results to the edge of the screen[/-][+][HOLD for payment 2025-02-05] Udpate the padding of the search router results to the edge of the screen[/+]melvin-bot commentedon Jan 29, 2025
Reviewinglabel has been removed, please complete the "BugZero Checklist".melvin-bot commentedon Jan 29, 2025
The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.90-6 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:
If no regressions arise, payment will be issued on 2025-02-05. 🎊
melvin-bot commentedon Jan 29, 2025
@mountiny @sakluger @mountiny The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]
mountiny commentedon Jan 29, 2025
No regression testing required, no payment either so I think we can close thanks!