> For AI agents: the complete Sanity documentation index is available at [https://www.sanity.io/docs/llms.txt](https://www.sanity.io/docs/llms.txt).

# Render a window view

Render your app's main, full-page view in the Dashboard window, the surface to the right of the dock and any open panel.

A window view is your app's main, full-page view. It fills the Dashboard to the right of the dock and any open panel, and it is where Media Library and Studios render. If you are coming from the App SDK, this is the surface your app already uses.

An application can declare at most one window view. Everything inside it belongs to your app, including its own navigation, so the Dashboard does not impose a layout on the window beyond its edges.

> [!WARNING]
> Beta API
> `unstable_defineView` can change without notice.

## Declare the window view

**sanity.cli.ts**

```typescript
import {defineApplication, defineCliConfig, defineWindowView} from 'sanity/cli'

export default defineCliConfig({
  app: defineApplication({
    organizationId: 'your-organization-id',
    slug: 'content-activity',
    title: 'Content activity',
    views: [
      defineWindowView({name: 'main', title: 'Content activity', src: './src/window.tsx'}),
    ],
  }),
})
```

`src` is relative to the project root, the folder that contains `sanity.cli.ts`. The window view's `name` must be unique across the app's views and web workers.

## Let the CLI create it for you

If the window is the only surface your app needs, set `entry` instead. The CLI creates the window view for you, and the rest of this guide is optional.

**sanity.cli.ts**

```typescript
import {defineApplication, defineCliConfig} from 'sanity/cli'

export default defineCliConfig({
  app: defineApplication({
    organizationId: 'your-organization-id',
    slug: 'content-activity',
    title: 'Content activity',
    entry: './src/App.tsx',
  }),
})
```

Declare `defineWindowView` explicitly when you need to configure the view, for example to set its dock item, or when the app also declares panel views, tile views, or web workers.

## Wrap the window in providers

Each view renders in its own island, so it doesn't inherit the Dashboard's context or providers. Wrap the window in `SanityApp`, the same provider your app's panels and tiles use:

**src/Providers.tsx**

```tsx
import {SanityApp} from '@sanity/sdk-react'
import type {ReactNode} from 'react'

export function Providers({children}: {children: ReactNode}) {
  return (
    <SanityApp fallback={null}>
      {children}
    </SanityApp>
  )
}
```

## Export the window view

**src/window.tsx**

```tsx
import {unstable_defineView} from 'sanity/dashboard'
import {Providers} from './Providers'

export default unstable_defineView('window', {
  title: ({view}) => view.title,
  window: () => (
    <Providers>
      { /* the rest of your app, including its own navigation */ }
    </Providers>
  ),
})
```

The Dashboard renders the `window` component into the window surface and uses `title` to label the app. Both receive `view`, which contains the view's `name` and `title`.

## How the window shares space

The dock sits on the far left, a panel view opens as a column beside it, and the window fills whatever is left. Opening a panel narrows the window rather than covering it, so design the window to reflow rather than assume a fixed width. On narrow screens, an open panel fills the width and the window is hidden behind it.

## Next steps

[Render a panel](https://www.sanity.io/docs/dashboard-beta/render-a-panel)
Add a persistent column beside the window.

[Render a tile](https://www.sanity.io/docs/dashboard-beta/render-a-tile)
Show a view on the Dashboard home page.

[Customize your app's dock item](https://www.sanity.io/docs/dashboard-beta/add-your-app-to-the-dock)
Choose where your app's window appears in the dock.

[Extension API reference](https://www.sanity.io/docs/dashboard-beta/extension-api-reference)
Look up window view fields and component props.