refactor: rename block to ai block

components/editor/intelli/ai-block.js

@@ -0,0 +1,47 @@
+/**
+ * license: MIT
+ * author: Tiptap
+ * origin: https://github.com/ueberdosis/tiptap/blob/develop/packages/extension-code-block/src/code-block.ts
+ */
+import tippy from 'tippy.js'
+import { Node, mergeAttributes, ReactRenderer, ReactNodeViewRenderer } from '@tiptap/react'
+import { Plugin, PluginKey } from '@tiptap/pm/state'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+import { QuickView } from './quick-view'
+
+const extensionName = 'quick-command'
+
+export const createAiBlock = () => {
+  const pluginKey = new PluginKey(extensionName)
+
+  return Node.create({
+    name: extensionName,
+    group: 'block',
+    defining: true,
+    content: 'text*',
+
+    addCommands () {
+      return {
+        setAiBlock:
+          attributes => ({ commands }) => {
+            return commands.setNode(this.name, attributes)
+          },
+        toggleAiBlock:
+          attributes => ({ commands }) => {
+            return commands.toggleNode(this.name, 'paragraph', attributes)
+          },
+      }
+    },
+    addNodeView () {
+      return ReactNodeViewRenderer(QuickView)
+    },
+    addKeyboardShortcuts () {
+      return {
+        'Mod-/': (state, dispatch, view) => {
+          this.editor.commands.toggleAiBlock()
+        },
+      }
+    },
+  })
+}

components/editor/intelli/quick-view.jsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import { NodeViewWrapper } from '@tiptap/react'
 
 export class QuickView extends React.Component {
   constructor (props) {
@@ -8,7 +9,9 @@ export class QuickView extends React.Component {
 
   render () {
     return (
-      <div>Hello, world</div>
+      <NodeViewWrapper>
+        <div>Hello, world</div>
+      </NodeViewWrapper>
     )
   }
 }

components/editor/live-editor.jsx

@@ -10,7 +10,7 @@ import MarkdownIt from 'markdown-it'
 import { MenuBubble } from './intelli/menu/menu-bubble'
 import { createSlashExtension } from './intelli/slash-extension'
 import { CommandFunctions } from './action/command-functions'
-import { createQuickExtension } from './intelli/quick-extension'
+import { createAiBlock } from './intelli/ai-block'
 
 const md = new MarkdownIt()
 
@@ -38,7 +38,7 @@ const extensions = [
       }
     ]
   }),
-  // createQuickExtension(),
+  createAiBlock(),
   Color.configure({ types: [TextStyle.name, ListItem.name] }),
   // @ts-ignore
   TextStyle.configure({ types: [ListItem.name] }),