jazz-tools 0.14.27 → 0.15.0

package/src/browser/createBrowserContext.ts

@@ -0,0 +1,326 @@
+import { LocalNode, Peer, RawAccountID } from "cojson";
+import { IDBStorage } from "cojson-storage-indexeddb";
+import { WebSocketPeerWithReconnection } from "cojson-transport-ws";
+import { WasmCrypto } from "cojson/crypto/WasmCrypto";
+import {
+  Account,
+  AccountClass,
+  AgentID,
+  AnyAccountSchema,
+  AuthCredentials,
+  AuthSecretStorage,
+  CoValue,
+  CoValueFromRaw,
+  CryptoProvider,
+  ID,
+  InviteSecret,
+  NewAccountProps,
+  SessionID,
+  SyncConfig,
+  cojsonInternals,
+  createAnonymousJazzContext,
+} from "jazz-tools";
+import { createJazzContext } from "jazz-tools";
+import { StorageConfig, getStorageOptions } from "./storageOptions.js";
+import { setupInspector } from "./utils/export-account-inspector.js";
+
+setupInspector();
+
+export type BaseBrowserContextOptions = {
+  sync: SyncConfig;
+  reconnectionTimeout?: number;
+  storage?: StorageConfig;
+  crypto?: CryptoProvider;
+  authSecretStorage: AuthSecretStorage;
+};
+
+class BrowserWebSocketPeerWithReconnection extends WebSocketPeerWithReconnection {
+  onNetworkChange(callback: (connected: boolean) => void): () => void {
+    const handler = () => callback(navigator.onLine);
+    window.addEventListener("online", handler);
+    window.addEventListener("offline", handler);
+
+    return () => {
+      window.removeEventListener("online", handler);
+      window.removeEventListener("offline", handler);
+    };
+  }
+}
+
+async function setupPeers(options: BaseBrowserContextOptions) {
+  const crypto = options.crypto || (await WasmCrypto.create());
+  let node: LocalNode | undefined = undefined;
+
+  const { useIndexedDB } = getStorageOptions(options.storage);
+
+  const peersToLoadFrom: Peer[] = [];
+
+  if (useIndexedDB) {
+    peersToLoadFrom.push(await IDBStorage.asPeer());
+  }
+
+  if (options.sync.when === "never") {
+    return {
+      toggleNetwork: () => {},
+      peersToLoadFrom,
+      setNode: () => {},
+      crypto,
+    };
+  }
+
+  const wsPeer = new BrowserWebSocketPeerWithReconnection({
+    peer: options.sync.peer,
+    reconnectionTimeout: options.reconnectionTimeout,
+    addPeer: (peer) => {
+      if (node) {
+        node.syncManager.addPeer(peer);
+      } else {
+        peersToLoadFrom.push(peer);
+      }
+    },
+    removePeer: (peer) => {
+      peersToLoadFrom.splice(peersToLoadFrom.indexOf(peer), 1);
+    },
+  });
+
+  function toggleNetwork(enabled: boolean) {
+    if (enabled) {
+      wsPeer.enable();
+    } else {
+      wsPeer.disable();
+    }
+  }
+
+  function setNode(value: LocalNode) {
+    node = value;
+  }
+
+  if (options.sync.when === "always" || !options.sync.when) {
+    toggleNetwork(true);
+  }
+
+  return {
+    toggleNetwork,
+    peersToLoadFrom,
+    setNode,
+    crypto,
+  };
+}
+
+export async function createJazzBrowserGuestContext(
+  options: BaseBrowserContextOptions,
+) {
+  const { toggleNetwork, peersToLoadFrom, setNode, crypto } =
+    await setupPeers(options);
+
+  const context = await createAnonymousJazzContext({
+    crypto,
+    peersToLoadFrom,
+  });
+
+  setNode(context.agent.node);
+
+  options.authSecretStorage.emitUpdate(null);
+
+  return {
+    guest: context.agent,
+    node: context.agent.node,
+    done: () => {
+      // TODO: Sync all the covalues before closing the connection & context
+      toggleNetwork(false);
+      context.done();
+    },
+    logOut: () => {
+      return context.logOut();
+    },
+  };
+}
+
+export type BrowserContextOptions<
+  S extends
+    | (AccountClass<Account> & CoValueFromRaw<Account>)
+    | AnyAccountSchema,
+> = {
+  credentials?: AuthCredentials;
+  AccountSchema?: S;
+  newAccountProps?: NewAccountProps;
+  defaultProfileName?: string;
+} & BaseBrowserContextOptions;
+
+export async function createJazzBrowserContext<
+  S extends
+    | (AccountClass<Account> & CoValueFromRaw<Account>)
+    | AnyAccountSchema,
+>(options: BrowserContextOptions<S>) {
+  const { toggleNetwork, peersToLoadFrom, setNode, crypto } =
+    await setupPeers(options);
+
+  let unsubscribeAuthUpdate = () => {};
+
+  if (options.sync.when === "signedUp") {
+    const authSecretStorage = options.authSecretStorage;
+    const credentials = options.credentials ?? (await authSecretStorage.get());
+
+    function handleAuthUpdate(isAuthenticated: boolean) {
+      if (isAuthenticated) {
+        toggleNetwork(true);
+      } else {
+        toggleNetwork(false);
+      }
+    }
+
+    unsubscribeAuthUpdate = authSecretStorage.onUpdate(handleAuthUpdate);
+    handleAuthUpdate(authSecretStorage.getIsAuthenticated(credentials));
+  }
+
+  const context = await createJazzContext({
+    credentials: options.credentials,
+    newAccountProps: options.newAccountProps,
+    peersToLoadFrom,
+    crypto,
+    defaultProfileName: options.defaultProfileName,
+    AccountSchema: options.AccountSchema,
+    sessionProvider: provideBrowserLockSession,
+    authSecretStorage: options.authSecretStorage,
+  });
+
+  setNode(context.node);
+
+  return {
+    me: context.account,
+    node: context.node,
+    authSecretStorage: context.authSecretStorage,
+    done: () => {
+      // TODO: Sync all the covalues before closing the connection & context
+      toggleNetwork(false);
+      unsubscribeAuthUpdate();
+      context.done();
+    },
+    logOut: () => {
+      unsubscribeAuthUpdate();
+      return context.logOut();
+    },
+  };
+}
+
+/** @category Auth Providers */
+export type SessionProvider = (
+  accountID: ID<Account> | AgentID,
+) => Promise<SessionID>;
+
+export function provideBrowserLockSession(
+  accountID: ID<Account> | AgentID,
+  crypto: CryptoProvider,
+) {
+  let sessionDone!: () => void;
+  const donePromise = new Promise<void>((resolve) => {
+    sessionDone = resolve;
+  });
+
+  let resolveSession: (sessionID: SessionID) => void;
+  const sessionPromise = new Promise<SessionID>((resolve) => {
+    resolveSession = resolve;
+  });
+
+  void (async function () {
+    for (let idx = 0; idx < 100; idx++) {
+      // To work better around StrictMode
+      for (let retry = 0; retry < 2; retry++) {
+        // console.debug("Trying to get lock", accountID + "_" + idx);
+        const sessionFinishedOrNoLock = await navigator.locks.request(
+          accountID + "_" + idx,
+          { ifAvailable: true },
+          async (lock) => {
+            if (!lock) return "noLock";
+
+            const sessionID =
+              localStorage.getItem(accountID + "_" + idx) ||
+              crypto.newRandomSessionID(accountID as RawAccountID | AgentID);
+            localStorage.setItem(accountID + "_" + idx, sessionID);
+
+            resolveSession(sessionID as SessionID);
+
+            await donePromise;
+            console.log("Done with lock", accountID + "_" + idx, sessionID);
+            return "sessionFinished";
+          },
+        );
+
+        if (sessionFinishedOrNoLock === "sessionFinished") {
+          return;
+        }
+      }
+    }
+    throw new Error("Couldn't get lock on session after 100x2 tries");
+  })();
+
+  return sessionPromise.then((sessionID) => ({
+    sessionID,
+    sessionDone,
+  }));
+}
+
+/** @category Invite Links */
+export function createInviteLink<C extends CoValue>(
+  value: C,
+  role: "reader" | "writer" | "admin" | "writeOnly",
+  // default to same address as window.location, but without hash
+  {
+    baseURL = window.location.href.replace(/#.*$/, ""),
+    valueHint,
+  }: { baseURL?: string; valueHint?: string } = {},
+): string {
+  const coValueCore = value._raw.core;
+  let currentCoValue = coValueCore;
+
+  while (currentCoValue.verified.header.ruleset.type === "ownedByGroup") {
+    currentCoValue = currentCoValue.getGroup().core;
+  }
+
+  const { ruleset, meta } = currentCoValue.verified.header;
+
+  if (ruleset.type !== "group" || meta?.type === "account") {
+    throw new Error("Can't create invite link for object without group");
+  }
+
+  const group = cojsonInternals.expectGroup(currentCoValue.getCurrentContent());
+  const inviteSecret = group.createInvite(role);
+
+  return `${baseURL}#/invite/${valueHint ? valueHint + "/" : ""}${
+    value.id
+  }/${inviteSecret}`;
+}
+
+/** @category Invite Links */
+export function parseInviteLink<C extends CoValue>(
+  inviteURL: string,
+):
+  | {
+      valueID: ID<C>;
+      valueHint?: string;
+      inviteSecret: InviteSecret;
+    }
+  | undefined {
+  const url = new URL(inviteURL);
+  const parts = url.hash.split("/");
+
+  let valueHint: string | undefined;
+  let valueID: ID<C> | undefined;
+  let inviteSecret: InviteSecret | undefined;
+
+  if (parts[0] === "#" && parts[1] === "invite") {
+    if (parts.length === 5) {
+      valueHint = parts[2];
+      valueID = parts[3] as ID<C>;
+      inviteSecret = parts[4] as InviteSecret;
+    } else if (parts.length === 4) {
+      valueID = parts[2] as ID<C>;
+      inviteSecret = parts[3] as InviteSecret;
+    }
+
+    if (!valueID || !inviteSecret) {
+      return undefined;
+    }
+    return { valueID, inviteSecret, valueHint };
+  }
+}

package/src/browser/index.ts

@@ -0,0 +1,72 @@
+import {
+  Account,
+  CoValue,
+  CoValueClass,
+  CoValueOrZodSchema,
+  ID,
+  InviteSecret,
+  createInviteLink as baseCreateInviteLink,
+  consumeInviteLink,
+} from "jazz-tools";
+import { setupInspector } from "./utils/export-account-inspector.js";
+export { BrowserPasskeyAuth } from "./auth/PasskeyAuth.js";
+
+setupInspector();
+
+export * from "./createBrowserContext.js";
+export * from "./BrowserContextManager.js";
+
+export { LocalStorageKVStore } from "./auth/LocalStorageKVStore.js";
+
+/** @category Invite Links */
+export function createInviteLink<C extends CoValue>(
+  value: C,
+  role: "reader" | "writer" | "admin" | "writeOnly",
+  // default to same address as window.location, but without hash
+  {
+    baseURL = window.location.href.replace(/#.*$/, ""),
+    valueHint,
+  }: { baseURL?: string; valueHint?: string } = {},
+): string {
+  return baseCreateInviteLink(value, role, baseURL, valueHint);
+}
+
+/** @category Invite Links */
+export { parseInviteLink } from "jazz-tools";
+
+/** @category Invite Links */
+export async function consumeInviteLinkFromWindowLocation<
+  S extends CoValueOrZodSchema,
+>({
+  as,
+  forValueHint,
+  invitedObjectSchema,
+}: {
+  as?: Account;
+  forValueHint?: string;
+  invitedObjectSchema: S;
+}): Promise<
+  | {
+      valueID: string;
+      valueHint?: string;
+      inviteSecret: InviteSecret;
+    }
+  | undefined
+> {
+  const result = await consumeInviteLink({
+    inviteURL: window.location.href,
+    as,
+    forValueHint,
+    invitedObjectSchema,
+  });
+
+  if (result) {
+    window.history.replaceState(
+      {},
+      "",
+      window.location.href.replace(/#.*$/, ""),
+    );
+  }
+
+  return result;
+}

package/src/browser/storageOptions.ts

@@ -0,0 +1,17 @@
+type StorageOption = "indexedDB";
+type CombinedStorageOption = ["indexedDB"];
+export type StorageConfig =
+  | StorageOption
+  | CombinedStorageOption
+  | [StorageOption];
+
+export function getStorageOptions(storage?: StorageConfig): {
+  useIndexedDB: boolean;
+} {
+  const useIndexedDB =
+    !storage ||
+    (Array.isArray(storage) && storage.includes("indexedDB")) ||
+    storage === "indexedDB";
+
+  return { useIndexedDB };
+}

package/src/browser/tests/LocalStorageKVStore.test.ts

@@ -0,0 +1,67 @@
+// @vitest-environment happy-dom
+
+import { beforeEach, describe, expect, it } from "vitest";
+import { LocalStorageKVStore } from "../auth/LocalStorageKVStore";
+
+describe("LocalStorageKVStore", () => {
+  let kvStore: LocalStorageKVStore;
+
+  beforeEach(() => {
+    // Clear localStorage before each test
+    localStorage.clear();
+    kvStore = new LocalStorageKVStore();
+  });
+
+  describe("get", () => {
+    it("should return null for non-existent key", async () => {
+      const value = await kvStore.get("nonexistent");
+      expect(value).toBeNull();
+    });
+
+    it("should return stored value for existing key", async () => {
+      localStorage.setItem("testKey", "testValue");
+      const value = await kvStore.get("testKey");
+      expect(value).toBe("testValue");
+    });
+  });
+
+  describe("set", () => {
+    it("should store value in localStorage", async () => {
+      await kvStore.set("testKey", "testValue");
+      expect(localStorage.getItem("testKey")).toBe("testValue");
+    });
+
+    it("should overwrite existing value", async () => {
+      localStorage.setItem("testKey", "oldValue");
+      await kvStore.set("testKey", "newValue");
+      expect(localStorage.getItem("testKey")).toBe("newValue");
+    });
+  });
+
+  describe("delete", () => {
+    it("should remove item from localStorage", async () => {
+      localStorage.setItem("testKey", "testValue");
+      await kvStore.delete("testKey");
+      expect(localStorage.getItem("testKey")).toBeNull();
+    });
+
+    it("should not throw when deleting non-existent key", async () => {
+      await expect(kvStore.delete("nonexistent")).resolves.not.toThrow();
+    });
+  });
+
+  describe("clearAll", () => {
+    it("should remove all items from localStorage", async () => {
+      localStorage.setItem("key1", "value1");
+      localStorage.setItem("key2", "value2");
+
+      await kvStore.clearAll();
+
+      expect(localStorage.length).toBe(0);
+    });
+
+    it("should work with empty localStorage", async () => {
+      await expect(kvStore.clearAll()).resolves.not.toThrow();
+    });
+  });
+});