Merge pull request #2023 from chrisza4/clickable-channel

Add support for Clickable channel names on Explore page headings (#1820)

CHANGELOG.md

@@ -8,6 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 ### Added
  * Allow typing of encryption password without clicking entry box ([#1977](https://github.com/lbryio/lbry-desktop/pull/1977))
  * Focus on search bar with {cmd,ctrl} + "l" ([#2003](https://github.com/lbryio/lbry-desktop/pull/2003))
+ * Add support for clickable channel names on explore page headings ([#2023](https://github.com/lbryio/lbry-desktop/pull/2023))
 ### Changed
  * Make tooltip smarter ([#1979](https://github.com/lbryio/lbry-desktop/pull/1979))
  * Change channel pages to have 48 items instead of 10 ([#2002](https://github.com/lbryio/lbry-desktop/pull/2002))

src/renderer/page/discover/view.jsx

@@ -31,6 +31,20 @@ class DiscoverPage extends React.PureComponent<Props> {
     this.clearContinuousFetch();
   }
 
+  getCategoryLinkPartByCategory(category: string) {
+    const channelName = category.substr(category.indexOf('@'));
+    if (!channelName.includes('#')) {
+      return null;
+    }
+    return channelName;
+  }
+
+  trimClaimIdFromCategory(category: string) {
+    return category.split('#')[0];
+  }
+
+  continousFetch: ?IntervalID;
+
   clearContinuousFetch() {
     if (this.continousFetch) {
       clearInterval(this.continousFetch);
@@ -38,24 +52,26 @@ class DiscoverPage extends React.PureComponent<Props> {
     }
   }
 
-  continousFetch: ?number;
-
   render() {
     const { featuredUris, fetchingFeaturedUris } = this.props;
     const hasContent = typeof featuredUris === 'object' && Object.keys(featuredUris).length;
     const failedToLoad = !fetchingFeaturedUris && !hasContent;
-
     return (
       <Page noPadding isLoading={!hasContent && fetchingFeaturedUris}>
         {hasContent &&
           Object.keys(featuredUris).map(
             category =>
               featuredUris[category].length ? (
-                <CategoryList key={category} category={category} names={featuredUris[category]} />
+                <CategoryList
+                  key={category}
+                  category={this.trimClaimIdFromCategory(category)}
+                  names={featuredUris[category]}
+                  categoryLink={this.getCategoryLinkPartByCategory(category)}
+                />
               ) : (
                 <CategoryList
                   key={category}
-                  category={category.split('#')[0]}
+                  category={this.trimClaimIdFromCategory(category)}
                   categoryLink={category}
                 />
               )