editor: remove images on paste if user is not pro

streetwriters · Jun 7, 2024 · 1f0fc83 · 1f0fc83
1 parent a6af92c
commit 1f0fc83
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 9 deletions.
diff --git a/packages/editor/src/extensions/clipboard/clipboard-dom-parser.ts b/packages/editor/src/extensions/clipboard/clipboard-dom-parser.ts
@@ -24,6 +24,7 @@ import {
 import { encodeNonAsciiHTML } from "entities";
 import { Schema, Slice } from "prosemirror-model";
 import { inferLanguage } from "../code-block";
+import { hasPermission } from "../../types";
 
 export class ClipboardDOMParser extends ProsemirrorDOMParser {
   static fromSchema(schema: Schema): ClipboardDOMParser {
@@ -41,6 +42,7 @@ export class ClipboardDOMParser extends ProsemirrorDOMParser {
       convertGoogleDocsChecklist(dom);
       formatCodeblocks(dom);
       convertBrToSingleSpacedParagraphs(dom);
+      if (!hasPermission("insertImage")) removeImages(dom);
     }
     return super.parseSlice(dom, options);
   }
@@ -134,6 +136,12 @@ export function convertGoogleDocsChecklist(dom: HTMLElement | Document) {
   }
 }
 
+export function removeImages(dom: HTMLElement | Document) {
+  for (const img of dom.querySelectorAll(`img`)) {
+    img.remove();
+  }
+}
+
 function splitOn(bound: Element, cutElement: Element) {
   let grandparent: ParentNode | null = null;
   for (

diff --git a/packages/editor/src/hooks/use-permission-handler.ts b/packages/editor/src/hooks/use-permission-handler.ts
@@ -28,7 +28,7 @@ export type PermissionHandlerOptions = {
 };
 
 const ClaimsMap: Record<Claims, (keyof UnionCommands)[]> = {
-  premium: ["insertImage"]
+  premium: ["insertImage", "insertAttachment"]
 };
 
 export function usePermissionHandler(options: PermissionHandlerOptions) {

diff --git a/packages/editor/src/types.ts b/packages/editor/src/types.ts
@@ -32,14 +32,7 @@ export class Editor extends TiptapEditor {
    * @returns latest editor instance
    */
   requestPermission(id: keyof UnionCommands): TiptapEditor | undefined {
-    const event = new CustomEvent("permissionrequest", {
-      detail: { id },
-      cancelable: true
-    });
-
-    if (!window.dispatchEvent(event)) return undefined;
-
-    return this;
+    return hasPermission(id) ? this : undefined;
   }
 
   /**
@@ -51,3 +44,11 @@ export class Editor extends TiptapEditor {
     return this.mutex.runExclusive(() => (this ? callback(this) : void 0));
   }
 }
+
+export function hasPermission(id: keyof UnionCommands): boolean {
+  const event = new CustomEvent("permissionrequest", {
+    detail: { id },
+    cancelable: true
+  });
+  return window.dispatchEvent(event);
+}