nishiki-tech / nishiki-frontend

Nishiki is an app for tracking and sharing food inventories within groups for better pantry management.
https://nishiki.tech
MIT License
11 stars 5 forks source link

"Copy Link" not working on mobile #375

Closed nick-y-ito closed 3 months ago

nick-y-ito commented 3 months ago

Description

On some random mobile devices, the "Copy Link" does not copy the URL to the clipboard.

Environment

Notes

-

nick-y-ito commented 3 months ago

https://stackoverflow.com/questions/69438702/why-does-navigator-clipboard-writetext-not-copy-text-to-clipboard-if-it-is-pro

This could be the cause.

nick-y-ito commented 3 months ago

I commented out the part of the code that sending a request to the backend, and copying linked got successful. Thus, I infer that this issue occurs due to the duration of time after a user clicks the button until navigator.clipboard.writeText() is revoked.

  const handleLinkCopy = async () => {
    setIsLinkButtonClicked(true);
    // const result = await putGenerateInvitationLinkHash(groupId);

    // if (!result.ok) {
    //   alert('Something went wrong. Please try again');
    //   return;
    // }

    // const hash = result.value.invitationLinkHash;
    const hash = "test-hash"
    return await navigator.clipboard.writeText(`${CLIENT_BASE_URL}/groups/join/${hash}`);
  };
nick-y-ito commented 3 months ago

Also, when clicking a "Copy Link" button, got the following error that occurred on the browser at navigator.clipboard.writeText() before commenting out the above part.

The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.