react-share icon indicating copy to clipboard operation
react-share copied to clipboard

feat: Accept async function for URL prop

Open Kashuab opened this issue 4 years ago • 5 comments

Closes #216 Related pull requests: #268

My first approach was to re-run ShareButton.handleClick after calling beforeOnClick, but I felt the solution was unreliable and messy. My actual use-case requires me to upload an image to a third party service (which returns a URL to the image), which I was doing in beforeOnClick. The problem was that after beforeOnClick was called, any props that got updated were not used.

Instead of relying on changing props by calling setState in the parent component that contains the beforeOnClick prop in order to dynamically specify a URL (which is very complicated,) I think it's a lot simpler to accept an async function instead for the url prop.

Here's a quick example implementation:

import { FacebookShareButton, FacebookIcon } from 'react-share';

const DynamicURLShare = () => {
  const getUrl = async () => {
    // ... make a fetch call, etc.

    return 'some URL';
  };

  return (
    <FacebookShareButton url={getUrl} quote="Testing 123">
      <FacebookIcon />
    </FacebookShareButton>
  );
};

This is my first ever open-source contribution, so let me know if there's anything I'm missing!

If you need to use this feature before it's merged, I've published a package in the interim: @kashuab/react-share

Kashuab avatar Jul 20 '20 18:07 Kashuab

Made a commit on my fork to resolve the edits I made to package.json before publishing the package to be used until this is merged 👍

Kashuab avatar Aug 08 '22 19:08 Kashuab

would love to get this merged in - I need the same feature

jonknyc avatar Nov 03 '22 18:11 jonknyc

any chance of this getting merged in?

wstuckey avatar Dec 13 '22 15:12 wstuckey

I also need this feature, is there a chance to merge in?

Hubackova avatar Dec 20 '23 19:12 Hubackova