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

ButtonGroup

Open dstuecken opened this issue 8 years ago • 1 comments

I think of a ButtonGroup component that is capable of displaying all the buttons you want with just one single component. Because usually you want to share the same url with the same message at one time. So what you basically can do with a button group would be something like that:

render() {
  const url = "https://github.com/olahol/react-socia", message = "So cool!";
  const buttonsToShow = [{
       button: 'Facebook',
       style: BUTTON_WITH_COUNTER,
       appId: 'my-facebook-app-id'
    }, {
       button: 'Google',
       style: BUTTON_WITHOUT_COUNTER
    }, {
       button: 'Reddit'
    }
  ];

  return (
    <div className="btn-group">
      <ButtonGroup url={url} message={message} buttons={buttonsToShow} />
    </div>
  )
}

url and message are directly passed down to every button props since it is always the same. appId is only passed if available and needed. And there can be a button style that can display a button itself or one with a couter.

What do you guys think of that approach?

dstuecken avatar May 20 '16 08:05 dstuecken

This sounds like a great idea, I've also been wanting incorporate styles.

olahol avatar May 24 '16 21:05 olahol