138 lines
4 KiB
JavaScript
138 lines
4 KiB
JavaScript
// @flow
|
|
import * as ICONS from 'constants/icons';
|
|
import * as PAGES from 'constants/pages';
|
|
import React from 'react';
|
|
import { parseURI } from 'lbry-redux';
|
|
import ClaimPreview from 'component/claimPreview';
|
|
import Button from 'component/button';
|
|
import ClaimEffectiveAmount from 'component/claimEffectiveAmount';
|
|
import I18nMessage from 'component/i18nMessage';
|
|
import { useHistory } from 'react-router';
|
|
import LbcSymbol from 'component/common/lbc-symbol';
|
|
import { DOMAIN } from 'config';
|
|
|
|
type Props = {
|
|
query: string,
|
|
winningUri: ?string,
|
|
doResolveUris: (Array<string>) => void,
|
|
hideLink?: boolean,
|
|
setChannelActive: boolean => void,
|
|
beginPublish: string => void,
|
|
pendingIds: Array<string>,
|
|
isResolvingWinningUri: boolean,
|
|
winningClaim: ?Claim,
|
|
};
|
|
|
|
export default function SearchTopClaim(props: Props) {
|
|
const {
|
|
doResolveUris,
|
|
query = '',
|
|
winningUri,
|
|
winningClaim,
|
|
hideLink = false,
|
|
setChannelActive,
|
|
beginPublish,
|
|
isResolvingWinningUri,
|
|
} = props;
|
|
const uriFromQuery = `lbry://${query}`;
|
|
const { push } = useHistory();
|
|
let name;
|
|
let channelUriFromQuery;
|
|
let winningUriIsChannel;
|
|
try {
|
|
const { isChannel, streamName, channelName } = parseURI(uriFromQuery);
|
|
const { isChannel: winnerIsChannel } = parseURI(winningUri);
|
|
winningUriIsChannel = winnerIsChannel;
|
|
if (!isChannel) {
|
|
channelUriFromQuery = `lbry://@${query}`;
|
|
name = streamName;
|
|
} else {
|
|
name = channelName;
|
|
}
|
|
} catch (e) {}
|
|
|
|
React.useEffect(() => {
|
|
setChannelActive && winningUriIsChannel && setChannelActive(true);
|
|
}, [setChannelActive, winningUriIsChannel]);
|
|
|
|
React.useEffect(() => {
|
|
let urisToResolve = [];
|
|
if (uriFromQuery) {
|
|
urisToResolve.push(uriFromQuery);
|
|
}
|
|
|
|
if (channelUriFromQuery) {
|
|
urisToResolve.push(channelUriFromQuery);
|
|
}
|
|
|
|
if (urisToResolve.length > 0) {
|
|
doResolveUris(urisToResolve);
|
|
}
|
|
}, [doResolveUris, uriFromQuery, channelUriFromQuery]);
|
|
|
|
if (winningUri && !winningClaim && isResolvingWinningUri) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="search__header">
|
|
{winningUri && (
|
|
<div className="claim-preview__actions--header">
|
|
<a
|
|
className="media__uri"
|
|
href="https://lbry.com/faq/trending"
|
|
title={__('Learn more about LBRY Credits on %DOMAIN%', { DOMAIN })}
|
|
>
|
|
<LbcSymbol prefix={__('Most supported')} />
|
|
</a>
|
|
</div>
|
|
)}
|
|
{winningUri && (
|
|
<div className="card">
|
|
<ClaimPreview
|
|
hideRepostLabel
|
|
uri={winningUri}
|
|
type="large"
|
|
properties={claim => (
|
|
<span className="claim-preview__custom-properties">
|
|
<ClaimEffectiveAmount uri={winningUri} />
|
|
</span>
|
|
)}
|
|
/>
|
|
</div>
|
|
)}
|
|
{!winningUri && uriFromQuery && (
|
|
<div className="card card--section help--inline">
|
|
<I18nMessage
|
|
tokens={{
|
|
repost: (
|
|
<Button button="link" onClick={() => push(`/$/${PAGES.REPOST_NEW}?to=${name}`)} label={__('Repost')} />
|
|
),
|
|
publish: (
|
|
<span>
|
|
<Button button="link" onClick={() => beginPublish(name)} label={'publish'} />
|
|
</span>
|
|
),
|
|
}}
|
|
>
|
|
You have found the edge of the internet. %repost% or %publish% your stuff here to claim this spot.
|
|
</I18nMessage>
|
|
</div>
|
|
)}
|
|
{!hideLink && winningUri && (
|
|
<div className="section__actions--between section__actions--no-margin">
|
|
<span />
|
|
<Button
|
|
button="link"
|
|
className="search__top-link"
|
|
label={
|
|
<I18nMessage tokens={{ name: <strong>{query}</strong> }}>View competing uploads for %name%</I18nMessage>
|
|
}
|
|
navigate={`/$/${PAGES.TOP}?name=${query}`}
|
|
iconRight={ICONS.ARROW_RIGHT}
|
|
/>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|