LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

DiscoverPage: re-org, no functional change

Browse source 
- Avoid double loop in `isFollowing` (map + includes).
- Move calculations into functions, as most of the variables are only single-purpose. This makes it easier to find things and tweak. Only shared variables need to be at the top.
- Re-org to 'vars -- funcs -- effects -- return' file structure.
This commit is contained in:
infinite-persistence 2022-06-02 13:26:35 +08:00
parent c3aaadf4aa
commit 227b6e3011
No known key found for this signature in database
GPG key ID: B9C3252EDC3D0AA0
1 changed files with 90 additions and 68 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

98
ui/page/discover/view.jsx
View file

@ -77,13 +77,8 @@ function DiscoverPage(props: Props) {
const channelIds = dynamicRouteProps?.options?.channelIds || undefined;
const excludedChannelIds = dynamicRouteProps?.options?.excludedChannelIds || undefined;
const isFollowing = followedTags.map(({ name }) => name).includes(tag);
let label = isFollowing ? __('Following --[button label indicating a channel has been followed]--') : __('Follow');
if (isHovering && isFollowing) {
label = __('Unfollow');
}
const isFollowing = React.useMemo(() => followedTags.some((t) => t.name === tag), [tag, followedTags]);
const includeLivestreams = !tagsQuery;
const filters = { contentTypes: isCategory && !isWildWest ? CATEGORY_CONTENT_TYPES_FILTER : CS.CONTENT_TYPES };
// **************************************************************************
@ -102,7 +97,18 @@ function DiscoverPage(props: Props) {
);
}
// NOTE: the if-block below will never run because a Tag page is also
// "!dynamicRouteProps". However, using the existing channel Follow button
// to follow a tag looks confusing, so I'll leave things as-is for now.
if (tag && !isMobile) {
let label = isFollowing
? __('Following --[button label indicating a channel has been followed]--')
: __('Follow');
if (isHovering && isFollowing) {
label = __('Unfollow');
}
return (
<Button
ref={buttonRef}
@ -120,6 +126,7 @@ function DiscoverPage(props: Props) {
}
function getSubSection() {
const includeLivestreams = !tagsQuery;
if (includeLivestreams) {
return (
<LivestreamSection
@ -148,21 +155,7 @@ function DiscoverPage(props: Props) {
}
}
React.useEffect(() => {
if (repostedUri && !repostedClaimIsResolved) {
doResolveUri(repostedUri);
}
}, [repostedUri, repostedClaimIsResolved, doResolveUri]);
function handleFollowClick() {
if (tag) {
doToggleTagFollowDesktop(tag);
const nowFollowing = !isFollowing;
analytics.tagFollowEvent(tag, nowFollowing, 'tag-page');
}
}
function getHeaderLabel() {
let headerLabel;
if (repostedClaim) {
headerLabel = __('Reposts of %uri%', { uri: repostedUri });
@ -188,21 +181,61 @@ function DiscoverPage(props: Props) {
</span>
);
}
return headerLabel;
}
function getAds() {
return (
!isWildWest &&
!hasPremiumPlus && {
node: (index, lastVisibleIndex, pageSize) => {
if (pageSize && index < pageSize) {
return index === lastVisibleIndex ? <Ads small type="video" tileLayout={tileLayout} /> : null;
} else {
return index % (pageSize * 2) === 0 ? <Ads small type="video" tileLayout={tileLayout} /> : null;
}
},
}
);
}
function getReleaseTime() {
const categoryReleaseTime = dynamicRouteProps?.options?.releaseTime;
let releaseTime;
if (isWildWest) {
// The homepage definition currently does not support 'start-of-week', so
// continue to hardcode here for now.
releaseTime = `>${Math.floor(moment().subtract(0, 'hour').startOf('week').unix())}`;
return `>${Math.floor(moment().subtract(0, 'hour').startOf('week').unix())}`;
} else if (categoryReleaseTime) {
const hasFreshnessOverride = orderParam === CS.ORDER_BY_TOP && freshnessParam !== null;
if (!hasFreshnessOverride) {
releaseTime = categoryReleaseTime;
return categoryReleaseTime;
}
}
return undefined;
}
function handleFollowClick() {
if (tag) {
doToggleTagFollowDesktop(tag);
const nowFollowing = !isFollowing;
analytics.tagFollowEvent(tag, nowFollowing, 'tag-page');
}
}
// **************************************************************************
// **************************************************************************
React.useEffect(() => {
if (repostedUri && !repostedClaimIsResolved) {
doResolveUri(repostedUri);
}
}, [repostedUri, repostedClaimIsResolved, doResolveUri]);
// **************************************************************************
// **************************************************************************
return (
<Page
noFooter
@ -219,25 +252,14 @@ function DiscoverPage(props: Props) {
defaultOrderBy={isWildWest || tags ? CS.ORDER_BY_TRENDING : undefined}
claimType={claimType ? [claimType] : undefined}
defaultStreamType={isCategory && !isWildWest ? [CS.FILE_VIDEO, CS.FILE_AUDIO, CS.FILE_DOCUMENT] : undefined}
headerLabel={headerLabel}
headerLabel={getHeaderLabel()}
tags={tags}
hiddenNsfwMessage={<HiddenNsfw type="page" />}
repostedClaimId={repostedClaim ? repostedClaim.claim_id : null}
injectedItem={
!isWildWest &&
!hasPremiumPlus && {
node: (index, lastVisibleIndex, pageSize) => {
if (pageSize && index < pageSize) {
return index === lastVisibleIndex ? <Ads small type="video" tileLayout={tileLayout} /> : null;
} else {
return index % (pageSize * 2) === 0 ? <Ads small type="video" tileLayout={tileLayout} /> : null;
}
},
}
}
injectedItem={getAds()}
// TODO: find a better way to determine discover / wild west vs other modes release times
// for now including && !tags so that
releaseTime={releaseTime || undefined}
releaseTime={getReleaseTime()}
feeAmount={isWildWest || tags ? CS.FEE_AMOUNT_ANY : undefined}
channelIds={channelIds}
excludedChannelIds={excludedChannelIds}