From 6c02558f1b29bb98a696c8be8663b49c48006edc Mon Sep 17 00:00:00 2001
From: Danny Avila <messagedaniel@protonmail.com>
Date: Fri, 10 Mar 2023 09:44:40 -0500
Subject: [PATCH] feat: links open in new tab

---
 client/src/components/Messages/TabLink.jsx     | 15 +++++++++++++++
 client/src/components/Messages/TextWrapper.jsx | 14 +++++++++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)
 create mode 100644 client/src/components/Messages/TabLink.jsx

diff --git a/client/src/components/Messages/TabLink.jsx b/client/src/components/Messages/TabLink.jsx
new file mode 100644
index 0000000000..e095f85a6c
--- /dev/null
+++ b/client/src/components/Messages/TabLink.jsx
@@ -0,0 +1,15 @@
+import React from 'react';
+
+export default function TabLink(a) {
+  return (
+    <a
+      href={a.href}
+      title={a.title}
+      className={a.className}
+      target="_blank"
+      rel="noopener noreferrer"
+    >
+      {a.children}
+    </a>
+  );
+}
diff --git a/client/src/components/Messages/TextWrapper.jsx b/client/src/components/Messages/TextWrapper.jsx
index d4e528695e..28b8f6480c 100644
--- a/client/src/components/Messages/TextWrapper.jsx
+++ b/client/src/components/Messages/TextWrapper.jsx
@@ -2,10 +2,22 @@ import React from 'react';
 import Markdown from 'markdown-to-jsx';
 import Embed from './Embed';
 import Highlight from './Highlight';
+import TabLink from './TabLink';
 import regexSplit from '~/utils/regexSplit';
 import { wrapperRegex } from '~/utils';
 const { codeRegex, inLineRegex, markupRegex, languageMatch, newLineMatch } = wrapperRegex;
-const mdOptions = { wrapper: React.Fragment, forceWrapper: true };
+const mdOptions = {
+  wrapper: React.Fragment,
+  forceWrapper: true,
+  overrides: {
+    a: {
+      component: TabLink,
+      // props: {
+      //   className: 'foo'
+      // }
+    }
+  }
+};
 
 const inLineWrap = (parts) => {
   let previousElement = null;