From efde2a2484daed1d1144c698b609a4674c044b93 Mon Sep 17 00:00:00 2001
From: Sean Yesmunt <sean@lbry.io>
Date: Tue, 18 Feb 2020 10:26:58 -0500
Subject: [PATCH] add additional rows to channel discovery page

---
 ui/page/channelsFollowingDiscover/index.js |  2 +
 ui/page/channelsFollowingDiscover/view.jsx | 56 ++++++++++++++++++++--
 2 files changed, 53 insertions(+), 5 deletions(-)

diff --git a/ui/page/channelsFollowingDiscover/index.js b/ui/page/channelsFollowingDiscover/index.js
index dfd8bb014..e749abcaf 100644
--- a/ui/page/channelsFollowingDiscover/index.js
+++ b/ui/page/channelsFollowingDiscover/index.js
@@ -1,9 +1,11 @@
 import { connect } from 'react-redux';
+import { selectFollowedTags } from 'lbry-redux';
 import { selectSubscriptions, selectSuggestedChannels } from 'redux/selectors/subscriptions';
 import { doFetchRecommendedSubscriptions } from 'redux/actions/subscriptions';
 import ChannelsFollowingManagePage from './view';
 
 const select = state => ({
+  followedTags: selectFollowedTags(state),
   subscribedChannels: selectSubscriptions(state),
   suggestedSubscriptions: selectSuggestedChannels(state),
 });
diff --git a/ui/page/channelsFollowingDiscover/view.jsx b/ui/page/channelsFollowingDiscover/view.jsx
index d1037fa95..dc01afae6 100644
--- a/ui/page/channelsFollowingDiscover/view.jsx
+++ b/ui/page/channelsFollowingDiscover/view.jsx
@@ -5,8 +5,11 @@ 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 = {};
+type Props = {
+  followedTags: Array<Tag>,
+};
 
 type RowDataItem = {
   title: string,
@@ -16,18 +19,61 @@ type RowDataItem = {
 };
 
 function ChannelsFollowingDiscover(props: Props) {
+  const { followedTags } = props;
   let rowData: Array<RowDataItem> = [];
 
   rowData.push({
-    title: 'Top Channels On LBRY',
-    link: `/$/${PAGES.DISCOVER}`,
+    title: 'Top Channels Of All Time',
     options: {
-      pageSize: 12,
+      pageSize: 8,
       claimType: 'channel',
-      orderBy: ['trending_global', 'trending_mixed'],
+      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 for #${toCapitalCase(tag.name)}`,
+      link: `/$/${PAGES.TAGS}?t=${tag.name}`,
+      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}`,
+      options: {
+        claimType: 'channel',
+        tags: followedTags.map(tag => tag.name),
+      },
+    });
+  }
+
   return (
     <Page>
       {rowData.map(({ title, link, help, options = {} }) => (