1 files changed, 25 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/components/source_viewer/plugins/utils/gemfile_linker.js b/app/assets/javascripts/vue_shared/components/source_viewer/plugins/utils/gemfile_linker.js
new file mode 100644
index 00000000000..81389763f49
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/source_viewer/plugins/utils/gemfile_linker.js
@@ -0,0 +1,25 @@
+import { createLink, generateHLJSOpenTag } from './dependency_linker_util';
+
+const GEM_URL = 'https://rubygems.org/gems/';
+const GEM_STRING = 'gem </span>';
+const delimiter = '&#39;';
+const stringOpenTag = generateHLJSOpenTag('string', delimiter);
+
+const DEPENDENCY_REGEX = new RegExp(
+  /*
+   * Detects dependencies inside of content that is highlighted by Highlight.js
+   * Example: 'gem </span><span class="hljs-string">&#39;paranoia&#39;'
+   * Group 1 (packageName)     :  'paranoia'
+   */
+  `${GEM_STRING}${stringOpenTag}(.+?(?=${delimiter}))`,
+  'gm',
+);
+
+const handleReplace = (packageName) => {
+  const href = `${GEM_URL}${packageName}`;
+  const packageLink = createLink(href, packageName);
+  return `${GEM_STRING}${stringOpenTag}${packageLink}`;
+};
+export default (result) => {
+  return result.value.replace(DEPENDENCY_REGEX, (_, packageName) => handleReplace(packageName));
+};