diff --git a/ui/component/page/index.js b/ui/component/page/index.js index 276f4b6d9..dd41e0fa9 100644 --- a/ui/component/page/index.js +++ b/ui/component/page/index.js @@ -1,9 +1,4 @@ import { connect } from 'react-redux'; -import { selectUserVerifiedEmail } from 'lbryinc'; import Page from './view'; -const select = state => ({ - authenticated: Boolean(selectUserVerifiedEmail(state)), -}); - -export default connect(select)(Page); +export default connect()(Page); diff --git a/ui/component/page/view.jsx b/ui/component/page/view.jsx index f32da24dc..61a0389e8 100644 --- a/ui/component/page/view.jsx +++ b/ui/component/page/view.jsx @@ -12,20 +12,18 @@ type Props = { autoUpdateDownloaded: boolean, isUpgradeAvailable: boolean, authPage: boolean, - authenticated: boolean, noHeader: boolean, }; function Page(props: Props) { - const { children, className, authPage = false, authenticated, noHeader } = props; - const obscureSideNavigation = IS_WEB ? !authenticated : false; + const { children, className, authPage = false, noHeader } = props; return ( {!noHeader &&
}
{children}
- {!authPage && !noHeader && } + {!authPage && !noHeader && }
); diff --git a/ui/component/sideNavigation/view.jsx b/ui/component/sideNavigation/view.jsx index aa6a7c3fd..cc9b39383 100644 --- a/ui/component/sideNavigation/view.jsx +++ b/ui/component/sideNavigation/view.jsx @@ -19,7 +19,6 @@ type Props = { subscriptions: Array, followedTags: Array, email: ?string, - obscureSideNavigation: boolean, uploadCount: number, sticky: boolean, expanded: boolean, @@ -31,7 +30,6 @@ function SideNavigation(props: Props) { const { subscriptions, followedTags, - obscureSideNavigation, uploadCount, doSignOut, email, @@ -46,6 +44,9 @@ function SideNavigation(props: Props) { getSideInformation(pathname) ); + const isPersonalized = !IS_WEB || isAuthenticated; + const requireAuthOnPersonalizedActions = IS_WEB; + function getSideInformation(path) { switch (path) { case `/$/${PAGES.CHANNELS_FOLLOWING}`: @@ -64,12 +65,13 @@ function SideNavigation(props: Props) { setSideInformation(sideInfo); }, [pathname, setSideInformation]); - function buildLink(path, label, icon, onClick) { + function buildLink(path, label, icon, onClick, requiresAuth = false) { return { navigate: path ? `$/${path}` : '/', label, icon, onClick, + requiresAuth, }; } @@ -82,12 +84,6 @@ function SideNavigation(props: Props) {
{children}
); - // @if TARGET='web' - if (obscureSideNavigation) { - return ; - } - // @endif - return ( + // @if TARGET='web' + {!isAuthenticated && !expanded && } + // @endif ); } diff --git a/ui/page/home/view.jsx b/ui/page/home/view.jsx index e64c8bc60..2fe50a1f9 100644 --- a/ui/page/home/view.jsx +++ b/ui/page/home/view.jsx @@ -27,71 +27,62 @@ type RowDataItem = { function HomePage(props: Props) { const { followedTags, subscribedChannels, authenticated } = props; - const showAuthenticatedRows = authenticated || !IS_WEB; + const showPersonalizedChannels = (authenticated || !IS_WEB) && subscribedChannels && subscribedChannels.length > 0; + const showPersonalizedTags = (authenticated || !IS_WEB) && followedTags && followedTags.length > 0; + const showIndividualTags = showPersonalizedTags && followedTags.length < 5; let rowData: Array = []; - if (!showAuthenticatedRows) { + // if you are following channels, always show that first + if (showPersonalizedChannels) { + let releaseTime = `>${Math.floor( + moment() + .subtract(1, 'year') + .startOf('week') + .unix() + )}`; + + // Warning - hack below + // If users are following more than 20 channels or tags, limit results to stuff less than 6 months old + // This helps with timeout issues for users that are following a ton of stuff + // https://github.com/lbryio/lbry-sdk/issues/2420 + if (subscribedChannels.length > 20) { + releaseTime = `>${Math.floor( + moment() + .subtract(6, 'months') + .startOf('week') + .unix() + )}`; + } + rowData.push({ - title: 'Top Channels On LBRY', - link: `/$/${PAGES.DISCOVER}?claim_type=channel&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${ - CS.FRESH_ALL - }`, + title: 'Recent From Following', + link: `/$/${PAGES.CHANNELS_FOLLOWING}`, options: { - orderBy: ['effective_amount'], - claimType: ['channel'], + orderBy: ['release_time'], + releaseTime: releaseTime, + pageSize: subscribedChannels.length > 3 ? 8 : 4, + channelIds: subscribedChannels.map(subscription => { + const { channelClaimId } = parseURI(subscription.uri); + return channelClaimId; + }), }, }); } - if (showAuthenticatedRows) { - if (subscribedChannels && subscribedChannels.length > 0) { - let releaseTime = `>${Math.floor( - moment() - .subtract(1, 'year') - .startOf('week') - .unix() - )}`; - - // Warning - hack below - // If users are following more than 20 channels or tags, limit results to stuff less than 6 months old - // This helps with timeout issues for users that are following a ton of stuff - // https://github.com/lbryio/lbry-sdk/issues/2420 - if (subscribedChannels.length > 20) { - releaseTime = `>${Math.floor( - moment() - .subtract(6, 'months') - .startOf('week') - .unix() - )}`; - } + if (showPersonalizedTags && !showIndividualTags) { + rowData.push({ + title: 'Trending For Your Tags', + link: `/$/${PAGES.TAGS_FOLLOWING}`, + options: { + tags: followedTags.map(tag => tag.name), + claimType: ['stream'], + }, + }); + } + if (showPersonalizedTags && showIndividualTags) { + followedTags.forEach((tag: Tag) => { rowData.push({ - title: 'Recent From Following', - link: `/$/${PAGES.CHANNELS_FOLLOWING}`, - options: { - orderBy: ['release_time'], - releaseTime: releaseTime, - pageSize: subscribedChannels.length > 3 ? 8 : 4, - channelIds: subscribedChannels.map(subscription => { - const { channelClaimId } = parseURI(subscription.uri); - return channelClaimId; - }), - }, - }); - } - - if (followedTags.length === 0) { - rowData.push({ - title: 'Trending On LBRY', - link: `/$/${PAGES.DISCOVER}`, - options: { - pageSize: subscribedChannels.length > 0 ? 4 : 8, - }, - }); - } - - if (followedTags.length > 0 && followedTags.length < 5) { - const followedRows = followedTags.map((tag: Tag) => ({ title: `Trending for #${toCapitalCase(tag.name)}`, link: `/$/${PAGES.DISCOVER}?t=${tag.name}`, options: { @@ -99,87 +90,90 @@ function HomePage(props: Props) { tags: [tag.name], claimType: ['stream'], }, - })); - rowData.push(...followedRows); - } - - if (followedTags.length > 4) { - rowData.push({ - title: 'Trending For Your Tags', - link: `/$/${PAGES.TAGS_FOLLOWING}`, - options: { - tags: followedTags.map(tag => tag.name), - claimType: ['stream'], - }, }); - } + }); + } + + rowData.push({ + title: 'Top Content from Today', + link: `/$/${PAGES.DISCOVER}?${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_DAY}`, + options: { + pageSize: showPersonalizedChannels || showPersonalizedTags ? 4 : 8, + orderBy: ['effective_amount'], + claimType: ['stream'], + releaseTime: `>${Math.floor( + moment() + .subtract(1, 'day') + .startOf('day') + .unix() + )}`, + }, + }); + + rowData.push({ + title: 'Trending On LBRY', + link: `/$/${PAGES.DISCOVER}`, + options: { + pageSize: showPersonalizedChannels || showPersonalizedTags ? 4 : 8, + }, + }); + + if (!showPersonalizedChannels) { + rowData.push({ + title: 'Top Channels On LBRY', + link: `/$/${PAGES.DISCOVER}?claim_type=channel&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_ALL}`, + options: { + orderBy: ['effective_amount'], + claimType: ['channel'], + }, + }); } - // Everyone rowData.push( { - title: 'Top Content Last Week', - link: `/$/${PAGES.DISCOVER}?${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_WEEK}`, + title: 'Trending Classics', + link: `/$/${PAGES.DISCOVER}?${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TRENDING}&${CS.FRESH_KEY}=${CS.FRESH_WEEK}`, options: { - orderBy: ['effective_amount'], pageSize: 4, claimType: ['stream'], - releaseTime: `>${Math.floor( + releaseTime: `<${Math.floor( moment() - .subtract(1, 'week') - .startOf('day') - .unix() - )}`, - }, - }, - { - title: '#HomePageCageMatch', - link: `/$/${PAGES.DISCOVER}?t=homepagecagematch&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${ - CS.FRESH_ALL - }`, - help: ( -
- -
- ), - options: { - tags: ['homepagecagematch'], - orderBy: ['effective_amount'], - timestamp: `>${Math.floor( - moment() - .subtract(1, 'week') + .subtract(6, 'month') .startOf('day') .unix() )}`, }, } + /* the cagematch will return in some form! - Jeremy + { + title: '#HomePageCageMatch', + link: `/$/${PAGES.DISCOVER}?t=homepagecagematch&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${ + CS.FRESH_ALL + }`, + help: ( +
+ +
+ ), + options: { + tags: ['homepagecagematch'], + orderBy: ['effective_amount'], + timestamp: `>${Math.floor( + moment() + .subtract(1, 'week') + .startOf('day') + .unix() + )}`, + }, + } */ ); - if (!showAuthenticatedRows) { - rowData.push({ - title: '#lbry', - link: `/$/${PAGES.DISCOVER}?t=lbry&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_ALL}`, - options: { - tags: ['lbry'], - orderBy: ['effective_amount'], - pageSize: 4, - }, - }); - } - - if (showAuthenticatedRows) { - rowData.push({ - title: 'Trending On LBRY', - link: `/$/${PAGES.DISCOVER}`, - }); - } - rowData.push({ title: 'Latest From @lbrycast', link: `/@lbrycast:4`, diff --git a/ui/scss/component/_navigation.scss b/ui/scss/component/_navigation.scss index b88f5bde2..104e9932a 100644 --- a/ui/scss/component/_navigation.scss +++ b/ui/scss/component/_navigation.scss @@ -9,6 +9,10 @@ } } +.navigation + .ads-wrapper { + margin-top: var(--spacing-large); +} + .navigation__secondary { margin-top: var(--spacing-large); }