Read Dashboard state

Read the current organization, signed-in user, color scheme, and other Dashboard state from your app.

The Dashboard shares its state with your app: the current organization, the signed-in user, the color scheme, and more. Read it with hooks from @sanity/sdk-react/dashboard. Most of these hooks suspend until the Dashboard sends a first value, so render them inside Suspense.

import {useOrganizationId} from '@sanity/sdk-react/dashboard'

export function OrganizationId() {
  const organizationId = useOrganizationId()
  return <p>Organization: {organizationId}</p>
}

useOrganizationId returns undefined outside the Dashboard. For the organization's name and slug, read the organizations.current topic with useTopic.

import {useCurrentUser} from '@sanity/sdk-react/dashboard'

export function Greeting() {
  const user = useCurrentUser()
  return <p>Hello, {user?.name ?? 'there'}</p>
}

Import useCurrentUser from @sanity/sdk-react/dashboard. The hook with the same name in @sanity/sdk-react doesn't read from the Dashboard. It returns null while nobody is signed in.

preferences.color-scheme is light or dark and changes when the user switches the Dashboard's theme. To apply it to your styles, see Match the Dashboard's color scheme.

useTopic reads any Dashboard state topic and re-renders when it changes. These topics are available:

• organizations.current: The organization's id, name, and slug, or null.
• users.current: The signed-in user, or null.
• preferences.color-scheme: light or dark.
• preferences.dock-locked: Whether the dock is pinned open.
• navigation.location: The Dashboard's current location.
• panels.mode: The open panel. See Open and close panels.
• applications.context: What the foreground application is looking at, as {resource, document, appId}, or null. See Share your app's context.
• applications.foreground: The ID of the application currently in the foreground.