From 1c395c55a1ac867f7c8ac8387acf570ff5bac925 Mon Sep 17 00:00:00 2001
From: Konnor Rogers <konnor5456@gmail.com>
Date: Thu, 5 Dec 2024 18:45:28 -0500
Subject: [PATCH] fix pending uploads not getting cleared (#237)

* fix pending uploads not getting cleared

* fix pending uploads not getting cleared

* prettier
---
 .changeset/strong-tigers-wash.md            |  5 +++
 src/exports/elements/tip-tap-editor-base.ts | 35 ++++++++++++++++++---
 2 files changed, 35 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/strong-tigers-wash.md

diff --git a/.changeset/strong-tigers-wash.md b/.changeset/strong-tigers-wash.md
new file mode 100644
index 00000000..66fd6f75
--- /dev/null
+++ b/.changeset/strong-tigers-wash.md
@@ -0,0 +1,5 @@
+---
+"rhino-editor": patch
+---
+
+Fix pendingAttachments not clearing attachments that get cancelled
diff --git a/src/exports/elements/tip-tap-editor-base.ts b/src/exports/elements/tip-tap-editor-base.ts
index 9340d774..c183d4de 100644
--- a/src/exports/elements/tip-tap-editor-base.ts
+++ b/src/exports/elements/tip-tap-editor-base.ts
@@ -40,6 +40,7 @@ import { SelectionChangeEvent } from "../events/selection-change-event.js";
 import { RhinoPasteEvent } from "../events/rhino-paste-event.js";
 import { DOMSerializer, Slice } from "@tiptap/pm/model";
 import type { EditorView } from "@tiptap/pm/view";
+import { AttachmentRemoveEvent } from "../events/attachment-remove-event.js";
 
 export type Serializer = "" | "html" | "json";
 
@@ -393,12 +394,12 @@ export class TipTapEditorBase extends BaseElement {
   constructor() {
     super();
 
-    this.registerDependencies();
-    this.addEventListener(AddAttachmentEvent.eventName, this.handleAttachment);
-
     this.__addPendingAttachment = this.__addPendingAttachment.bind(this);
     this.__removePendingAttachment = this.__removePendingAttachment.bind(this);
 
+    this.registerDependencies();
+    this.addEventListener(AddAttachmentEvent.eventName, this.handleAttachment);
+
     this.addEventListener(
       AttachmentUploadStartEvent.eventName,
       this.__addPendingAttachment,
@@ -407,19 +408,43 @@ export class TipTapEditorBase extends BaseElement {
       AttachmentUploadCompleteEvent.eventName,
       this.__removePendingAttachment,
     );
+    this.addEventListener(
+      AttachmentRemoveEvent.eventName,
+      this.__removePendingAttachment,
+    );
 
     this.addEventListener("drop", this.handleNativeDrop);
     this.addEventListener("rhino-paste", this.handlePaste);
     this.addEventListener("rhino-file-accept", this.handleFileAccept);
   }
 
+  /**
+   * @private
+   */
   __addPendingAttachment(e: { attachmentUpload: AttachmentUpload }) {
     this.pendingAttachments.push(e.attachmentUpload);
   }
 
-  __removePendingAttachment(e: { attachmentUpload: AttachmentUpload }) {
+  /**
+   * @private
+   */
+  __removePendingAttachment(
+    e:
+      | { attachment: AttachmentManager }
+      | { attachmentUpload: AttachmentUpload },
+  ) {
     const index = this.pendingAttachments.findIndex((attachment) => {
-      return attachment === e.attachmentUpload;
+      // This is what you get from an attachment upload finishing.
+      if ("attachmentUpload" in e) {
+        return attachment === e.attachmentUpload;
+      }
+
+      // This is what you get from a generic "remove" event when an attachment is removed from the editor, this may not always be an upload.
+      if ("attachment" in e) {
+        return attachment.attachment.attachmentId === e.attachment.attachmentId;
+      }
+
+      return false;
     });
 
     if (index > -1) {