integrate Link react router to material ui Link

Link.tsx

import React, { RefObject } from 'react';
import { Link as RouterLink, LinkProps as RouterLinkProps } from 'react-router-dom';
import Link from '@material-ui/core/Link';
import { LinkProps } from '@material-ui/core';

type refType = ((instance: HTMLAnchorElement | null) => void) | RefObject<HTMLAnchorElement> | null | undefined; 

type CustomLinkProps = RouterLinkProps & LinkProps;

const LinkBehavior = React.forwardRef((props: CustomLinkProps, ref: refType) => {
  const { to, ...restProps } = props;
  return (<RouterLink ref={ref} to={to} {...restProps} />)
});

/**
 * Custom Link with behavior of Link react router
 * and style of material ui
 */
const CustomLink: React.FunctionComponent<CustomLinkProps> = ({underline = 'none', children, ...restProps}) => {
  return <Link component={LinkBehavior} {...restProps} underline={underline}>{children}</Link>
}

export default CustomLink;