# Hooks (/themes/sdk/reference/editor/hooks)

```ts
import { … } from '@poltura/theme-sdk/editor';
```

## `useIsEditing` [#useisediting]

Whether the page is drawn inside the customizer canvas.

```ts
useIsEditing(): boolean
```

**Returns:** True on the customizer canvas, false on the live storefront.

**Example**

```tsx
import { useIsEditing } from '@poltura/theme-sdk/editor';

export function EmptyHint({ count }: { count: number }) {
  const editing = useIsEditing();
  return count === 0 && editing ? <p>Add a product to this rail.</p> : null;
}
```

## `usePreviewScenario` [#usepreviewscenario]

The choice the customizer's Data picker made for a preview domain.

```ts
usePreviewScenario(key: string): string
```

Outside the customizer it is always the domain's first choice, so branching on it costs nothing live.

**Parameters**

- `key: string`: The domain key, a system one such as `cart` or one the theme declares.

**Returns:** The chosen value, or `''` for a domain nobody declares.

**Example**

```tsx
import { usePreviewScenario } from '@poltura/theme-sdk/editor';

export function Reviews({ count }: { count: number }) {
  const shown = usePreviewScenario('reviews') === 'empty' ? 0 : count;
  return <p>{shown} reviews</p>;
}
```