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

57 lines
1.5 KiB
React
Raw Normal View History

2019-05-07 04:35:04 +02:00
// @flow
import React, { Fragment } from 'react';
import MarkdownPreview from 'component/common/markdown-preview';
2019-05-07 04:35:04 +02:00
type Props = {
description: ?string,
email: ?string,
website: ?string,
};
const formatEmail = (email: string) => {
if (email) {
const protocolRegex = new RegExp('^mailto:', 'i');
const protocol = protocolRegex.exec(email);
return protocol ? email : `mailto:${email}`;
}
return null;
};
2019-05-07 04:35:04 +02:00
function ChannelContent(props: Props) {
const { description, email, website } = props;
const showAbout = description || email || website;
return (
2019-06-11 20:10:58 +02:00
<section className="card--section">
{!showAbout && <h2 className="main--empty empty">{__('Nothing here yet')}</h2>}
2019-05-07 04:35:04 +02:00
{showAbout && (
<Fragment>
{description && (
2019-11-22 22:13:00 +01:00
<div className="media__info-text media__info-text--constrained">
2019-12-03 17:41:44 +01:00
<MarkdownPreview content={description} />
</div>
)}
2019-05-07 04:35:04 +02:00
{email && (
<Fragment>
2019-11-22 22:13:00 +01:00
<label>{__('Contact')}</label>
<div className="media__info-text">
2019-12-03 17:41:44 +01:00
<MarkdownPreview content={formatEmail(email)} />
</div>
2019-05-07 04:35:04 +02:00
</Fragment>
)}
{website && (
<Fragment>
2019-11-22 22:13:00 +01:00
<label>{__('Site')}</label>
<div className="media__info-text">
2019-12-03 17:41:44 +01:00
<MarkdownPreview content={website} />
</div>
2019-05-07 04:35:04 +02:00
</Fragment>
)}
</Fragment>
)}
</section>
);
}
export default ChannelContent;