Distance - Waypoint field is not focused after navigating back from RHN

IuliiaHerets commented 2 hours ago

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: v9.0.41-2 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): gibethlehem@gmail.com Issue reported by: Applause Internal Team

Action Performed:

Go to any chat
Click on the Plus sign > Submit expense > Distance
Go to Start address page
Press on cmd/ctrl + J to open "Keyboard Shortcuts" Page
Navigate back

Expected Result:

Waypoint field is focused

Actual Result:

Waypoint field is not focused after returning from "Keyboard Shortcuts" Page

Workaround:

Unknown

Platforms:

[ ] Android: Native
[ ] Android: mWeb Chrome
[ ] iOS: Native
[ ] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

Screenshots/Videos

https://github.com/user-attachments/assets/20970849-f494-4fea-b2f6-8a1600de647b

View all open jobs on GitHub

melvin-bot[bot] commented 2 hours ago

Triggered auto assignment to @slafortune (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.

IuliiaHerets commented 2 hours ago

@slafortune FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

daledah commented 2 hours ago

Edited by proposal-police: This proposal was edited at 2024-10-01 09:20:21 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

Waypoint field is not focused after returning from "Keyboard Shortcuts" Page

What is the root cause of that problem?

we don't have the logic to re-focus when users go back to that page

The logic here

https://github.com/Expensify/App/blob/76c5c81542e598c147f57cf149122f4e124dfe10/src/pages/iou/request/step/IOURequestStepWaypoint.tsx#L165

just run when the page is mount, if users open "Keyboard Shortcuts" Page, it's still there that why when they go back, this function is not trigger.

What changes do you think we should make in order to solve the problem?

In IOURequestStepWaypoint

use useAutoFocusInput like what we did in other pages

    const {inputCallbackRef} = useAutoFocusInput();

...

<InputWrapperWithRef
                            InputComponent={AddressSearch}
...
                            ref={inputCallbackRef}

and remove onEntryTransitionEnd={() => textInput.current?.focus()}

What alternative solutions did you explore? (Optional)

Check other places that has same issue

Result

https://github.com/user-attachments/assets/4925c397-f7db-4485-815a-51ee7caaada2

Expensify / App