How to use the react-share.generateShareIcon function in react-share
To help you get started, we’ve selected a few react-share examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
Neufund / ico-transparency-monitor / src / components / ShareButtons.js View on Github 
export default (props) => {
const FacebookIcon = generateShareIcon('facebook');
const TwitterIcon = generateShareIcon('twitter');
const LinkedinIcon = generateShareIcon('linkedin');
const TelegramIcon = generateShareIcon('telegram');
const RedditIcon = generateShareIcon('reddit');
const projectName = props.projectName;
const title = `Stats and Transparency score for ${projectName}`;
const description = `Explore real time stats on raised funds,
tokens and investors in ${projectName} and review comprehensive
transparency score based on ${projectName} smart contracts code.`;
const {
FacebookShareButton,
LinkedinShareButton,
TwitterShareButton,
TelegramShareButton,
RedditShareButton,)
} else {
const directionMode = true
const {
FacebookShareButton,
GooglePlusShareButton,
LinkedinShareButton,
TwitterShareButton,
PinterestShareButton,
VKShareButton
} = ShareButtons
const FacebookIcon = generateShareIcon('facebook')
const TwitterIcon = generateShareIcon('twitter')
const LinkedinIcon = generateShareIcon('linkedin')
const { shareInfo } = this.props
const shareIconSize = 32
const { detail } = this.props.post
const { content } = detail
const files = typeof detail.file !== 'undefined'
? JSON.parse(detail.file)
: []
const detailClass = classNames('content', { hide: !detail.id })
const finalContent = this.parseContent(content)
const eventDate = (detail.startDate === detail.endDate)
? toShortDate(detail.endDate)
: toShortDate(detail.startDate) + ' - ' + toShortDate(detail.endDate)import React from 'react';
import { PropTypes } from 'prop-types';
import { ShareButtons, generateShareIcon } from 'react-share';
import { SiteConf } from 'base';
import styles from './styles.css';
const { FacebookShareButton, LinkedinShareButton, TwitterShareButton, WhatsappShareButton, EmailShareButton, GooglePlusShareButton } = ShareButtons;
const FacebookIcon = generateShareIcon('facebook');
const TwitterIcon = generateShareIcon('twitter');
const LinkedinIcon = generateShareIcon('linkedin');
const WhatsappIcon = generateShareIcon('whatsapp');
const GooglePlusIcon = generateShareIcon('google');
const EmailIcon = generateShareIcon('email');
const propTypes = {
post: PropTypes.object.isRequired
};
const SharePost = ({ post }) => {
const postUrl = `${ SiteConf.BlogUrl }/${ post.slug }`;
const shareTitle = `${ post.title } @ ${ SiteConf.BlogTitle }`;
return (render() {
if (!this.props.challenge) {
return null
}
const {
FacebookShareButton,
TwitterShareButton,
EmailShareButton,
} = ShareButtons
const FacebookIcon = generateShareIcon('facebook')
const TwitterIcon = generateShareIcon('twitter')
const EmailIcon = generateShareIcon('email')
const shareUrl = `${process.env.REACT_APP_URL}/browse/challenges/${this.props.challenge.id}`
const title = process.env.REACT_APP_TITLE
const hashtag = 'maproulette'
return (
<div>
<div>
<span>
</span>
</div>
</div>].map(({ Component, iconName }, index) => (
));FacebookShareButton,
GooglePlusShareButton,
LinkedinShareButton,
TwitterShareButton,
TelegramShareButton,
WhatsappShareButton,
PinterestShareButton,
VKShareButton,
OKShareButton,
RedditShareButton,
TumblrShareButton,
LivejournalShareButton,
EmailShareButton,
} = ShareButtons;
const FacebookIcon = generateShareIcon('facebook');
const TwitterIcon = generateShareIcon('twitter');
const GooglePlusIcon = generateShareIcon('google');
const LinkedinIcon = generateShareIcon('linkedin');
const PinterestIcon = generateShareIcon('pinterest');
const VKIcon = generateShareIcon('vk');
const OKIcon = generateShareIcon('ok');
const TelegramIcon = generateShareIcon('telegram');
const WhatsappIcon = generateShareIcon('whatsapp');
const RedditIcon = generateShareIcon('reddit');
const TumblrIcon = generateShareIcon('tumblr');
const MailruIcon = generateShareIcon('mailru');
const EmailIcon = generateShareIcon('email');
const LivejournalIcon = generateShareIcon('livejournal');
const shareTitle = `${post.json_metadata.title} - Hede.io`
const shareUrl = "https://hede.io/" + post.url;import { Component } from 'react'
import PropTypes from 'prop-types'
import { ShareButtons, generateShareIcon } from 'react-share'
const { FacebookShareButton, TwitterShareButton } = ShareButtons
const FacebookIcon = generateShareIcon('facebook')
const TwitterIcon = generateShareIcon('twitter')
const propTypes = {
description: PropTypes.string,
imgUrl: PropTypes.string.isRequired,
shareUrl: PropTypes.string.isRequired,
title: PropTypes.string.isRequired,
}
class PostShareWidget extends Component {
constructor(props) {
super(props)
}
render() {
const { description, imgUrl, shareUrl, title } = this.props
return (TumblrShareButton,
LivejournalShareButton,
EmailShareButton,
} = ShareButtons;
const FacebookIcon = generateShareIcon('facebook');
const TwitterIcon = generateShareIcon('twitter');
const GooglePlusIcon = generateShareIcon('google');
const LinkedinIcon = generateShareIcon('linkedin');
const PinterestIcon = generateShareIcon('pinterest');
const VKIcon = generateShareIcon('vk');
const OKIcon = generateShareIcon('ok');
const TelegramIcon = generateShareIcon('telegram');
const WhatsappIcon = generateShareIcon('whatsapp');
const RedditIcon = generateShareIcon('reddit');
const TumblrIcon = generateShareIcon('tumblr');
const MailruIcon = generateShareIcon('mailru');
const EmailIcon = generateShareIcon('email');
const LivejournalIcon = generateShareIcon('livejournal');
const shareTitle = `${post.json_metadata.title} - Hede.io`
const shareUrl = "https://hede.io/" + post.url;
return (
<div>
{isModerator && !reviewed || alreadyChecked ? <div>
{!alreadyChecked && isModerator && <h3>
Review Entry
<br>
</h3>}
</div></div>FacebookShareButton,
GooglePlusShareButton,
LinkedinShareButton,
TwitterShareButton,
TelegramShareButton,
RedditShareButton
} = ShareButtons;
const {
FacebookShareCount,
GooglePlusShareCount,
LinkedinShareCount,
RedditShareCount
} = ShareCounts;
const FacebookIcon = generateShareIcon("facebook");
const TwitterIcon = generateShareIcon("twitter");
const TelegramIcon = generateShareIcon("telegram");
const GooglePlusIcon = generateShareIcon("google");
const LinkedinIcon = generateShareIcon("linkedin");
const RedditIcon = generateShareIcon("reddit");
const iconSize = mobile ? 36 : 48;
const filter = count => (count > 0 ? count : "");
return (
<div>
{count =>
<div>
{filter(count)}
</div>}</div>LinkedinShareButton,
TwitterShareButton,
TelegramShareButton,
RedditShareButton
} = ShareButtons
const {
FacebookShareCount,
GooglePlusShareCount,
LinkedinShareCount,
RedditShareCount
} = ShareCounts
const FacebookIcon = generateShareIcon('facebook')
const TwitterIcon = generateShareIcon('twitter')
const TelegramIcon = generateShareIcon('telegram')
const GooglePlusIcon = generateShareIcon('google')
const LinkedinIcon = generateShareIcon('linkedin')
const RedditIcon = generateShareIcon('reddit')
const iconSize = mobile ? 36 : 48
const filter = count => (count > 0 ? count : '')
return (
<div>
{count => <div>{filter(count)}</div>}
</div>react-share
Social media share buttons and share counts for React.
