Link fix

lib/components/Link.js

@@ -1,7 +1,7 @@
-import React from 'react';
+import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { Link as RouterLink } from 'react-router-dom';
+import MuiLink from '@material-ui/core/Link';
 import { withStyles } from '@material-ui/core/styles';
 import Icon from '@material-ui/core/Icon';
 
@@ -43,52 +43,45 @@ const styles = theme => ({
   },
 });
 
-class Link extends React.Component {
+class Link extends Component {
   render() {
     const {
-      classes = {},
+      classes,
       children,
+      component,
       to,
-      onClick,
-      external,
       footer,
       tooltip,
+      external,
+      onClick,
     } = this.props;
-    return external ? (
-      <a
+
+    return (
+      <MuiLink
         className={classNames(classes.base, {
           [classes.baseDefault]: !footer && !tooltip,
           [classes.baseFooter]: footer,
-          [classes.baseTooltip]: tooltip,
+          [classes.basetooltip]: tooltip,
         })}
-        target="_blank"
-        rel="noopener noreferrer"
-        href={to}
+        component={component}
+        to={to}
+        underline="none"
+        href={external ? to : null}
+        target={external ? '_blank' : null}
+        rel={external ? 'noopener noreferrer' : null}
         onClick={onClick}
       >
         {children}
-        {footer ? null : (
+        {footer ? null : external ? (
           <Icon
             className={classNames(
               'fa',
               'fa-external-link-alt',
               classes.externalIcon
             )}
           />
-        )}
-      </a>
-    ) : (
-      <RouterLink
-        className={classNames(classes.base, {
-          [classes.baseDefault]: !footer && !tooltip,
-          [classes.baseFooter]: footer,
-          [classes.basetooltip]: tooltip,
-        })}
-        to={to}
-        onClick={onClick}
-      >
-        {children}
-      </RouterLink>
+        ) : null}
+      </MuiLink>
     );
   }
 }
@@ -114,6 +107,6 @@ Link.defaultProps = {
   to: '/',
 };
 
-export { Link };
+// export { Link };
 
 export default withStyles(styles)(Link);

lib/components/NavBar.js

@@ -1,8 +1,7 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
+import Link from '@material-ui/core/Link';
 import AppBar from '@material-ui/core/AppBar';
 import Toolbar from '@material-ui/core/Toolbar';
-import Button from '@material-ui/core/Button';
 import Typography from '@material-ui/core/Typography';
 import { withStyles } from '@material-ui/core/styles';
 import classNames from 'classnames';
@@ -65,6 +64,7 @@ const NavBar = ({
   docs,
   contact,
   homepage,
+  linkComponent,
 }) => (
   <AppBar
     className={classNames(classes.navbar, {
@@ -76,9 +76,9 @@ const NavBar = ({
   >
     <Toolbar variant="dense">
       {homepage ? null : (
-        <Button component={Link} to="/" color="inherit">
+        <Link component={linkComponent} to="/">
           <OpenTargetsTitle name={name} />
-        </Button>
+        </Link>
       )}
       <div className={classes.flex} />
       {search ? search : null}

lib/components/OpenTargetsTitle.js

@@ -6,6 +6,8 @@ import classNames from 'classnames';
 const styles = () => ({
   root: {
     display: 'inline',
+    color: 'white',
+    paddingLeft: '8px',
   },
   fat: {
     fontWeight: 1100,

lib/components/SearchExamples.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
+// import { Link } from 'react-router-dom';
+import Link from '@material-ui/core/Link';
 import { withStyles } from '@material-ui/core/styles';
 import Button from '@material-ui/core/Button';
 

package.json

@@ -79,7 +79,6 @@
     "react": "16.8.6",
     "react-dom": "16.8.6",
     "react-measure": "^2.1.0",
-    "react-router-dom": "^5.0.1",
     "react-select": "^2.0.0",
     "typeface-inter": "^3.3.0"
   },
@@ -90,6 +89,5 @@
       "!lib/index.js",
       "!lib/setupTests.js"
     ]
-  },
-  "dependencies": {}
+  }
 }