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.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;