@sanity/sdk-react 3.0.0-rc.0 → 3.0.0-rc.2

package/src/hooks/dashboard/useWindowTitle.test.ts

@@ -0,0 +1,244 @@
+import {renderHook, waitFor} from '@testing-library/react'
+import {afterEach, describe, expect, it, vi} from 'vitest'
+
+import {useWindowConnection} from '../comlink/useWindowConnection'
+import {useWindowTitle} from './useWindowTitle'
+
+vi.mock('../comlink/useWindowConnection', () => ({
+  useWindowConnection: vi.fn(),
+}))
+
+function createContextResponse(resource: Record<string, unknown>) {
+  return {context: {resource}}
+}
+
+describe('useWindowTitle', () => {
+  afterEach(() => {
+    vi.clearAllMocks()
+    document.title = ''
+  })
+
+  it('should set the document title to the manifest title', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: {title: 'Movie List App'},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle())
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movie List App')
+    })
+  })
+
+  it('should prefer manifest title over system title', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: {title: 'Movie List App'},
+        activeDeployment: {manifest: {title: 'Deployed Title'}},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle())
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movie List App')
+    })
+  })
+
+  it('should fall back to activeDeployment manifest title', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: null,
+        activeDeployment: {manifest: {title: 'Deployed Title'}},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle())
+
+    await waitFor(() => {
+      expect(document.title).toBe('Deployed Title')
+    })
+  })
+
+  it('should fall back to system title when no manifest title exists', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: null,
+        activeDeployment: null,
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle())
+
+    await waitFor(() => {
+      expect(document.title).toBe('sdk-movie-list')
+    })
+  })
+
+  it('should fall back to the iframe title when the dashboard resource has no title', async () => {
+    document.title = 'Local App'
+
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: '',
+        manifest: null,
+        activeDeployment: null,
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    const {rerender} = renderHook(({viewTitle}) => useWindowTitle(viewTitle), {
+      initialProps: {viewTitle: 'Teams'},
+    })
+
+    await waitFor(() => {
+      expect(document.title).toBe('Teams | Local App')
+    })
+
+    rerender({viewTitle: 'Week 10'})
+
+    await waitFor(() => {
+      expect(document.title).toBe('Week 10 | Local App')
+    })
+  })
+
+  it('should prepend view title when provided', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: {title: 'Movie List App'},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle('Movies'))
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movies | Movie List App')
+    })
+  })
+
+  it('should update when view title changes', async () => {
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: {title: 'Movie List App'},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    const {rerender} = renderHook(({viewTitle}) => useWindowTitle(viewTitle), {
+      initialProps: {viewTitle: 'Movies'},
+    })
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movies | Movie List App')
+    })
+
+    rerender({viewTitle: 'Movie Details'})
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movie Details | Movie List App')
+    })
+  })
+
+  it('should restore the previous title on unmount', async () => {
+    document.title = 'Previous Title'
+
+    const mockFetch = vi.fn().mockResolvedValue(
+      createContextResponse({
+        type: 'application',
+        title: 'sdk-movie-list',
+        manifest: {title: 'Movie List App'},
+      }),
+    )
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    const {unmount} = renderHook(() => useWindowTitle('Movies'))
+
+    await waitFor(() => {
+      expect(document.title).toBe('Movies | Movie List App')
+    })
+
+    unmount()
+
+    expect(document.title).toBe('Previous Title')
+  })
+
+  it('should handle AbortError silently', async () => {
+    const abortError = new Error('Aborted')
+    abortError.name = 'AbortError'
+    const mockFetch = vi.fn().mockRejectedValue(abortError)
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle())
+
+    await waitFor(() => {
+      expect(document.title).toBe('')
+    })
+  })
+
+  it('should log non-abort fetch errors', async () => {
+    const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const mockFetch = vi.fn().mockRejectedValue(new Error('Connection failed'))
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
+    })
+
+    renderHook(() => useWindowTitle('Movies'))
+
+    await waitFor(() => {
+      expect(consoleSpy).toHaveBeenCalledWith(
+        'Failed to fetch app title from dashboard context:',
+        expect.any(Error),
+      )
+    })
+
+    consoleSpy.mockRestore()
+  })
+})

package/src/hooks/dashboard/useWindowTitle.ts

@@ -0,0 +1,114 @@
+import {SDK_CHANNEL_NAME, SDK_NODE_NAME} from '@sanity/message-protocol'
+import {useEffect, useState} from 'react'
+
+import {useWindowConnection} from '../comlink/useWindowConnection'
+
+interface ContextResource {
+  type: string
+  title?: string
+  manifest?: {
+    title?: string
+  } | null
+  activeDeployment?: {
+    manifest?: {
+      title?: string
+    } | null
+  } | null
+}
+
+interface ContextResponse {
+  context: {
+    resource: ContextResource
+  }
+}
+
+function resolveAppTitle(resource: ContextResource): string | undefined {
+  return resource.manifest?.title || resource.activeDeployment?.manifest?.title || resource.title
+}
+
+/**
+ * Sets the browser's document title, automatically including the app's name
+ * from the manifest.
+ *
+ * This follows the same convention as Sanity Studio workspaces, where the
+ * workspace name is always present in the title:
+ *
+ * - With a view title: `<viewTitle> | <appTitle>`
+ * - Without a view title: `<appTitle>`
+ *
+ * The Sanity dashboard appends `| Sanity` to produce the final browser tab title.
+ *
+ * @param viewTitle - An optional view-specific title to prepend to the app title.
+ *
+ * @example
+ * ```tsx
+ * import {useWindowTitle} from '@sanity/sdk-react'
+ *
+ * function MoviesList() {
+ *   useWindowTitle('Movies')
+ *   return <div>...</div>
+ * }
+ *
+ * // Browser tab: "Movies | My App | Sanity"
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Call without arguments to show just the app title
+ * function AppRoot() {
+ *   useWindowTitle()
+ *   return <Outlet />
+ * }
+ *
+ * // Browser tab: "My App | Sanity"
+ * ```
+ *
+ * @public
+ */
+export function useWindowTitle(viewTitle?: string): void {
+  const [appTitle, setAppTitle] = useState<string | null>(null)
+
+  const {fetch} = useWindowConnection({
+    name: SDK_NODE_NAME,
+    connectTo: SDK_CHANNEL_NAME,
+  })
+
+  useEffect(() => {
+    if (!fetch) return
+
+    const controller = new AbortController()
+
+    async function fetchAppTitle(signal: AbortSignal) {
+      try {
+        const data = await fetch<ContextResponse>('dashboard/v1/context', undefined, {signal})
+        // Local development resources do not have a registered title or deployment manifest.
+        // In that case, use the title rendered into the iframe HTML by the Sanity CLI.
+        const title = resolveAppTitle(data.context.resource) || document.title
+        if (title) {
+          setAppTitle(title)
+        }
+      } catch (err: unknown) {
+        if (err instanceof Error && err.name === 'AbortError') return
+        // eslint-disable-next-line no-console
+        console.error('Failed to fetch app title from dashboard context:', err)
+      }
+    }
+
+    fetchAppTitle(controller.signal)
+
+    return () => {
+      controller.abort()
+    }
+  }, [fetch])
+
+  useEffect(() => {
+    if (!appTitle) return
+
+    const previous = document.title
+    document.title = viewTitle ? `${viewTitle} | ${appTitle}` : appTitle
+
+    return () => {
+      document.title = previous
+    }
+  }, [viewTitle, appTitle])
+}

package/src/hooks/datasets/useDatasets.test.tsx

@@ -0,0 +1,116 @@
+import {type DatasetsResponse} from '@sanity/client'
+import {
+  createSanityInstance,
+  getDatasetsState,
+  resolveDatasets,
+  type StateSource,
+} from '@sanity/sdk'
+import {type ReactNode} from 'react'
+import {type Observable} from 'rxjs'
+import {beforeEach, describe, expect, it, vi} from 'vitest'
+
+import {renderHook} from '../../../test/test-utils'
+import {ResourceProvider} from '../../context/ResourceProvider'
+import {SanityInstanceContext} from '../../context/SanityInstanceContext'
+import {useDatasets} from './useDatasets'
+
+vi.mock('@sanity/sdk', async (importOriginal) => {
+  const original = await importOriginal<typeof import('@sanity/sdk')>()
+  return {...original, getDatasetsState: vi.fn(), resolveDatasets: vi.fn()}
+})
+
+const stateSource = (
+  current: DatasetsResponse | undefined,
+): StateSource<DatasetsResponse | undefined> =>
+  ({
+    getCurrent: vi.fn(() => current),
+    subscribe: vi.fn(),
+    get observable(): Observable<unknown> {
+      throw new Error('Not implemented')
+    },
+  }) as unknown as StateSource<DatasetsResponse | undefined>
+
+const sanityInstance = expect.objectContaining({config: expect.any(Object)})
+
+describe('useDatasets', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    vi.mocked(getDatasetsState).mockReturnValue(stateSource([] as unknown as DatasetsResponse))
+  })
+
+  it('resolves the projectId from the instance config resource', () => {
+    // test-utils wraps with ResourceProvider projectId="test" dataset="test".
+    renderHook(() => useDatasets())
+    expect(getDatasetsState).toHaveBeenCalledWith(
+      sanityInstance,
+      expect.objectContaining({projectId: 'test'}),
+    )
+  })
+
+  it('lets an explicit projectId override the ambient resource', () => {
+    renderHook(() => useDatasets({projectId: 'explicit-project'}))
+    expect(getDatasetsState).toHaveBeenCalledWith(
+      sanityInstance,
+      expect.objectContaining({projectId: 'explicit-project'}),
+    )
+  })
+
+  it('resolves the projectId from an explicit resource when the config has none', () => {
+    renderHook(() => useDatasets(), {
+      wrapper: ({children}: {children: ReactNode}) => (
+        <ResourceProvider
+          resource={{projectId: 'resource-project', dataset: 'production'}}
+          fallback={null}
+        >
+          {children}
+        </ResourceProvider>
+      ),
+    })
+    expect(getDatasetsState).toHaveBeenCalledWith(
+      sanityInstance,
+      expect.objectContaining({projectId: 'resource-project'}),
+    )
+  })
+
+  it('resolves a dataset-less projectId config for project-scoped use', () => {
+    renderHook(() => useDatasets(), {
+      wrapper: ({children}: {children: ReactNode}) => (
+        <ResourceProvider projectId="config-project" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
+    // A dataset-less config can't form a DatasetResource; the projectId is carried
+    // via ProjectContext and injected so project-scoped reads still resolve it.
+    expect(getDatasetsState).toHaveBeenCalledWith(
+      sanityInstance,
+      expect.objectContaining({projectId: 'config-project'}),
+    )
+  })
+
+  it('resolves a bare projectId from a ResourceProvider when the parent instance has no config', () => {
+    // An instance with no project/dataset config and no ambient
+    // resource, then a projectId-only ResourceProvider.
+    const emptyInstance = createSanityInstance({})
+    renderHook(() => useDatasets(), {
+      wrapper: ({children}: {children: ReactNode}) => (
+        <SanityInstanceContext.Provider value={emptyInstance}>
+          <ResourceProvider projectId="bare-project" fallback={null}>
+            {children}
+          </ResourceProvider>
+        </SanityInstanceContext.Provider>
+      ),
+    })
+    expect(getDatasetsState).toHaveBeenCalledWith(
+      emptyInstance,
+      expect.objectContaining({projectId: 'bare-project'}),
+    )
+  })
+
+  it('suspends via resolveDatasets until dataset data is available', () => {
+    vi.mocked(getDatasetsState).mockReturnValue(stateSource(undefined))
+    vi.mocked(resolveDatasets).mockReturnValue(new Promise(() => {}))
+    renderHook(() => useDatasets())
+    expect(resolveDatasets).toHaveBeenCalled()
+  })
+})

package/src/hooks/datasets/useDatasets.ts

@@ -1,7 +1,14 @@
 import {type DatasetsResponse} from '@sanity/client'
-import {getDatasetsState, resolveDatasets, type SanityInstance, type StateSource} from '@sanity/sdk'
+import {
+  getDatasetsState,
+  type ProjectHandle,
+  resolveDatasets,
+  type SanityInstance,
+  type StateSource,
+} from '@sanity/sdk'
 
 import {createStateSourceHook} from '../helpers/createStateSourceHook'
+import {useResolvedProjectId} from '../helpers/useResolvedProjectId'
 
 type UseDatasets = {
   /**
@@ -9,12 +16,13 @@ type UseDatasets = {
    * Returns metadata for each dataset the current user has access to.
    *
    * @category Datasets
-   * @param options - An object containing the `projectId` to list datasets for.
-   * @returns The metadata for the datasets
+   * @param options - Optional project/resource to read datasets for. Defaults to
+   *   the resource named in `ResourceProvider`/`SDKProvider`.
+   * @returns The metadata for your the datasets
    *
    * @example
    * ```tsx
-   * const datasets = useDatasets({projectId: 'my-project-id'})
+   * const datasets = useDatasets()
    *
    * return (
    *   <select>
@@ -25,20 +33,32 @@ type UseDatasets = {
    * )
    * ```
    *
+   * @remarks
+   * The `projectId` is resolved in order from:
+   * 1. an explicit `projectId` option
+   * 2. A legacy ProjectContext (e.g. a `<ResourceProvider projectId="…">` with no dataset), then
+   * 3. The active resource (`ResourceProvider`/`SDKProvider`)
+   * 4. `instance.config`.
    */
-  (options: {projectId: string}): DatasetsResponse
+  (options?: ProjectHandle): DatasetsResponse
 }
 
-/**
- * @public
- * @function
- */
-export const useDatasets: UseDatasets = createStateSourceHook({
+const useDatasetsBase = createStateSourceHook({
   getState: getDatasetsState as (
     instance: SanityInstance,
-    options: {projectId: string},
+    projectHandle?: ProjectHandle,
   ) => StateSource<DatasetsResponse>,
-  shouldSuspend: (instance, options: {projectId: string}) =>
-    getDatasetsState(instance, options).getCurrent() === undefined,
+  shouldSuspend: (instance, projectHandle?: ProjectHandle) =>
+    // remove `undefined` since we're suspending when that is the case
+    getDatasetsState(instance, projectHandle).getCurrent() === undefined,
   suspender: resolveDatasets,
 })
+
+/**
+ * @public
+ * @function
+ */
+export const useDatasets: UseDatasets = (options) => {
+  const projectId = useResolvedProjectId(options)
+  return useDatasetsBase(projectId ? {...options, projectId} : options)
+}

package/src/hooks/document/useApplyDocumentActions.test.tsx

@@ -0,0 +1,48 @@
+import {applyDocumentActions, createSanityInstance} from '@sanity/sdk'
+import {describe, it} from 'vitest'
+
+import {renderHook} from '../../../test/test-utils'
+import {useSanityInstance} from '../context/useSanityInstance'
+import {useApplyDocumentActions} from './useApplyDocumentActions'
+
+// Resource resolution, mismatch detection, and context fallback are covered
+// by hooks/helpers/useApplyActions.test.tsx — both this hook and
+// useApplyReleaseActions are typed wrappers over that shared implementation.
+// These tests just verify the wrapper forwards document actions through.
+
+vi.mock('@sanity/sdk', async (importOriginal) => {
+  const original = await importOriginal<typeof import('@sanity/sdk')>()
+  return {...original, applyDocumentActions: vi.fn()}
+})
+
+vi.mock('../context/useSanityInstance')
+
+const instance = createSanityInstance({projectId: 'p', dataset: 'd'})
+
+describe('useApplyDocumentActions', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+    vi.mocked(useSanityInstance).mockReturnValueOnce(instance)
+  })
+
+  it('forwards a document action to applyDocumentActions with the resolved resource', () => {
+    const {result} = renderHook(() => useApplyDocumentActions())
+    result.current({
+      type: 'document.edit',
+      documentType: 'post',
+      documentId: 'abc',
+    })
+
+    expect(applyDocumentActions).toHaveBeenCalledExactlyOnceWith(instance, {
+      actions: [
+        {
+          type: 'document.edit',
+          documentType: 'post',
+          documentId: 'abc',
+          resource: {projectId: 'test', dataset: 'test'},
+        },
+      ],
+      resource: {projectId: 'test', dataset: 'test'},
+    })
+  })
+})