@nuasite/cms 0.5.0 → 0.6.0

package/package.json

@@ -14,7 +14,7 @@
     "directory": "packages/astro-cms"
   },
   "license": "Apache-2.0",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "module": "src/index.ts",
   "types": "src/index.ts",
   "type": "module",

package/src/build-processor.ts

@@ -4,7 +4,8 @@ import fs from 'node:fs/promises'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { getProjectRoot } from './config'
-import { extractPropsFromSource, findComponentInvocationLine } from './handlers/component-ops'
+import { detectArrayPattern, extractArrayElementProps } from './handlers/array-ops'
+import { extractPropsFromSource, findComponentInvocationLine, findFrontmatterEnd } from './handlers/component-ops'
 import { extractComponentName, processHtml } from './html-processor'
 import type { ManifestWriter } from './manifest-writer'
 import { generateComponentPreviews } from './preview-generator'
@@ -640,6 +641,42 @@ async function processFile(
 						comp.props = extractPropsFromSource(pageLines, invLine, comp.componentName)
 					}
 				}
+
+				// Resolve spread props for array-rendered components
+				const componentGroups = new Map<string, typeof result.components[string][]>()
+				for (const comp of Object.values(result.components)) {
+					const key = `${comp.componentName}::${comp.invocationSourcePath ?? ''}`
+					if (!componentGroups.has(key)) componentGroups.set(key, [])
+					componentGroups.get(key)!.push(comp)
+				}
+
+				for (const group of componentGroups.values()) {
+					if (group.length <= 1) continue
+					if (!group.some(c => Object.keys(c.props).length === 0)) continue
+
+					const firstComp = group[0]!
+					const invLine = findComponentInvocationLine(pageLines, firstComp.componentName, 0)
+					if (invLine < 0) continue
+
+					const pattern = detectArrayPattern(pageLines, invLine)
+					if (!pattern) continue
+
+					const fmEnd = findFrontmatterEnd(pageLines)
+					if (fmEnd === 0) continue
+
+					const frontmatterContent = pageLines.slice(1, fmEnd - 1).join('\n')
+
+					const sorted = [...group].sort((a, b) => (a.invocationIndex ?? 0) - (b.invocationIndex ?? 0))
+					for (let i = 0; i < sorted.length; i++) {
+						const comp = sorted[i]!
+						if (Object.keys(comp.props).length > 0) continue
+
+						const arrayProps = extractArrayElementProps(frontmatterContent, pattern.arrayVarName, i)
+						if (arrayProps) {
+							comp.props = arrayProps
+						}
+					}
+				}
 			} catch {
 				// Could not read page source — leave props empty
 			}

package/src/dev-middleware.ts

@@ -3,10 +3,11 @@ import fs from 'node:fs/promises'
 import type { IncomingMessage, ServerResponse } from 'node:http'
 import path from 'node:path'
 import { getProjectRoot } from './config'
-import { handleAddArrayItem, handleRemoveArrayItem } from './handlers/array-ops'
+import { detectArrayPattern, extractArrayElementProps, handleAddArrayItem, handleRemoveArrayItem } from './handlers/array-ops'
 import {
 	extractPropsFromSource,
 	findComponentInvocationLine,
+	findFrontmatterEnd,
 	getPageFileCandidates,
 	handleInsertComponent,
 	handleRemoveComponent,
@@ -429,7 +430,7 @@ async function handleCmsApiRoute(
 
 	// GET /_nua/cms/deployment/status
 	if (route === 'deployment/status' && req.method === 'GET') {
-		sendJson(res, { currentDeployment: null, pendingCount: 0 })
+		sendJson(res, { currentDeployment: null, pendingCount: 0, deploymentEnabled: false })
 		return
 	}
 
@@ -536,6 +537,50 @@ async function processHtmlForDev(
 		}
 	}
 
+	// Resolve spread props for array-rendered components.
+	// Group components by (name, invocationSourcePath) to detect array patterns.
+	const componentGroups = new Map<string, typeof result.components[string][]>()
+	for (const comp of Object.values(result.components)) {
+		const key = `${comp.componentName}::${comp.invocationSourcePath ?? ''}`
+		if (!componentGroups.has(key)) componentGroups.set(key, [])
+		componentGroups.get(key)!.push(comp)
+	}
+
+	for (const group of componentGroups.values()) {
+		if (group.length <= 1) continue
+		// Only process groups where at least one component has empty props (spread case)
+		if (!group.some(c => Object.keys(c.props).length === 0)) continue
+
+		const firstComp = group[0]!
+		const filePath = normalizeFilePath(firstComp.invocationSourcePath ?? firstComp.sourcePath)
+		const lines = await readLines(path.resolve(projectRoot, filePath))
+		if (!lines) continue
+
+		// Find the invocation line (occurrence 0, since .map() has a single <Component> tag)
+		const invLine = findComponentInvocationLine(lines, firstComp.componentName, 0)
+		if (invLine < 0) continue
+
+		const pattern = detectArrayPattern(lines, invLine)
+		if (!pattern) continue
+
+		const fmEnd = findFrontmatterEnd(lines)
+		if (fmEnd === 0) continue
+
+		const frontmatterContent = lines.slice(1, fmEnd - 1).join('\n')
+
+		// Sort group by invocationIndex to match array element order
+		const sorted = [...group].sort((a, b) => (a.invocationIndex ?? 0) - (b.invocationIndex ?? 0))
+		for (let i = 0; i < sorted.length; i++) {
+			const comp = sorted[i]!
+			if (Object.keys(comp.props).length > 0) continue
+
+			const arrayProps = extractArrayElementProps(frontmatterContent, pattern.arrayVarName, i)
+			if (arrayProps) {
+				comp.props = arrayProps
+			}
+		}
+	}
+
 	// Build collection entry if this is a collection page
 	let collectionEntry: CollectionEntry | undefined
 	if (collectionInfo && mdContent) {

package/src/editor/components/collections-browser.tsx

@@ -3,6 +3,7 @@ import {
 	closeCollectionsBrowser,
 	isCollectionsBrowserOpen,
 	manifest,
+	openMarkdownEditorForEntry,
 	openMarkdownEditorForNewPage,
 	selectBrowserCollection,
 	selectedBrowserCollection,
@@ -16,7 +17,7 @@ export function CollectionsBrowser() {
 	const collectionDefinitions = manifest.value.collectionDefinitions ?? {}
 
 	const collections = useMemo(() => {
-		return Object.values(collectionDefinitions)
+		return Object.values(collectionDefinitions).sort((a, b) => a.label.localeCompare(b.label))
 	}, [collectionDefinitions])
 
 	if (!visible) return null
@@ -38,11 +39,14 @@ export function CollectionsBrowser() {
 
 		const handleEntryClick = (slug: string, sourcePath: string, pathname?: string) => {
 			closeCollectionsBrowser()
-			// Navigate to the collection detail page to edit inline.
-			// Use known pathname or construct one from collection/slug.
-			const targetPath = pathname || `/${selected}/${slug}`
-			savePendingEntryNavigation({ collectionName: selected, slug, sourcePath, pathname: targetPath })
-			window.location.href = targetPath
+			if (pathname) {
+				// Navigate to the collection detail page to edit inline.
+				savePendingEntryNavigation({ collectionName: selected, slug, sourcePath, pathname })
+				window.location.href = pathname
+			} else {
+				// No detail page exists for this entry — open the markdown editor inline.
+				openMarkdownEditorForEntry(selected, slug, sourcePath, def)
+			}
 		}
 
 		const handleAddNew = () => {

package/src/editor/components/fields.tsx

@@ -54,7 +54,7 @@ export function TextField({ label, value, placeholder, onChange, isDirty, onRese
 				placeholder={placeholder}
 				onInput={(e) => onChange((e.target as HTMLInputElement).value)}
 				class={cn(
-					'w-full px-3 py-2 bg-white/10 border rounded-cms-md text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
+					'w-full px-3 py-2 bg-white/10 border rounded-cms-sm text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
 					isDirty
 						? 'border-cms-primary focus:border-cms-primary focus:ring-cms-primary/30'
 						: 'border-white/20 focus:border-white/40 focus:ring-white/10',
@@ -90,7 +90,7 @@ export function ImageField({ label, value, placeholder, onChange, onBrowse, isDi
 					placeholder={placeholder}
 					onInput={(e) => onChange((e.target as HTMLInputElement).value)}
 					class={cn(
-						'flex-1 px-3 py-2 bg-white/10 border rounded-cms-md text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
+						'flex-1 px-3 py-2 bg-white/10 border rounded-cms-sm text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
 						isDirty
 							? 'border-cms-primary focus:border-cms-primary focus:ring-cms-primary/30'
 							: 'border-white/20 focus:border-white/40 focus:ring-white/10',
@@ -100,7 +100,7 @@ export function ImageField({ label, value, placeholder, onChange, onBrowse, isDi
 				<button
 					type="button"
 					onClick={onBrowse}
-					class="px-3 py-2 bg-white/10 hover:bg-white/20 border border-white/20 rounded-cms-md text-sm text-white transition-colors cursor-pointer"
+					class="px-3 py-2 bg-white/10 hover:bg-white/20 border border-white/20 rounded-cms-sm text-sm text-white transition-colors cursor-pointer"
 					data-cms-ui
 				>
 					Browse
@@ -132,7 +132,7 @@ export function SelectField({ label, value, options, onChange, isDirty, onReset,
 				value={value ?? ''}
 				onChange={(e) => onChange((e.target as HTMLSelectElement).value)}
 				class={cn(
-					'w-full px-3 py-2 bg-white/10 border rounded-cms-md text-sm text-white focus:outline-none focus:ring-1 transition-colors cursor-pointer',
+					'w-full px-3 py-2 bg-white/10 border rounded-cms-sm text-sm text-white focus:outline-none focus:ring-1 transition-colors cursor-pointer',
 					isDirty
 						? 'border-cms-primary focus:border-cms-primary focus:ring-cms-primary/30'
 						: 'border-white/20 focus:border-white/40 focus:ring-white/10',
@@ -220,7 +220,7 @@ export function NumberField({ label, value, placeholder, min, max, onChange, isD
 					onChange(val === '' ? undefined : Number(val))
 				}}
 				class={cn(
-					'w-full px-3 py-2 bg-white/10 border rounded-cms-md text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
+					'w-full px-3 py-2 bg-white/10 border rounded-cms-sm text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
 					isDirty
 						? 'border-cms-primary focus:border-cms-primary focus:ring-cms-primary/30'
 						: 'border-white/20 focus:border-white/40 focus:ring-white/10',
@@ -341,7 +341,7 @@ export function ComboBoxField({ label, value, placeholder, options, onChange, is
 				onKeyDown={handleKeyDown}
 				autocomplete="off"
 				class={cn(
-					'w-full px-3 py-2 bg-white/10 border rounded-cms-md text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
+					'w-full px-3 py-2 bg-white/10 border rounded-cms-sm text-sm text-white placeholder:text-white/40 focus:outline-none focus:ring-1 transition-colors',
 					isDirty
 						? 'border-cms-primary focus:border-cms-primary focus:ring-cms-primary/30'
 						: 'border-white/20 focus:border-white/40 focus:ring-white/10',
@@ -351,7 +351,7 @@ export function ComboBoxField({ label, value, placeholder, options, onChange, is
 			{showDropdown && (
 				<div
 					ref={listRef}
-					class="absolute z-50 left-0 right-0 mt-1 max-h-40 overflow-y-auto bg-cms-dark border border-white/15 rounded-cms-md shadow-lg"
+					class="absolute z-50 left-0 right-0 mt-1 max-h-40 overflow-y-auto bg-cms-dark border border-white/15 rounded-cms-sm shadow-lg"
 					data-cms-ui
 				>
 					{filtered.map((opt, i) => (

package/src/editor/components/frontmatter-fields.tsx

@@ -1,3 +1,4 @@
+import { useState } from 'preact/hooks'
 import { markdownEditorState, openMediaLibraryWithCallback, updateMarkdownFrontmatter } from '../signals'
 import type { CollectionDefinition, FieldDefinition, MarkdownPageEntry } from '../types'
 import { ComboBoxField, ImageField, NumberField, TextField, ToggleField } from './fields'
@@ -87,6 +88,17 @@ export function FrontmatterField({
 		)
 	}
 
+	// Object field - render nested fields with add/remove
+	if (value !== null && typeof value === 'object' && !Array.isArray(value)) {
+		return (
+			<ObjectFields
+				label={label}
+				value={value as Record<string, unknown>}
+				onChange={onChange}
+			/>
+		)
+	}
+
 	// String field (default) - check if it's a long text (excerpt, etc.)
 	const isLongText = fieldKey.toLowerCase().includes('excerpt')
 		|| fieldKey.toLowerCase().includes('description')
@@ -158,7 +170,7 @@ export function CreateModeFrontmatter({
 						}
 					}}
 					placeholder="url-friendly-slug"
-					class="w-full px-3 py-2 bg-white/10 border border-white/20 rounded-cms-md text-sm text-white placeholder-white/40 focus:outline-none focus:border-white/40 focus:ring-1 focus:ring-white/10"
+					class="w-full px-3 py-2 bg-white/10 border border-white/20 rounded-cms-sm text-sm text-white placeholder-white/40 focus:outline-none focus:border-white/40 focus:ring-1 focus:ring-white/10"
 					data-cms-ui
 				/>
 				<p class="mt-1 text-xs text-white/40">
@@ -214,7 +226,7 @@ export function EditModeFrontmatter({
 				<input
 					type="text"
 					value={page.slug}
-					class="w-full px-3 py-2 bg-white/10 border border-white/20 rounded-cms-md text-sm text-white/50 focus:outline-none cursor-not-allowed"
+					class="w-full px-3 py-2 bg-white/10 border border-white/20 rounded-cms-sm text-sm text-white/50 focus:outline-none cursor-not-allowed"
 					disabled
 					data-cms-ui
 				/>
@@ -415,6 +427,32 @@ export function SchemaFrontmatterField({
 			)
 		}
 
+		case 'object': {
+			const obj = (value ?? {}) as Record<string, unknown>
+			const nestedFields = field.fields ?? []
+			if (nestedFields.length > 0) {
+				// Schema-defined nested fields + any extra keys from the actual value
+				const schemaNames = new Set(nestedFields.map((f) => f.name))
+				const extraKeys = Object.keys(obj).filter((k) => !schemaNames.has(k))
+				return (
+					<ObjectFields
+						label={label}
+						value={obj}
+						onChange={onChange}
+						schemaFields={nestedFields}
+						extraKeys={extraKeys}
+					/>
+				)
+			}
+			return (
+				<ObjectFields
+					label={label}
+					value={obj}
+					onChange={onChange}
+				/>
+			)
+		}
+
 		default:
 			return (
 				<div class="flex flex-col gap-1" data-cms-ui>
@@ -431,6 +469,129 @@ export function SchemaFrontmatterField({
 	}
 }
 
+// ============================================================================
+// Object Fields — renders nested fields with add/remove key support
+// ============================================================================
+
+interface ObjectFieldsProps {
+	label: string
+	value: Record<string, unknown>
+	onChange: (value: unknown) => void
+	schemaFields?: FieldDefinition[]
+	extraKeys?: string[]
+}
+
+function ObjectFields({ label, value, onChange, schemaFields, extraKeys }: ObjectFieldsProps) {
+	const [newKey, setNewKey] = useState('')
+	const obj = value ?? {}
+
+	const handleRemoveKey = (key: string) => {
+		const { [key]: _, ...rest } = obj
+		onChange(rest)
+	}
+
+	const handleAddKey = () => {
+		const trimmed = newKey.trim()
+		if (!trimmed || trimmed in obj) return
+		onChange({ ...obj, [trimmed]: '' })
+		setNewKey('')
+	}
+
+	return (
+		<div class="flex flex-col gap-2 col-span-2" data-cms-ui>
+			<label class="text-xs text-white/60 font-medium">{label}</label>
+			<div class="space-y-2 pl-3 border-l-2 border-white/10">
+				{schemaFields
+					? (
+						<>
+							{schemaFields.map((subField) => (
+								<div key={subField.name} class="flex items-end gap-2">
+									<div class="flex-1 min-w-0">
+										<SchemaFrontmatterField
+											field={subField}
+											value={obj[subField.name]}
+											onChange={(newValue) => onChange({ ...obj, [subField.name]: newValue })}
+										/>
+									</div>
+								</div>
+							))}
+							{(extraKeys ?? []).map((key) => (
+								<div key={key} class="flex items-end gap-2">
+									<div class="flex-1 min-w-0">
+										<FrontmatterField
+											fieldKey={key}
+											value={obj[key]}
+											onChange={(newValue) => onChange({ ...obj, [key]: newValue })}
+										/>
+									</div>
+									<button
+										type="button"
+										onClick={() => handleRemoveKey(key)}
+										class="p-1 mb-1 text-white/30 hover:text-red-400 transition-colors shrink-0"
+										title={`Remove ${key}`}
+										data-cms-ui
+									>
+										<RemoveIcon />
+									</button>
+								</div>
+							))}
+						</>
+					)
+					: Object.entries(obj).map(([key, subValue]) => (
+						<div key={key} class="flex items-end gap-2">
+							<div class="flex-1 min-w-0">
+								<FrontmatterField
+									fieldKey={key}
+									value={subValue}
+									onChange={(newValue) => onChange({ ...obj, [key]: newValue })}
+								/>
+							</div>
+							<button
+								type="button"
+								onClick={() => handleRemoveKey(key)}
+								class="p-1 mb-1 text-white/30 hover:text-red-400 transition-colors shrink-0"
+								title={`Remove ${key}`}
+								data-cms-ui
+							>
+								<RemoveIcon />
+							</button>
+						</div>
+					))
+				}
+				{/* Add new key */}
+				<div class="flex items-center gap-2 pt-1">
+					<input
+						type="text"
+						value={newKey}
+						onInput={(e) => setNewKey((e.target as HTMLInputElement).value)}
+						onKeyDown={(e) => { if (e.key === 'Enter') { e.preventDefault(); handleAddKey() } }}
+						placeholder="New field name..."
+						class="flex-1 px-2 py-1 text-xs bg-white/5 border border-white/10 rounded-cms-sm text-white placeholder-white/30 focus:outline-none focus:border-white/30"
+						data-cms-ui
+					/>
+					<button
+						type="button"
+						onClick={handleAddKey}
+						disabled={!newKey.trim() || newKey.trim() in obj}
+						class="px-2 py-1 text-xs font-medium text-white/60 hover:text-white bg-white/5 hover:bg-white/10 border border-white/10 rounded-cms-sm transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
+						data-cms-ui
+					>
+						+ Add
+					</button>
+				</div>
+			</div>
+		</div>
+	)
+}
+
+function RemoveIcon() {
+	return (
+		<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+			<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+		</svg>
+	)
+}
+
 // ============================================================================
 // Helper Functions
 // ============================================================================

package/src/editor/components/seo-editor.tsx

@@ -175,7 +175,8 @@ export function SeoEditor() {
 			})
 
 			if (result.errors && result.errors.length > 0) {
-				showToast(`Saved ${result.updated} SEO changes, ${result.errors.length} failed`, 'error')
+				const details = result.errors.map(e => e.error).join('; ')
+				showToast(`SEO save failed: ${details}`, 'error')
 			} else {
 				showToast(`Saved ${result.updated} SEO change(s) successfully!`, 'success')
 				clearPendingSeoChanges()

package/src/editor/components/toast/toast.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'preact/hooks'
+import { useCallback, useEffect, useState } from 'preact/hooks'
 import { TIMING } from '../../constants'
 import type { ToastMessage } from './types'
 
@@ -8,8 +8,16 @@ interface ToastProps extends ToastMessage {
 
 export const Toast = ({ id, message, type, onRemove }: ToastProps) => {
 	const [isVisible, setIsVisible] = useState(true)
+	const persistent = type === 'error'
+
+	const dismiss = useCallback(() => {
+		setIsVisible(false)
+		setTimeout(() => onRemove(id), TIMING.TOAST_FADE_DURATION_MS)
+	}, [id, onRemove])
 
 	useEffect(() => {
+		if (persistent) return
+
 		const hideTimer = setTimeout(() => {
 			setIsVisible(false)
 		}, TIMING.TOAST_VISIBLE_DURATION_MS)
@@ -22,7 +30,7 @@ export const Toast = ({ id, message, type, onRemove }: ToastProps) => {
 			clearTimeout(hideTimer)
 			clearTimeout(removeTimer)
 		}
-	}, [id, onRemove])
+	}, [id, onRemove, persistent])
 
 	const typeClasses = {
 		error: 'bg-cms-dark border-l-4 border-l-cms-error text-white',
@@ -44,6 +52,15 @@ export const Toast = ({ id, message, type, onRemove }: ToastProps) => {
 			{type === 'error' && <span class="text-cms-error text-lg">✕</span>}
 			{type === 'info' && <span class="w-2.5 h-2.5 rounded-full bg-white/50 shrink-0" />}
 			{message}
+			{persistent && (
+				<button
+					onClick={dismiss}
+					class="ml-1 text-white/60 hover:text-white transition-colors text-lg leading-none cursor-pointer"
+					aria-label="Dismiss"
+				>
+					✕
+				</button>
+			)}
 		</div>
 	)
 }

package/src/editor/dom.ts

@@ -161,16 +161,19 @@ export function isStyledSpan(element: HTMLElement): boolean {
 }
 
 /**
- * Helper function to recursively extract plain text from child nodes,
- * replacing CMS elements with their placeholders.
- * Note: This returns plain text only - for styled content, use innerHTML directly.
+ * Block-level elements that browsers may create inside contentEditable on Enter.
+ * These are treated as line breaks when extracting text.
  */
+const BLOCK_ELEMENTS = new Set(['div', 'p', 'section', 'article', 'header', 'footer', 'blockquote'])
+
 function extractTextFromChildNodes(parentNode: HTMLElement): string {
 	let text = ''
 
 	parentNode.childNodes.forEach(node => {
 		if (node.nodeType === Node.TEXT_NODE) {
-			text += node.nodeValue || ''
+			// Normalize non-breaking spaces (\u00a0) that browsers insert in
+			// contentEditable to regular spaces
+			text += (node.nodeValue || '').replace(/\u00a0/g, ' ')
 		} else if (node.nodeType === Node.ELEMENT_NODE) {
 			const element = node as HTMLElement
 			const tagName = element.tagName.toLowerCase()
@@ -186,9 +189,17 @@ function extractTextFromChildNodes(parentNode: HTMLElement): string {
 			if (directCmsId) {
 				// Element has CMS ID - replace with placeholder
 				text += `{{cms:${directCmsId}}}`
+			} else if (BLOCK_ELEMENTS.has(tagName)) {
+				// Block-level elements created by browser on Enter should be
+				// treated as line breaks, not collapsed into the text
+				const blockText = extractTextFromChildNodes(element)
+				if (blockText) {
+					// Only add <br> separator if there's already text before this block
+					text += (text ? '<br>' : '') + blockText
+				}
 			} else {
 				// For all other elements (including styled spans), just get their text content
-				text += element.textContent || ''
+				text += (element.textContent || '').replace(/\u00a0/g, ' ')
 			}
 		}
 	})

package/src/editor/editor.ts

@@ -154,10 +154,14 @@ export async function startEditMode(
 		makeElementEditable(el)
 
 		// Suppress browser native contentEditable undo/redo (we handle it ourselves)
+		// Also prevent Enter/Shift+Enter from inserting line breaks
 		el.addEventListener('beforeinput', (e) => {
 			if (e.inputType === 'historyUndo' || e.inputType === 'historyRedo') {
 				e.preventDefault()
 			}
+			if (e.inputType === 'insertParagraph' || e.inputType === 'insertLineBreak') {
+				e.preventDefault()
+			}
 		})
 
 		// Setup color tracking for elements with colorClasses in manifest
@@ -1122,11 +1126,24 @@ export interface DeploymentPollingOptions {
  * Start polling for deployment status after a save operation.
  * Polls the API every 3 seconds until deployment completes or fails.
  * Waits for deployment to appear for up to 30 seconds before giving up.
+ * Skips polling entirely when deployment is not available (e.g. local dev).
  */
-export function startDeploymentPolling(config: CmsConfig, options?: DeploymentPollingOptions): void {
+export async function startDeploymentPolling(config: CmsConfig, options?: DeploymentPollingOptions): Promise<void> {
 	// Clear any existing timers
 	stopDeploymentPolling()
 
+	// Do a preflight check to see if deployment is available
+	try {
+		const preflight = await getDeploymentStatus(config.apiBase)
+		if (preflight.deploymentEnabled === false) {
+			// Deployment not available (e.g. local dev) — skip polling entirely
+			return
+		}
+	} catch {
+		// If we can't even reach the endpoint, skip polling
+		return
+	}
+
 	// Reset wait attempts counter and store the timestamp when we started
 	deploymentWaitAttempts = 0
 	deploymentStartTimestamp = new Date().toISOString()

package/src/editor/index.tsx

@@ -142,10 +142,12 @@ const CmsUI = () => {
 			if (result.success) {
 				signals.showToast(`Saved ${result.updated} change(s) successfully!`, 'success')
 			} else if (result.errors) {
-				signals.showToast(`Saved ${result.updated}, ${result.errors.length} failed`, 'error')
+				const details = result.errors.map(e => e.error).join('; ')
+				signals.showToast(`Save failed: ${details}`, 'error')
 			}
 		} catch (err) {
-			signals.showToast('Save failed – see console', 'error')
+			const message = err instanceof Error ? err.message : 'Unknown error'
+			signals.showToast(`Save failed: ${message}`, 'error')
 		}
 	}, [config, updateUI])
 

package/src/editor/types.ts

@@ -418,6 +418,8 @@ export interface DeploymentStatusResponse {
 		publishedUrl: string
 	} | null
 	pendingCount: number
+	/** When false, deployment is not available (e.g. local dev) and polling should be skipped */
+	deploymentEnabled?: boolean
 }
 
 export interface DeploymentState {