e58ddbc809
* Tooltip: add 'followCursor' and 'placement' option When used on a `<span>` with short text but large empty area, the location of the tooltip was at the bottom-center of the area, which isn't ideal. I think 'followCursor' should be the default, but making it optional for now to minimize testing. Also added the 'placement' prop -- for the span case again, the mouse cursor is blocking the tooltip. * View/Follower count: only use compact when > 10k ## Issue Received complaints -- some people prefer to see full resolution. ## Changes - As a compromise, we'll only apply the compact notation when the value is greater than 10k, with the exception of Tile View Count, where we'll always apply it due to space limitation. - Also added Tooltip for Follower count. ## Fixes - The string was always in 'en' locale in some instances, so it wasn't grouping up digits properly in Japanese (groups of 4), for example.
70 lines
3.1 KiB
JavaScript
70 lines
3.1 KiB
JavaScript
import { connect } from 'react-redux';
|
|
import {
|
|
selectClaimForUri,
|
|
selectIsUriResolving,
|
|
selectClaimIsMine,
|
|
makeSelectClaimIsPending,
|
|
makeSelectReflectingClaimForUri,
|
|
makeSelectClaimWasPurchased,
|
|
isStreamPlaceholderClaim,
|
|
selectTitleForUri,
|
|
selectDateForUri,
|
|
} from 'redux/selectors/claims';
|
|
import { makeSelectStreamingUrlForUri } from 'redux/selectors/file_info';
|
|
import {
|
|
makeSelectCollectionIsMine,
|
|
makeSelectUrlsForCollectionId,
|
|
makeSelectIndexForUrlInCollection,
|
|
} from 'redux/selectors/collections';
|
|
|
|
import { doResolveUri } from 'redux/actions/claims';
|
|
import { doCollectionEdit } from 'redux/actions/collections';
|
|
import { doFileGet } from 'redux/actions/file';
|
|
import { selectBanStateForUri } from 'lbryinc';
|
|
import { selectIsActiveLivestreamForUri } from 'redux/selectors/livestream';
|
|
import { selectLanguage, selectShowMatureContent } from 'redux/selectors/settings';
|
|
import { makeSelectHasVisitedUri } from 'redux/selectors/content';
|
|
import { selectIsSubscribedForUri } from 'redux/selectors/subscriptions';
|
|
import { isClaimNsfw } from 'util/claim';
|
|
import ClaimPreview from './view';
|
|
import formatMediaDuration from 'util/formatMediaDuration';
|
|
|
|
const select = (state, props) => {
|
|
const claim = props.uri && selectClaimForUri(state, props.uri);
|
|
const media = claim && claim.value && (claim.value.video || claim.value.audio);
|
|
const mediaDuration = media && media.duration && formatMediaDuration(media.duration, { screenReader: true });
|
|
const isLivestream = isStreamPlaceholderClaim(claim);
|
|
|
|
return {
|
|
claim,
|
|
mediaDuration,
|
|
date: props.uri && selectDateForUri(state, props.uri),
|
|
title: props.uri && selectTitleForUri(state, props.uri),
|
|
pending: props.uri && makeSelectClaimIsPending(props.uri)(state),
|
|
reflectingProgress: props.uri && makeSelectReflectingClaimForUri(props.uri)(state),
|
|
obscureNsfw: selectShowMatureContent(state) === false,
|
|
claimIsMine: props.uri && selectClaimIsMine(state, claim),
|
|
isResolvingUri: props.uri && selectIsUriResolving(state, props.uri),
|
|
isResolvingRepost: props.uri && selectIsUriResolving(state, props.repostUrl),
|
|
nsfw: claim ? isClaimNsfw(claim) : false,
|
|
banState: selectBanStateForUri(state, props.uri),
|
|
hasVisitedUri: props.uri && makeSelectHasVisitedUri(props.uri)(state),
|
|
isSubscribed: props.uri && selectIsSubscribedForUri(state, props.uri),
|
|
streamingUrl: props.uri && makeSelectStreamingUrlForUri(props.uri)(state),
|
|
wasPurchased: props.uri && makeSelectClaimWasPurchased(props.uri)(state),
|
|
isLivestream,
|
|
isLivestreamActive: isLivestream && selectIsActiveLivestreamForUri(state, props.uri),
|
|
isCollectionMine: makeSelectCollectionIsMine(props.collectionId)(state),
|
|
collectionUris: makeSelectUrlsForCollectionId(props.collectionId)(state),
|
|
collectionIndex: makeSelectIndexForUrlInCollection(props.uri, props.collectionId)(state),
|
|
lang: selectLanguage(state),
|
|
};
|
|
};
|
|
|
|
const perform = (dispatch) => ({
|
|
resolveUri: (uri) => dispatch(doResolveUri(uri)),
|
|
getFile: (uri) => dispatch(doFileGet(uri, false)),
|
|
editCollection: (id, params) => dispatch(doCollectionEdit(id, params)),
|
|
});
|
|
|
|
export default connect(select, perform)(ClaimPreview);
|