fix: resolve error when deleting images in default editor (#6551)

#### What type of PR is this?

/kind bug
/area editor
/area ui
/milestone 2.19.x

#### What this PR does / why we need it:

在上传的文件中执行 `resetUpload` 方法之前，提前验证是否可以进行更新。

#### How to test it?

测试删除图片或变更图片位置时，默认编辑器是否会进行报错。

#### Does this PR introduce a user-facing change?
```release-note
解决默认编辑器删除图片后报错的问题
```

ui/packages/editor/src/components/bubble/BubbleItem.vue

@@ -30,11 +30,7 @@ const handleBubbleItemClick = (editor: Editor) => {
   }
   const callback = props.action?.({ editor });
   if (typeof callback === "object") {
-    if (componentRef.value) {
+    componentRef.value = callback;
-      componentRef.value = undefined;
-    } else {
-      componentRef.value = callback;
-    }
   }
 };
 </script>
@@ -46,6 +42,7 @@ const handleBubbleItemClick = (editor: Editor) => {
     :auto-hide="true"
     :shown="!!componentRef"
     :distance="10"
+    @hide="componentRef = undefined"
   >
     <button
       v-if="visible({ editor })"

ui/packages/editor/src/extensions/paragraph/index.ts

@@ -102,7 +102,6 @@ const Paragraph = TiptapParagraph.extend<ExtensionOptions & ParagraphOptions>({
       Backspace: ({ editor }: { editor: CoreEditor }) => {
         const { state, view } = editor;
         const { selection } = state;
-
         if (isListActive(editor) || !isActive(state, Paragraph.name)) {
           return false;
         }
@@ -118,7 +117,6 @@ const Paragraph = TiptapParagraph.extend<ExtensionOptions & ParagraphOptions>({
         }
 
         const beforePos = $from.before($from.depth);
-
         if (isEmpty($from.parent)) {
           return deleteCurrentNodeAndSetSelection(
             $from,

ui/packages/editor/src/utils/isNodeEmpty.ts

@@ -15,5 +15,9 @@ export const isParagraphEmpty = (node: PMNode) => {
     return false;
   }
 
+  if (node.childCount > 0) {
+    return false;
+  }
+
   return node.textContent.length === 0;
 };

ui/src/components/editor/extensions/audio/AudioView.vue

@@ -39,8 +39,13 @@ const handleSetExternalLink = (attachment: AttachmentAttr) => {
 };
 
 const resetUpload = () => {
-  if (props.getPos()) {
+  const canUpdateAttributes = props.editor.can().updateAttributes(Audio.name, {
-    props.updateAttributes({
+    width: undefined,
+    height: undefined,
+    file: undefined,
+  });
+  if (canUpdateAttributes && props.getPos()) {
+    props.editor.commands.updateAttributes(Audio.name, {
       width: undefined,
       height: undefined,
       file: undefined,

ui/src/components/editor/extensions/image/ImageView.vue

@@ -93,8 +93,14 @@ const handleUploadError = () => {
 const resetUpload = () => {
   fileBase64.value = undefined;
   uploadProgress.value = undefined;
-  if (props.getPos()) {
+
-    props.updateAttributes({
+  const canUpdateAttributes = props.editor.can().updateAttributes(Image.name, {
+    width: undefined,
+    height: undefined,
+    file: undefined,
+  });
+  if (canUpdateAttributes && props.getPos()) {
+    props.editor.commands.updateAttributes(Image.name, {
       width: undefined,
       height: undefined,
       file: undefined,

ui/src/components/editor/extensions/video/VideoView.vue

@@ -11,6 +11,7 @@ import RiVideoAddLine from "~icons/ri/video-add-line";
 import { EditorLinkObtain } from "../../components";
 import InlineBlockBox from "../../components/InlineBlockBox.vue";
 import type { AttachmentAttr } from "../../utils/attachment";
+import Video from "./index";
 
 const props = defineProps<{
   editor: Editor;
@@ -57,8 +58,13 @@ const handleSetExternalLink = (attachment: AttachmentAttr) => {
 };
 
 const resetUpload = () => {
-  if (props.getPos()) {
+  const canUpdateAttributes = props.editor.can().updateAttributes(Video.name, {
-    props.updateAttributes({
+    width: undefined,
+    height: undefined,
+    file: undefined,
+  });
+  if (canUpdateAttributes && props.getPos()) {
+    props.editor.commands.updateAttributes(Video.name, {
       width: undefined,
       height: undefined,
       file: undefined,