# Preview White Page Fix

## Problem Identified
The preview was showing a completely white page instead of displaying HTML content, including the starter HTML code.

## Root Causes Found

### 1. **Critical iframe srcDoc Logic Error**
- **Primary iframe**: `srcDoc={activeIframeIndex === 0 ? displayHtml : ''}` 
  - When `activeIframeIndex` was 0, it showed content
  - When `activeIframeIndex` was NOT 0, it showed empty string ❌
- **Secondary iframe**: `srcDoc={activeIframeIndex === 1 ? displayHtml : secondaryHtml}`
  - Only worked when `activeIframeIndex` was 1
  - `secondaryHtml` started as empty string ❌

### 2. **Empty Secondary HTML State**
- `secondaryHtml` was initialized as empty string `''`
- This meant the secondary iframe never had content

### 3. **Complex Update Logic Interference**
- Over-complicated update flow prevented basic HTML display
- Multiple conditions and async operations blocked simple content showing

## Fixes Applied

### ✅ **Fix 1: Corrected iframe srcDoc Logic**
```tsx
// Before (BROKEN):
srcDoc={activeIframeIndex === 0 ? displayHtml : ''}
srcDoc={activeIframeIndex === 1 ? displayHtml : secondaryHtml}

// After (FIXED):
srcDoc={displayHtml}
srcDoc={secondaryHtml || displayHtml}
```

### ✅ **Fix 2: Initialize Secondary HTML Properly**
```tsx
// Before:
const [secondaryHtml, setSecondaryHtml] = useState('');

// After:
const [secondaryHtml, setSecondaryHtml] = useState(html);
```

### ✅ **Fix 3: Simplified Update Logic**
- **ALWAYS** update `displayHtml` immediately when `html` prop changes
- Prioritize showing content over complex transition effects
- Use enhanced updates only during AI streaming for improvements
- Removed blocking conditions that prevented basic HTML display

### ✅ **Fix 4: Enhanced Debug Logging**
- Added console logs to track HTML content flow
- Monitor component mounting and state initialization
- Track when displayHtml gets updated

## Expected Results

### ✅ **Immediate Benefits:**
1. **Starter HTML displays** - Preview shows default HTML content on load
2. **Basic HTML rendering works** - Any HTML content should display properly  
3. **No more white page** - Content is always visible in the preview
4. **Reliable updates** - HTML changes reflect in the preview consistently

### ✅ **Maintained Features:**
1. **Smooth transitions** - Enhanced updates during AI streaming
2. **Dual iframe system** - For zero-flash transitions when needed
3. **Loading indicators** - Subtle progress feedback during AI work
4. **Mobile/desktop responsive** - All device styling preserved

## Testing Checklist

- [ ] Preview shows starter HTML on fresh page load
- [ ] Manual HTML edits reflect in preview immediately  
- [ ] AI-generated content displays after streaming
- [ ] No white page or blank content issues
- [ ] Smooth transitions work during AI updates

The core issue was the iframe content assignment logic - now both iframes always have valid HTML content to display.