@sanity/sdk-react 2.14.0 → 2.15.0

package/package.json

@@ -1,30 +1,37 @@
 {
   "name": "@sanity/sdk-react",
-  "version": "2.14.0",
+  "version": "2.15.0",
   "private": false,
   "description": "Sanity SDK React toolkit for Content OS",
   "keywords": [
-    "sanity",
-    "sdk",
-    "content operating system",
     "cms",
+    "content",
+    "content operating system",
     "headless",
     "realtime",
-    "content"
+    "sanity",
+    "sdk"
   ],
   "homepage": "https://github.com/sanity-io/sdk/tree/main/packages/react/README.md",
   "bugs": {
     "url": "https://github.com/sanity-io/sdk/issues"
   },
+  "license": "MIT",
+  "author": "Sanity <developers@sanity.io>",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/sanity-io/sdk.git",
     "directory": "packages/react"
   },
-  "license": "MIT",
-  "author": "Sanity <developers@sanity.io>",
-  "sideEffects": false,
+  "files": [
+    "dist",
+    "src"
+  ],
   "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "source": "./src/_exports/index.ts",
@@ -33,51 +40,44 @@
     },
     "./package.json": "./package.json"
   },
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "files": [
-    "dist",
-    "src"
-  ],
-  "browserslist": "extends @sanity/browserslist-config",
-  "prettier": "@sanity/prettier-config",
+  "publishConfig": {
+    "access": "public"
+  },
   "dependencies": {
-    "@sanity/client": "^7.22.0",
+    "@sanity/client": "^7.23.0",
     "@sanity/message-protocol": "^0.23.0",
-    "@sanity/types": "^6.0.0",
+    "@sanity/types": "^6.1.0",
     "groq": "3.88.1-typegen-experimental.0",
     "react-compiler-runtime": "19.1.0-rc.2",
     "react-error-boundary": "^6.1.2",
     "rxjs": "^7.8.2",
-    "@sanity/sdk": "2.14.0"
+    "@sanity/sdk": "2.15.0"
   },
   "devDependencies": {
     "@sanity/browserslist-config": "^1.0.5",
     "@sanity/comlink": "^4.0.1",
-    "@sanity/pkg-utils": "^10.5.3",
-    "@sanity/prettier-config": "^1.0.6",
+    "@sanity/pkg-utils": "^10.5.8",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@types/node": "^24.12.4",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react": "^5.2.0",
-    "@vitest/coverage-v8": "^4.1.8",
+    "@vitest/coverage-v8": "^4.1.9",
     "babel-plugin-react-compiler": "19.1.0-rc.1",
     "eslint": "^9.39.4",
     "groq-js": "^1.30.2",
     "jsdom": "^29.1.1",
-    "prettier": "^3.8.3",
+    "oxfmt": "^0.55.0",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
-    "rollup-plugin-visualizer": "^5.14.0",
+    "rollup-plugin-visualizer": "^7.0.1",
     "typescript": "^5.9.3",
     "vite": "^7.3.5",
-    "vitest": "^4.1.8",
+    "vitest": "^4.1.9",
+    "@repo/package.bundle": "3.82.0",
     "@repo/config-eslint": "0.0.0",
     "@repo/config-test": "0.0.1",
-    "@repo/package.bundle": "3.82.0",
     "@repo/package.config": "0.0.1",
     "@repo/tsconfig": "0.0.1"
   },
@@ -85,16 +85,14 @@
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
-  "publishConfig": {
-    "access": "public"
-  },
+  "browserslist": "extends @sanity/browserslist-config",
   "scripts": {
     "build": "pkg build --strict --clean --check",
     "build:bundle": "vite build --configLoader runner --config package.bundle.ts",
     "clean": "rimraf dist",
     "dev": "pkg watch",
     "docs": "typedoc --json docs/typedoc.json --tsconfig ./tsconfig.dist.json",
-    "format": "prettier --write --cache --ignore-unknown .",
+    "format": "oxfmt",
     "lint": "eslint .",
     "test": "vitest run",
     "test:coverage": "vitest run --coverage",

package/src/_exports/sdk-react.ts

@@ -59,6 +59,7 @@ export {useStudioWorkspacesByProjectIdDataset} from '../hooks/dashboard/useStudi
 export {useWindowTitle} from '../hooks/dashboard/useWindowTitle'
 export {useDatasets} from '../hooks/datasets/useDatasets'
 export {useApplyDocumentActions} from '../hooks/document/useApplyDocumentActions'
+export {type CreateDocumentOverrides, useCreateDocument} from '../hooks/document/useCreateDocument'
 export {useDocument} from '../hooks/document/useDocument'
 export {useDocumentEvent} from '../hooks/document/useDocumentEvent'
 export {useDocumentPermissions} from '../hooks/document/useDocumentPermissions'

package/src/components/auth/AuthBoundary.recovery.test.tsx

@@ -0,0 +1,86 @@
+import {AuthStateType, getIsInDashboardState} from '@sanity/sdk'
+import {render, screen, waitFor} from '@testing-library/react'
+import {beforeEach, describe, expect, it, type Mock, vi} from 'vitest'
+
+import {ResourceProvider} from '../../context/ResourceProvider'
+import {useAuthState} from '../../hooks/auth/useAuthState'
+import {AuthBoundary} from './AuthBoundary'
+
+// NOTE: unlike AuthBoundary.test.tsx this file does NOT mock react-error-boundary
+// — we want the REAL ErrorBoundary so we can observe whether it recovers when the
+// auth store transitions back to LOGGED_IN (e.g. after a successful silent token
+// refresh via ComlinkTokenRefresh -> setAuthToken).
+
+vi.mock('@sanity/sdk', async () => {
+  const actual = await vi.importActual('@sanity/sdk')
+  return {
+    ...actual,
+    getIsInDashboardState: vi.fn(() => ({getCurrent: () => true})),
+  }
+})
+
+vi.mock('../../hooks/auth/useAuthState', () => ({useAuthState: vi.fn()}))
+vi.mock('../../hooks/auth/useLoginUrl', () => ({
+  useLoginUrl: vi.fn(() => 'https://example.com/login'),
+}))
+vi.mock('../../hooks/auth/useVerifyOrgProjects', () => ({useVerifyOrgProjects: vi.fn(() => null)}))
+vi.mock('../../hooks/auth/useLogOut', () => ({useLogOut: vi.fn(() => async () => {})}))
+vi.mock('../../hooks/auth/useHandleAuthCallback', () => ({
+  useHandleAuthCallback: vi.fn(() => async () => {}),
+}))
+vi.mock('../../hooks/comlink/useWindowConnection', () => ({
+  useWindowConnection: vi.fn(() => ({fetch: vi.fn().mockResolvedValue({token: 'fresh-token'})})),
+}))
+// Avoid injecting the SanityOS bridge.js <script> during import.
+vi.mock('../utils', () => ({isInIframe: vi.fn(() => false)}))
+
+const mockUseAuthState = useAuthState as Mock
+
+describe('AuthBoundary — recovery after silent token refresh (dashboard)', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    ;(getIsInDashboardState as Mock).mockReturnValue({getCurrent: () => true})
+  })
+
+  it('renders the app again once the session is re-established (LOGGED_IN)', async () => {
+    // 1. Session expires: a request 401s and the auth store goes to ERROR.
+    mockUseAuthState.mockReturnValue({
+      type: AuthStateType.ERROR,
+      error: Object.assign(new Error('Unauthorized'), {statusCode: 401}),
+    })
+
+    const {rerender} = render(
+      <ResourceProvider projectId="p" dataset="d" fallback={null}>
+        <AuthBoundary projectIds={['p']}>
+          <div>Protected Content</div>
+        </AuthBoundary>
+      </ResourceProvider>,
+    )
+
+    // The error boundary catches the AuthError and shows the auth-error screen.
+    await waitFor(() => {
+      expect(screen.getByText('Authentication Error')).toBeInTheDocument()
+    })
+
+    // 2. ComlinkTokenRefresh fetches a fresh token from the Dashboard, setAuthToken
+    //    lands it, /users/me re-fetches and the store returns to LOGGED_IN.
+    mockUseAuthState.mockReturnValue({
+      type: AuthStateType.LOGGED_IN,
+      currentUser: null,
+      token: 'fresh-token',
+    })
+    rerender(
+      <ResourceProvider projectId="p" dataset="d" fallback={null}>
+        <AuthBoundary projectIds={['p']}>
+          <div>Protected Content</div>
+        </AuthBoundary>
+      </ResourceProvider>,
+    )
+
+    // EXPECTED (desired) behaviour: the app recovers automatically, no Retry click.
+    await waitFor(() => {
+      expect(screen.getByText('Protected Content')).toBeInTheDocument()
+    })
+    expect(screen.queryByText('Authentication Error')).not.toBeInTheDocument()
+  })
+})

package/src/components/auth/AuthBoundary.tsx

@@ -109,6 +109,16 @@ export function AuthBoundary({
   LoginErrorComponent = LoginError,
   ...props
 }: AuthBoundaryProps): React.ReactNode {
+  /**
+   * When the session is re-established (e.g. ComlinkTokenRefresh silently mints a
+   * fresh token via setAuthToken), the auth store returns to LOGGED_IN but the
+   * ErrorBoundary stays latched on its fallback until reset. Keying it on the
+   * recovered session lets it clear automatically
+   */
+  const authState = useAuthState()
+  const sessionResetKey =
+    authState.type === AuthStateType.LOGGED_IN ? authState.token : authState.type
+
   const FallbackComponent = useMemo(() => {
     return function LoginComponentWithLayoutProps(fallbackProps: FallbackProps) {
       // Chunk-load errors from any lazy-loaded code beneath this boundary
@@ -131,7 +141,7 @@ export function AuthBoundary({
 
   return (
     <ComlinkTokenRefreshProvider>
-      <ErrorBoundary FallbackComponent={FallbackComponent}>
+      <ErrorBoundary FallbackComponent={FallbackComponent} resetKeys={[sessionResetKey]}>
         <AuthSwitch {...props} />
       </ErrorBoundary>
     </ComlinkTokenRefreshProvider>

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

@@ -0,0 +1,83 @@
+import {createDocument} from '@sanity/sdk'
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest'
+
+import {renderHook} from '../../../test/test-utils'
+import {useApplyDocumentActions} from './useApplyDocumentActions'
+import {useCreateDocument} from './useCreateDocument'
+
+vi.mock('./useApplyDocumentActions', () => ({
+  useApplyDocumentActions: vi.fn(),
+}))
+
+const typeHandle = {
+  documentType: 'book',
+  projectId: 'test',
+  dataset: 'test',
+} as const
+
+describe('useCreateDocument hook', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it('applies a createDocument action with a generated id and initial values', async () => {
+    vi.spyOn(crypto, 'randomUUID').mockReturnValue('00000000-0000-0000-0000-000000000000')
+    const apply = vi.fn().mockResolvedValue({transactionId: 'tx1'})
+    vi.mocked(useApplyDocumentActions).mockReturnValue(apply)
+
+    const {result} = renderHook(() => useCreateDocument(typeHandle))
+    const handle = await result.current({title: 'New Book'})
+
+    expect(apply).toHaveBeenCalledWith(
+      createDocument(
+        {...typeHandle, documentId: '00000000-0000-0000-0000-000000000000'},
+        {
+          title: 'New Book',
+        },
+      ),
+    )
+    expect(handle).toEqual({...typeHandle, documentId: '00000000-0000-0000-0000-000000000000'})
+  })
+
+  it('returns a handle carrying the generated id', async () => {
+    vi.spyOn(crypto, 'randomUUID').mockReturnValue('11111111-1111-1111-1111-111111111111')
+    const apply = vi.fn().mockResolvedValue({transactionId: 'tx2'})
+    vi.mocked(useApplyDocumentActions).mockReturnValue(apply)
+
+    const {result} = renderHook(() => useCreateDocument(typeHandle))
+    const handle = await result.current()
+
+    expect(handle.documentId).toBe('11111111-1111-1111-1111-111111111111')
+    expect(handle.documentType).toBe('book')
+  })
+
+  it('uses the documentId supplied on the handle instead of generating one', async () => {
+    const apply = vi.fn().mockResolvedValue({transactionId: 'tx3'})
+    vi.mocked(useApplyDocumentActions).mockReturnValue(apply)
+
+    const {result} = renderHook(() => useCreateDocument({...typeHandle, documentId: 'fixed-id'}))
+    const handle = await result.current()
+
+    expect(handle.documentId).toBe('fixed-id')
+    expect(apply).toHaveBeenCalledWith(
+      createDocument({...typeHandle, documentId: 'fixed-id'}, undefined),
+    )
+  })
+
+  it('uses a per-call documentId override over the handle id', async () => {
+    const apply = vi.fn().mockResolvedValue({transactionId: 'tx4'})
+    vi.mocked(useApplyDocumentActions).mockReturnValue(apply)
+
+    const {result} = renderHook(() => useCreateDocument({...typeHandle, documentId: 'handle-id'}))
+    const handle = await result.current({title: 'Override'}, {documentId: 'override-id'})
+
+    expect(handle.documentId).toBe('override-id')
+    expect(apply).toHaveBeenCalledWith(
+      createDocument({...typeHandle, documentId: 'override-id'}, {title: 'Override'}),
+    )
+  })
+})

package/src/hooks/document/useCreateDocument.ts

@@ -0,0 +1,117 @@
+import {createDocument} from '@sanity/sdk'
+import {type SanityDocument} from 'groq'
+
+import {type DocumentHandle, type DocumentTypeHandle} from '../../config/handles'
+import {useSanityInstance} from '../context/useSanityInstance'
+import {trackHookUsage} from '../helpers/useTrackHookUsage'
+import {useApplyDocumentActions} from './useApplyDocumentActions'
+
+type IgnoredKey = '_id' | '_type' | '_rev' | '_createdAt' | '_updatedAt'
+
+/**
+ * Optional per-call overrides for {@link useCreateDocument}'s create function.
+ * @public
+ */
+export interface CreateDocumentOverrides {
+  /**
+   * Use this document ID instead of generating one. Overrides any `documentId`
+   * supplied on the handle passed to `useCreateDocument`.
+   */
+  documentId?: string
+}
+
+// Overload 1: Typegen — infers the document shape from your schema.
+/**
+ * @public
+ * Create a new document, relying on Typegen for the initial-value type.
+ *
+ * @param options - A document-type handle including `documentType`, an optional `documentId`, and optionally `projectId`/`dataset`/`perspective`.
+ * @returns A function that creates the document. It accepts optional initial field values and an optional `{documentId}` override,
+ *          and resolves to the {@link DocumentHandle} of the created document (carrying the generated or supplied id).
+ */
+export function useCreateDocument<
+  TDocumentType extends string = string,
+  TDataset extends string = string,
+  TProjectId extends string = string,
+>(
+  options: DocumentTypeHandle<TDocumentType, TDataset, TProjectId>,
+): (
+  initialValue?: Partial<
+    Omit<SanityDocument<TDocumentType, `${TProjectId}.${TDataset}`>, IgnoredKey>
+  >,
+  overrides?: CreateDocumentOverrides,
+) => Promise<DocumentHandle<TDocumentType, TDataset, TProjectId>>
+
+// Overload 2: Explicit type `TData`.
+/**
+ * @public
+ * Create a new document with an explicit type `TData`.
+ *
+ * @param options - A document-type handle including `documentType` and optionally `projectId`/`dataset`/`perspective`.
+ * @returns A function that creates the document. It accepts optional initial field values (typed against `TData`) and an
+ *          optional `{documentId}` override, and resolves to the {@link DocumentHandle} of the created document.
+ */
+export function useCreateDocument<TData extends Record<string, unknown>>(
+  options: DocumentTypeHandle,
+): (
+  initialValue?: Partial<Omit<TData, IgnoredKey>>,
+  overrides?: CreateDocumentOverrides,
+) => Promise<DocumentHandle>
+
+/**
+ * @public
+ * Provides a function to create a new document and returns its handle.
+ *
+ * @category Documents
+ * @remarks
+ * This is the create counterpart to {@link useEditDocument}. It wraps
+ * {@link useApplyDocumentActions} and the `createDocument` action for the common
+ * single-document case, so you don't have to assemble the action by hand.
+ *
+ * It handles the document ID for you: if you don't supply one (on the handle or
+ * via the per-call `{documentId}` override), a UUID is generated. Either way the
+ * returned {@link DocumentHandle} carries that id, ready to pass to
+ * {@link useDocument}, {@link useEditDocument}, or your router.
+ *
+ * Unlike {@link useEditDocument}, this hook does not read existing document state,
+ * so it never suspends.
+ *
+ * For atomic create-and-publish, or for creating several documents in a single
+ * transaction, use {@link useApplyDocumentActions} with the `createDocument` and
+ * `publishDocument` action creators directly.
+ *
+ * @example Create a document and navigate to it
+ * ```tsx
+ * import {useCreateDocument} from '@sanity/sdk-react'
+ * import {useNavigate} from 'react-router-dom'
+ *
+ * function CreateArticleButton() {
+ *   const createArticle = useCreateDocument({documentType: 'article'})
+ *   const navigate = useNavigate()
+ *
+ *   const handleClick = async () => {
+ *     const handle = await createArticle({title: 'New Article'})
+ *     navigate(`/articles/${handle.documentId}`)
+ *   }
+ *
+ *   return <button onClick={handleClick}>Create Article</button>
+ * }
+ * ```
+ */
+export function useCreateDocument(
+  options: DocumentTypeHandle,
+): (
+  initialValue?: Record<string, unknown>,
+  overrides?: CreateDocumentOverrides,
+) => Promise<DocumentHandle> {
+  const instance = useSanityInstance()
+  trackHookUsage(instance, 'useCreateDocument')
+  const apply = useApplyDocumentActions()
+
+  return async (initialValue, overrides) => {
+    const documentId = overrides?.documentId ?? options.documentId ?? crypto.randomUUID()
+    const handle: DocumentHandle = {...options, documentId}
+    await apply(createDocument(handle, initialValue))
+    return handle
+  }
+}