fix: rest MUI components - Introduced ForwardRef (#224)

* refactor(162): added forwardRef Card

* refactor(162): introduced forwardRefDivider

* refactor(162): introduced forwardRef MuiComponents

* refactor(162): introducing forwardRef

* refactor(162): introduced forwardRef

* refactor(162): introduced forwardRef

* fix(162): fixed link

* fix: fixed port number

* fix: fixed duplicated id

* fix: fixed ref iconbutton

* fix: updated snaps

* fix: fixed port

* fix: fixed eslint errors

* fix: the item should be a button

* fix: fixed eslint errors

src/components/Link/Link.test.tsx

@@ -1,14 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-
-import Link from './Link';
-
-describe('<Link /> component', () => {
-  const props = {
-    to: 'https://github.com/verdaccio/ui',
-  };
-  test('should render the component in default state', () => {
-    const wrapper = mount(<Link blank={true} to={props.to} />);
-    expect(wrapper.html()).toMatchSnapshot();
-  });
-});

src/components/Link/Link.tsx

@@ -1,15 +1,26 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
+import { Link as RouterLink } from 'react-router-dom';
 
-interface Props {
-  children?: ReactNode;
+import Text, { TextProps } from '../../muiComponents/Text';
+
+interface Props extends Pick<TextProps, 'variant'> {
+  external?: boolean;
+  className?: string;
   to: string;
-  blank?: boolean;
 }
 
-const Link: React.FC<Props> = ({ children, to = '#', blank = false, ...props }) => (
-  <a href={to} target={blank ? '_blank' : '_self'} {...props}>
-    {children}
-  </a>
-);
+/* eslint-disable verdaccio/jsx-spread */
+const Link: React.FC<Props> = ({ external, to, children, variant, className, ...props }) => {
+  const LinkTextContent = <Text variant={variant}>{children}</Text>;
+  return external ? (
+    <a className={className} href={to} rel="noopener noreferrer" target="_blank" {...props}>
+      {LinkTextContent}
+    </a>
+  ) : (
+    <RouterLink className={className} to={to} {...props}>
+      {LinkTextContent}
+    </RouterLink>
+  );
+};
 
 export default Link;

src/components/Link/__snapshots__/Link.test.tsx.snap

@@ -1,3 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`<Link /> component should render the component in default state 1`] = `"<a href=\\"https://github.com/verdaccio/ui\\" target=\\"_blank\\"></a>"`;