// @flow import * as ICONS from 'constants/icons'; import * as PAGES from 'constants/pages'; import React from 'react'; import Page from 'component/page'; import Button from 'component/button'; import ClaimTilesDiscover from 'component/claimTilesDiscover'; import { toCapitalCase } from 'util/string'; type Props = { followedTags: Array, subscribedChannels: Array, blockedChannels: Array, }; type RowDataItem = { title: string, link?: string, help?: any, options?: {}, }; function ChannelsFollowingDiscover(props: Props) { const { followedTags, subscribedChannels, blockedChannels } = props; let rowData: Array = []; const notChannels = subscribedChannels .map(({ uri }) => uri) .concat(blockedChannels) .map(uri => uri.split('#')[1]); rowData.push({ title: 'Top Channels Of All Time', options: { pageSize: 8, claimType: 'channel', orderBy: ['effective_amount'], }, }); rowData.push({ title: 'Latest From @lbrycast', link: `/@lbrycast:4`, options: { orderBy: ['release_time'], pageSize: 8, channelIds: ['4c29f8b013adea4d5cca1861fb2161d5089613ea'], }, }); rowData.push({ title: 'Trending Channels', options: { pageSize: 4, claimType: 'channel', orderBy: ['trending_group', 'trending_mixed'], }, }); if (followedTags.length > 0 && followedTags.length < 5) { const followedRows = followedTags.map((tag: Tag) => ({ title: `Trending Channels for #${toCapitalCase(tag.name)}`, link: `/$/${PAGES.TAGS}?t=${tag.name}&claim_type=channel`, options: { claimType: 'channel', pageSize: 4, tags: [tag.name], }, })); rowData.push(...followedRows); } if (followedTags.length > 4) { rowData.push({ title: 'Trending For Your Tags', link: `/$/${PAGES.TAGS_FOLLOWING}?claim_type=channel`, options: { claimType: 'channel', tags: followedTags.map(tag => tag.name), }, }); } const rowDataWithGenericOptions = rowData.map(row => { return { ...row, options: { ...row.options, notChannels, }, }; }); return ( {rowDataWithGenericOptions.map(({ title, link, help, options = {} }) => (

{link ? (

))}
); } export default ChannelsFollowingDiscover;