WeaveStoreAzureWebPubsub

Overview

The WeaveStoreAzureWebPubsub class is a client-side store in the Weave.js Azure Web PubSub store that enables real-time collaboration via Azure Web PubSub. It connects to a backend powered by WeaveAzureWebPubsubServer, using Yjs under the hood to handle conflict-free data syncing and user awareness.

This store allows your Weave.js-based frontend application to join a collaborative session, share state with other users, and reflect live updates instantly—all while leveraging the scalability and reliability of Azure’s managed infrastructure.

Import

import { WeaveStoreAzureWebPubsub } from "@inditextech/weave-store-azure-web-pubsub/client";

Instantiation

const store = new WeaveStoreAzureWebPubsub(initialRoomData: Uint8Array | FetchInitialState | undefined, storeOptions: WeaveStoreOptions, azureWebPubsubOptions: WeaveStoreAzureWebPubsubOptions);

Parameters

Prop	Type	Default
`azureWebPubsubOptions.syncClientOptions.heartbeat.checkIntervalMs?`	`number`	`5000`
`azureWebPubsubOptions.syncClientOptions.heartbeat.checkWindowTimeMs?`	`number`	`10000`
`azureWebPubsubOptions.fetchClient?`	`FetchClient`	`fetch`
`azureWebPubsubOptions.url`	`string`	-
`azureWebPubsubOptions.roomId`	`string`	-
`storeOptions.undoManagerOptions?`	`WeaveUndoManagerOptions`	-
`storeOptions.getUser`	`() => WeaveUser`	-
`initialRoomData`	`Uint8Array \| FetchInitialState \| undefined`	-

TypeScript types

type WeaveStoreAzureWebPubsubConfig = {
  endpoint: string;
  persistIntervalMs?: number;
  hubName: string;
  auth?: {
    key?: string;
    custom?: TokenCredential;
  };
  connectionHandlers?: DeepPartial<WeaveAzureWebPubsubSyncHandlerOptions>;
};

type WeaveAzureWebPubsubSyncHandlerOptions = {
  onConnect?: (
    connectionId: string,
    queries: Record<string, string[]> | undefined,
  ) => Promise<void>;
  onConnected?: (connectionId: string) => Promise<void>;
  removeConnection?: (connectionId: string) => Promise<void>;
  getConnectionRoom?: (connectionId: string) => Promise<string | null>;
  getRoomConnections?: (roomId: string) => Promise<string[]>;
  persistIntervalMs?: number;
};

type WeaveStoreAzureWebPubsubOptions = {
  roomId: string;
  url: string;
  fetchClient?: FetchClient;
  syncClientOptions?: DeepPartial<WeaveStoreAzureWebPubSubSyncClientOptions>;
};

type WeaveStoreAzureWebPubsubOnStoreFetchConnectionUrlEvent = {
  loading: boolean;
  error: Error | null;
};

type FetchClient = (
  input: string | URL | globalThis.Request,
  init?: RequestInit,
) => Promise<Response>;

type FetchInitialState = (doc: Doc) => void;
type PersistRoom = (
  roomId: string,
  actualState: Uint8Array<ArrayBufferLike>,
) => Promise<void>;
type FetchRoom = (roomId: string) => Promise<Uint8Array | null>;

type WeaveStoreAzureWebPubsubEvents = {
  onConnect: WeaveStoreAzureWebPubsubOnConnectEvent;
  onConnected: WeaveStoreAzureWebPubsubOnConnectedEvent;
  onDisconnected: WeaveStoreAzureWebPubsubOnDisconnectedEvent;
};

type WeaveStoreAzureWebPubsubOnConnectEvent = {
  context: ConnectionContext;
  queries: Record<string, string[]> | undefined;
};

type WeaveStoreAzureWebPubsubOnConnectedEvent = {
  context: ConnectionContext;
  queries?: Record<string, string[]>;
};

type WeaveStoreAzureWebPubsubOnDisconnectedEvent = {
  context: ConnectionContext;
  queries?: Record<string, string[]>;
};

type WeaveStoreAzureWebPubsubOnWebsocketOpenEvent = {
  group: string;
  event: WebSocket.Event;
  connectionAttempt: number;
};

type WeaveStoreAzureWebPubsubOnWebsocketJoinGroupEvent = {
  group: string;
  connectionAttempt: number;
};

type WeaveStoreAzureWebPubsubOnWebsocketMessageEvent = {
  group: string;
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  event: WebSocket.MessageEvent;
};

type WeaveStoreAzureWebPubsubOnWebsocketCloseEvent = {
  group: string;
  event: CloseEvent;
  connectionAttempt: number;
};

type WeaveStoreAzureWebPubsubOnWebsocketReconnectEvent = {
  group: string;
  connectionAttempt: number;
  timeoutMs: number;
};

type WeaveStoreAzureWebPubsubOnWebsocketErrorEvent = {
  group: string;
  error: ErrorEvent;
  connectionAttempt: number;
};

type WeaveStoreAzureWebPubSubSyncHostClientConnectOptions = {
  expirationTimeInMinutes?: number;
};

// Client types

type WeaveStoreAzureWebPubSubSyncClientConnectionStatusKeys =
  keyof typeof WEAVE_STORE_AZURE_WEB_PUBSUB_CONNECTION_STATUS;
type WeaveStoreAzureWebPubSubSyncClientConnectionStatus =
  (typeof WEAVE_STORE_AZURE_WEB_PUBSUB_CONNECTION_STATUS)[WeaveStoreAzureWebPubSubSyncClientConnectionStatusKeys];

enum MessageType {
  System = "system",
  JoinGroup = "joinGroup",
  SendToGroup = "sendToGroup",
}

enum MessageDataType {
  Init = "init",
  Sync = "sync",
  Awareness = "awareness",
}

interface MessageData {
  payloadId?: string;
  index?: number;
  type?: "heartbeat" | "resync" | "chunk" | "end";
  totalChunks?: number;
  group: string;
  t: string; // type / target uuid
  f: string; // origin uuid
  c: string; // base64 encoded binary data
}

interface Message {
  type: string;
  fromUserId: string;
  from: string;
  group: string;
  data: MessageData;
}

type MessageHandler = (
  encoder: Encoder,
  decoder: Decoder,
  client: WeaveStoreAzureWebPubSubSyncClient,
  clientId: string,
  emitSynced: boolean,
  messageType: number,
) => void;

type WeaveStoreAzureWebPubsubSyncHandlerDestroyRoomStatusKeys =
  keyof typeof WEAVE_STORE_AZURE_WEB_PUBSUB_DESTROY_ROOM_STATUS;
type WeaveStoreAzureWebPubsubSyncHandlerDestroyRoomStatus =
  (typeof WEAVE_STORE_AZURE_WEB_PUBSUB_DESTROY_ROOM_STATUS)[WeaveStoreAzureWebPubsubSyncHandlerDestroyRoomStatusKeys];

type WeaveStoreAzureWebPubSubSyncClientOptions = {
  heartbeat: {
    checkWindowTimeMs: number;
    checkIntervalMs: number;
  };
};

type WeaveStoreAzureWebPubsubSyncHostOptions = {
  heartbeat: {
    sendIntervalMs: number;
  };
  resync: {
    checkIntervalMs: number;
    attemptsLimit: number;
  };
};

Events

onStateChange

onStateChange: WeaveStoreOnStateChangeEvent;

The onStateChange event is called when the shared-state changes.

onRoomLoaded

onRoomLoaded: WeaveStoreOnRoomLoadedEvent;

The onRoomLoaded event is called when the room shared-state is loaded.

onUndoManagerStatusChange

onUndoManagerStatusChange: WeaveStoreOnUndoRedoChangeEvent;

The onUndoManagerStatusChange event is called when the undo/redo manager changes.

onNodeChange

onNodeChange: WeaveStoreOnNodeChangeEvent;

The onNodeChange event is called when there is a single node selected and the node changes.

Methods

connect

connect(): void

The connect method is called when an user tries to join a room.

disconnect

disconnect(): void

The disconnect method is called when an user leaves a room.

setAwarenessInfo

setAwarenessInfo(field: string, value: unknown): void

This method set awareness information, for example if you want to inform the metadata of an user that connected to the room, or to send the pointer information of that user to the other peers.

WeaveStoreAzureWebPubsub

On this page