Obscure NSFW content title

This commit is contained in:
miikkatu 2018-04-03 21:26:22 +03:00
parent 229cca975c
commit 437833d8e1

View file

@ -1,19 +1,17 @@
// @flow // @flow
import * as React from 'react'; import * as React from 'react';
import { normalizeURI } from 'lbryURI'; import { normalizeURI } from 'lbryURI';
import Button from 'component/button';
import CardMedia from 'component/cardMedia'; import CardMedia from 'component/cardMedia';
import TruncatedText from 'component/common/truncated-text'; import TruncatedText from 'component/common/truncated-text';
import Icon from 'component/common/icon'; import Icon from 'component/common/icon';
import FilePrice from 'component/filePrice'; import FilePrice from 'component/filePrice';
import UriIndicator from 'component/uriIndicator'; import UriIndicator from 'component/uriIndicator';
import NsfwOverlay from 'component/nsfwOverlay';
import * as icons from 'constants/icons'; import * as icons from 'constants/icons';
import classnames from 'classnames'; import classnames from 'classnames';
// TODO: iron these out // TODO: iron these out
type Props = { type Props = {
isResolvingUri: boolean,
resolveUri: string => void,
uri: string, uri: string,
claim: ?{ claim_id: string }, claim: ?{ claim_id: string },
fileInfo: ?{}, fileInfo: ?{},
@ -78,22 +76,41 @@ class FileCard extends React.PureComponent<Props> {
<CardMedia nsfw={shouldObscureNsfw} thumbnail={thumbnail} /> <CardMedia nsfw={shouldObscureNsfw} thumbnail={thumbnail} />
<div className="card-media__internal-links">{showPrice && <FilePrice uri={uri} />}</div> <div className="card-media__internal-links">{showPrice && <FilePrice uri={uri} />}</div>
<div className="card__title-identity"> {shouldObscureNsfw ? (
<div className="card__title--small"> <div className="card__title-identity">
<TruncatedText lines={3}>{title}</TruncatedText> <div className="card__title--small">
<TruncatedText lines={3}>
{__('This content is obscured because it is NSFW. You can change this in ')}
<Button
button="link"
label={__('Settings.')}
onClick={e => {
// Don't propagate to the onClick handler of parent element
e.stopPropagation();
navigate('/settings');
}}
/>
</TruncatedText>
</div>
</div> </div>
<div className="card__subtitle card__subtitle--file-info"> ) : (
{pending ? ( <div className="card__title-identity">
<div>Pending...</div> <div className="card__title--small">
) : ( <TruncatedText lines={3}>{title}</TruncatedText>
<React.Fragment> </div>
<UriIndicator uri={uri} link /> <div className="card__subtitle card__subtitle--file-info">
{isRewardContent && <Icon icon={icons.FEATURED} />} {pending ? (
{fileInfo && <Icon icon={icons.LOCAL} />} <div>Pending...</div>
</React.Fragment> ) : (
)} <React.Fragment>
<UriIndicator uri={uri} link />
{isRewardContent && <Icon icon={icons.FEATURED} />}
{fileInfo && <Icon icon={icons.LOCAL} />}
</React.Fragment>
)}
</div>
</div> </div>
</div> )}
</section> </section>
); );
/* eslint-enable jsx-a11y/click-events-have-key-events */ /* eslint-enable jsx-a11y/click-events-have-key-events */