From 774678fd654110cabef030dec7714431e562f7b4 Mon Sep 17 00:00:00 2001
From: Ryan Wang <i@ryanc.cc>
Date: Sat, 28 Sep 2024 18:37:41 +0800
Subject: [PATCH] fix: resolve issue with editor not detecting image paste in
 Firefox (#6693)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/area ui
/kind bug
/milestone 2.20.x

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

修复在 FireFox 浏览器下的编辑器中无法通过粘贴文件上传的问题。

#### Which issue(s) this PR fixes:

Fixes #6684

#### Special notes for your reviewer:

在 FireFox 浏览器中，复制一张本地的图片，尝试在编辑器中粘贴，观察是否上传成功。

#### Does this PR introduce a user-facing change?

```release-note
修复在 FireFox 浏览器下的编辑器中无法通过粘贴文件上传的问题。
```
---
 ui/src/components/editor/extensions/upload/index.ts | 8 ++++++--
 ui/src/components/editor/utils/upload.ts            | 5 +++++
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/editor/extensions/upload/index.ts b/ui/src/components/editor/extensions/upload/index.ts
index a68a89723..adca39cf7 100644
--- a/ui/src/components/editor/extensions/upload/index.ts
+++ b/ui/src/components/editor/extensions/upload/index.ts
@@ -4,7 +4,10 @@ import {
   Plugin,
   PluginKey,
 } from "@halo-dev/richtext-editor";
-import { handleFileEvent } from "../../utils/upload";
+import {
+  containsFileClipboardIdentifier,
+  handleFileEvent,
+} from "../../utils/upload";
 
 export const Upload = Extension.create({
   name: "upload",
@@ -26,7 +29,8 @@ export const Upload = Extension.create({
             }
 
             const types = event.clipboardData.types;
-            if (!(types.length === 1 && types[0].toLowerCase() === "files")) {
+
+            if (!containsFileClipboardIdentifier(types)) {
               return false;
             }
 
diff --git a/ui/src/components/editor/utils/upload.ts b/ui/src/components/editor/utils/upload.ts
index 4ca9a4ce8..09cd04bc8 100644
--- a/ui/src/components/editor/utils/upload.ts
+++ b/ui/src/components/editor/utils/upload.ts
@@ -142,3 +142,8 @@ export function fileToBase64(file: File): Promise<string> {
     reader.readAsDataURL(file);
   });
 }
+
+export function containsFileClipboardIdentifier(types: readonly string[]) {
+  const fileTypes = ["files", "application/x-moz-file", "public.file-url"];
+  return types.some((type) => fileTypes.includes(type.toLowerCase()));
+}