Make Discover page channel names into links

src/renderer/component/fileCard/view.jsx

@@ -94,20 +94,22 @@ class FileCard extends React.PureComponent {
                 <TruncatedText lines={1}>{title}</TruncatedText>
               </div>
               <div className="card__subtitle">
-                <span className="card__indicators">
+                <span className="card__indicators card--file-subtitle">
                   <FilePrice uri={uri} />{" "}
                   {isRewardContent && <Icon icon={icons.FEATURED} />}{" "}
                   {fileInfo && <Icon icon={icons.LOCAL} />}
                 </span>
-                <UriIndicator uri={uri} smallCard />
+                <span className="card--file-subtitle">
+                  <UriIndicator uri={uri} link={true} span={true} smallCard />
+                </span>
               </div>
             </div>
-            {/* Test for nizuka's design: should we remove description?
+          </Link>
+          {/* Test for nizuka's design: should we remove description?
             <div className="card__content card__subtext card__subtext--two-lines">
               <TruncatedMarkdown lines={2}>{description}</TruncatedMarkdown>
             </div>
             */}
-          </Link>
         </div>
         {obscureNsfw && this.state.hovered && <NsfwOverlay />}
       </section>

src/renderer/component/link/view.jsx

@@ -16,6 +16,7 @@ const Link = props => {
     navigateParams,
     doNavigate,
     className,
+    span,
   } = props;
 
   const combinedClassName =
@@ -26,7 +27,8 @@ const Link = props => {
 
   const onClick =
     !props.onClick && navigate
-      ? () => {
+      ? e => {
+          e.stopPropagation();
           doNavigate(navigate, navigateParams || {});
         }
       : props.onClick;
@@ -44,16 +46,18 @@ const Link = props => {
     );
   }
 
-  return (
+  const linkProps = {
-    <a
+    className: combinedClassName,
-      className={combinedClassName}
+    href: href || "javascript:;",
-      href={href || "javascript:;"}
+    title,
-      title={title}
+    onClick,
-      onClick={onClick}
+    style,
-      {...("style" in props ? { style: style } : {})}
+  };
-    >
+
-      {content}
+  return span ? (
-    </a>
+    <span {...linkProps}>{content}</span>
+  ) : (
+    <a {...linkProps}>{content}</a>
   );
 };
 

src/renderer/component/uriIndicator/view.jsx

@@ -22,7 +22,7 @@ class UriIndicator extends React.PureComponent {
   }
 
   render() {
-    const { claim, link, uri, isResolvingUri, smallCard } = this.props;
+    const { claim, link, uri, isResolvingUri, smallCard, span } = this.props;
 
     if (isResolvingUri && !claim) {
       return <span className="empty">Validating...</span>;
@@ -91,6 +91,7 @@ class UriIndicator extends React.PureComponent {
         navigate="/show"
         navigateParams={{ uri: channelLink }}
         className="no-underline"
+        span={span}
       >
         {inner}
       </Link>