Invoices - App opens workspace description settings when clicking on invoice description text

IuliiaHerets commented 2 days 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: 9.0.57-0 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): applausetester+kh25100005@applause.expensifail.com Issue reported by: Applause Internal Team

Action Performed:

Go to staging.new.expensify.com
Go to FAB > Send invoice.
Send an invoice to anyone.
Go to invoice chat.
Click on the invoice chat header.
Click Room description.
Enter a description and save it.
Go back to invoice chat.
Click on the room description text under "Say hello!".

Expected Result:

App will open invoice room description settings.

Actual Result:

App opens workspace description settings when clicking on the invoice description text.

This issue only happens in invoice room.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

https://github.com/user-attachments/assets/c12026ff-68a1-461c-a2c9-dd54620a7dc1

View all open jobs on GitHub

melvin-bot[bot] commented 2 days ago

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

nyomanjyotisa commented 2 days ago

Edited by proposal-police: This proposal was edited at 2024-11-04 18:00:25 UTC.

Proposal

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

App opens workspace description settings when clicking on invoice description text

What is the root cause of that problem?

We navigate to WORKSPACE_PROFILE_DESCRIPTION here https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L126-L129

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

Change to the following


                                const activeRoute = Navigation.getReportRHPActiveRoute();
                                if (ReportUtils.canEditReportDescription(report, policy)) {
                                    Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(report?.reportID ?? '-1', activeRoute));
                                    return;
                                }
                                Navigation.navigate(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(report?.reportID ?? '-1', activeRoute));

What alternative solutions did you explore? (Optional)

daledah commented 2 days ago

Proposal

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

App opens workspace description settings when clicking on the invoice description text.

What is the root cause of that problem?

When we click to this description, we'll navigate to workspace description here

https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L129

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

We should navigate to the report description when it is Invoice room

ReportUtils.isInvoiceRoom(report) ? Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(report?.reportID ?? '-1')) :  Navigation.navigate(ROUTES.WORKSPACE_PROFILE_DESCRIPTION.getRoute(policy?.id ?? '-1'));

What alternative solutions did you explore? (Optional)

NA

Nodebrute commented 2 days ago

Proposal

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

App opens workspace description settings when clicking on invoice description text

What is the root cause of that problem?

Here we are navigating to workspace profile description page instead of report description page https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L129

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

We don't need the canEditPolicyDescription as we are not navigating to policy description page anymore https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L126-L128

and instead of navigating to policy description page here, let's change this to

                                const activeRoute = Navigation.getReportRHPActiveRoute();
                                Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(report?.reportID ?? '-1', activeRoute));

[!NOTE]
We don’t need the canEditReportDescription check here since it’s already handled in RoomDescriptionPage.tsx, where users see a different view if they can’t edit the description(not the policy admin). Removing this check allows users to click on the description and navigate to the invoice room description, ensuring consistency with the behavior when accessing the room description from the header.

https://github.com/user-attachments/assets/6b6232cc-d1f4-4f08-84b9-7620c21e3b27

We should also remove these styles canEditPolicyDescription ? styles.cursorPointer : styles.cursorText

https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L131

What alternative solutions did you explore? (Optional)

If we want to prevent users from navigating to the description page when they can't edit it, we can implement the following solution:

Let's add a new check, we use the same check on RoomDescriptionPage.tsx

 const canEdit = ReportUtils.canEditReportDescription(report, policy);

then we can change these canEditPolicyDescription to canEdit https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L131 https://github.com/Expensify/App/blob/fcb4a5b1c3270725478d03e069be3b888d6d9004/src/components/ReportWelcomeText.tsx#L126

and at last let's change this link

 const activeRoute = Navigation.getReportRHPActiveRoute();
      Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(report?.reportID ?? '-1', activeRoute));

With this solution, users who cannot edit the report description will see the text cursor when hovering over it, indicating it's not editable.

Expensify / App