[HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline #43560

m-natarajan · 2024-06-12T12:52:18Z

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

Issue found when validating #43020
Version Number: 1.4.82-0
Reproducible in staging?: y
Reproducible in production?: y
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:

Go to staging.new.expensify.com
Go offline.
Go to Self DM.
Track an expense.
Go to transaction thread.
Delete the expense.
Back in 1:1 DM, click on any option in actionable whisper.

Expected Result:

The actionable whisper should not be interactable when the expense is deleted offline.

Actual Result:

The actionable whisper is interactable when the expense is deleted offline and the options (except Nothing for now) lead to not here page.

Workaround:

unknown

Platforms:

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

Screenshots/Videos

Bug6510127_1718153439897.20240612_084634.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~0102bf6b299104a911
Upwork Job ID: 1801628978700613798
Last Price Increase: 2024-06-14
Automatic offers:

rojiphil | Reviewer | 102784394
truph01 | Contributor | 102784396

Issue Owner

Current Issue Owner: @CortneyOfstad

melvin-bot · 2024-06-12T12:52:28Z

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

m-natarajan · 2024-06-12T12:52:58Z

@CortneyOfstad 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

m-natarajan · 2024-06-12T12:53:05Z

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

Krishna2323 · 2024-06-12T14:56:07Z

Proposal

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

Actionable whisper - Whisper options are interactable when the expense is deleted offline

What is the root cause of that problem?

We don't have any logic to disable the buttons when the transaction is deleted.

App/src/pages/home/report/ReportActionItem.tsx

Lines 401 to 417 in 79e619a

    
           const actionableItemButtons: ActionableItem[] = useMemo(() => { 
        
               if (!isActionableWhisper && (!ReportActionsUtils.isActionableJoinRequest(action) || action.originalMessage.choice !== ('' as JoinWorkspaceResolution))) { 
        
                   return []; 
        
               } 
        
               if (ReportActionsUtils.isActionableTrackExpense(action)) { 
        
                   const transactionID = action?.originalMessage?.transactionID; 
        
                   return [ 
        
                       { 
        
                           text: 'actionableMentionTrackExpense.submit', 
        
                           key: `${action.reportActionID}-actionableMentionTrackExpense-submit`, 
        
                           onPress: () => { 
        
                               ReportUtils.createDraftTransactionAndNavigateToParticipantSelector(transactionID, report.reportID, CONST.IOU.ACTION.SUBMIT, action.reportActionID); 
        
                           }, 
        
                           isMediumSized: true, 
        
                       }, 
        
                       {

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

We should get the transaction using transactionID and if the transaction doesn't exist, we will disable the buttons. In order to make this work we need to follow few steps.

Get all transactions using useOnyx in ReportActionItem.

const [transactions] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION);

Get the transaction details using the transactionID.

const transactionID = action?.originalMessage?.transactionID;
const transaction = transactions?.[`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`] ?? null;

App/src/pages/home/report/ReportActionItem.tsx

Lines 401 to 410 in 79e619a

    
           const actionableItemButtons: ActionableItem[] = useMemo(() => { 
        
               if (!isActionableWhisper && (!ReportActionsUtils.isActionableJoinRequest(action) || action.originalMessage.choice !== ('' as JoinWorkspaceResolution))) { 
        
                   return []; 
        
               } 
        
               if (ReportActionsUtils.isActionableTrackExpense(action)) { 
        
                   const transactionID = action?.originalMessage?.transactionID; 
        
                   return [ 
        
                       { 
        
                           text: 'actionableMentionTrackExpense.submit',

3. Add isDisabled property in the objects in actionableItemButtons array.

{
    text: 'actionableMentionTrackExpense.submit',
    key: `${action.reportActionID}-actionableMentionTrackExpense-submit`,
    onPress: () => {
        ReportUtils.createDraftTransactionAndNavigateToParticipantSelector(transactionID, report.reportID, CONST.IOU.ACTION.SUBMIT, action.reportActionID);
    },
    isMediumSized: true,
    isDisabled: !transactions,
},

Update ActionableItemButtton to pass the isDisabled prop.

App/src/components/ReportActionItem/ActionableItemButtons.tsx

Lines 28 to 36 in 79e619a

    
               <Button 
        
                   key={item.key} 
        
                   onPress={item.onPress} 
        
                   text={translate(item.text)} 
        
                   small={!item.isMediumSized} 
        
                   medium={item.isMediumSized} 
        
                   success={item.isPrimary} 
        
               /> 
        
           ))}

<Button
    key={item.key}
    onPress={item.onPress}
    text={translate(item.text)}
    small={!item.isMediumSized}
    medium={item.isMediumSized}
    success={item.isPrimary}
    isDisabled={item.isDisabled}
/>

Optional: We can wrap the Whisper message with OfflineWithFeedback.

App/src/pages/home/report/ReportActionItem.tsx

Line 767 in 79e619a

<ReportActionItemSingle

<OfflineWithFeedback pendingAction={ReportActionsUtils.isActionableTrackExpense(action) && !transaction && 'delete'}>

Note: We also need to update the type files.

What alternative solutions did you explore? (Optional)

We can also get the action transaction using the withOnyx HOC.
Instead of making the buttons disabled we can hide the buttons by returning empty array if transaction is falsy value.

Result

Monosnap.screencast.2024-06-12.21-08-45.mp4

melvin-bot · 2024-06-14T14:53:18Z

Job added to Upwork: https://www.upwork.com/jobs/~0102bf6b299104a911

melvin-bot · 2024-06-14T14:53:24Z

Triggered auto assignment to Contributor-plus team member for initial proposal review - @rojiphil (External)

truph01 · 2024-06-15T09:14:42Z

Proposal

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

The actionable whisper is interactable when the expense is deleted offline and the options (except Nothing for now) lead to not here page.

What is the root cause of that problem?

When online, after delete track expense, API DeleteMoneyRequest return the OnyxData:

{
    "html": "What would you like to do with this expense?",
    "resolution": "nothing",
}

With this, the whisper options are not displayed because we have a logic:

App/src/pages/home/report/ReportActionItem.tsx

Lines 930 to 933 in 75c104b

    
           // If action is actionable whisper and resolved by user, then we don't want to render anything 
        
           if (isActionableWhisper && (action.originalMessage.resolution ?? null)) { 
        
               return null; 
        
           }

It works as expected in online, but in offline, because when deleting a track expense, we do not set the optimistic data "resolution": "nothing" to the action whisper, that leads to the current behavior, where the whisper options are still displayed.

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

As previously mentioned, when deleting a tracked expense, Backend (BE) configures the whisper action to "resolution": "nothing". Similarly, selecting the 'Nothing for now' option from the whisper action buttons also results in BE setting "resolution": "nothing". Therefore, we infer that deleting a tracked expense should exhibit the same behavior as choosing 'Nothing for now' with the whisper action. Consequently, the expected outcome for this issue should be that 'The whisper action is not displayed'. To verify this behavior, you can test by selecting the 'Nothing for now' option in offline mode.
In general, we need to optimistically set the "resolution": "nothing" to the whisper action when deleting expense. And restore that data in case the API is failed.

To do it, in this logic:

App/src/libs/actions/IOU.ts

Line 5557 in 75c104b

    
           const {parameters, optimisticData, successData, failureData, shouldDeleteTransactionThread} = getDeleteTrackExpenseInformation(chatReportID, transactionID, reportAction);

we can call getDeleteTrackExpenseInformation with actionableWhisperReportActionID param is:

const chatReportActions = allReportActions?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${chatReportID}`] ?? {};
const whisper = Object.values(chatReportActions).find((o)=>o?.originalMessage?.transactionID === transactionID)
const actionableWhisperReportActionID = whisper.reportActionID

and resolution param is 'nothing'.

What alternative solutions did you explore? (Optional)

Continue the main solution, if we still want to display the whisper action then disable it, we can:
Update this:

App/src/libs/actions/IOU.ts

Line 1592 in 75c104b

...(actionableWhisperReportActionID && {[actionableWhisperReportActionID]: {originalMessage: {resolution}}}),

to:

        ...(actionableWhisperReportActionID && {
            [actionableWhisperReportActionID]: {
                originalMessage: {resolution, pendingFields: {resolution: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE}},
            },
        }),

It will mark the resolution as the pending field.

Then update this:

App/src/pages/home/report/ReportActionItem.tsx

Line 931 in 75c104b

if (isActionableWhisper && (action.originalMessage.resolution ?? null)) {

to:

        if (isActionableWhisper && (action.originalMessage.resolution ?? null) && (!isActionableTrackExpense || !action.message.pendingFields.resolution)) {

It will do not return null if the whisper action as resolution as the pending field.

Then update this:

App/src/pages/home/report/ReportActionItem.tsx

Line 959 in 75c104b

    
           style={[action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE && !isDeletedParentAction ? styles.pointerEventsNone : styles.pointerEventsAuto]}

to:

            style={[(action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE && !isDeletedParentAction || isActionableTrackExpense) ? styles.pointerEventsNone : styles.pointerEventsAuto]}

It will disable user from interacting with the whisper action. We also need to add the grey out style to it, to indicate that the action is disabled.

And we should consider the case API is failed as well.

truph01 · 2024-06-15T10:02:54Z

I updated the solution to add more detail about the implementation

truph01 · 2024-06-16T04:51:47Z

I added the alternative solution

CortneyOfstad · 2024-06-17T18:15:42Z

@rojiphil can you review the proposals from @truph01 by EOD? Thank you!

melvin-bot · 2024-06-17T18:36:43Z

@rojiphil, @CortneyOfstad Whoops! This issue is 2 days overdue. Let's get this updated quick!

rojiphil · 2024-06-17T20:38:32Z

Thanks for your proposals.
@Krishna2323 proposed to disable the buttons of the whisper action.

Whereas @truph01 proposed to prevent displaying the whisper action which goes in sync with online behavior. The main solution of optimistically setting the "resolution": "nothing" to the whisper action LGTM.
🎀👀🎀 C+ reviewed

melvin-bot · 2024-06-17T20:38:51Z

Triggered auto assignment to @cristipaval, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

cristipaval · 2024-06-18T08:38:07Z

@jasperhuangg could you please help me triage this issue? I'm not sure what is the expected behavior here.

Krishna2323 · 2024-06-18T08:52:31Z

@rojiphil @jasperhuangg, I think hiding the whisper will result in weird behavior when the expense deletion fails. When deleting an expense in offline mode, the whisper will be removed. If the deletion fails, the whisper will pop up again as if it was created for a new expense.

jasperhuangg · 2024-06-18T17:37:09Z

I agree with what @Krishna2323 is saying. In this case I think it's better to just disable the buttons rather than optimistically setting a field that is technically unrelated to this particular flow. Just to confirm, if the user comes back online and the expense is deleted, then the buttons should disappear on their own, correct?

cc @rojiphil

truph01 · 2024-06-18T18:38:53Z

@jasperhuangg

When we call API DeleteMoneyRequest, BE returns "resolution": "nothing" for the whisper action if successfully. So we also need to add it to optimistic data, right? Currently, we don't and it does not follow our Offline UX Patterns.
And FYI, we have a logic to hide the reportAction that has "resolution": "nothing"

truph01 · 2024-06-18T18:46:20Z

Updated comment

cristipaval · 2024-06-18T19:03:14Z

Thanks for jumping into this one, @jasperhuangg 🙇

truph01 · 2024-06-19T07:12:21Z

@rojiphil PR #43977 is ready

CortneyOfstad · 2024-06-25T17:43:26Z

PR is actively being reviewed!

CortneyOfstad · 2024-07-01T18:03:52Z

Has been committed to main, just waiting on staging and production!

melvin-bot · 2024-07-10T10:46:56Z

Reviewing label has been removed, please complete the "BugZero Checklist".

melvin-bot · 2024-07-10T10:47:00Z

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.5-13 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

Fix: Hide whisper action when deleting track expense in offline #43977

If no regressions arise, payment will be issued on 2024-07-17. 🎊

For reference, here are some details about the assignees on this issue:

@rojiphil requires payment automatic offer (Reviewer)
@truph01 requires payment automatic offer (Contributor)

melvin-bot · 2024-07-10T10:47:01Z

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

[@rojiphil] The PR that introduced the bug has been identified. Link to the PR:
[@rojiphil] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
[@rojiphil] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
[@rojiphil] Determine if we should create a regression test for this bug.
[@rojiphil] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
[@CortneyOfstad] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

melvin-bot · 2024-07-15T20:10:39Z

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.6-8 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

Fix: Hide whisper action when deleting track expense in offline #43977

If no regressions arise, payment will be issued on 2024-07-22. 🎊

For reference, here are some details about the assignees on this issue:

@rojiphil requires payment automatic offer (Reviewer)
@truph01 requires payment automatic offer (Contributor)

melvin-bot · 2024-07-15T20:10:41Z

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

[@rojiphil] The PR that introduced the bug has been identified. Link to the PR:
[@rojiphil] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
[@rojiphil] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
[@rojiphil] Determine if we should create a regression test for this bug.
[@rojiphil] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
[@CortneyOfstad] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

CortneyOfstad · 2024-07-18T14:03:04Z

So the title is incorrect and this needs to be paid.

@rojiphil can you please complete the checklist by EOD? Thank you and sorry for the short notice!

rojiphil · 2024-07-19T06:46:58Z

[@rojiphil] The PR that introduced the bug has been identified. Link to the PR: Offending PR
[@rojiphil] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment: Added comment
[@rojiphil] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion: Not Required. Existing checklist is good enough to capture such issues.
[@rojiphil] Determine if we should create a regression test for this bug. : Since this feature was not implemented before, we can add the test case to the existing list of test cases for this track expense feature.
[@rojiphil] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.

Test Steps
1 Go offline.
2 Navigate to Self DM.
3 Track an expense.
4 Go to transaction thread.
5 Delete the expense.
6 Verify that the actionable whisper is not displayed.

rojiphil · 2024-07-19T06:47:50Z

can you please complete the checklist by EOD?

@CortneyOfstad Checklist is done.

CortneyOfstad · 2024-07-19T19:52:05Z

Payment Summary

@rojiphil — paid $250 via Upwork
@truph01 — paid $250 via Upwork

Regression Test

https://github.com/Expensify/Expensify/issues/414055

m-natarajan added Daily KSv2 Bug Something is broken. Auto assigns a BugZero manager. labels Jun 12, 2024

melvin-bot bot assigned CortneyOfstad Jun 12, 2024

CortneyOfstad added the External Added to denote the issue can be worked on by a contributor label Jun 14, 2024

melvin-bot bot changed the title ~~Actionable whisper - Whisper options are interactable when the expense is deleted offline~~ [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline Jun 14, 2024

melvin-bot bot added Overdue Help Wanted Apply this label when an issue is open to proposals by contributors labels Jun 14, 2024

melvin-bot bot assigned rojiphil Jun 14, 2024

melvin-bot bot removed the Overdue label Jun 14, 2024

melvin-bot bot added the Overdue label Jun 17, 2024

melvin-bot bot removed the Overdue label Jun 17, 2024

melvin-bot bot assigned cristipaval Jun 17, 2024

truph01 mentioned this issue Jun 19, 2024

Fix: Hide whisper action when deleting track expense in offline #43977

Merged

50 tasks

melvin-bot bot added Reviewing Has a PR in review Weekly KSv2 and removed Daily KSv2 labels Jun 19, 2024

melvin-bot bot added Weekly KSv2 Awaiting Payment Auto-added when associated PR is deployed to production and removed Weekly KSv2 labels Jul 10, 2024

melvin-bot bot changed the title ~~[$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline~~ [HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline Jul 10, 2024

melvin-bot bot removed the Reviewing Has a PR in review label Jul 10, 2024

melvin-bot bot added Weekly KSv2 and removed Weekly KSv2 labels Jul 15, 2024

melvin-bot bot added Daily KSv2 and removed Weekly KSv2 labels Jul 16, 2024

rojiphil mentioned this issue Jul 19, 2024

Feat/track whispers #38709

Merged

50 tasks

CortneyOfstad closed this as completed Jul 19, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline #43560

[HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline #43560

m-natarajan commented Jun 12, 2024 •

edited by melvin-bot bot

Loading

melvin-bot bot commented Jun 12, 2024

m-natarajan commented Jun 12, 2024

m-natarajan commented Jun 12, 2024

Krishna2323 commented Jun 12, 2024 •

edited

Loading

melvin-bot bot commented Jun 14, 2024

melvin-bot bot commented Jun 14, 2024

truph01 commented Jun 15, 2024 •

edited

Loading

truph01 commented Jun 15, 2024

truph01 commented Jun 16, 2024

CortneyOfstad commented Jun 17, 2024

melvin-bot bot commented Jun 17, 2024

rojiphil commented Jun 17, 2024

melvin-bot bot commented Jun 17, 2024

cristipaval commented Jun 18, 2024

Krishna2323 commented Jun 18, 2024

jasperhuangg commented Jun 18, 2024 •

edited

Loading

truph01 commented Jun 18, 2024 •

edited

Loading

truph01 commented Jun 18, 2024

cristipaval commented Jun 18, 2024

truph01 commented Jun 19, 2024

CortneyOfstad commented Jun 25, 2024

CortneyOfstad commented Jul 1, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 15, 2024

melvin-bot bot commented Jul 15, 2024

CortneyOfstad commented Jul 18, 2024

rojiphil commented Jul 19, 2024

rojiphil commented Jul 19, 2024

CortneyOfstad commented Jul 19, 2024

[HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline #43560

[HOLD for payment 2024-07-17] [$250] Actionable whisper - Whisper options are interactable when the expense is deleted offline #43560

Comments

m-natarajan commented Jun 12, 2024 • edited by melvin-bot bot Loading

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

melvin-bot bot commented Jun 12, 2024

m-natarajan commented Jun 12, 2024

m-natarajan commented Jun 12, 2024

Krishna2323 commented Jun 12, 2024 • edited Loading

Proposal

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

What is the root cause of that problem?

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

What alternative solutions did you explore? (Optional)

Result

melvin-bot bot commented Jun 14, 2024

melvin-bot bot commented Jun 14, 2024

truph01 commented Jun 15, 2024 • edited Loading

Proposal

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

What is the root cause of that problem?

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

What alternative solutions did you explore? (Optional)

truph01 commented Jun 15, 2024

truph01 commented Jun 16, 2024

CortneyOfstad commented Jun 17, 2024

melvin-bot bot commented Jun 17, 2024

rojiphil commented Jun 17, 2024

melvin-bot bot commented Jun 17, 2024

cristipaval commented Jun 18, 2024

Krishna2323 commented Jun 18, 2024

jasperhuangg commented Jun 18, 2024 • edited Loading

truph01 commented Jun 18, 2024 • edited Loading

truph01 commented Jun 18, 2024

cristipaval commented Jun 18, 2024

truph01 commented Jun 19, 2024

CortneyOfstad commented Jun 25, 2024

CortneyOfstad commented Jul 1, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 10, 2024

melvin-bot bot commented Jul 15, 2024

melvin-bot bot commented Jul 15, 2024

CortneyOfstad commented Jul 18, 2024

rojiphil commented Jul 19, 2024

rojiphil commented Jul 19, 2024

CortneyOfstad commented Jul 19, 2024

Payment Summary

Regression Test

m-natarajan commented Jun 12, 2024 •

edited by melvin-bot bot

Loading

Krishna2323 commented Jun 12, 2024 •

edited

Loading

truph01 commented Jun 15, 2024 •

edited

Loading

jasperhuangg commented Jun 18, 2024 •

edited

Loading

truph01 commented Jun 18, 2024 •

edited

Loading