Как удалить картинку из редактора текста написанном на draft-js?

Question

[Дмитрий Путилов]

Доброго времени суток, возникла проблема, я пытаюсь сделать drag and drop в своем редакторе текста написанном с помощью библиотеки draft-js. Я сделалчто бы можно было перенести картинку в нужное место с помощью drag and drop, но проблема в том, что картинка переносится, но старая не удаляется. И вопрос вообщем то в том, как сделать так, что бы удалялась картинка, которую я перенес через drag and drop?
Вот API комопнента

import {
  AtomicBlockUtils,
  DraftEntityMutability,
  EditorState,
  RichUtils,
} from "draft-js";
import React, { Dispatch, SetStateAction } from "react";
import { BlockType, EntityType, InlineStyle } from "./config.ts";
import { IMMUTABLE, MUTABLE } from "../../../Contstants/SettingsEntityType.ts";

export type EditorApi = {
  state: EditorState;
  onChange: (state: EditorState) => void;
  toggleBlockType: (blockType: BlockType) => void;
  toggleInlineStyle: (inlineStyle: InlineStyle) => void;
  isCursorInBold: (type: InlineStyle) => boolean;
  addLink: (url: string) => void;
  setEntityData: (entityKey: string, data: Record<string, string>) => void;
  addImage: (url: string) => void;
};

export const useEditor = (
  state: EditorState,
  setState: Dispatch<SetStateAction<EditorState>>,
): EditorApi => {
  // Функция для стилистики шрифтов
  const toggleBlockType = React.useCallback(
    (blockType: BlockType) => {
      setState((currentState) =>
        RichUtils.toggleBlockType(currentState, blockType),
      );
    },
    [setState],
  );

  // Функция для стилистики текста
  const toggleInlineStyle = React.useCallback(
    (inlineStyle: InlineStyle) => {
      setState((currentState) =>
        RichUtils.toggleInlineStyle(currentState, inlineStyle),
      );
    },
    [setState],
  );

  // Функция для проверки наличия полужирного стиля
  const isCursorInBold = React.useCallback(
    (type: InlineStyle) => {
      const currentStyle = state.getCurrentInlineStyle();
      return currentStyle.has(type);
    },
    [state],
  );

  // Функция обработки добавления сущности в редактор
  const addEntityToEditor = React.useCallback(
    (
      entityType: EntityType,
      data: Record<string, string>,
      mutability: DraftEntityMutability,
      toggleLink: boolean,
    ) => {
      setState((currentState) => {
        // Получаем текущий контент
        const contentState = currentState.getCurrentContent();
        // Создаем Entity с данными
        const contentStateWithEntity = contentState.createEntity(
          entityType,
          mutability,
          data,
        );
        // Получаем уникальный ключ Entity
        const entityKey = contentStateWithEntity.getLastCreatedEntityKey();
        // Объединяем текущее состояние с новым
        const newState = EditorState.set(currentState, {
          currentContent: contentStateWithEntity,
        });

        if (toggleLink) {
          // Вставляем ссылку в указанное место
          return RichUtils.toggleLink(
            newState,
            newState.getSelection(),
            entityKey,
          );
        } else {
          // Вставляем сущность в указанное место
          return AtomicBlockUtils.insertAtomicBlock(newState, entityKey, " ");
        }
      });
    },
    [setState],
  );

  // Функция обработки добавления сущности ссылки в редактор
  const addEntity = React.useCallback(
    (
      entityType: EntityType,
      data: Record<string, string>,
      mutability: DraftEntityMutability,
    ) => addEntityToEditor(entityType, data, mutability, true),
    [addEntityToEditor],
  );

  // Функция обработки добавления сущности картинки в редактор
  const addEntityImage = React.useCallback(
    (
      entityType: EntityType,
      data: Record<string, string>,
      mutability: DraftEntityMutability,
    ) => addEntityToEditor(entityType, data, mutability, false),
    [addEntityToEditor],
  );

  // Функция добавления ссылки в редактор
  const addLink = React.useCallback(
    (url: string) => addEntity(EntityType.link, { url }, MUTABLE),
    [addEntity],
  );

  // Функция добавления картинки в редактор
  const addImage = React.useCallback(
    (url: string) => addEntityImage(EntityType.image, { url }, IMMUTABLE),
    [addEntityImage],
  );

  const setEntityData = React.useCallback(
    (entityKey: string, data: Record<string, string>) => {
      setState((currentState) => {
        const content = currentState.getCurrentContent();
        const contentStateUpdated = content.mergeEntityData(entityKey, data);
        return EditorState.push(
          currentState,
          contentStateUpdated,
          "apply-entity",
        );
      });
    },
    [setState],
  );

  return React.useMemo(
    () => ({
      state,
      onChange: setState,
      toggleBlockType,
      toggleInlineStyle,
      isCursorInBold,
      addLink,
      setEntityData,
      addImage,
    }),
    [
      state,
      toggleBlockType,
      toggleInlineStyle,
      isCursorInBold,
      addLink,
      setEntityData,
      setState,
      addImage,
    ],
  );
};

А вот сам редактор

import { Editor } from "draft-js";
import { useEditorApi } from "../TextEditorFunctions/useEditorApi.ts";
import classes from "./TextEditor.module.scss";
import { DragEvent, DragEventHandler, useEffect, useRef } from "react";

const TextEditor = () => {
  const editorApi = useEditorApi();
  const ref = useRef<Editor | null>(null);

  useEffect(() => {
    if (ref.current) ref.current.focus(); // Установка фокуса при изменении контента
  }, [editorApi]);

  if (!editorApi) return null;

  const handlerDropAndDrop: DragEventHandler = (
    event: DragEvent<HTMLDataElement>,
  ) => {
    event.preventDefault();
    const url = event.dataTransfer.getData("URL");
    console.log(event.dataTransfer);
    if (url) editorApi.addImage(url);
  };

  return (
    <div className={classes.textArea} onDrop={handlerDropAndDrop}>
      <Editor
        ref={ref}
        placeholder={"Описание поста"}
        editorState={editorApi.state}
        onChange={editorApi.onChange}
      />
    </div>
  );
};

export default TextEditor;

За ранее сасибо