Fix bug with parsing in abritrary react components

common/util/parse.ts

@@ -1,4 +1,4 @@
-import { generateText, JSONContent } from '@tiptap/core'
+import { generateText, JSONContent, Node } from '@tiptap/core'
 import { generateJSON } from '@tiptap/html'
 // Tiptap starter extensions
 import { Blockquote } from '@tiptap/extension-blockquote'
@@ -52,6 +52,26 @@ export function parseMentions(data: JSONContent): string[] {
   return uniq(mentions)
 }
 
+// TODO: this is a hack to get around the fact that tiptap doesn't have a
+// way to add a node view without bundling in tsx
+function skippableComponent(name: string): Node<any, any> {
+  return Node.create({
+    name,
+
+    group: 'block',
+
+    content: 'inline*',
+
+    parseHTML() {
+      return [
+        {
+          tag: 'grid-cards-component',
+        },
+      ]
+    },
+  })
+}
+
 const stringParseExts = [
   // StarterKit extensions
   Blockquote,
@@ -79,6 +99,7 @@ const stringParseExts = [
     renderText: ({ node }) =>
       '[embed]' + node.attrs.src ? `(${node.attrs.src})` : '',
   }),
+  skippableComponent('gridCardsComponent'),
   TiptapTweet.extend({ renderText: () => '[tweet]' }),
   TiptapSpoiler.extend({ renderHTML: () => ['span', '[spoiler]', 0] }),
 ]