jazz-tools 0.17.0 → 0.17.2

package/src/media/utils.test.ts

@@ -1,7 +1,11 @@
-import { Account, FileStream, ImageDefinition } from "jazz-tools";
-import { highestResAvailable, loadImageBySize } from "jazz-tools/media";
-import { createJazzTestAccount, setupJazzTestSync } from "jazz-tools/testing";
+import { Account, FileStream, Group, ImageDefinition } from "jazz-tools";
+import {
+  createJazzTestAccount,
+  setActiveAccount,
+  setupJazzTestSync,
+} from "jazz-tools/testing";
 import { beforeEach, describe, expect, it, vi } from "vitest";
+import { highestResAvailable, loadImageBySize } from "./utils.js";
 
 const createFileStream = (account: any, blobSize?: number) => {
   return FileStream.createFromBlob(
@@ -209,23 +213,21 @@ describe("highestResAvailable", async () => {
 describe("loadImageBySize", async () => {
   let account: Account;
   beforeEach(async () => {
-    account = await createJazzTestAccount({
-      isCurrentActiveAccount: true,
-    });
-    vi.spyOn(Account, "getMe").mockReturnValue(account);
-    await setupJazzTestSync();
+    account = await setupJazzTestSync();
+    setActiveAccount(account);
   });
 
   const createImageDef = async (
     sizes: Array<[number, number]>,
     progressive = true,
+    owner: Account | Group = account,
   ) => {
     if (sizes.length === 0) throw new Error("sizes array must not be empty");
 
     const originalSize = sizes[sizes.length - 1]!;
     sizes = sizes.slice(0, -1);
 
-    const original = await createFileStream(account, 1);
+    const original = await createFileStream(owner, 1);
     // Ensure sizes array is not empty
     const imageDef = ImageDefinition.create(
       {
@@ -233,14 +235,14 @@ describe("loadImageBySize", async () => {
         progressive,
         original,
       },
-      { owner: account },
+      { owner },
     );
     imageDef[`${originalSize[0]}x${originalSize[1]}`] = original;
 
     for (const size of sizes) {
       if (!size) continue;
       const [w, h] = size;
-      imageDef[`${w}x${h}`] = await createFileStream(account, 1);
+      imageDef[`${w}x${h}`] = await createFileStream(owner, 1);
     }
     return imageDef;
   };
@@ -251,6 +253,24 @@ describe("loadImageBySize", async () => {
     expect(result?.image.id).toBe(imageDef["1920x1080"]!.id);
   });
 
+  it("returns the original image already loaded", async () => {
+    const account = await setupJazzTestSync({ asyncPeers: true });
+    const account2 = await createJazzTestAccount();
+
+    setActiveAccount(account);
+
+    const group = Group.create();
+    group.addMember("everyone", "reader");
+
+    const imageDef = await createImageDef([[1920, 1080]], false, group);
+    setActiveAccount(account2);
+
+    const result = await loadImageBySize(imageDef, 256, 256);
+    expect(result?.image.id).toBe(imageDef["1920x1080"]!.id);
+    expect(result?.image.isBinaryStreamEnded()).toBe(true);
+    expect(result?.image.asBase64()).toStrictEqual(expect.any(String));
+  });
+
   it("returns null if no sizes are available", async () => {
     const original = await createFileStream(account._owner, 1);
     const imageDef = ImageDefinition.create(
@@ -324,4 +344,30 @@ describe("loadImageBySize", async () => {
     expect(result?.width).toBe(1024);
     expect(result?.height).toBe(1024);
   });
+
+  it("returns the image already loaded", async () => {
+    const account = await setupJazzTestSync({ asyncPeers: true });
+    const account2 = await createJazzTestAccount();
+
+    setActiveAccount(account);
+
+    const group = Group.create();
+    group.addMember("everyone", "reader");
+
+    const imageDef = await createImageDef(
+      [
+        [512, 512],
+        [1024, 1024],
+      ],
+      undefined,
+      group,
+    );
+
+    setActiveAccount(account2);
+
+    const result = await loadImageBySize(imageDef, 1024, 1024);
+    expect(result?.image.id).toBe(imageDef["1024x1024"]!.id);
+    expect(result?.image.isBinaryStreamEnded()).toBe(true);
+    expect(result?.image.asBase64()).toStrictEqual(expect.any(String));
+  });
 });

package/src/media/utils.ts

@@ -126,21 +126,22 @@ export async function loadImage(
     };
   }
 
-  await imageOrId.ensureLoaded({
-    resolve: {
-      original: true,
-    },
-  });
-
   if (!imageOrId.original) {
     console.warn("Unable to find the original image");
     return null;
   }
 
+  const loadedOriginal = await FileStream.load(imageOrId.original.id);
+
+  if (!loadedOriginal) {
+    console.warn("Unable to find the original image");
+    return null;
+  }
+
   return {
     width: imageOrId.originalSize[0],
     height: imageOrId.originalSize[1],
-    image: imageOrId.original,
+    image: loadedOriginal,
   };
 }
 
@@ -149,7 +150,7 @@ export async function loadImageBySize(
   wantedWidth: number,
   wantedHeight: number,
 ): Promise<{ width: number; height: number; image: FileStream } | null> {
-  const image =
+  const image: ImageDefinition | null =
     typeof imageOrId === "string"
       ? await ImageDefinition.load(imageOrId)
       : imageOrId;
@@ -184,19 +185,21 @@ export async function loadImageBySize(
   const bestTarget =
     sortedSizes.find((el) => el.match > 0.95) || sortedSizes.at(-1)!;
 
-  const deepLoaded = await ImageDefinition.load(image.id, {
-    resolve: {
-      [bestTarget.size[2]]: true,
-    },
-  });
+  const file = image[bestTarget.size[2]];
+
+  if (!file) {
+    return null;
+  }
+
+  const loadedFile = await FileStream.load(file.id);
 
-  if (deepLoaded === null || deepLoaded[bestTarget.size[2]] === undefined) {
+  if (!loadedFile) {
     return null;
   }
 
   return {
     width: bestTarget.size[0],
     height: bestTarget.size[1],
-    image: deepLoaded[bestTarget.size[2]]!,
+    image: loadedFile,
   };
 }

package/src/react/media/image.tsx

@@ -92,7 +92,7 @@ export const Image = forwardRef<HTMLImageElement, ImageProps>(function Image(
   );
   const lazyPlaceholder = useMemo(
     () =>
-      waitingLazyLoading ? URL.createObjectURL(emptyPixelBlob) : undefined,
+      waitingLazyLoading ? URL.createObjectURL(getEmptyPixelBlob()) : undefined,
     [waitingLazyLoading],
   );
 
@@ -197,14 +197,20 @@ function revokeObjectURL(url: string | undefined) {
   }
 }
 
-const emptyPixelBlob = new Blob(
-  [
-    Uint8Array.from(
-      atob(
-        "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==",
-      ),
-      (c) => c.charCodeAt(0),
-    ),
-  ],
-  { type: "image/png" },
-);
+let emptyPixelBlob: Blob | undefined;
+function getEmptyPixelBlob() {
+  if (!emptyPixelBlob) {
+    emptyPixelBlob = new Blob(
+      [
+        Uint8Array.from(
+          atob(
+            "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==",
+          ),
+          (c) => c.charCodeAt(0),
+        ),
+      ],
+      { type: "image/png" },
+    );
+  }
+  return emptyPixelBlob;
+}

package/src/svelte/media/image.svelte

@@ -13,7 +13,7 @@ interface ImageProps extends Omit<HTMLImgAttributes, "width" | "height"> {
 
 const { imageId, width, height, ...rest }: ImageProps = $props();
 
-const imageState = new CoState(ImageDefinition, imageId);
+const imageState = new CoState(ImageDefinition, () => imageId);
 let lastBestImage: [string, string] | null = null;
 
 /**

package/src/tools/coValues/request.ts

@@ -330,7 +330,7 @@ function parseSchemaAndResolve<
   };
 }
 
-class HttpRoute<
+export class HttpRoute<
   RequestShape extends MessageShape = z.core.$ZodLooseShape,
   RequestResolve extends ResolveQuery<CoMapSchema<RequestShape>> = any,
   ResponseShape extends MessageShape = z.core.$ZodLooseShape,

package/src/tools/exports.ts

@@ -113,4 +113,5 @@ export {
   experimental_defineRequest,
   JazzRequestError,
   isJazzRequestError,
+  type HttpRoute,
 } from "./coValues/request.js";