The document handle for the document to navigate to
OptionalpreferredStudioUrl: stringThe preferred studio url to navigate to if you have multiple studios with the same projectId and dataset
An object containing:
navigateToStudioDocument - Function that when called will navigate to the studio documentIf you write your own Document Handle to pass to this hook (as opposed to a Document Handle generated by another hook),
it must include values for documentId, documentType, projectId, and dataset.
import {useNavigateToStudioDocument, type DocumentHandle} from '@sanity/sdk-react'
import {Button} from '@sanity/ui'
import {Suspense} from 'react'
function NavigateButton({documentHandle}: {documentHandle: DocumentHandle}) {
const {navigateToStudioDocument} = useNavigateToStudioDocument(documentHandle)
return (
<Button
onClick={navigateToStudioDocument}
text="Navigate to Studio Document"
/>
)
}
// Wrap the component with Suspense since the hook may suspend
function MyDocumentAction({documentHandle}: {documentHandle: DocumentHandle}) {
return (
<Suspense fallback={<Button text="Loading..." disabled />}>
<NavigateButton documentHandle={documentHandle} />
</Suspense>
)
}
Hook that provides a function to navigate to a given document in its parent Studio.
Uses the
projectIdanddatasetproperties of the DocumentHandle you provide to resolve the correct Studio. This will only work if you have deployed a studio with a workspace with thisprojectId/datasetcombination.