Chat - Link preview doesn't update after editing link

[lanitochka17]

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

---

Action Performed:

1. Open a chat
2. Write google.com inside the composer and post it
3. After the preview has showed up hover over the link and click on edit
4. Remove the 'e" from google and click on the tick mark

Expected Result:

Preview should be removed

Actual Result:

Preview still shown even if the link is edited and doesn't lead to google any more

Workaround:

Unknown

Platforms:

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

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• Windows / Chrome
• MacOS / Desktop

Version Number: 1.3.54.11

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

Notes/Photos/Videos: Any additional supporting documentation

2023-08-07.23.11.45.mp4

Recording.5890.mp4

Expensify/Expensify Issue URL:

Issue reported by: @Nathan-Mulugeta

Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1691439246176759

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~014b233b198d71a919
• Upwork Job ID: 1701884164569468928
• Last Price Increase: 2023-09-13

[melvin-bot]

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

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[rayane-d]

I think this should be fixed from BE

[jfquevedol2198]

Proposal

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

Chat - Link preview doesn't update after editing link

What is the root cause of that problem?

App is not refetching the link preview once Draft messages is published

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

Need to refetch the link preview in ReportActionItemMessageEdit.js if link is updated

const publishDraft = useCallback(() => {
    ...
    const urls = ReportActionsUtils.extractLinksFromMessageHtml(props.action);
    if (urls.length === 0) return;
    Report.expandURLPreview(props.report.reportID, props.action.reportActionID);
}, [props.action, debouncedSaveDraft, deleteDraft, draft, props.reportID]);

Result

Screen.Recording.2023-08-17.at.8.43.03.AM.mov

What alternative solutions did you explore? (Optional)

N/A

[hungvu193]

Should be BE issue, otherwise it will be dupe of this one: #21191
cc @MonilBhavsar

[jfquevedol2198]

I think this is not BE issue, when we add link, it calls api?command=ExpandURLPreview for linkPreview, then it displays linkPreview from the response.
When edit the link and publish it, we need to re-call the api for getting updated linkPreview.

Screen.Recording.2023-08-17.at.11.16.22.AM.1.mov

cc @MonilBhavsar @JmillsExpensify

[hungvu193]

I think this is not BE issue, when we add link, it calls api?command=ExpandURLPreview for linkPreview, then it displays linkPreview from the response.

Not sure, what you mean. For now, LinkPreviewer is disable (#24475)

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

Lines 163 to 165 in 7162c96

	if (!Permissions.canUseLinkPreviews()) {
	return;
	}

Let remove above condition to make it work, expandURLPreview will call every time when we edit url. Incase the preview didn't update, that should be BE issue, since we decided to move the logic of updating URL preview into BE here (#21191 (comment)).
That doesn't make sense to call update preview every time when publish draft 🤦 . That will make a lot of redundant call. Your RCA isn't correct, the correct RCA should be we return here, so Report.expandURLPreview was not called. Anyway, let get this close.

Screen.Recording.2023-08-17.at.10.49.59.mov

[jfquevedol2198]

Yes, its temporarily disabled in the latest code, but whenever message is updated, it should be called for link preview update on FE side or BE side. but I don't know this link preview is being handled on BE side. My proposal was for the case that link preview is fetched from FE side.
cc @MonilBhavsar @JmillsExpensify

[hungvu193]

Nope. You only need to remove this, everything will work as expected. A friendly advice that you shouldn't tag other people, when it's not necessary, I tagged Monil because he worked on the BE PR of the issue I mentioned.

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

Lines 163 to 165 in 7162c96

	if (!Permissions.canUseLinkPreviews()) {
	return;
	}

Here's the example about removing the condition above. Correct me if I'm wrong? @jfquevedol2198

Screen.Recording.2023-08-17.at.10.57.23.mov

[melvin-bot]

@JmillsExpensify Huh... This is 4 days overdue. Who can take care of this?