Use a private SyncManager instead of a SyncProvider class

Author: chriszarate

packages/core-data/src/actions.js

@@ -10,7 +10,7 @@ import { v4 as uuid } from 'uuid';
 import apiFetch from '@wordpress/api-fetch';
 import { addQueryArgs } from '@wordpress/url';
 import deprecated from '@wordpress/deprecated';
-import { LOCAL_EDITOR_ORIGIN } from '@wordpress/sync';
+import { LOCAL_EDITOR_ORIGIN, syncManager } from '@wordpress/sync';
 
 /**
  * Internal dependencies
@@ -20,7 +20,6 @@ import { receiveItems, removeItems, receiveQueriedItems } from './queried-data';
 import { DEFAULT_ENTITY_KEY } from './entities';
 import { createBatch } from './batch';
 import { STORE_NAME } from './name';
-import { getSyncProvider } from './sync';
 import logEntityDeprecation from './utils/log-entity-deprecation';
 
 /**
@@ -414,7 +413,7 @@ export const editEntityRecord =
 				const objectType = `${ kind }/${ name }`;
 				const objectId = recordId;
 
-				getSyncProvider().updateCRDTDoc(
+				syncManager.update(
 					objectType,
 					objectId,
 					edit.edits,

packages/core-data/src/resolvers.js

@@ -9,6 +9,7 @@ import { camelCase } from 'change-case';
 import { addQueryArgs } from '@wordpress/url';
 import { decodeEntities } from '@wordpress/html-entities';
 import apiFetch from '@wordpress/api-fetch';
+import { syncManager } from '@wordpress/sync';
 
 /**
  * Internal dependencies
@@ -23,7 +24,6 @@ import {
 	ALLOWED_RESOURCE_ACTIONS,
 	RECEIVE_INTERMEDIATE_RESULTS,
 } from './utils';
-import { getSyncProvider } from './sync';
 import { fetchBlockPatterns } from './fetch';
 
 /**
@@ -185,7 +185,7 @@ export const getEntityRecord =
 						} );
 
 					// Bootstraps the edited document (and load from peers).
-					await getSyncProvider().bootstrap(
+					await syncManager.load(
 						entityConfig.syncConfig,
 						objectType,
 						objectId,

packages/core-data/src/sync.js

@@ -2,12 +2,13 @@
  * WordPress dependencies
  */
 import triggerFetch from '@wordpress/api-fetch';
+import { syncManager } from '@wordpress/sync';
 
 jest.mock( '@wordpress/api-fetch' );
-
-// Mock the sync provider
-jest.mock( '../sync', () => ( {
-	getSyncProvider: jest.fn(),
+jest.mock( '@wordpress/sync', () => ( {
+	syncManager: {
+		load: jest.fn(),
+	},
 } ) );
 
 /**
@@ -21,7 +22,6 @@ import {
 	getAutosaves,
 	getCurrentUser,
 } from '../resolvers';
-import { getSyncProvider } from '../sync';
 
 describe( 'getEntityRecord', () => {
 	const POST_TYPE = { slug: 'post' };
@@ -47,7 +47,7 @@ describe( 'getEntityRecord', () => {
 			finishResolutions: jest.fn(),
 		} );
 		triggerFetch.mockReset();
-		getSyncProvider.mockClear();
+		syncManager.load.mockClear();
 	} );
 
 	afterEach( () => {
@@ -123,7 +123,7 @@ describe( 'getEntityRecord', () => {
 		);
 	} );
 
-	it( 'bootstraps entity with sync provider when __experimentalEnableSync is true', async () => {
+	it( 'loads entity with sync provider when __experimentalEnableSync is true', async () => {
 		const POST_RECORD = { id: 1, title: 'Test Post' };
 		const POST_RESPONSE = {
 			json: () => Promise.resolve( POST_RECORD ),
@@ -140,12 +140,6 @@ describe( 'getEntityRecord', () => {
 
 		window.__experimentalEnableSync = true;
 
-		const mockBootstrap = jest.fn();
-		getSyncProvider.mockReturnValue( {
-			bootstrap: mockBootstrap,
-			register: jest.fn(),
-		} );
-
 		const resolveSelectWithSync = {
 			getEntitiesConfig: jest.fn( () => ENTITIES_WITH_SYNC ),
 			getEditedEntityRecord: jest.fn(),
@@ -163,10 +157,9 @@ describe( 'getEntityRecord', () => {
 			resolveSelect: resolveSelectWithSync,
 		} );
 
-		// Verify bootstrap was called with correct arguments.
-		expect( getSyncProvider ).toHaveBeenCalled();
-		expect( mockBootstrap ).toHaveBeenCalledTimes( 1 );
-		expect( mockBootstrap ).toHaveBeenCalledWith(
+		// Verify load was called with correct arguments.
+		expect( syncManager.load ).toHaveBeenCalledTimes( 1 );
+		expect( syncManager.load ).toHaveBeenCalledWith(
 			{},
 			'postType/post',
 			1,
@@ -197,12 +190,6 @@ describe( 'getEntityRecord', () => {
 
 		window.__experimentalEnableSync = true;
 
-		const mockBootstrap = jest.fn();
-		getSyncProvider.mockReturnValue( {
-			bootstrap: mockBootstrap,
-			register: jest.fn(),
-		} );
-
 		const resolveSelectWithSync = {
 			getEntitiesConfig: jest.fn( () => ENTITIES_WITH_SYNC ),
 			getEditedEntityRecord: jest.fn(),
@@ -220,10 +207,9 @@ describe( 'getEntityRecord', () => {
 			resolveSelect: resolveSelectWithSync,
 		} );
 
-		// Verify bootstrap was called with correct arguments.
-		expect( getSyncProvider ).toHaveBeenCalled();
-		expect( mockBootstrap ).toHaveBeenCalledTimes( 1 );
-		expect( mockBootstrap ).toHaveBeenCalledWith(
+		// Verify load was called with correct arguments.
+		expect( syncManager.load ).toHaveBeenCalledTimes( 1 );
+		expect( syncManager.load ).toHaveBeenCalledWith(
 			{},
 			'postType/post',
 			1,
@@ -232,7 +218,7 @@ describe( 'getEntityRecord', () => {
 		);
 	} );
 
-	it( 'does not bootstrap entity when query is present', async () => {
+	it( 'does not load entity when query is present', async () => {
 		const POST_RECORD = { id: 1, title: 'Test Post' };
 		const POST_RESPONSE = {
 			json: () => Promise.resolve( POST_RECORD ),
@@ -262,10 +248,10 @@ describe( 'getEntityRecord', () => {
 			resolveSelect: resolveSelectWithSync,
 		} );
 
-		expect( getSyncProvider ).not.toHaveBeenCalled();
+		expect( syncManager.load ).not.toHaveBeenCalled();
 	} );
 
-	it( 'does not bootstrap entity when __experimentalEnableSync is undefined', async () => {
+	it( 'does not load entity when __experimentalEnableSync is undefined', async () => {
 		const POST_RECORD = { id: 1, title: 'Test Post' };
 		const POST_RESPONSE = {
 			json: () => Promise.resolve( POST_RECORD ),
@@ -296,7 +282,7 @@ describe( 'getEntityRecord', () => {
 			resolveSelect: resolveSelectWithSync,
 		} );
 
-		expect( getSyncProvider ).not.toHaveBeenCalled();
+		expect( syncManager.load ).not.toHaveBeenCalled();
 	} );
 } );
 

packages/core-data/src/test/resolvers.js

@@ -14,45 +14,17 @@ npm install @wordpress/sync --save
 
 <!-- START TOKEN(Autogenerated API docs) -->
 
-### connectIndexDb
-
-Connect function to the IndexedDB persistence provider.
-
-_Parameters_
-
--   _objectId_ `ObjectID`: The object ID.
--   _objectType_ `ObjectType`: The object type.
--   _doc_ `CRDTDoc`: The CRDT document.
-
-_Returns_
-
--   `Promise< ConnectDocResult >`: Promise that resolves when the connection is established.
-
 ### CRDT_RECORD_MAP_KEY
 
 Root-level key for the CRDT document that holds the entity record data.
 
-### createWebRTCConnection
-
-Function that creates a new WebRTC Connection.
-
-_Parameters_
-
--   _config_ `Object`:
--   _config.signaling_ `Array<string>`:
--   _config.password_ `string|undefined`:
-
-_Returns_
-
--   `ConnectDoc`: Promise that resolves when the connection is established.
-
-### SyncProvider
+### syncManager
 
-SyncProvider manages the lifecycle of syncing entity records. It establishes connections, creates the awareness instance, and coordinates with the local store.
+The sync manager orchestrates the lifecycle of syncing entity records. It creates Yjs documents, connects to providers, creates awareness instances, and coordinates with the `core-data` store.
 
 _Type_
 
--   `SyncProvider`
+-   `SyncManager`
 
 ### Y
 

packages/sync/README.md

@@ -7,19 +7,19 @@ import { IndexeddbPersistence } from 'y-indexeddb';
 /** @typedef {import('./types').ObjectType} ObjectType */
 /** @typedef {import('./types').ObjectID} ObjectID */
 /** @typedef {import('./types').CRDTDoc} CRDTDoc */
-/** @typedef {import('./types').ConnectDoc} ConnectDoc */
-/** @typedef {import('./types').ConnectDocResult} ConnectDocResult */
+/** @typedef {import('./types').ProviderCreator} ProviderCreator */
+/** @typedef {import('./types').ProviderCreatorResult} ProviderCreatorResult */
 
 /**
  * Connect function to the IndexedDB persistence provider.
  *
- * @param {ObjectID}   objectId   The object ID.
  * @param {ObjectType} objectType The object type.
+ * @param {ObjectID}   objectId   The object ID.
  * @param {CRDTDoc}    doc        The CRDT document.
  *
- * @return {Promise< ConnectDocResult >} Promise that resolves when the connection is established.
+ * @return {Promise< ProviderCreatorResult >} Promise that resolves when the connection is established.
  */
-export function connectIndexDb( objectId, objectType, doc ) {
+export function connectIndexDb( objectType, objectId, doc ) {
 	const roomName = `${ objectType }-${ objectId }`;
 	const provider = new IndexeddbPersistence( roomName, doc );
 

packages/sync/src/connect-indexdb.js

@@ -10,21 +10,21 @@ import { WebrtcProviderWithHttpSignaling } from './webrtc-http-stream-signaling'
 
 /** @typedef {import('./types').ObjectType} ObjectType */
 /** @typedef {import('./types').ObjectID} ObjectID */
-/** @typedef {import('./types').ConnectDoc} ConnectDoc */
 /** @typedef {import('./types').CRDTDoc} CRDTDoc */
+/** @typedef {import('./types').ProviderCreator} ProviderCreator */
 
 /**
  * Function that creates a new WebRTC Connection.
  *
  * @param {Object}           config
  * @param {Array<string>}    config.signaling
  * @param {string|undefined} config.password
- * @return {ConnectDoc} Promise that resolves when the connection is established.
+ * @return {ProviderCreator} Promise that resolves when the connection is established.
  */
 export function createWebRTCConnection( { signaling, password } ) {
 	return function (
-		/** @type {ObjectID} */ objectId,
 		/** @type {ObjectType} */ objectType,
+		/** @type {ObjectID} */ objectId,
 		/** @type {CRDTDoc} */ doc
 	) {
 		const roomName = `${ objectType }-${ objectId }`;

packages/sync/src/create-webrtc-connection.js

@@ -11,8 +11,6 @@
  */
 export * as Y from 'yjs';
 
-export { CRDT_RECORD_MAP_KEY } from './config';
-export { connectIndexDb } from './connect-indexdb';
-export { createWebRTCConnection } from './create-webrtc-connection';
-export { SyncProvider } from './provider';
+export { CRDT_RECORD_MAP_KEY, LOCAL_EDITOR_ORIGIN } from './config';
+export { syncManager } from './manager';
 export type * from './types';