Add icon for external links (#1098)

* feat: add external link styling

* feat: exclude links to k6.io

Author: yasell

src/components/shared/link/link.module.scss

@@ -49,3 +49,11 @@
     }
   }
 }
+.external {
+  display: inline-flex;
+  align-items: center;
+
+  svg {
+    margin-left: 6px;
+  }
+}

src/components/shared/link/link.view.js

@@ -1,6 +1,9 @@
 import React from 'react';
 import { LATEST_VERSION } from 'utils/versioning';
 
+import styles from './link.module.scss';
+import ExternalIcon from './svg/exnternal-link-icon.inline.svg';
+
 export const Link =
   (version) =>
   ({ href, children, ...otherProps }) => {
@@ -9,7 +12,18 @@ export const Link =
         ? href.replace('/javascript-api/', `/${version}/javascript-api/`)
         : href;
 
-    return (
+    return href.startsWith('http') && !href.includes('k6.io/') ? (
+      <a
+        className={styles.external}
+        href={newHref}
+        target="_blank"
+        rel="noreferrer"
+        {...otherProps}
+      >
+        {children}
+        <ExternalIcon />
+      </a>
+    ) : (
       <a href={newHref} {...otherProps}>
         {children}
       </a>