added better ts support

This commit is contained in:
Palanikannan1437 2023-09-05 01:52:42 +05:30
parent 67eeced439
commit 814af00402

View File

@ -1,27 +1,36 @@
import { Plugin, PluginKey } from "@tiptap/pm/state"; import { EditorState, Plugin, PluginKey, Transaction } from "@tiptap/pm/state";
import { Node as ProseMirrorNode } from "@tiptap/pm/model"; import { Node as ProseMirrorNode } from "@tiptap/pm/model";
import fileService from "services/file.service"; import fileService from "services/file.service";
const deleteKey = new PluginKey("delete-image"); const deleteKey = new PluginKey("delete-image");
const TrackImageDeletionPlugin = () => const IMAGE_NODE_TYPE = "image";
interface ImageNode extends ProseMirrorNode {
attrs: {
src: string;
id: string;
};
}
const TrackImageDeletionPlugin = (): Plugin =>
new Plugin({ new Plugin({
key: deleteKey, key: deleteKey,
appendTransaction: (transactions, oldState, newState) => { appendTransaction: (transactions: readonly Transaction[], oldState: EditorState, newState: EditorState) => {
transactions.forEach((transaction) => { transactions.forEach((transaction) => {
if (!transaction.docChanged) return; if (!transaction.docChanged) return;
const removedImages: ProseMirrorNode[] = []; const removedImages: ImageNode[] = [];
oldState.doc.descendants((oldNode, oldPos) => { oldState.doc.descendants((oldNode, oldPos) => {
if (oldNode.type.name !== "image") return; if (oldNode.type.name !== IMAGE_NODE_TYPE) return;
if (oldPos < 0 || oldPos > newState.doc.content.size) return; if (oldPos < 0 || oldPos > newState.doc.content.size) return;
if (!newState.doc.resolve(oldPos).parent) return; if (!newState.doc.resolve(oldPos).parent) return;
const newNode = newState.doc.nodeAt(oldPos); const newNode = newState.doc.nodeAt(oldPos);
// Check if the node has been deleted or replaced // Check if the node has been deleted or replaced
if (!newNode || newNode.type.name !== "image") { if (!newNode || newNode.type.name !== IMAGE_NODE_TYPE) {
// Check if the node still exists elsewhere in the document // Check if the node still exists elsewhere in the document
let nodeExists = false; let nodeExists = false;
newState.doc.descendants((node) => { newState.doc.descendants((node) => {
@ -30,15 +39,14 @@ const TrackImageDeletionPlugin = () =>
} }
}); });
if (!nodeExists) { if (!nodeExists) {
removedImages.push(oldNode as ProseMirrorNode); removedImages.push(oldNode as ImageNode);
} }
} }
}); });
removedImages.forEach((node) => { removedImages.forEach(async (node) => {
const src = node.attrs.src; const src = node.attrs.src;
console.log("Image deleted: ", src, node.attrs.id) await onNodeDeleted(src);
onNodeDeleted(src);
}); });
}); });
@ -48,10 +56,14 @@ const TrackImageDeletionPlugin = () =>
export default TrackImageDeletionPlugin; export default TrackImageDeletionPlugin;
async function onNodeDeleted(src: string) { async function onNodeDeleted(src: string): Promise<void> {
const assetUrlWithWorkspaceId = new URL(src).pathname.substring(1); try {
const resStatus = await fileService.deleteImage(assetUrlWithWorkspaceId); const assetUrlWithWorkspaceId = new URL(src).pathname.substring(1);
if (resStatus === 204) { const resStatus = await fileService.deleteImage(assetUrlWithWorkspaceId);
console.log("Image deleted successfully"); if (resStatus === 204) {
console.log("Image deleted successfully");
}
} catch (error) {
console.error("Error deleting image: ", error);
} }
} }