diff --git a/ui/component/fileViewCountInline/view.jsx b/ui/component/fileViewCountInline/view.jsx index d27a59748..02605e10c 100644 --- a/ui/component/fileViewCountInline/view.jsx +++ b/ui/component/fileViewCountInline/view.jsx @@ -1,11 +1,12 @@ // @flow import React from 'react'; import 'scss/component/_view_count.scss'; +import * as PAGES from 'constants/pages'; type Props = { uri: string, isLivestream?: boolean, - // --- select --- + // --- redux --- claim: ?StreamClaim, viewCount: string, lang: ?string, @@ -24,16 +25,18 @@ export default function FileViewCountInline(props: Props) { formattedViewCount = Number(viewCount).toLocaleString(); } - // Limit the view-count visibility to Channel Pages for now. We'll eventually + // Limit the view-count visibility to specific pages for now. We'll eventually // show it everywhere, so this band-aid would be the easiest to clean up // (only one place edit/remove). const pathname: string = window.location.pathname; - const isOnChannelPage = pathname && pathname.startsWith('/@') && pathname.indexOf('/', 1) === -1; + const isOnAllowedPage = + (pathname && pathname.startsWith('/@') && pathname.indexOf('/', 1) === -1) || // Channel Page + pathname === `/$/${PAGES.UPLOADS}`; - if (!viewCount || (claim && claim.repost_url) || isLivestream || !isOnChannelPage) { + if (!viewCount || (claim && claim.repost_url) || isLivestream || !isOnAllowedPage) { // (1) Currently, selectViewCountForUri doesn't differentiate between // un-fetched vs zero view-count. But since it's probably not ideal to - // highlight that a claim has 0 count, let's just not show anything. + // highlight that a claim has 0 view count, let's just not show anything. // (2) No idea how to get the repost source's claim ID from the repost claim, // so hiding it for now. return null; diff --git a/ui/page/fileListPublished/index.js b/ui/page/fileListPublished/index.js index a7a929049..aa91f0bff 100644 --- a/ui/page/fileListPublished/index.js +++ b/ui/page/fileListPublished/index.js @@ -4,10 +4,12 @@ import { selectMyClaimsPage, selectMyClaimsPageItemCount, selectFetchingMyClaimsPageError, + selectClaimsByUri, } from 'redux/selectors/claims'; import { selectUploadCount } from 'redux/selectors/publish'; import { doFetchClaimListMine, doCheckPendingClaims } from 'redux/actions/claims'; import { doClearPublish } from 'redux/actions/publish'; +import { doFetchViewCount } from 'lbryinc'; import FileListPublished from './view'; import { withRouter } from 'react-router'; import { MY_CLAIMS_PAGE_SIZE, PAGE_PARAM, PAGE_SIZE_PARAM } from 'constants/claim'; @@ -26,6 +28,7 @@ const select = (state, props) => { urlTotal: selectMyClaimsPageItemCount(state), error: selectFetchingMyClaimsPageError(state), uploadCount: selectUploadCount(state), + claimsByUri: selectClaimsByUri(state), }; }; @@ -34,6 +37,7 @@ const perform = (dispatch) => ({ fetchClaimListMine: (page, pageSize, resolve, filterBy) => dispatch(doFetchClaimListMine(page, pageSize, resolve, filterBy)), clearPublish: () => dispatch(doClearPublish()), + doFetchViewCount: (csv) => dispatch(doFetchViewCount(csv)), }); export default withRouter(connect(select, perform)(FileListPublished)); diff --git a/ui/page/fileListPublished/view.jsx b/ui/page/fileListPublished/view.jsx index c87ea8634..fadc46d8c 100644 --- a/ui/page/fileListPublished/view.jsx +++ b/ui/page/fileListPublished/view.jsx @@ -11,6 +11,7 @@ import WebUploadList from 'component/webUploadList'; import Spinner from 'component/spinner'; import Yrbl from 'component/yrbl'; import classnames from 'classnames'; +import useFetchViewCount from 'effects/use-fetch-view-count'; const FILTER_ALL = 'stream,repost'; const FILTER_UPLOADS = 'stream'; @@ -18,6 +19,7 @@ const FILTER_REPOSTS = 'repost'; type Props = { uploadCount: number, + claimsByUri: { [string]: any }, checkPendingPublishes: () => void, clearPublish: () => void, fetchClaimListMine: (number, number, boolean, Array) => void, @@ -27,11 +29,13 @@ type Props = { history: { replace: (string) => void, push: (string) => void }, page: number, pageSize: number, + doFetchViewCount: (claimIdCsv: string) => void, }; function FileListPublished(props: Props) { const { uploadCount, + claimsByUri, checkPendingPublishes, clearPublish, fetchClaimListMine, @@ -40,6 +44,7 @@ function FileListPublished(props: Props) { urlTotal, page, pageSize, + doFetchViewCount, } = props; const [filterBy, setFilterBy] = React.useState(FILTER_ALL); @@ -61,6 +66,8 @@ function FileListPublished(props: Props) { } }, [uploadCount, paramsString, filterBy, fetchClaimListMine]); + useFetchViewCount(!fetching, urls, claimsByUri, doFetchViewCount); + return (