From 2f90a45da7200ebda95dbe2825bf7b46a6c24b72 Mon Sep 17 00:00:00 2001
From: roschaefer <git@roschaefer.de>
Date: Tue, 17 Sep 2019 11:05:45 +0200
Subject: [PATCH] Follow @Tirokk's review and fix a bug

The bug happened because the hashtag link won't get parsed by the
extension. This is desired for mentions because you don't want to
re-notify a user if you haven't updated the text in which you notify
somebody. For hashtags this is undesired and would lead to transforming
the hashtag link into a normal link on the next edit of a post.
---
 webapp/components/Editor/ContentViewer.vue |  8 +++++++-
 webapp/components/Editor/Editor.vue        |  4 +++-
 webapp/components/Editor/nodes/Hashtag.js  | 10 ++++++++--
 webapp/components/Editor/nodes/Link.js     |  3 ++-
 4 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/webapp/components/Editor/ContentViewer.vue b/webapp/components/Editor/ContentViewer.vue
index 993cf32b9..ab07d11d6 100644
--- a/webapp/components/Editor/ContentViewer.vue
+++ b/webapp/components/Editor/ContentViewer.vue
@@ -4,6 +4,7 @@
 
 <script>
 import defaultExtensions from './defaultExtensions.js'
+import Hashtag from './nodes/Hashtag.js'
 import { Editor, EditorContent } from 'tiptap'
 
 export default {
@@ -21,7 +22,12 @@ export default {
         doc: this.doc,
         content: this.content,
         editable: false,
-        extensions: defaultExtensions(this),
+        extensions: [
+          // Hashtags must come first, see
+          // https://github.com/scrumpy/tiptap/issues/421#issuecomment-523037460
+          new Hashtag(),
+          ...defaultExtensions(this),
+        ],
       }),
     }
   },
diff --git a/webapp/components/Editor/Editor.vue b/webapp/components/Editor/Editor.vue
index af98f785a..8d3ce281b 100644
--- a/webapp/components/Editor/Editor.vue
+++ b/webapp/components/Editor/Editor.vue
@@ -134,10 +134,12 @@ export default {
       content: this.value || '',
       doc: this.doc,
       extensions: [
+        // Hashtags must come first, see
+        // https://github.com/scrumpy/tiptap/issues/421#issuecomment-523037460
+        ...this.optionalExtensions,
         ...defaultExtensions(this),
         new EventHandler(),
         new History(),
-        ...this.optionalExtensions,
       ],
       onUpdate: e => {
         clearTimeout(throttleInputEvent)
diff --git a/webapp/components/Editor/nodes/Hashtag.js b/webapp/components/Editor/nodes/Hashtag.js
index 96a57e935..0a06946aa 100644
--- a/webapp/components/Editor/nodes/Hashtag.js
+++ b/webapp/components/Editor/nodes/Hashtag.js
@@ -37,8 +37,14 @@ export default class Hashtag extends TipTapMention {
         ]
       },
       parseDOM: [
-        // simply don't parse mentions from html
-        // just treat them as normal links
+        {
+          tag: 'a[data-hashtag-id]',
+          getAttrs: dom => {
+            const id = dom.getAttribute('data-hashtag-id')
+            const label = dom.innerText.split(this.options.matcher.char).join('')
+            return { id, label }
+          },
+        },
       ],
     }
   }
diff --git a/webapp/components/Editor/nodes/Link.js b/webapp/components/Editor/nodes/Link.js
index a2a032ba3..6c015c030 100644
--- a/webapp/components/Editor/nodes/Link.js
+++ b/webapp/components/Editor/nodes/Link.js
@@ -15,7 +15,8 @@ export default class Link extends TipTapLink {
       inclusive: false,
       parseDOM: [
         {
-          tag: 'a[href]:not(.embed)', // do not trigger on embed links
+          // if this is an embed link or a hashtag, ignore
+          tag: 'a[href]:not(.embed):not([data-hashtag-id])',
           getAttrs: dom => ({
             href: dom.getAttribute('href'),
           }),