Preview
Preview mode component for Contentstack Live Preview.
Props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
path | string | Yes | - | Content path |
type | 'page' | 'blogpost' | Yes | - | Content type |
Usage
import Preview from '@/components/pages/Preview';
<Preview path="/about" type="page" />Features
- Live Preview: Integrates with Contentstack Live Preview
- Dynamic loading: Fetches content based on type and path
- Loading state: Shows loading spinner while fetching
- Type switching: Renders Page or Blog component based on type
- Auto-refresh: Updates when content changes in Live Preview
Behavior
- Initializes Live Preview on mount
- Listens for entry changes
- Fetches fresh content when changes detected
- Shows loading state during fetch
- Renders appropriate component (Page or Blog)
Notes
- Client-side component (uses
'use client') - Uses ContentstackLivePreview.onEntryChange
- Shows favicon logo during loading
- Supports both page and blogpost content types