fix: Handle base64 and remote images when creating a file (#5740)

server/utils/dataURItoBuffer.test.ts

@@ -1,20 +0,0 @@
-import dataURItoBuffer from "./dataURItoBuffer";
-
-it("should parse value data URI", () => {
-  const response = dataURItoBuffer(
-    `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAB+FBMVEUAAAA/mUPidDHiLi5Cn0XkNTPmeUrkdUg/m0Q0pEfcpSbwaVdKskg+lUP4zA/iLi3msSHkOjVAmETdJSjtYFE/lkPnRj3sWUs8kkLeqCVIq0fxvhXqUkbVmSjwa1n1yBLepyX1xxP0xRXqUkboST9KukpHpUbuvRrzrhF/ljbwaljuZFM4jELaoSdLtElJrUj1xxP6zwzfqSU4i0HYnydMtUlIqUfywxb60AxZqEXaoifgMCXptR9MtklHpEY2iUHWnSjvvRr70QujkC+pUC/90glMuEnlOjVMt0j70QriLS1LtEnnRj3qUUXfIidOjsxAhcZFo0bjNDH0xxNLr0dIrUdmntVTkMoyfL8jcLBRuErhJyrgKyb4zA/5zg3tYFBBmUTmQTnhMinruBzvvhnxwxZ/st+Ktt5zp9hqota2vtK6y9FemNBblc9HiMiTtMbFtsM6gcPV2r6dwroseLrMrbQrdLGdyKoobKbo3Zh+ynrgVllZulTsXE3rV0pIqUf42UVUo0JyjEHoS0HmsiHRGR/lmRz/1hjqnxjvpRWfwtOhusaz0LRGf7FEfbDVmqHXlJeW0pbXq5bec3fX0nTnzmuJuWvhoFFhm0FtrziBsjaAaDCYWC+uSi6jQS3FsSfLJiTirCOkuCG1KiG+wSC+GBvgyhTszQ64Z77KAAAARXRSTlMAIQRDLyUgCwsE6ebm5ubg2dLR0byXl4FDQzU1NDEuLSUgC+vr6urq6ubb29vb2tra2tG8vLu7u7uXl5eXgYGBgYGBLiUALabIAAABsElEQVQoz12S9VPjQBxHt8VaOA6HE+AOzv1wd7pJk5I2adpCC7RUcHd3d3fXf5PvLkxheD++z+yb7GSRlwD/+Hj/APQCZWxM5M+goF+RMbHK594v+tPoiN1uHxkt+xzt9+R9wnRTZZQpXQ0T5uP1IQxToyOAZiQu5HEpjeA4SWIoksRxNiGC1tRZJ4LNxgHgnU5nJZBDvuDdl8lzQRBsQ+s9PZt7s7Pz8wsL39/DkIfZ4xlB2Gqsq62ta9oxVlVrNZpihFRpGO9fzQw1ms0NDWZz07iGkJmIFH8xxkc3a/WWlubmFkv9AB2SEpDvKxbjidN2faseaNV3zoHXvv7wMODJdkOHAegweAfFPx4G67KluxzottCU9n8CUqXzcIQdXOytAHqXxomvykhEKN9EFutG22p//0rbNvHVxiJywa8yS2KDfV1dfbu31H8jF1RHiTKtWYeHxUvq3bn0pyjCRaiRU6aDO+gb3aEfEeVNsDgm8zzLy9egPa7Qt8TSJdwhjplk06HH43ZNJ3s91KKCHQ5x4sw1fRGYDZ0n1L4FKb9/BP5JLYxToheoFCVxz57PPS8UhhEpLBVeAAAAAElFTkSuQmCC`
-  );
-  expect(response.buffer).toBeTruthy();
-  expect(response.type).toBe("image/png");
-});
-it("should throw an error with junk input", () => {
-  let err;
-
-  try {
-    dataURItoBuffer("what");
-  } catch (error) {
-    err = error;
-  }
-
-  expect(err).toBeTruthy();
-});

server/utils/dataURItoBuffer.ts

@@ -1,16 +0,0 @@
-export default function dataURItoBuffer(dataURI: string) {
-  const split = dataURI.split(",");
-
-  if (!dataURI.startsWith("data") || split.length <= 1) {
-    throw new Error("Not a dataURI");
-  }
-
-  // separate out the mime component
-  const type = split[0].split(":")[1].split(";")[0];
-  // convert base64 to buffer
-  const buffer = Buffer.from(split[1], "base64");
-  return {
-    buffer,
-    type,
-  };
-}

server/utils/parseImages.test.ts

@@ -10,7 +10,8 @@ it("should return an array of images", () => {
   ![internal](/attachments/image.png)
   `);
   expect(result.length).toBe(1);
-  expect(result[0]).toBe("/attachments/image.png");
+  expect(result[0].alt).toBe("internal");
+  expect(result[0].src).toBe("/attachments/image.png");
 });
 
 it("should return deeply nested images", () => {
@@ -18,10 +19,11 @@ it("should return deeply nested images", () => {
   
 - one
   - two
-    - three ![internal](/attachments/image.png)
+    - three ![oh my](/attachments/image.png)
   `);
   expect(result.length).toBe(1);
-  expect(result[0]).toBe("/attachments/image.png");
+  expect(result[0].alt).toBe("oh my");
+  expect(result[0].src).toBe("/attachments/image.png");
 });
 
 it("should not return non document links", () => {

server/utils/parseImages.ts

@@ -1,17 +1,29 @@
 import { Node } from "prosemirror-model";
 import { parser } from "@server/editor";
 
-export default function parseImages(text: string): string[] {
+type ImageProps = { src: string; alt: string };
+
+/**
+ * Parses a string of markdown and returns a list of images.
+ *
+ * @param text The markdown to parse
+ * @returns A unique list of images
+ */
+export default function parseImages(text: string): ImageProps[] {
   const doc = parser.parse(text);
-  const images: string[] = [];
+  const images = new Map<string, ImageProps>();
+
   if (!doc) {
-    return images;
+    return [];
   }
 
   doc.descendants((node: Node) => {
     if (node.type.name === "image") {
-      if (!images.includes(node.attrs.src)) {
-        images.push(node.attrs.src);
+      if (!images.has(node.attrs.src)) {
+        images.set(node.attrs.src, {
+          src: node.attrs.src,
+          alt: node.attrs.alt,
+        });
       }
 
       return false;
@@ -24,5 +36,5 @@ export default function parseImages(text: string): string[] {
     return true;
   });
 
-  return images;
+  return Array.from(images.values());
 }