diff --git a/client/coral-admin/src/components/CommentBodyHighlighter.js b/client/coral-admin/src/components/CommentBodyHighlighter.js
index f58859648..055d24822 100644
--- a/client/coral-admin/src/components/CommentBodyHighlighter.js
+++ b/client/coral-admin/src/components/CommentBodyHighlighter.js
@@ -1,5 +1,5 @@
import React from 'react';
-import {linkRegexp} from '../utils/regexp';
+import {matchLinks} from '../utils';
const wordSeperator = /([.\s'"?!])/;
@@ -25,21 +25,18 @@ function markWords(body, words, keyPrefix) {
// markLinks looks for links inside `body` and highlights them by returning
// an array of React Elements.
function markLinks(body) {
- const tokens = body.split(linkRegexp);
+ const matches = matchLinks(body);
const content = [];
- let tmp = [];
- tokens
- .filter((token) => token)
- .forEach((token, i) => {
- if (token.match(linkRegexp)) {
- content.push(...tmp);
- tmp = [];
- content.push({token});
- return;
- }
- tmp.push(token);
- });
- content.push(...tmp);
+ let index = 0;
+ if (matches) {
+ matches
+ .forEach((match, i) => {
+ content.push(body.substring(index, match.index));
+ content.push({match.text});
+ index = match.lastIndex;
+ });
+ }
+ content.push(body.substring(index));
return content;
}
diff --git a/client/coral-admin/src/components/IfHasLink.js b/client/coral-admin/src/components/IfHasLink.js
index e6a96503d..73b335815 100644
--- a/client/coral-admin/src/components/IfHasLink.js
+++ b/client/coral-admin/src/components/IfHasLink.js
@@ -1,8 +1,8 @@
import React from 'react';
-import {linkRegexp} from '../utils/regexp';
+import {matchLinks} from '../utils';
export default ({text, children}) => {
- const hasLinks = text.match(linkRegexp);
+ const hasLinks = !!matchLinks(text);
if (!hasLinks) {
return null;
diff --git a/client/coral-admin/src/services/linkify.js b/client/coral-admin/src/services/linkify.js
new file mode 100644
index 000000000..c51d7261b
--- /dev/null
+++ b/client/coral-admin/src/services/linkify.js
@@ -0,0 +1,8 @@
+import LinkifyIt from 'linkify-it';
+import tlds from 'tlds';
+
+export function createLinkify() {
+ const linkify = new LinkifyIt();
+ linkify.tlds(tlds);
+ return linkify;
+}
diff --git a/client/coral-admin/src/utils/index.js b/client/coral-admin/src/utils/index.js
index db3fb132d..f78a7b631 100644
--- a/client/coral-admin/src/utils/index.js
+++ b/client/coral-admin/src/utils/index.js
@@ -1,3 +1,12 @@
+import LinkifyIt from 'linkify-it';
+import tlds from 'tlds';
+const linkify = new LinkifyIt();
+linkify.tlds(tlds);
+
+export function matchLinks(text) {
+ return linkify.match(text);
+}
+
export const isPremod = (mod) => mod === 'PRE';
export const getModPath = (type = 'all', assetId) =>
diff --git a/client/coral-admin/src/utils/regexp.js b/client/coral-admin/src/utils/regexp.js
deleted file mode 100644
index 1544824dc..000000000
--- a/client/coral-admin/src/utils/regexp.js
+++ /dev/null
@@ -1 +0,0 @@
-export const linkRegexp = /([-a-zA-Z0-9@:%_+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_+.~#?&//=]*)?)/;
diff --git a/package.json b/package.json
index 99939b46d..dc81e26a0 100644
--- a/package.json
+++ b/package.json
@@ -175,6 +175,7 @@
"subscriptions-transport-ws": "^0.7.2",
"timeago.js": "^2.0.3",
"timekeeper": "^1.0.0",
+ "tlds": "^1.196.0",
"url-loader": "^0.5.9",
"url-search-params": "^0.9.0",
"uuid": "^3.1.0",
diff --git a/yarn.lock b/yarn.lock
index 1fd1f5711..12a275e76 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7431,6 +7431,10 @@ title-case-minors@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/title-case-minors/-/title-case-minors-1.0.0.tgz#51f17037c294747a1d1cda424b5004c86d8eb115"
+tlds@^1.196.0:
+ version "1.196.0"
+ resolved "https://registry.yarnpkg.com/tlds/-/tlds-1.196.0.tgz#49d74ddbd1f9df30238b3bfef4df82862b5bbb48"
+
tmp@^0.0.31:
version "0.0.31"
resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.31.tgz#8f38ab9438e17315e5dbd8b3657e8bfb277ae4a7"