feat: add remark-gemoji plugin

2 files changed, 21 insertions, 18 deletions

diff --git a/src/emojiPlugin.tsx b/src/emojiPlugin.tsx
index a408ed7..e23ac37 100644
--- a/src/emojiPlugin.tsx
+++ b/src/emojiPlugin.tsx
@@ -16,26 +16,28 @@ const emojiPlugin = (emojiFileNames: string[]) => () => {
       const emoji = match[0]?.replaceAll(':', '') || '';
       const src = emojiFileNames.find(fileName => fileName.match(`${emoji}.*`));
 
-      const beforeNode = {
-        type: 'text',
-        value: text.slice(0, match.index),
-      }
-
-      const emojiNode = {
-        type: 'element',
-        tagName: 'emoji',
-        children: [{
+      if (src) {
+        const beforeNode = {
           type: 'text',
-          value: src,
-        }],
-      }
+          value: text.slice(0, match.index),
+        }
+
+        const emojiNode = {
+          type: 'element',
+          tagName: 'emoji',
+          children: [{
+            type: 'text',
+            value: src,
+          }],
+        }
+
+        const afterNode = {
+          type: 'text',
+          value: text.slice(match.index + emoji?.length + 2),
+        }
 
-      const afterNode = {
-        type: 'text',
-        value: text.slice(match.index + emoji?.length + 2),
+        parent.children.splice(nodeIndex, 1, ...[beforeNode, emojiNode, afterNode])
       }
-
-      parent.children.splice(nodeIndex, 1, ...[beforeNode, emojiNode, afterNode])
     }
 
   }
diff --git a/src/pages/[...path].tsx b/src/pages/[...path].tsx
index 9c7704e..ff03d1c 100644
--- a/src/pages/[...path].tsx
+++ b/src/pages/[...path].tsx
@@ -6,6 +6,7 @@ import Emoji from '../Emoji';
 import deepReadDir from '../deepReadDir';
 import emojiPlugin from '../emojiPlugin';
 import fs from 'fs';
+import remarkGemoji from 'remark-gemoji';
 
 
 const MARKDOWN_DIR = '../eug-vs-xyz/src';
@@ -54,7 +55,7 @@ const Page: NextPage = ({ markdownSource, emojiFileNames }: any) => {
         <ReactMarkdown
           children={markdownSource}
           transformLinkUri={transformLinkURI}
-          rehypePlugins={[emojiPlugin(emojiFileNames)]}
+          rehypePlugins={[emojiPlugin(emojiFileNames), remarkGemoji]}
           components={{
             emoji: Emoji,
             h1: 'h2',