Added Download Button on hover for the thumbnail

This commit is contained in:
Kenneth Tubman V 2020-01-25 14:42:39 -05:00 committed by Sean Yesmunt
parent 8e16b8d8ab
commit 3f9953c41b

View file

@ -13,6 +13,8 @@ import { formatLbryUrlForWeb } from 'util/url';
import { parseURI } from 'lbry-redux'; import { parseURI } from 'lbry-redux';
import FileProperties from 'component/fileProperties'; import FileProperties from 'component/fileProperties';
import FileDownloadLink from 'component/fileDownloadLink';
type Props = { type Props = {
uri: string, uri: string,
claim: ?Claim, claim: ?Claim,
@ -61,6 +63,8 @@ function ClaimPreviewTile(props: Props) {
onClick: e => e.stopPropagation(), onClick: e => e.stopPropagation(),
}; };
const [isHovering, setHovering] = React.useState(false);
let isChannel; let isChannel;
let isValid = false; let isValid = false;
if (uri) { if (uri) {
@ -87,6 +91,14 @@ function ClaimPreviewTile(props: Props) {
} }
} }
function handleOnMouseOver(e) {
setHovering(true);
}
function handleOnMouseOut(e) {
setHovering(false);
}
React.useEffect(() => { React.useEffect(() => {
if (isValid && !isResolvingUri && shouldFetch && uri) { if (isValid && !isResolvingUri && shouldFetch && uri) {
resolveUri(uri); resolveUri(uri);
@ -146,6 +158,8 @@ function ClaimPreviewTile(props: Props) {
className={classnames('card claim-preview--tile', { className={classnames('card claim-preview--tile', {
'claim-preview--channel': isChannel, 'claim-preview--channel': isChannel,
})} })}
onMouseOver={handleOnMouseOver}
onMouseOut={handleOnMouseOut}
> >
<NavLink {...navLinkProps}> <NavLink {...navLinkProps}>
<FileThumbnail thumbnail={thumbnailUrl}> <FileThumbnail thumbnail={thumbnailUrl}>