@sanity/sdk-react 0.0.1 → 0.0.2

package/src/hooks/{comlink → dashboard}/useManageFavorite.ts

@@ -1,4 +1,3 @@
-import {type Status} from '@sanity/comlink'
 import {
   type CanvasResource,
   type Events,
@@ -14,16 +13,15 @@ import {
   getFavoritesState,
   resolveFavoritesState,
 } from '@sanity/sdk'
-import {useCallback, useMemo, useState, useSyncExternalStore} from 'react'
+import {useCallback, useMemo, useSyncExternalStore} from 'react'
 
+import {useWindowConnection} from '../comlink/useWindowConnection'
 import {useSanityInstance} from '../context/useSanityInstance'
-import {useWindowConnection} from './useWindowConnection'
 
 interface ManageFavorite extends FavoriteStatusResponse {
   favorite: () => Promise<void>
   unfavorite: () => Promise<void>
   isFavorited: boolean
-  isConnected: boolean
 }
 
 interface UseManageFavoriteProps extends DocumentHandle {
@@ -92,11 +90,9 @@ export function useManageFavorite({
   resourceType,
   schemaName,
 }: UseManageFavoriteProps): ManageFavorite {
-  const [status, setStatus] = useState<Status>('idle')
   const {fetch} = useWindowConnection<Events.FavoriteMessage, FrameMessage>({
     name: SDK_NODE_NAME,
     connectTo: SDK_CHANNEL_NAME,
-    onStatus: setStatus,
   })
   const instance = useSanityInstance()
   const {config} = instance
@@ -136,7 +132,7 @@ export function useManageFavorite({
 
   const handleFavoriteAction = useCallback(
     async (action: 'added' | 'removed') => {
-      if (status !== 'connected' || !fetch || !documentId || !documentType || !resourceType) return
+      if (!fetch || !documentId || !documentType || !resourceType) return
 
       try {
         const payload = {
@@ -165,46 +161,15 @@ export function useManageFavorite({
         throw err
       }
     },
-    [
-      fetch,
-      documentId,
-      documentType,
-      resourceId,
-      resourceType,
-      schemaName,
-      instance,
-      context,
-      status,
-    ],
+    [fetch, documentId, documentType, resourceId, resourceType, schemaName, instance, context],
   )
 
   const favorite = useCallback(() => handleFavoriteAction('added'), [handleFavoriteAction])
   const unfavorite = useCallback(() => handleFavoriteAction('removed'), [handleFavoriteAction])
 
-  // if state is undefined, we should suspend
-  if (!state) {
-    try {
-      const promise = resolveFavoritesState(instance, context)
-      throw promise
-    } catch (err) {
-      // If we get a timeout error, return a fallback state instead of suspending
-      if (err instanceof Error && err.message === 'Favorites service connection timeout') {
-        return {
-          favorite: async () => {},
-          unfavorite: async () => {},
-          isFavorited: false,
-          isConnected: false,
-        }
-      }
-      // For other errors, continue with suspension
-      throw err
-    }
-  }
-
   return {
     favorite,
     unfavorite,
     isFavorited,
-    isConnected: status === 'connected',
   }
 }

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

@@ -1,6 +1,5 @@
-import {type Status} from '@sanity/comlink'
 import {type DocumentHandle} from '@sanity/sdk'
-import {act, renderHook} from '@testing-library/react'
+import {renderHook} from '@testing-library/react'
 import {beforeEach, describe, expect, it, vi} from 'vitest'
 
 import {useNavigateToStudioDocument} from './useNavigateToStudioDocument'
@@ -9,13 +8,10 @@ import {useNavigateToStudioDocument} from './useNavigateToStudioDocument'
 const mockSendMessage = vi.fn()
 const mockFetch = vi.fn()
 let mockWorkspacesByProjectIdAndDataset = {}
-let mockWorkspacesIsConnected = true
-let mockStatusCallback: ((status: Status) => void) | null = null
 
 vi.mock('../comlink/useWindowConnection', () => {
   return {
-    useWindowConnection: ({onStatus}: {onStatus?: (status: Status) => void}) => {
-      mockStatusCallback = onStatus || null
+    useWindowConnection: () => {
       return {
         sendMessage: mockSendMessage,
         fetch: mockFetch,
@@ -29,7 +25,6 @@ vi.mock('./useStudioWorkspacesByProjectIdDataset', () => {
     useStudioWorkspacesByProjectIdDataset: () => ({
       workspacesByProjectIdAndDataset: mockWorkspacesByProjectIdAndDataset,
       error: null,
-      isConnected: mockWorkspacesIsConnected,
     }),
   }
 })
@@ -57,35 +52,19 @@ describe('useNavigateToStudioDocument', () => {
     mockWorkspacesByProjectIdAndDataset = {
       'project1:dataset1': [mockWorkspace],
     }
-    mockWorkspacesIsConnected = true
-    mockStatusCallback = null
   })
 
   it('returns a function and connection status', () => {
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle))
 
-    // Initially not connected
-    expect(result.current.isConnected).toBe(false)
-
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     expect(result.current).toEqual({
       navigateToStudioDocument: expect.any(Function),
-      isConnected: true,
     })
   })
 
   it('sends correct navigation message when called', () => {
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     expect(mockSendMessage).toHaveBeenCalledWith('dashboard/v1/bridge/navigate-to-resource', {
@@ -95,35 +74,10 @@ describe('useNavigateToStudioDocument', () => {
     })
   })
 
-  it('does not send message when not connected', () => {
-    mockWorkspacesByProjectIdAndDataset = {}
-    mockWorkspacesIsConnected = false
-
-    const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle))
-
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
-    result.current.navigateToStudioDocument()
-
-    expect(mockSendMessage).not.toHaveBeenCalled()
-  })
-
   it('does not send message when no workspace is found', () => {
     mockWorkspacesByProjectIdAndDataset = {}
-    mockWorkspacesIsConnected = true
-
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle))
-
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
-
     expect(mockSendMessage).not.toHaveBeenCalled()
   })
 
@@ -137,11 +91,6 @@ describe('useNavigateToStudioDocument', () => {
 
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     expect(consoleSpy).toHaveBeenCalledWith(
@@ -169,11 +118,6 @@ describe('useNavigateToStudioDocument', () => {
 
     const {result} = renderHook(() => useNavigateToStudioDocument(incompleteDocumentHandle))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     expect(consoleSpy).toHaveBeenCalledWith(
@@ -194,11 +138,6 @@ describe('useNavigateToStudioDocument', () => {
 
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle, preferredUrl))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     // Should choose workspace2 because it matches the preferred URL
@@ -227,11 +166,6 @@ describe('useNavigateToStudioDocument', () => {
 
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle, preferredUrl))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     // Should choose the NO_PROJECT_ID:NO_DATASET workspace because it matches the preferred URL
@@ -259,11 +193,6 @@ describe('useNavigateToStudioDocument', () => {
 
     const {result} = renderHook(() => useNavigateToStudioDocument(mockDocumentHandle, preferredUrl))
 
-    // Simulate connection
-    act(() => {
-      mockStatusCallback?.('connected')
-    })
-
     result.current.navigateToStudioDocument()
 
     expect(consoleSpy).toHaveBeenCalledWith(

package/src/hooks/dashboard/useNavigateToStudioDocument.ts

@@ -1,7 +1,6 @@
-import {type Status} from '@sanity/comlink'
 import {type Bridge, SDK_CHANNEL_NAME, SDK_NODE_NAME} from '@sanity/message-protocol'
 import {type DocumentHandle} from '@sanity/sdk'
-import {useCallback, useState} from 'react'
+import {useCallback} from 'react'
 
 import {useWindowConnection} from '../comlink/useWindowConnection'
 import {
@@ -15,7 +14,6 @@ import {
  */
 export interface NavigateToStudioResult {
   navigateToStudioDocument: () => void
-  isConnected: boolean
 }
 
 /**
@@ -38,16 +36,28 @@ export interface NavigateToStudioResult {
  * - `isConnected` - Boolean indicating if connection to Dashboard is established
  *
  * @example
- * ```ts
+ * ```tsx
  * import {useNavigateToStudioDocument, type DocumentHandle} from '@sanity/sdk-react'
+ * import {Button} from '@sanity/ui'
+ * import {Suspense} from 'react'
  *
- * function MyComponent({documentHandle}: {documentHandle: DocumentHandle}) {
+ * function NavigateButton({documentHandle}: {documentHandle: DocumentHandle}) {
  *   const {navigateToStudioDocument, isConnected} = useNavigateToStudioDocument(documentHandle)
+ *   return (
+ *     <Button
+ *       disabled={!isConnected}
+ *       onClick={navigateToStudioDocument}
+ *       text="Navigate to Studio Document"
+ *     />
+ *   )
+ * }
  *
+ * // Wrap the component with Suspense since the hook may suspend
+ * function MyDocumentAction({documentHandle}: {documentHandle: DocumentHandle}) {
  *   return (
- *     <button onClick={navigateToStudioDocument} disabled={!isConnected}>
- *       Navigate to Studio Document
- *     </button>
+ *     <Suspense fallback={<Button text="Loading..." disabled />}>
+ *       <NavigateButton documentHandle={documentHandle} />
+ *     </Suspense>
  *   )
  * }
  * ```
@@ -56,24 +66,15 @@ export function useNavigateToStudioDocument(
   documentHandle: DocumentHandle,
   preferredStudioUrl?: string,
 ): NavigateToStudioResult {
-  const {workspacesByProjectIdAndDataset, isConnected: workspacesConnected} =
-    useStudioWorkspacesByProjectIdDataset()
-  const [status, setStatus] = useState<Status>('idle')
+  const {workspacesByProjectIdAndDataset} = useStudioWorkspacesByProjectIdDataset()
   const {sendMessage} = useWindowConnection<Bridge.Navigation.NavigateToResourceMessage, never>({
     name: SDK_NODE_NAME,
     connectTo: SDK_CHANNEL_NAME,
-    onStatus: setStatus,
   })
 
   const navigateToStudioDocument = useCallback(() => {
     const {projectId, dataset} = documentHandle
 
-    if (!workspacesConnected || status !== 'connected') {
-      // eslint-disable-next-line no-console
-      console.warn('Not connected to Dashboard')
-      return
-    }
-
     if (!projectId || !dataset) {
       // eslint-disable-next-line no-console
       console.warn('Project ID and dataset are required to navigate to a studio document')
@@ -123,17 +124,9 @@ export function useNavigateToStudioDocument(
     }
 
     sendMessage(message.type, message.data)
-  }, [
-    documentHandle,
-    workspacesConnected,
-    status,
-    workspacesByProjectIdAndDataset,
-    sendMessage,
-    preferredStudioUrl,
-  ])
+  }, [documentHandle, workspacesByProjectIdAndDataset, sendMessage, preferredStudioUrl])
 
   return {
     navigateToStudioDocument,
-    isConnected: workspacesConnected && status === 'connected',
   }
 }

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

@@ -0,0 +1,69 @@
+import {beforeEach, describe, expect, it, vi} from 'vitest'
+
+import {renderHook} from '../../../test/test-utils'
+import {useWindowConnection} from '../comlink/useWindowConnection'
+import {useRecordDocumentHistoryEvent} from './useRecordDocumentHistoryEvent'
+
+vi.mock('../comlink/useWindowConnection', () => ({
+  useWindowConnection: vi.fn(),
+}))
+
+describe('useRecordDocumentHistoryEvent', () => {
+  let mockSendMessage = vi.fn()
+  const mockDocumentHandle = {
+    documentId: 'mock-id',
+    documentType: 'mock-type',
+    resourceType: 'studio' as const,
+    resourceId: 'mock-resource-id',
+  }
+
+  beforeEach(() => {
+    mockSendMessage = vi.fn()
+    vi.mocked(useWindowConnection).mockImplementation(() => {
+      return {
+        sendMessage: mockSendMessage,
+        fetch: vi.fn(),
+      }
+    })
+  })
+
+  it('should send correct message when recording events', () => {
+    const {result} = renderHook(() => useRecordDocumentHistoryEvent(mockDocumentHandle))
+
+    result.current.recordEvent('viewed')
+    expect(mockSendMessage).toHaveBeenCalledWith('dashboard/v1/events/history', {
+      eventType: 'viewed',
+      document: {
+        id: 'mock-id',
+        type: 'mock-type',
+        resource: {
+          id: 'mock-resource-id',
+          type: 'studio',
+        },
+      },
+    })
+  })
+
+  it('should handle errors when sending messages', () => {
+    mockSendMessage.mockImplementation(() => {
+      throw new Error('Failed to send message')
+    })
+
+    const {result} = renderHook(() => useRecordDocumentHistoryEvent(mockDocumentHandle))
+
+    expect(() => result.current.recordEvent('viewed')).toThrow('Failed to send message')
+  })
+
+  it('should throw error when resourceId is missing for non-studio resources', () => {
+    const mockMediaDocumentHandle = {
+      documentId: 'mock-id',
+      documentType: 'mock-type',
+      resourceType: 'media-library' as const,
+      resourceId: undefined,
+    }
+
+    expect(() => renderHook(() => useRecordDocumentHistoryEvent(mockMediaDocumentHandle))).toThrow(
+      'resourceId is required for media-library and canvas resources',
+    )
+  })
+})

package/src/hooks/{comlink → dashboard}/useRecordDocumentHistoryEvent.ts

@@ -1,4 +1,3 @@
-import {type Status} from '@sanity/comlink'
 import {
   type CanvasResource,
   type Events,
@@ -8,13 +7,12 @@ import {
   type StudioResource,
 } from '@sanity/message-protocol'
 import {type DocumentHandle, type FrameMessage} from '@sanity/sdk'
-import {useCallback, useState} from 'react'
+import {useCallback} from 'react'
 
-import {useWindowConnection} from './useWindowConnection'
+import {useWindowConnection} from '../comlink/useWindowConnection'
 
 interface DocumentInteractionHistory {
   recordEvent: (eventType: 'viewed' | 'edited' | 'created' | 'deleted') => void
-  isConnected: boolean
 }
 
 /**
@@ -42,7 +40,11 @@ interface UseRecordDocumentHistoryEventProps extends DocumentHandle {
  *
  * @example
  * ```tsx
- * function MyDocumentAction(props: DocumentActionProps) {
+ * import {useRecordDocumentHistoryEvent} from '@sanity/sdk-react'
+ * import {Button} from '@sanity/ui'
+ * import {Suspense} from 'react'
+ *
+ * function RecordEventButton(props: DocumentActionProps) {
  *   const {documentId, documentType, resourceType, resourceId} = props
  *   const {recordEvent, isConnected} = useRecordDocumentHistoryEvent({
  *     documentId,
@@ -50,15 +52,23 @@ interface UseRecordDocumentHistoryEventProps extends DocumentHandle {
  *     resourceType,
  *     resourceId,
  *   })
- *
  *   return (
  *     <Button
  *       disabled={!isConnected}
  *       onClick={() => recordEvent('viewed')}
- *       text={'Viewed'}
+ *       text="Viewed"
  *     />
  *   )
  * }
+ *
+ * // Wrap the component with Suspense since the hook may suspend
+ * function MyDocumentAction(props: DocumentActionProps) {
+ *   return (
+ *     <Suspense fallback={<Button text="Loading..." disabled />}>
+ *       <RecordEventButton {...props} />
+ *     </Suspense>
+ *   )
+ * }
  * ```
  */
 export function useRecordDocumentHistoryEvent({
@@ -68,11 +78,9 @@ export function useRecordDocumentHistoryEvent({
   resourceId,
   schemaName,
 }: UseRecordDocumentHistoryEventProps): DocumentInteractionHistory {
-  const [status, setStatus] = useState<Status>('idle')
   const {sendMessage} = useWindowConnection<Events.HistoryMessage, FrameMessage>({
     name: SDK_NODE_NAME,
     connectTo: SDK_CHANNEL_NAME,
-    onStatus: setStatus,
   })
 
   if (resourceType !== 'studio' && !resourceId) {
@@ -110,6 +118,5 @@ export function useRecordDocumentHistoryEvent({
 
   return {
     recordEvent,
-    isConnected: status === 'connected',
   }
 }

package/src/hooks/dashboard/useStudioWorkspacesByProjectIdDataset.test.tsx

@@ -1,8 +1,7 @@
-import {type Message, type Status} from '@sanity/comlink'
 import {renderHook, waitFor} from '@testing-library/react'
 import {describe, expect, it, vi} from 'vitest'
 
-import {useWindowConnection, type WindowConnection} from '../comlink/useWindowConnection'
+import {useWindowConnection} from '../comlink/useWindowConnection'
 import {useStudioWorkspacesByProjectIdDataset} from './useStudioWorkspacesByProjectIdDataset'
 
 vi.mock('../comlink/useWindowConnection', () => ({
@@ -54,49 +53,15 @@ describe('useStudioWorkspacesByResourceId', () => {
     vi.clearAllMocks()
   })
 
-  it('should return empty workspaces and connected=false when not connected', async () => {
-    // Create a mock that captures the onStatus callback
-    let capturedOnStatus: ((status: Status) => void) | undefined
-
-    vi.mocked(useWindowConnection).mockImplementation(({onStatus}) => {
-      capturedOnStatus = onStatus
-
-      return {
-        fetch: undefined,
-        sendMessage: vi.fn(),
-      } as unknown as WindowConnection<Message>
-    })
-
-    const {result} = renderHook(() => useStudioWorkspacesByProjectIdDataset())
-
-    // Call onStatus with 'idle' to simulate not connected
-    if (capturedOnStatus) capturedOnStatus('idle')
-
-    expect(result.current).toEqual({
-      workspacesByProjectIdAndDataset: {},
-      error: null,
-      isConnected: false,
-    })
-  })
-
   it('should process workspaces into lookup by projectId:dataset', async () => {
     const mockFetch = vi.fn().mockResolvedValue(mockWorkspaceData)
-    let capturedOnStatus: ((status: Status) => void) | undefined
-
-    vi.mocked(useWindowConnection).mockImplementation(({onStatus}) => {
-      capturedOnStatus = onStatus
-
-      return {
-        fetch: mockFetch,
-        sendMessage: vi.fn(),
-      } as unknown as WindowConnection<Message>
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
     })
 
     const {result} = renderHook(() => useStudioWorkspacesByProjectIdDataset())
 
-    // Call onStatus with 'connected' to simulate connected state
-    if (capturedOnStatus) capturedOnStatus('connected')
-
     await waitFor(() => {
       expect(result.current.workspacesByProjectIdAndDataset).toEqual({
         'project1:dataset1': [
@@ -138,38 +103,23 @@ describe('useStudioWorkspacesByResourceId', () => {
         ],
       })
       expect(result.current.error).toBeNull()
-      expect(result.current.isConnected).toBe(true)
     })
 
-    expect(mockFetch).toHaveBeenCalledWith(
-      'dashboard/v1/bridge/context',
-      undefined,
-      expect.any(Object),
-    )
+    expect(mockFetch).toHaveBeenCalledWith('dashboard/v1/context', undefined, expect.any(Object))
   })
 
   it('should handle fetch errors', async () => {
     const mockFetch = vi.fn().mockRejectedValue(new Error('Failed to fetch'))
-    let capturedOnStatus: ((status: Status) => void) | undefined
-
-    vi.mocked(useWindowConnection).mockImplementation(({onStatus}) => {
-      capturedOnStatus = onStatus
-
-      return {
-        fetch: mockFetch,
-        sendMessage: vi.fn(),
-      } as unknown as WindowConnection<Message>
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
     })
 
     const {result} = renderHook(() => useStudioWorkspacesByProjectIdDataset())
 
-    // Call onStatus with 'connected' to simulate connected state
-    if (capturedOnStatus) capturedOnStatus('connected')
-
     await waitFor(() => {
       expect(result.current.workspacesByProjectIdAndDataset).toEqual({})
       expect(result.current.error).toBe('Failed to fetch workspaces')
-      expect(result.current.isConnected).toBe(true)
     })
   })
 
@@ -177,26 +127,16 @@ describe('useStudioWorkspacesByResourceId', () => {
     const abortError = new Error('Aborted')
     abortError.name = 'AbortError'
     const mockFetch = vi.fn().mockRejectedValue(abortError)
-    let capturedOnStatus: ((status: Status) => void) | undefined
-
-    vi.mocked(useWindowConnection).mockImplementation(({onStatus}) => {
-      capturedOnStatus = onStatus
-
-      return {
-        fetch: mockFetch,
-        sendMessage: vi.fn(),
-      } as unknown as WindowConnection<Message>
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
     })
 
     const {result} = renderHook(() => useStudioWorkspacesByProjectIdDataset())
 
-    // Call onStatus with 'connected' to simulate connected state
-    if (capturedOnStatus) capturedOnStatus('connected')
-
     await waitFor(() => {
       expect(result.current.workspacesByProjectIdAndDataset).toEqual({})
       expect(result.current.error).toBeNull()
-      expect(result.current.isConnected).toBe(true)
     })
   })
 
@@ -248,24 +188,14 @@ describe('useStudioWorkspacesByResourceId', () => {
         ],
       },
     }
-
     const mockFetch = vi.fn().mockResolvedValue(mockDataWithMixedResources)
-    let capturedOnStatus: ((status: Status) => void) | undefined
-
-    vi.mocked(useWindowConnection).mockImplementation(({onStatus}) => {
-      capturedOnStatus = onStatus
-
-      return {
-        fetch: mockFetch,
-        sendMessage: vi.fn(),
-      } as unknown as WindowConnection<Message>
+    vi.mocked(useWindowConnection).mockReturnValue({
+      fetch: mockFetch,
+      sendMessage: vi.fn(),
     })
 
     const {result} = renderHook(() => useStudioWorkspacesByProjectIdDataset())
 
-    // Call onStatus with 'connected' to simulate connected state
-    if (capturedOnStatus) capturedOnStatus('connected')
-
     await waitFor(() => {
       // Should only include the studio resource with valid projectId and dataset
       expect(result.current.workspacesByProjectIdAndDataset['project1:dataset1']).toHaveLength(1)
@@ -285,7 +215,6 @@ describe('useStudioWorkspacesByResourceId', () => {
       ).toEqual(['studio-no-project', 'studio-no-dataset'])
 
       expect(result.current.error).toBeNull()
-      expect(result.current.isConnected).toBe(true)
     })
   })
 })