fix modal and add basic filter for url

src/renderer/component/externalLink/view.jsx

@@ -4,10 +4,10 @@ import { MODALS } from 'lbry-redux';
 import Button from 'component/button';
 
 type Props = {
-  href?: string,
+  href: string,
   title?: string,
   children: React.Node,
-  openModal: ({ id: string }, { url: string }) => void,
+  openModal: ({ id: string }, { uri: string }) => void,
 };
 
 class ExternalLink extends React.PureComponent<Props> {
@@ -15,21 +15,38 @@ class ExternalLink extends React.PureComponent<Props> {
     href: null,
     title: null,
   };
-  render() {
+
+  createLink() {
     const { href, title, children, openModal } = this.props;
-    return href ? (
+
+    // Regex for url protocol
+    const protocolRegex = new RegExp('^(https?|lbry)+:', 'i');
+    const protocol = href ? protocolRegex.exec(href) : null;
+
+    // Return plain text if no valid url
+    let element = <span>{children}</span>;
+
+    // Return external link if protocol is http or https
+    if (protocol && (protocol[0] === 'http:' || protocol[0] === 'https:')) {
+      element = (
         <Button
           button="link"
-        className="btn--external-link"
           title={title}
-        onClick={() => openModal({ id: MODALS.CONFIRM_EXTERNAL_LINK }, { url: href })}
+          className="btn--external-link"
+          onClick={() => openModal({ id: MODALS.CONFIRM_EXTERNAL_LINK }, { uri: href })}
         >
           {children}
         </Button>
-    ) : (
-      <span>children</span>
       );
     }
+
+    return element;
+  }
+
+  render() {
+    const RenderLink = () => this.createLink();
+    return <RenderLink />;
+  }
 }
 
 export default ExternalLink;

src/renderer/modal/modalOpenExternalLink/view.jsx

@@ -4,22 +4,22 @@ import { Modal } from 'modal/modal';
 import { shell } from 'electron';
 
 type Props = {
-  url: string,
+  uri: string,
   closeModal: () => void,
 };
 
 class ModalOpenExternalLink extends React.PureComponent<Props> {
   openExternalLink() {
-    const { url, closeModal } = this.props;
+    const { uri, closeModal } = this.props;
     const { openExternal } = shell;
-    if (url) {
-      openExternal(url);
+    if (uri) {
+      openExternal(uri);
     }
     closeModal();
   }
 
   render() {
-    const { url, closeModal } = this.props;
+    const { uri, closeModal } = this.props;
     return (
       <Modal
         isOpen
@@ -31,7 +31,7 @@ class ModalOpenExternalLink extends React.PureComponent<Props> {
       >
         <h1>Warning!</h1>
         <p>{__('This link leads to an external website.')}</p>
-        <blockquote>{url}</blockquote>
+        <blockquote>{uri}</blockquote>
         <p>
           {__(
             'LBRY Inc is not responsible for its content, click continue to proceed at your own risk.'