@sanity/sdk 0.0.0-chore-react-18-compat.1 → 0.0.0-chore-react-18-compat.3

package/src/query/queryStore.ts

@@ -20,13 +20,19 @@ import {
   tap,
 } from 'rxjs'
 
-import {type ClientOptions, getClientState} from '../client/clientStore'
-import {type SanityInstance} from '../instance/types'
-import {type ActionContext, createAction, createInternalAction} from '../resources/createAction'
-import {createResource} from '../resources/createResource'
-import {createStateSourceAction, type StateSource} from '../resources/createStateSourceAction'
+import {getClientState} from '../client/clientStore'
+import {type DatasetHandle} from '../config/sanityConfig'
+import {bindActionByDataset} from '../store/createActionBinder'
+import {type SanityInstance} from '../store/createSanityInstance'
+import {
+  createStateSourceAction,
+  type SelectorContext,
+  type StateSource,
+} from '../store/createStateSourceAction'
+import {type StoreState} from '../store/createStoreState'
+import {defineStore, type StoreContext} from '../store/defineStore'
 import {insecureRandomId} from '../utils/ids'
-import {QUERY_STATE_CLEAR_DELAY} from './queryStoreConstants'
+import {QUERY_STATE_CLEAR_DELAY, QUERY_STORE_API_VERSION} from './queryStoreConstants'
 import {
   addSubscriber,
   cancelQuery,
@@ -42,8 +48,11 @@ import {
  * @beta
  */
 export interface QueryOptions
-  extends Pick<ResponseQueryOptions, 'perspective' | 'useCdn' | 'cache' | 'next' | 'cacheMode'>,
-    Pick<ClientOptions, 'scope' | 'resourceId'> {
+  extends Pick<
+      ResponseQueryOptions,
+      'perspective' | 'useCdn' | 'cache' | 'next' | 'cacheMode' | 'tag'
+    >,
+    DatasetHandle {
   params?: Record<string, unknown>
 }
 
@@ -63,13 +72,13 @@ export const getQueryKey = (query: string, options: QueryOptions = {}): string =
 export const parseQueryKey = (key: string): {query: string; options: QueryOptions} =>
   JSON.parse(key)
 
-export const queryStore = createResource<QueryStoreState>({
+const queryStore = defineStore<QueryStoreState>({
   name: 'QueryStore',
   getInitialState: () => ({queries: {}}),
-  initialize() {
+  initialize(context) {
     const subscriptions = [
-      listenForNewSubscribersAndFetch(this),
-      listenToLiveClientAndSetLastLiveEventIds(this),
+      listenForNewSubscribersAndFetch(context),
+      listenToLiveClientAndSetLastLiveEventIds(context),
     ]
 
     return () => {
@@ -80,106 +89,107 @@ export const queryStore = createResource<QueryStoreState>({
   },
 })
 
-export const errorHandler = createInternalAction(({state}: ActionContext<{error?: unknown}>) => {
-  return function () {
-    return (error: unknown) => state.set('setError', {error})
-  }
-})
-
-const listenForNewSubscribersAndFetch = createInternalAction(
-  ({state, instance}: ActionContext<QueryStoreState>) => {
-    return function () {
-      return state.observable
-        .pipe(
-          map((s) => new Set(Object.keys(s.queries))),
-          distinctUntilChanged((curr, next) => {
-            if (curr.size !== next.size) return false
-            return Array.from(next).every((i) => curr.has(i))
-          }),
-          startWith(new Set<string>()),
-          pairwise(),
-          mergeMap(([curr, next]) => {
-            const added = Array.from(next).filter((i) => !curr.has(i))
-            const removed = Array.from(curr).filter((i) => !next.has(i))
-
-            return [
-              ...added.map((key) => ({key, added: true})),
-              ...removed.map((key) => ({key, added: false})),
-            ]
-          }),
-          groupBy((i) => i.key),
-          mergeMap((group$) =>
-            group$.pipe(
-              switchMap((e) => {
-                if (!e.added) return EMPTY
+const errorHandler = (state: StoreState<{error?: unknown}>) => {
+  return (error: unknown): void => state.set('setError', {error})
+}
 
-                const lastLiveEventId$ = state.observable.pipe(
-                  map((s) => s.queries[group$.key]?.lastLiveEventId),
-                  distinctUntilChanged(),
-                )
-                const {query, options: {params, scope, ...options} = {}} = parseQueryKey(group$.key)
-                const client$ = getClientState(instance, {apiVersion: 'vX', scope}).observable
+const listenForNewSubscribersAndFetch = ({state, instance}: StoreContext<QueryStoreState>) => {
+  return state.observable
+    .pipe(
+      map((s) => new Set(Object.keys(s.queries))),
+      distinctUntilChanged((curr, next) => {
+        if (curr.size !== next.size) return false
+        return Array.from(next).every((i) => curr.has(i))
+      }),
+      startWith(new Set<string>()),
+      pairwise(),
+      mergeMap(([curr, next]) => {
+        const added = Array.from(next).filter((i) => !curr.has(i))
+        const removed = Array.from(curr).filter((i) => !next.has(i))
 
-                return combineLatest([lastLiveEventId$, client$]).pipe(
-                  switchMap(([lastLiveEventId, client]) =>
-                    client.observable.fetch(query, params, {
-                      ...options,
-                      filterResponse: false,
-                      returnQuery: false,
-                      lastLiveEventId,
-                    }),
-                  ),
-                )
-              }),
-              catchError((error) => {
-                state.set('setQueryError', setQueryError(group$.key, error))
-                return EMPTY
-              }),
-              tap(({result, syncTags}) => {
-                state.set('setQueryData', setQueryData(group$.key, result, syncTags))
-              }),
-            ),
-          ),
-        )
-        .subscribe({error: errorHandler(this)})
-    }
-  },
-)
+        return [
+          ...added.map((key) => ({key, added: true})),
+          ...removed.map((key) => ({key, added: false})),
+        ]
+      }),
+      groupBy((i) => i.key),
+      mergeMap((group$) =>
+        group$.pipe(
+          switchMap((e) => {
+            if (!e.added) return EMPTY
 
-const listenToLiveClientAndSetLastLiveEventIds = createInternalAction(
-  ({state, instance}: ActionContext<QueryStoreState>) => {
-    return function () {
-      const liveMessages$ = getClientState(instance, {apiVersion: 'vX'}).observable.pipe(
-        switchMap((client) =>
-          client.live.events({includeDrafts: !!client.config().token, tag: 'query-store'}),
-        ),
-        share(),
-        filter((e) => e.type === 'message'),
-      )
-
-      return state.observable
-        .pipe(
-          mergeMap((s) => Object.entries(s.queries)),
-          groupBy(([key]) => key),
-          mergeMap((group$) => {
-            const syncTags$ = group$.pipe(
-              map(([, queryState]) => queryState),
-              map((i) => i?.syncTags ?? EMPTY_ARRAY),
+            const lastLiveEventId$ = state.observable.pipe(
+              map((s) => s.queries[group$.key]?.lastLiveEventId),
               distinctUntilChanged(),
             )
+            const {query, options: {params, projectId, dataset, tag, ...options} = {}} =
+              parseQueryKey(group$.key)
+            const client$ = getClientState(instance, {
+              apiVersion: QUERY_STORE_API_VERSION,
+              projectId,
+              dataset,
+            }).observable
 
-            return combineLatest([liveMessages$, syncTags$]).pipe(
-              filter(([message, syncTags]) => message.tags.some((tag) => syncTags.includes(tag))),
-              tap(([message]) => {
-                state.set('setLastLiveEventId', setLastLiveEventId(group$.key, message.id))
-              }),
+            return combineLatest([lastLiveEventId$, client$]).pipe(
+              switchMap(([lastLiveEventId, client]) =>
+                client.observable.fetch(query, params, {
+                  ...options,
+                  filterResponse: false,
+                  returnQuery: false,
+                  lastLiveEventId,
+                  tag,
+                }),
+              ),
             )
           }),
+          catchError((error) => {
+            state.set('setQueryError', setQueryError(group$.key, error))
+            return EMPTY
+          }),
+          tap(({result, syncTags}) => {
+            state.set('setQueryData', setQueryData(group$.key, result, syncTags))
+          }),
+        ),
+      ),
+    )
+    .subscribe({error: errorHandler(state)})
+}
+
+const listenToLiveClientAndSetLastLiveEventIds = ({
+  state,
+  instance,
+}: StoreContext<QueryStoreState>) => {
+  const liveMessages$ = getClientState(instance, {
+    apiVersion: QUERY_STORE_API_VERSION,
+  }).observable.pipe(
+    switchMap((client) =>
+      client.live.events({includeDrafts: !!client.config().token, tag: 'query-store'}),
+    ),
+    share(),
+    filter((e) => e.type === 'message'),
+  )
+
+  return state.observable
+    .pipe(
+      mergeMap((s) => Object.entries(s.queries)),
+      groupBy(([key]) => key),
+      mergeMap((group$) => {
+        const syncTags$ = group$.pipe(
+          map(([, queryState]) => queryState),
+          map((i) => i?.syncTags ?? EMPTY_ARRAY),
+          distinctUntilChanged(),
+        )
+
+        return combineLatest([liveMessages$, syncTags$]).pipe(
+          filter(([message, syncTags]) => message.tags.some((tag) => syncTags.includes(tag))),
+          tap(([message]) => {
+            state.set('setLastLiveEventId', setLastLiveEventId(group$.key, message.id))
+          }),
         )
-        .subscribe({error: errorHandler(this)})
-    }
-  },
-)
+      }),
+    )
+    .subscribe({error: errorHandler(state)})
+}
 
 /**
  * Returns the state source for a query.
@@ -198,13 +208,13 @@ const listenToLiveClientAndSetLastLiveEventIds = createInternalAction(
  * @beta
  */
 export function getQueryState<T>(
-  instance: SanityInstance | ActionContext<QueryStoreState>,
+  instance: SanityInstance,
   query: string,
   options?: QueryOptions,
 ): StateSource<T | undefined>
 /** @beta */
 export function getQueryState(
-  instance: SanityInstance | ActionContext<QueryStoreState>,
+  instance: SanityInstance,
   query: string,
   options?: QueryOptions,
 ): StateSource<unknown>
@@ -212,29 +222,36 @@ export function getQueryState(
 export function getQueryState(...args: Parameters<typeof _getQueryState>): StateSource<unknown> {
   return _getQueryState(...args)
 }
-const _getQueryState = createStateSourceAction(queryStore, {
-  selector: (state: QueryStoreState, query: string, options?: QueryOptions) => {
-    if (state.error) throw state.error
-    const key = getQueryKey(query, options)
-    const queryState = state.queries[key]
-    if (queryState?.error) throw queryState.error
-    return queryState?.result
-  },
-  onSubscribe: ({state}, query, options?: QueryOptions) => {
-    const subscriptionId = insecureRandomId()
-    const key = getQueryKey(query, options)
+const _getQueryState = bindActionByDataset(
+  queryStore,
+  createStateSourceAction({
+    selector: (
+      {state}: SelectorContext<QueryStoreState>,
+      query: string,
+      options?: QueryOptions,
+    ) => {
+      if (state.error) throw state.error
+      const key = getQueryKey(query, options)
+      const queryState = state.queries[key]
+      if (queryState?.error) throw queryState.error
+      return queryState?.result
+    },
+    onSubscribe: ({state}, query, options?: QueryOptions) => {
+      const subscriptionId = insecureRandomId()
+      const key = getQueryKey(query, options)
 
-    state.set('addSubscriber', addSubscriber(key, subscriptionId))
+      state.set('addSubscriber', addSubscriber(key, subscriptionId))
 
-    return () => {
-      // this runs on unsubscribe
-      setTimeout(
-        () => state.set('removeSubscriber', removeSubscriber(key, subscriptionId)),
-        QUERY_STATE_CLEAR_DELAY,
-      )
-    }
-  },
-})
+      return () => {
+        // this runs on unsubscribe
+        setTimeout(
+          () => state.set('removeSubscriber', removeSubscriber(key, subscriptionId)),
+          QUERY_STATE_CLEAR_DELAY,
+        )
+      }
+    },
+  }),
+)
 
 /**
  * Resolves the result of a query without registering a lasting subscriber.
@@ -251,13 +268,13 @@ const _getQueryState = createStateSourceAction(queryStore, {
  * @beta
  */
 export function resolveQuery<T>(
-  instance: SanityInstance | ActionContext<QueryStoreState>,
+  instance: SanityInstance,
   query: string,
   options?: ResolveQueryOptions,
 ): Promise<T>
 /** @beta */
 export function resolveQuery(
-  instance: SanityInstance | ActionContext<QueryStoreState>,
+  instance: SanityInstance,
   query: string,
   options?: ResolveQueryOptions,
 ): Promise<unknown>
@@ -265,9 +282,10 @@ export function resolveQuery(
 export function resolveQuery(...args: Parameters<typeof _resolveQuery>): Promise<unknown> {
   return _resolveQuery(...args)
 }
-const _resolveQuery = createAction(queryStore, ({state}) => {
-  return function (query: string, {signal, ...options}: ResolveQueryOptions = {}) {
-    const {getCurrent} = getQueryState(this, query, options)
+const _resolveQuery = bindActionByDataset(
+  queryStore,
+  ({state, instance}, query: string, {signal, ...options}: ResolveQueryOptions = {}) => {
+    const {getCurrent} = getQueryState(instance, query, options)
     const key = getQueryKey(query, options)
 
     const aborted$ = signal
@@ -302,5 +320,5 @@ const _resolveQuery = createAction(queryStore, ({state}) => {
     )
 
     return firstValueFrom(race([resolved$, aborted$]))
-  }
-})
+  },
+)

package/src/query/queryStoreConstants.ts

@@ -6,3 +6,5 @@
  * different views quickly.
  */
 export const QUERY_STATE_CLEAR_DELAY = 1000
+// NOTE: Have to use vX for the text::query groq function
+export const QUERY_STORE_API_VERSION = 'vX'

package/src/store/createActionBinder.test.ts

@@ -0,0 +1,153 @@
+import {beforeEach, describe, expect, it, vi} from 'vitest'
+
+import {bindActionByDataset, bindActionGlobally, createActionBinder} from './createActionBinder'
+import {createSanityInstance} from './createSanityInstance'
+import {createStoreInstance} from './createStoreInstance'
+
+// Mock store instance creation for testing
+vi.mock('./createStoreInstance', () => ({
+  createStoreInstance: vi.fn(() => ({state: {counter: 0}, dispose: vi.fn()})),
+}))
+beforeEach(() => vi.mocked(createStoreInstance).mockClear())
+
+describe('createActionBinder', () => {
+  it('should bind an action and call it with correct context and parameters, using caching', () => {
+    const binder = createActionBinder(() => '')
+    const storeDefinition = {
+      name: 'TestStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    // Action that increments counter by given value
+    const action = vi.fn((context, increment: number) => {
+      context.state.counter += increment
+      return context.state.counter
+    })
+    const boundAction = binder(storeDefinition, action)
+    const instance = createSanityInstance({projectId: 'proj1', dataset: 'ds1'})
+
+    // First call creates store instance
+    const result1 = boundAction(instance, 5)
+    expect(result1).toBe(5)
+    // Second call reuses cached store
+    const result2 = boundAction(instance, 5)
+    expect(result2).toBe(10)
+
+    expect(action).toHaveBeenCalledTimes(2)
+    expect(vi.mocked(createStoreInstance)).toHaveBeenCalledTimes(1)
+  })
+
+  it('should create separate store instances for different composite keys', () => {
+    const binder = createActionBinder(({projectId, dataset}) => `${projectId}.${dataset}`)
+    const storeDefinition = {
+      name: 'TestStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    const action = vi.fn((context, val: number) => {
+      context.state.counter += val
+      return context.state.counter
+    })
+    const boundAction = binder(storeDefinition, action)
+    const instanceA = createSanityInstance({projectId: 'p1', dataset: 'd1'})
+    const instanceB = createSanityInstance({projectId: 'p2', dataset: 'd2'})
+
+    const resultA = boundAction(instanceA, 3)
+    const resultB = boundAction(instanceB, 4)
+
+    expect(resultA).toBe(3)
+    expect(resultB).toBe(4)
+    expect(vi.mocked(createStoreInstance)).toHaveBeenCalledTimes(2)
+  })
+
+  it('should dispose the store instance when the last instance is disposed', () => {
+    const binder = createActionBinder(() => '')
+    const storeDefinition = {
+      name: 'TestStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    const action = vi.fn((context) => context.state.counter)
+    const boundAction = binder(storeDefinition, action)
+    const instance1 = createSanityInstance({projectId: 'p1', dataset: 'd1'})
+    const instance2 = createSanityInstance({projectId: 'p1', dataset: 'd1'})
+
+    // Call action on both instances
+    boundAction(instance1)
+    boundAction(instance2)
+    expect(vi.mocked(createStoreInstance)).toHaveBeenCalledTimes(1)
+
+    const [{value: storeInstance}] = vi.mocked(createStoreInstance).mock.results
+    expect(storeInstance).toBeDefined()
+
+    // First disposal shouldn't trigger store disposal
+    instance1.dispose()
+    expect(storeInstance.dispose).not.toHaveBeenCalled()
+
+    // Last disposal should trigger store disposal
+    instance2.dispose()
+    expect(storeInstance.dispose).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('bindActionByDataset', () => {
+  it('should work correctly when projectId and dataset are provided', () => {
+    const storeDefinition = {
+      name: 'DSStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    const action = vi.fn((_context, value: string) => value)
+    const boundAction = bindActionByDataset(storeDefinition, action)
+    const instance = createSanityInstance({projectId: 'proj1', dataset: 'ds1'})
+    const result = boundAction(instance, 'hello')
+    expect(result).toBe('hello')
+  })
+
+  it('should throw an error if projectId or dataset is missing', () => {
+    const storeDefinition = {
+      name: 'DSStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    const action = vi.fn((_context) => 'fail')
+    const boundAction = bindActionByDataset(storeDefinition, action)
+    // Instance with missing dataset
+    const instance = createSanityInstance({projectId: 'proj1', dataset: ''})
+    expect(() => boundAction(instance)).toThrow(
+      'This API requires a project ID and dataset configured.',
+    )
+  })
+})
+
+describe('bindActionGlobally', () => {
+  it('should work correctly ignoring config in key generation', () => {
+    const storeDefinition = {
+      name: 'GlobalStore',
+      getInitialState: () => ({counter: 0}),
+    }
+    const action = vi.fn((_context, x: number) => x)
+    const boundAction = bindActionGlobally(storeDefinition, action)
+
+    // Create instances with different configs
+    const instance1 = createSanityInstance({projectId: 'any', dataset: 'any'})
+    const instance2 = createSanityInstance({projectId: 'different', dataset: 'config'})
+
+    // Both instances should use the same store
+    const result1 = boundAction(instance1, 42)
+    const result2 = boundAction(instance2, 99)
+
+    expect(result1).toBe(42)
+    expect(result2).toBe(99)
+
+    // Verify single store instance used
+    expect(vi.mocked(createStoreInstance)).toHaveBeenCalledTimes(1)
+
+    // Verify action called with correct arguments
+    expect(action).toHaveBeenNthCalledWith(1, expect.anything(), 42)
+    expect(action).toHaveBeenNthCalledWith(2, expect.anything(), 99)
+
+    // Test disposal tracking
+    const [{value: storeInstance}] = vi.mocked(createStoreInstance).mock.results
+    instance1.dispose()
+    expect(storeInstance.dispose).not.toHaveBeenCalled()
+
+    instance2.dispose()
+    expect(storeInstance.dispose).toHaveBeenCalledTimes(1)
+  })
+})