[HOLD for payment 2023-10-16] [$500] Approved requests shouldn't have a `delete` option

[JmillsExpensify]

While we've already implemented logic preventing paid requests from being deleted, the same isn't true for approved requests, which we've just added. Accordingly, let's remove the Delete request option from the three dot overflow menu anytime a request has been approved.

Here's mock for clarity. Notice how I've removed the Delete request option.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01bd5a594a7f989566
• Upwork Job ID: 1697326804261687296
• Last Price Increase: 2023-08-31
• Automatic offers:
• cubuspl42 | Reviewer | 26523887
• Pujan92 | Contributor | 26523889

[melvin-bot]

Triggered auto assignment to @NicMendonca (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details.

[jeet-dhandha]

Proposal

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

• Currently we can delete approved requests, which is not ideal.

What is the root cause of that problem?

• We don't have logic preventing the delete option from being displayed.

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

• We can add a isApproved const here and to check if report is approved or not, we can use isReportApproved function from ReportUtils.js file.

App/src/components/MoneyRequestHeader.js

Line 60 in c9c1f47

const isSettled = ReportUtils.isSettled(moneyRequestReport.reportID);

const isApproved = ReportUtils.isReportApproved(moneyRequestReport);

• And use it here to show/hide delete option, like we did for isSettled.

App/src/components/MoneyRequestHeader.js

Lines 81 to 84 in c9c1f47

	<HeaderWithBackButton
	shouldShowAvatarWithDisplay
	shouldShowPinButton={false}
	shouldShowThreeDotsButton={isActionOwner && !isSettled}

shouldShowThreeDotsButton={isActionOwner && !isSettled && !isApproved}

• We will need to update canDeleteReportAction also in ReportUtils. For context menu.

App/src/libs/ReportUtils.js

Line 749 in 7c13734

if (isActionOwner && ReportActionsUtils.isMoneyRequestAction(reportAction) && !isSettled(reportAction.originalMessage.IOUReportID)) {

const report = getReport(reportID);
if (isActionOwner && ReportActionsUtils.isMoneyRequestAction(reportAction) && !isSettled(reportAction.originalMessage.IOUReportID) && !isReportApproved(report)) {

What alternative solutions did you explore? (Optional)

• If we are looking to just remove the Delete Option and retain other options (which we currently don't have any on main branch.)

For Ref of which options are available

App/src/components/MoneyRequestHeader.js

Lines 85 to 91 in c9c1f47

	threeDotsMenuItems={[
	{
	icon: Expensicons.Trashcan,
	text: translate('reportActionContextMenu.deleteAction', {action: parentReportAction}),
	onSelected: () => setIsDeleteModalVisible(true),
	},
	]}

• We can update the above code conditionally.

Updated Code

threeDotsMenuItems={[
    ...(!isApproved
        ? [
                {
                    icon: Expensicons.Trashcan,
                    text: props.translate('reportActionContextMenu.deleteAction', {action: parentReportAction}),
                    onSelected: deleteTransaction,
                },
            ]
        : []),
    ...restOptions,
]}

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01bd5a594a7f989566

[melvin-bot]

Current assignees @JmillsExpensify and @NicMendonca are eligible for the External assigner, not assigning anyone new.