diff --git a/ui/component/claimPreview/index.js b/ui/component/claimPreview/index.js index d93977ffc..79039fda3 100644 --- a/ui/component/claimPreview/index.js +++ b/ui/component/claimPreview/index.js @@ -6,7 +6,7 @@ import { makeSelectClaimIsPending, makeSelectReflectingClaimForUri, makeSelectClaimWasPurchased, - makeSelectClaimIsStreamPlaceholder, + isStreamPlaceholderClaim, makeSelectTitleForUri, selectDateForUri, } from 'redux/selectors/claims'; @@ -21,7 +21,7 @@ import { doResolveUri } from 'redux/actions/claims'; import { doCollectionEdit } from 'redux/actions/collections'; import { doFileGet } from 'redux/actions/file'; import { selectBanStateForUri } from 'lbryinc'; -import { makeSelectIsActiveLivestream } from 'redux/selectors/livestream'; +import { selectIsActiveLivestreamForUri } from 'redux/selectors/livestream'; import { selectShowMatureContent } from 'redux/selectors/settings'; import { makeSelectHasVisitedUri } from 'redux/selectors/content'; import { selectIsSubscribedForUri } from 'redux/selectors/subscriptions'; @@ -33,6 +33,7 @@ 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, @@ -51,8 +52,8 @@ const select = (state, props) => { isSubscribed: props.uri && selectIsSubscribedForUri(state, props.uri), streamingUrl: props.uri && makeSelectStreamingUrlForUri(props.uri)(state), wasPurchased: props.uri && makeSelectClaimWasPurchased(props.uri)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), - isLivestreamActive: makeSelectIsActiveLivestream(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), diff --git a/ui/component/claimPreviewSubtitle/index.js b/ui/component/claimPreviewSubtitle/index.js index 9ffbee866..d982c781d 100644 --- a/ui/component/claimPreviewSubtitle/index.js +++ b/ui/component/claimPreviewSubtitle/index.js @@ -1,10 +1,6 @@ import * as PAGES from 'constants/pages'; import { connect } from 'react-redux'; -import { - selectClaimForUri, - makeSelectClaimIsPending, - makeSelectClaimIsStreamPlaceholder, -} from 'redux/selectors/claims'; +import { selectClaimForUri, makeSelectClaimIsPending, isStreamPlaceholderClaim } from 'redux/selectors/claims'; import { doClearPublish, doPrepareEdit } from 'redux/actions/publish'; import { push } from 'connected-react-router'; import ClaimPreviewSubtitle from './view'; @@ -17,7 +13,7 @@ const select = (state, props) => { return { claim, pending: makeSelectClaimIsPending(props.uri)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestream: isStreamPlaceholderClaim(claim), subCount: isChannel ? selectSubCountForUri(state, props.uri) : 0, }; }; diff --git a/ui/component/claimPreviewTile/index.js b/ui/component/claimPreviewTile/index.js index 240d7eece..6c032b262 100644 --- a/ui/component/claimPreviewTile/index.js +++ b/ui/component/claimPreviewTile/index.js @@ -4,13 +4,13 @@ import { makeSelectIsUriResolving, getThumbnailFromClaim, makeSelectTitleForUri, - makeSelectClaimIsStreamPlaceholder, + isStreamPlaceholderClaim, selectDateForUri, } from 'redux/selectors/claims'; import { doFileGet } from 'redux/actions/file'; import { doResolveUri } from 'redux/actions/claims'; import { selectViewCountForUri, selectBanStateForUri } from 'lbryinc'; -import { makeSelectIsActiveLivestream } from 'redux/selectors/livestream'; +import { selectIsActiveLivestreamForUri } from 'redux/selectors/livestream'; import { selectShowMatureContent } from 'redux/selectors/settings'; import { isClaimNsfw } from 'util/claim'; import ClaimPreviewTile from './view'; @@ -20,6 +20,7 @@ const select = (state, props) => { const claim = props.uri && makeSelectClaimForUri(props.uri)(state); 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, @@ -31,8 +32,8 @@ const select = (state, props) => { banState: selectBanStateForUri(state, props.uri), showMature: selectShowMatureContent(state), isMature: claim ? isClaimNsfw(claim) : false, - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), - isLivestreamActive: makeSelectIsActiveLivestream(props.uri)(state), + isLivestream, + isLivestreamActive: isLivestream && selectIsActiveLivestreamForUri(state, props.uri), viewCount: selectViewCountForUri(state, props.uri), }; }; diff --git a/ui/component/claimType/index.js b/ui/component/claimType/index.js index 98034acda..7758504bf 100644 --- a/ui/component/claimType/index.js +++ b/ui/component/claimType/index.js @@ -1,10 +1,10 @@ import { connect } from 'react-redux'; -import { makeSelectClaimForUri, makeSelectClaimIsStreamPlaceholder } from 'redux/selectors/claims'; +import { makeSelectClaimForUri, selectIsStreamPlaceholderForUri } from 'redux/selectors/claims'; import FileType from './view'; const select = (state, props) => ({ claim: makeSelectClaimForUri(props.uri)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestream: selectIsStreamPlaceholderForUri(state, props.uri), }); export default connect(select)(FileType); diff --git a/ui/component/fileActions/index.js b/ui/component/fileActions/index.js index 951d19f17..b2ca9dafa 100644 --- a/ui/component/fileActions/index.js +++ b/ui/component/fileActions/index.js @@ -3,7 +3,7 @@ import { selectClaimIsMine, selectClaimForUri, selectHasChannels, - makeSelectClaimIsStreamPlaceholder, + selectIsStreamPlaceholderForUri, makeSelectTagInClaimOrChannelForUri, } from 'redux/selectors/claims'; import { makeSelectStreamingUrlForUri, makeSelectFileInfoForUri } from 'redux/selectors/file_info'; @@ -27,7 +27,7 @@ const select = (state, props) => { renderMode: makeSelectFileRenderModeForUri(props.uri)(state), costInfo: makeSelectCostInfoForUri(props.uri)(state), hasChannels: selectHasChannels(state), - isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestreamClaim: selectIsStreamPlaceholderForUri(state, props.uri), reactionsDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state), streamingUrl: makeSelectStreamingUrlForUri(props.uri)(state), }; diff --git a/ui/component/fileType/index.js b/ui/component/fileType/index.js index 67e40411b..d2ee7a7c6 100644 --- a/ui/component/fileType/index.js +++ b/ui/component/fileType/index.js @@ -1,11 +1,11 @@ import { connect } from 'react-redux'; import { makeSelectMediaTypeForUri } from 'redux/selectors/file_info'; -import { makeSelectClaimIsStreamPlaceholder } from 'redux/selectors/claims'; +import { selectIsStreamPlaceholderForUri } from 'redux/selectors/claims'; import FileType from './view'; const select = (state, props) => ({ mediaType: makeSelectMediaTypeForUri(props.uri)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestream: selectIsStreamPlaceholderForUri(state, props.uri), }); export default connect(select)(FileType); diff --git a/ui/component/publishFile/index.js b/ui/component/publishFile/index.js index 6d2089a4f..4483176f5 100644 --- a/ui/component/publishFile/index.js +++ b/ui/component/publishFile/index.js @@ -2,7 +2,7 @@ import { connect } from 'react-redux'; import { selectBalance } from 'redux/selectors/wallet'; import { selectIsStillEditing, makeSelectPublishFormValue } from 'redux/selectors/publish'; import { doUpdatePublishForm, doClearPublish } from 'redux/actions/publish'; -import { makeSelectClaimIsStreamPlaceholder } from 'redux/selectors/claims'; +import { selectIsStreamPlaceholderForUri } from 'redux/selectors/claims'; import { doToast } from 'redux/actions/notifications'; import { selectFfmpegStatus } from 'redux/selectors/settings'; import PublishPage from './view'; @@ -20,7 +20,7 @@ const select = (state, props) => ({ size: makeSelectPublishFormValue('fileSize')(state), duration: makeSelectPublishFormValue('fileDur')(state), isVid: makeSelectPublishFormValue('fileVid')(state), - isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestreamClaim: selectIsStreamPlaceholderForUri(state, props.uri), }); const perform = (dispatch) => ({ diff --git a/ui/component/publishForm/index.js b/ui/component/publishForm/index.js index 77310640a..4a4d3c1b5 100644 --- a/ui/component/publishForm/index.js +++ b/ui/component/publishForm/index.js @@ -15,7 +15,7 @@ import { selectIsResolvingPublishUris, selectMyClaimForUri, } from 'redux/selectors/publish'; -import { makeSelectClaimIsStreamPlaceholder } from 'redux/selectors/claims'; +import { selectIsStreamPlaceholderForUri } from 'redux/selectors/claims'; import * as RENDER_MODES from 'constants/file_render_modes'; import * as SETTINGS from 'constants/settings'; import { doClaimInitialRewards } from 'redux/actions/rewards'; @@ -45,7 +45,7 @@ const select = (state) => { user: selectUser(state), // The winning claim for a short lbry uri amountNeededForTakeover: selectTakeOverAmount(state), - isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(permanentUrl)(state), + isLivestreamClaim: selectIsStreamPlaceholderForUri(state, permanentUrl), isPostClaim, permanentUrl, // My previously published claims under this short lbry uri diff --git a/ui/modal/modalPublishPreview/index.js b/ui/modal/modalPublishPreview/index.js index 8a3056169..440eee6c0 100644 --- a/ui/modal/modalPublishPreview/index.js +++ b/ui/modal/modalPublishPreview/index.js @@ -2,7 +2,7 @@ import { connect } from 'react-redux'; import { doHideModal } from 'redux/actions/app'; import ModalPublishPreview from './view'; import { makeSelectPublishFormValue, selectPublishFormValues, selectIsStillEditing } from 'redux/selectors/publish'; -import { selectMyChannelClaims, makeSelectClaimIsStreamPlaceholder } from 'redux/selectors/claims'; +import { selectMyChannelClaims, selectIsStreamPlaceholderForUri } from 'redux/selectors/claims'; import * as SETTINGS from 'constants/settings'; import { selectFfmpegStatus, makeSelectClientSetting } from 'redux/selectors/settings'; import { doPublishDesktop } from 'redux/actions/publish'; @@ -21,7 +21,7 @@ const select = (state, props) => { isStillEditing: selectIsStillEditing(state), ffmpegStatus: selectFfmpegStatus(state), enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state), - isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(editingUri)(state), + isLivestreamClaim: selectIsStreamPlaceholderForUri(state, editingUri), }; }; diff --git a/ui/page/file/index.js b/ui/page/file/index.js index 743a5a792..27a59d8f4 100644 --- a/ui/page/file/index.js +++ b/ui/page/file/index.js @@ -4,7 +4,7 @@ import { withRouter } from 'react-router-dom'; import { selectClaimIsNsfwForUri, makeSelectTagInClaimOrChannelForUri, - makeSelectClaimIsStreamPlaceholder, + selectIsStreamPlaceholderForUri, } from 'redux/selectors/claims'; import { makeSelectFileInfoForUri } from 'redux/selectors/file_info'; import { doFetchFileInfo } from 'redux/actions/file_info'; @@ -32,7 +32,7 @@ const select = (state, props) => { renderMode: makeSelectFileRenderModeForUri(props.uri)(state), videoTheaterMode: makeSelectClientSetting(SETTINGS.VIDEO_THEATER_MODE)(state), commentsDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(props.uri)(state), + isLivestream: selectIsStreamPlaceholderForUri(state, props.uri), collection: makeSelectCollectionForId(collectionId)(state), collectionId, position: makeSelectContentPositionForUri(props.uri)(state), diff --git a/ui/page/show/index.js b/ui/page/show/index.js index 43db18f06..1a57e5a57 100644 --- a/ui/page/show/index.js +++ b/ui/page/show/index.js @@ -10,7 +10,7 @@ import { makeSelectTitleForUri, selectClaimIsMine, makeSelectClaimIsPending, - makeSelectClaimIsStreamPlaceholder, + selectIsStreamPlaceholderForUri, } from 'redux/selectors/claims'; import { makeSelectCollectionForId, @@ -79,7 +79,7 @@ const select = (state, props) => { title: makeSelectTitleForUri(uri)(state), claimIsMine: selectClaimIsMine(state, claim), claimIsPending: makeSelectClaimIsPending(uri)(state), - isLivestream: makeSelectClaimIsStreamPlaceholder(uri)(state), + isLivestream: selectIsStreamPlaceholderForUri(state, uri), collection: makeSelectCollectionForId(collectionId)(state), collectionId: collectionId, collectionUrls: makeSelectUrlsForCollectionId(collectionId)(state), diff --git a/ui/redux/selectors/claims.js b/ui/redux/selectors/claims.js index bb014d930..16bf6453b 100644 --- a/ui/redux/selectors/claims.js +++ b/ui/redux/selectors/claims.js @@ -705,14 +705,14 @@ export const makeSelectClaimHasSource = (uri: string) => return Boolean(claim.value.source); }); -export const makeSelectClaimIsStreamPlaceholder = (uri: string) => - createSelector(makeSelectClaimForUri(uri), (claim) => { - if (!claim) { - return false; - } +export const isStreamPlaceholderClaim = (claim: ?StreamClaim) => { + return claim ? Boolean(claim.value_type === 'stream' && !claim.value.source) : false; +}; - return Boolean(claim.value_type === 'stream' && !claim.value.source); - }); +export const selectIsStreamPlaceholderForUri = (state: State, uri: string) => { + const claim = selectClaimForUri(state, uri); + return isStreamPlaceholderClaim(claim); +}; export const selectTotalStakedAmountForChannelUri = createCachedSelector(selectClaimForUri, (claim) => { if (!claim || !claim.amount || !claim.meta || !claim.meta.support_amount) { diff --git a/ui/redux/selectors/livestream.js b/ui/redux/selectors/livestream.js index 9d39bf7c3..c5a55540a 100644 --- a/ui/redux/selectors/livestream.js +++ b/ui/redux/selectors/livestream.js @@ -1,5 +1,6 @@ // @flow import { createSelector } from 'reselect'; +import { createCachedSelector } from 're-reselect'; import { selectMyClaims, selectPendingClaims } from 'redux/selectors/claims'; type State = { livestream: any }; @@ -45,20 +46,16 @@ export const makeSelectPendingLivestreamsForChannelId = (channelId: string) => export const selectActiveLivestreams = (state: State) => selectState(state).activeLivestreams; -export const makeSelectIsActiveLivestream = (uri: string) => - createSelector(selectState, (state) => { - const activeLivestreamValues = (state.activeLivestreams && Object.values(state.activeLivestreams)) || []; - // $FlowFixMe - return Boolean(activeLivestreamValues.find((v) => v.latestClaimUri === uri)); - }); +export const selectIsActiveLivestreamForUri = createCachedSelector( + (state, uri) => uri, + selectActiveLivestreams, + (uri, activeLivestreams) => { + if (!uri || !activeLivestreams) { + return false; + } -export const makeSelectActiveLivestreamUris = (uri: string) => - createSelector(selectState, (state) => { - const activeLivestreamValues = (state.activeLivestreams && Object.values(state.activeLivestreams)) || []; - const uris = []; - activeLivestreamValues.forEach((v) => { - // $FlowFixMe - if (v.latestClaimUri) uris.push(v.latestClaimUri); - }); - return uris; - }); + const activeLivestreamValues = Object.values(activeLivestreams); + // $FlowFixMe - unable to resolve latestClaimUri + return activeLivestreamValues.some((v) => v.latestClaimUri === uri); + } +)((state, uri) => String(uri));