From 54cc57bb1b71dfb4419a0d2a3acaced90a717c1d Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Tue, 22 Mar 2022 12:58:46 +0800
Subject: [PATCH] feat: improve tiptap

---
 .../tiptap/components/attachment/index.tsx    |  6 +++-
 .../documentReference/index.module.scss       | 12 ++++++++
 .../components/documentReference/index.tsx    | 30 +++++++++++--------
 .../tiptap/components/image/index.tsx         |  3 +-
 .../tiptap/extensions/attachment.ts           |  2 ++
 .../src/components/tiptap/extensions/image.ts |  7 ++++-
 6 files changed, 45 insertions(+), 15 deletions(-)

diff --git a/packages/client/src/components/tiptap/components/attachment/index.tsx b/packages/client/src/components/tiptap/components/attachment/index.tsx
index 093e61fb..726a2d77 100644
--- a/packages/client/src/components/tiptap/components/attachment/index.tsx
+++ b/packages/client/src/components/tiptap/components/attachment/index.tsx
@@ -149,5 +149,9 @@ export const AttachmentWrapper = ({ editor, node, updateAttributes }) => {
     }
   })();
 
-  return <NodeViewWrapper as="div">{content}</NodeViewWrapper>;
+  return (
+    <NodeViewWrapper as="div">
+      {content} <NodeViewContent />
+    </NodeViewWrapper>
+  );
 };
diff --git a/packages/client/src/components/tiptap/components/documentReference/index.module.scss b/packages/client/src/components/tiptap/components/documentReference/index.module.scss
index 80d2876b..55193b17 100644
--- a/packages/client/src/components/tiptap/components/documentReference/index.module.scss
+++ b/packages/client/src/components/tiptap/components/documentReference/index.module.scss
@@ -33,4 +33,16 @@
       margin-left: 8px;
     }
   }
+
+  .empty {
+    display: flex;
+    align-items: center;
+    padding: 8px;
+    border: 1px solid var(--semi-color-border);
+    margin-top: 12px;
+    border-radius: var(--border-radius);
+    text-decoration: none;
+    color: var(--semi-color-text-1);
+    cursor: not-allowed;
+  }
 }
diff --git a/packages/client/src/components/tiptap/components/documentReference/index.tsx b/packages/client/src/components/tiptap/components/documentReference/index.tsx
index 434633f2..b2428964 100644
--- a/packages/client/src/components/tiptap/components/documentReference/index.tsx
+++ b/packages/client/src/components/tiptap/components/documentReference/index.tsx
@@ -47,18 +47,24 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
             )}
           />
         )}
-        <Link
-          key={documentId}
-          href={{
-            pathname: `${!isShare ? '' : '/share'}/wiki/[wikiId]/document/[documentId]`,
-            query: { wikiId, documentId },
-          }}
-        >
-          <a className={styles.itemWrap} target="_blank">
-            <IconDocument />
-            <span>{title || '请选择文档'}</span>
-          </a>
-        </Link>
+        {wikiId && documentId ? (
+          <Link
+            key={documentId}
+            href={{
+              pathname: `${!isShare ? '' : '/share'}/wiki/[wikiId]/document/[documentId]`,
+              query: { wikiId, documentId },
+            }}
+          >
+            <a className={styles.itemWrap} target="_blank">
+              <IconDocument />
+              <span>{title || '请选择文档'}</span>
+            </a>
+          </Link>
+        ) : (
+          <div className={styles.empty}>
+            <span>{'用户未选择文档'}</span>
+          </div>
+        )}
       </div>
       <NodeViewContent></NodeViewContent>
     </NodeViewWrapper>
diff --git a/packages/client/src/components/tiptap/components/image/index.tsx b/packages/client/src/components/tiptap/components/image/index.tsx
index 14388389..39a6f66f 100644
--- a/packages/client/src/components/tiptap/components/image/index.tsx
+++ b/packages/client/src/components/tiptap/components/image/index.tsx
@@ -1,4 +1,4 @@
-import { NodeViewWrapper } from '@tiptap/react';
+import { NodeViewWrapper, NodeViewContent } from '@tiptap/react';
 import { Resizeable } from 'components/resizeable';
 import { useEffect, useRef } from 'react';
 import { Typography, Spin } from '@douyinfe/semi-ui';
@@ -87,6 +87,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
   return (
     <NodeViewWrapper as="div" style={{ textAlign, fontSize: 0, maxWidth: '100%' }}>
       {content}
+      <NodeViewContent />
     </NodeViewWrapper>
   );
 };
diff --git a/packages/client/src/components/tiptap/extensions/attachment.ts b/packages/client/src/components/tiptap/extensions/attachment.ts
index b9eba454..2cd406e7 100644
--- a/packages/client/src/components/tiptap/extensions/attachment.ts
+++ b/packages/client/src/components/tiptap/extensions/attachment.ts
@@ -12,6 +12,8 @@ declare module '@tiptap/core' {
 
 export const Attachment = Node.create({
   name: 'attachment',
+  content: '',
+  marks: '',
   group: 'block',
   draggable: true,
   atom: true,
diff --git a/packages/client/src/components/tiptap/extensions/image.ts b/packages/client/src/components/tiptap/extensions/image.ts
index 80d9a614..00325d7b 100644
--- a/packages/client/src/components/tiptap/extensions/image.ts
+++ b/packages/client/src/components/tiptap/extensions/image.ts
@@ -16,7 +16,12 @@ export const Image = BuiltInImage.extend({
   addOptions() {
     return {
       ...this.parent?.(),
-      inline: true,
+      inline: false,
+      content: '',
+      marks: '',
+      group: 'block',
+      draggable: true,
+      atom: true,
     };
   },
   addAttributes() {