[HOLD for payment 2024-04-15] [$500] Task - Mark as complete button shows up on cancelled task report

[m-natarajan]

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: 1.4.47-0
Reproducible in staging?:. yes
Reproducible in production?: yes
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: Applause internal team
Slack conversation:

Action Performed:

1. Go to staging.new.expensify.com
2. Go to chat.
3. Create a task.
4. Click on the task.
5. Click 3-dot menu > Delete > Delete the task.
6. Go to the cancelled task report from LHN.

Expected Result:

Mark as complete button will not show up on cancelled task report.

Actual Result:

Mark as complete button shows up on cancelled task report. Clicking on the button leads to error.
On mweb, Android and iOS app, the button appears and disappears after opening the cancelled task report.

Workaround:

unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6402230_1709602046041.bandicam_2024-03-05_06-02-11-676__3_.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0142a0550498bb0d82
• Upwork Job ID: 1765856337867956224
• Last Price Increase: 2024-03-21
• Automatic offers:
• situchan | Reviewer | 0
• dukenv0307 | Contributor | 0

[melvin-bot]

Triggered auto assignment to @lschurr (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[m-natarajan]

We think that this bug might be related to #vip-vsb
cc @quinthar

[m-natarajan]

@Ischurr 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.

[dukenv0307]

Proposal

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

Mark as complete button shows up on cancelled task report. Clicking on the button leads to error.
On mweb, Android and iOS app, the button appears and disappears after opening the cancelled task report.

What is the root cause of that problem?

When we open the task report, OpenReport API is called and BE returns isDeletedParentAction as null.

It leads to this check being true in HeaderView

App/src/pages/home/HeaderView.js

Line 362 in a79c119

{isTaskReport && !isSmallScreenWidth && ReportUtils.isOpenTaskReport(props.report) && <TaskHeaderActionButton report={props.report} />}

App/src/libs/ReportUtils.ts

Line 671 in a79c119

isTaskReport(report) && !isCanceledTaskReport(report, parentReportAction) && report?.stateNum === CONST.REPORT.STATE_NUM.OPEN && report?.statusNum === CONST.REPORT.STATUS_NUM.OPEN

because we don't pass parentReportAction into isOpenTaskReport task report as we

App/src/pages/home/ReportScreen.js

Line 535 in a79c119

{ReportUtils.isTaskReport(report) && isSmallScreenWidth && ReportUtils.isOpenTaskReport(report, parentReportAction) && (

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

1. We should pass parentReportAction from ReportScreen into HeaderView instead of getting it through getParentReportAction because HeaderView will not re-render if parentReportAction is changed.

App/src/pages/home/HeaderView.js

Line 113 in a79c119

const parentReportAction = ReportActionsUtils.getParentReportAction(props.report);

2. pass props.parentReportAction into isOpenTaskReport here

{isTaskReport && !isSmallScreenWidth && ReportUtils.isOpenTaskReport(props.report, props.parentReportAction) && <TaskHeaderActionButton report={props.report} />} 

App/src/pages/home/HeaderView.js

Line 362 in a79c119

{isTaskReport && !isSmallScreenWidth && ReportUtils.isOpenTaskReport(props.report) && <TaskHeaderActionButton report={props.report} />}

3. We should get all actions of parent report through another withOnyx and then get the parent report action inside the report screen and then we will update the the memo function to only re-render when the current parent report action is changed.

App/src/pages/home/ReportScreen.tsx

Line 627 in ddf9e7a

parentReportAction: {

What alternative solutions did you explore? (Optional)

NA

[lschurr]

Asking in Slack - https://expensify.slack.com/archives/C066HJM2CAZ/p1709658682543139

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~0142a0550498bb0d82