lbry-desktop/ui/component/socialShare/view.jsx

64 lines
1.8 KiB
React
Raw Normal View History

2018-09-12 18:42:15 +02:00
// @flow
2018-11-26 02:21:25 +01:00
import * as ICONS from 'constants/icons';
import React from 'react';
2018-09-12 18:42:15 +02:00
import Button from 'component/button';
2018-10-04 15:39:14 +02:00
import CopyableText from 'component/copyableText';
2019-10-29 17:23:56 +01:00
import EmbedArea from 'component/embedArea';
2018-09-12 18:42:15 +02:00
type Props = {
2019-06-28 09:33:07 +02:00
claim: Claim,
2019-10-29 17:23:56 +01:00
webShareable: boolean,
2018-11-09 16:34:48 +01:00
isChannel: boolean,
2018-09-12 18:42:15 +02:00
};
class SocialShare extends React.PureComponent<Props> {
2018-11-09 16:34:48 +01:00
static defaultProps = {
isChannel: false,
};
2018-09-12 18:42:15 +02:00
constructor(props: Props) {
super(props);
this.input = undefined;
}
input: ?HTMLInputElement;
render() {
const { claim, isChannel } = this.props;
const { canonical_url: canonicalUrl, permanent_url: permanentUrl } = claim;
2019-11-22 22:13:00 +01:00
const { webShareable } = this.props;
2019-10-01 16:00:23 +02:00
const OPEN_URL = 'https://open.lbry.com/';
const lbryUrl = canonicalUrl ? canonicalUrl.split('lbry://')[1] : permanentUrl.split('lbry://')[1];
const lbryWebUrl = lbryUrl.replace(/#/g, ':');
const encodedLbryURL: string = `${OPEN_URL}${encodeURIComponent(lbryWebUrl)}`;
const lbryURL: string = `${OPEN_URL}${lbryWebUrl}`;
2019-03-21 17:44:07 +01:00
2019-06-28 09:33:07 +02:00
const shareOnFb = __('Share on Facebook');
const shareOnTwitter = __('Share On Twitter');
2018-10-04 15:39:14 +02:00
2018-09-12 18:42:15 +02:00
return (
<React.Fragment>
2019-12-27 01:00:07 +01:00
<CopyableText label={__('LBRY Link')} copyable={lbryURL} noSnackbar />
2019-11-22 22:13:00 +01:00
<div className="">
2019-07-21 23:31:22 +02:00
<Button
icon={ICONS.FACEBOOK}
button="link"
description={shareOnFb}
href={`https://facebook.com/sharer/sharer.php?u=${encodedLbryURL}`}
2019-11-22 22:13:00 +01:00
/>{' '}
2019-07-21 23:31:22 +02:00
<Button
icon={ICONS.TWITTER}
button="link"
description={shareOnTwitter}
2019-07-23 22:16:37 +02:00
href={`https://twitter.com/intent/tweet?text=${encodedLbryURL}`}
2019-07-21 23:31:22 +02:00
/>
2018-09-26 19:48:07 +02:00
</div>
{webShareable && !isChannel && <EmbedArea label={__('Embedded')} claim={claim} noSnackbar />}
</React.Fragment>
2018-09-12 18:42:15 +02:00
);
}
}
export default SocialShare;