Merge pull request #30168 from overleaf/mg-context-menu

Add context menu (right click) to editor

GitOrigin-RevId: f2e567b51b04170ba1a46b0ab4659f3481b05bfe

services/web/frontend/js/features/source-editor/utils/paste-image.ts

@@ -0,0 +1,47 @@
+export const ALLOWED_IMAGE_TYPES = new Set([
+  'image/jpeg',
+  'image/png',
+  'application/pdf',
+])
+
+export function isAllowedImageType(mimeType: string): boolean {
+  return ALLOWED_IMAGE_TYPES.has(mimeType)
+}
+
+export type PastedImageData = {
+  name: string
+  type: string
+  data: Blob
+}
+
+export function dispatchFigureModalPasteEvent(
+  imageData: PastedImageData
+): void {
+  window.dispatchEvent(
+    new CustomEvent<PastedImageData>('figure-modal:paste-image', {
+      detail: imageData,
+    })
+  )
+}
+
+export async function findImageInClipboard(): Promise<File | null> {
+  try {
+    const clipboardItems = await navigator.clipboard.read()
+
+    for (const item of clipboardItems) {
+      for (const type of item.types) {
+        if (isAllowedImageType(type)) {
+          const blob = await item.getType(type)
+          const file = new File([blob], `image.${type.split('/')[1]}`, {
+            type,
+          })
+          return file
+        }
+      }
+    }
+  } catch (error) {
+    // Clipboard.read() may fail in some browsers
+  }
+
+  return null
+}