App: [HOLD for payment 2022-08-30] [$250] Right clicking and “Copy Link” on a link produced https://new.expensify.com//r/0/NaN when pasted

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


This Issue has been divided in 2 parts, as it evolved while it was being discusses, the solution to both the situations is similar, and it would be easier to keep them in one GH.

1st Situation

Action Performed:

  1. Send any link (e.g. Google.com) to a chat on web.
  2. Right-click on the link to open the context menu.
  3. Check that you see 2 option, Copy link and Copy URL to clipboard

Expected Result:

We should only display the Copy URL to clipboard option

Actual Result:

We show both options and it’s confusing

2nd Situation

  1. Add an attachement to a chat on web.
  2. Right-click on the link to open the context menu.
  3. Check that you see several options including Copy link and Copy to clipboard

Expected Result:

We should only Download, Mark as unread, Delete comment

Actual Result:

We show all of the above option, and it’s confusing

Workaround:

unknown

Platform:

Where is this issue occurring?

  • Web
  • iOS
  • Android
  • Desktop App
  • Mobile Web

Version Number: 1.1.79-9 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Notes/Photos/Videos: Any additional supporting documentation 2022-06-29_07-21-39 Screen Shot 2022-07-01 at 1 41 25 AM

Expensify/Expensify Issue URL: Issue reported by: @marcaaron Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1656523285065139

View all open jobs on GitHub

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 51 (40 by maintainers)

Most upvoted comments

I agree that Copy link vs Copy URL to clipboard is confusing. Reading up in the slack thread, I think @marcaaron made some really good arguments for why we should just display Copy URL to clipboard if you right-click on the link, so 👍 there. I also think that the same logic should apply if you right-click an email link, which has this same bug.

And can you advise on how we could disable the option to “Copy link” when we are right-clicking on a hyperlink?

Yep!

  • all the context menu actions are defined here
  • whether or not each one shows is determined by their shouldShow function
  • The BaseReportActionContextMenu component has a type prop that’s passed to the shouldShow function for each context action.
  • So if we don’t want to show Copy link if you right-click on a link or email, then all we have to do is change this line to shouldShow: type => type === CONTEXT_MENU_TYPES.REPORT_ACTION,

I updated the GH, @parasharrajat and @Harshdeepjoshi let me know if that makes sense as we end up having to very similar changes to do here, one for the link and another for the attachements.

Based on the new requirements, @Harshdeepjoshi 's proposal looks good to me.

cc: @sketchydroide Could you please also update the expected result according to https://github.com/Expensify/App/issues/9660#issuecomment-1178020405

🎀 👀 🎀 C+ reviewed

Copy to clipboard for attachments until https://github.com/Expensify/App/issues/4629 is completed.

Yeah, I reported it a few days back https://expensify.slack.com/archives/C01GTK53T8Q/p1656707539152899 and will handle this separately.

@roryabraham Do we want to hide this menu option from attachments as well? I think we should.

Proposal

Solution

  • To hide the menu options from context menu for links, we need to edit this line and add => type === CONTEXT_MENU_TYPES.REPORT_ACTION

  • To hide the menu options from context menu for attachments, we would add && !ReportUtils.isReportMessageAttachment(lodashGet(reportAction, ['message', 0], {})) to the same line and this will solve our issue.

The final code will look like this

    {
        textTranslateKey: 'reportActionContextMenu.copyLink',
        icon: Expensicons.LinkCopy,
        shouldShow: (type, reportAction) => type === CONTEXT_MENU_TYPES.REPORT_ACTION && !ReportUtils.isReportMessageAttachment(lodashGet(reportAction, ['message', 0], {})),
        onPress: (closePopover, {reportAction, reportID}) => {
            Environment.getEnvironmentURL()
                .then((environmentURL) => {
                    const reportActionID = parseInt(lodashGet(reportAction, 'reportActionID'), 10);
                    Clipboard.setString(`${environmentURL}/r/${reportID}/${reportActionID}`);
                });
            hideContextMenu(true, ReportActionComposeFocusManager.focus);
        },
        getDescription: () => {},
    },


Links

Screenshot from 2022-07-08 03-13-02

Attachments

Screenshot from 2022-07-08 03-12-32

@roryabraham any thoughts? And can you advise on how we could disable the option to “Copy link” when we are right-clicking on a hyperlink?

I’m not sure where in the code we’d be able to do that (looked for a bit, but couldn’t find the logic that determines why some options show and others do not). That would be an easier solution IMO as it is pretty ambiguous what is even being copied when presented with these options:

Screen Shot 2022-07-06 at 3 25 58 PM

also this still needs to get the Help Wanted label first.

@jayeshmangwani I don’t think that is what we are looking for, the Copy link is not the link of the url for that we have Copy URL to clipboard. Copy link is a link of the chat comment itself. the entire line. Like if you want to share that post with someone else