@flisk-sh/flisk 0.0.0-stage → 1.3.189

package/ext/ide-components/config_inspector/server.py

@@ -0,0 +1,1052 @@
+#!/usr/bin/env python3
+# Copyright (c) 2026 Flisk Landscape contributors
+# SPDX-License-Identifier: MIT
+"""
+Tilt IDE Config Inspector
+Compare master configs and auto-generated outputs at http://localhost:9767
+
+Features:
+- Multi-pane comparison (1-3 configs side-by-side)
+- Edit mode with safe file saving
+- Sync scroll support
+- Keyboard shortcuts (Ctrl+S, Ctrl+Shift+S, Ctrl+E)
+"""
+
+import json
+import os
+import secrets
+import sys
+import urllib.parse
+from pathlib import Path
+from typing import Optional, Tuple
+
+# Add shared modules
+sys.path.insert(0, str(Path(__file__).parent.parent / 'shared'))
+from file_utils import FileUtils, PROJECT_ROOT
+from config_service import ConfigService
+from http_utils import BaseIDEHandler, run_server
+
+PORT = 9767
+
+
+class ConfigInspectorHandler(BaseIDEHandler):
+    """HTTP request handler for config inspector"""
+    
+    # CSRF token storage (in-memory, per-server-instance)
+    csrf_tokens = set()
+    
+    # Master configs allowed at project root
+    ALLOWED_ROOT_CONFIGS = [
+        'TILT_RESOURCE_DEFAULTS.star',
+        'spec.master',
+        'engine/spec.master',
+    ]
+    
+    def generate_csrf_token(self) -> str:
+        """Generate and store a new CSRF token"""
+        token = secrets.token_urlsafe(32)
+        self.csrf_tokens.add(token)
+        # Keep token set from growing too large
+        if len(self.csrf_tokens) > 1000:
+            self.csrf_tokens.clear()
+        return token
+    
+    def validate_csrf_token(self, token: str) -> bool:
+        """Validate a CSRF token"""
+        if not token:
+            return False
+        referer = self.headers.get('Referer', '')
+        origin = self.headers.get('Origin', '')
+        is_valid, _ = ConfigService.validate_csrf_token(token, referer, origin)
+        return is_valid
+    
+    def discover_master_configs(self) -> list:
+        """Discover all .star files in engine/topologies/ and project root master configs"""
+        configs = []
+        
+        # First, add project root master configs
+        for config_name in self.ALLOWED_ROOT_CONFIGS:
+            config_path = PROJECT_ROOT / config_name
+            if config_path.exists():
+                configs.append({
+                    'path': config_name,
+                    'name': config_path.name,
+                    'category': 'Project Root',
+                })
+        
+        # Then discover from engine/topologies/
+        topologies_dir = PROJECT_ROOT / 'engine' / 'topologies'
+        
+        if topologies_dir.exists():
+            for root, dirs, files in os.walk(topologies_dir):
+                # Skip __pycache__ and hidden
+                dirs[:] = [d for d in dirs if not d.startswith('.') and d != '__pycache__']
+                
+                for file in sorted(files):
+                    if file.endswith('.star'):
+                        file_path = Path(root) / file
+                        rel_path = file_path.relative_to(PROJECT_ROOT)
+                        configs.append({
+                            'path': str(rel_path),
+                            'name': file,
+                            'category': self._categorize_config(rel_path),
+                        })
+        
+        return sorted(configs, key=lambda x: (x['category'], x['path']))
+    
+    def _categorize_config(self, path: Path) -> str:
+        """Categorize a config file by its location"""
+        path_str = str(path).lower()
+        if 'platform/docker' in path_str:
+            return 'Docker'
+        elif 'platform/' in path_str:
+            return 'Platform'
+        elif 'tilt/' in path_str:
+            return 'Tilt'
+        elif 'generators' in path_str:
+            return 'Generators'
+        elif 'discovery' in path_str:
+            return 'Discovery'
+        else:
+            return 'Other'
+    
+    def discover_autogenerated_configs(self) -> list:
+        """Discover all autogenerated config files"""
+        configs = []
+        
+        for root, dirs, files in os.walk(PROJECT_ROOT):
+            # Skip certain directories
+            dirs[:] = [d for d in dirs if not d.startswith('.') and 
+                      d not in ('node_modules', 'dist', 'build', '__pycache__')]
+            
+            if 'autogenerated' in root:
+                for file in sorted(files):
+                    if 'autogenerated' in file:
+                        file_path = Path(root) / file
+                        rel_path = file_path.relative_to(PROJECT_ROOT)
+                        
+                        # Determine service name from path
+                        parts = str(rel_path).split('/')
+                        resource_name = 'unknown'
+                        for i, part in enumerate(parts):
+                            if part == 'services' and i + 2 < len(parts):
+                                resource_name = parts[i + 2]
+                                break
+                        
+                        configs.append({
+                            'path': str(rel_path),
+                            'name': file,
+                            'service': resource_name,
+                            'type': self._get_autogen_type(file),
+                        })
+        
+        return sorted(configs, key=lambda x: (x['service'], x['type'], x['path']))
+    
+    def _get_autogen_type(self, filename: str) -> str:
+        """Determine autogenerated config type from filename"""
+        if 'docker-compose' in filename:
+            return 'Docker Compose'
+        elif 'Dockerfile' in filename:
+            return 'Dockerfile'
+        elif 'vite.config' in filename:
+            return 'Vite Config'
+        elif 'tsconfig' in filename:
+            return 'TypeScript'
+        elif 'nginx' in filename:
+            return 'Nginx'
+        elif 'prisma' in filename:
+            return 'Prisma'
+        elif 'env' in filename:
+            return 'Environment'
+        else:
+            return 'Other'
+    
+    def read_file_content(self, path: str) -> Tuple[str, Optional[str]]:
+        """
+        Read file content safely.
+        Returns: (content, content_hash)
+        """
+        resolved = FileUtils.validate_path(path)
+        if not resolved or not resolved.exists():
+            return f"# File not found: {path}", None
+        
+        try:
+            with open(resolved, 'r', encoding='utf-8', errors='replace') as f:
+                content = f.read()
+            
+            # Compute hash for conflict detection
+            content_hash = ConfigService.compute_content_hash(content)
+            return content, content_hash
+        except Exception as e:
+            return f"# Error reading file: {e}", None
+    
+    def validate_url_path(self, path: str) -> Tuple[bool, str]:
+        """
+        Validate a path from URL parameter to prevent path traversal.
+        Returns: (is_valid, error_message)
+        """
+        if not path:
+            return False, "Empty path"
+        
+        # Check for path traversal sequences
+        decoded = urllib.parse.unquote(path)
+        if '..' in decoded or '%2e' in path.lower():
+            return False, "Path traversal not allowed"
+        
+        # Validate using ConfigService
+        resolved = ConfigService.validate_write_path(path)
+        if not resolved:
+            return False, "Path not in allowed directories"
+        
+        # Validate file type
+        is_valid, msg = ConfigService.validate_file_type(path)
+        if not is_valid:
+            return False, msg
+        
+        return True, "Valid"
+    
+    def parse_multi_master_params(self, query: dict) -> Tuple[list, str]:
+        """
+        Parse and validate master1, master2, master3 URL parameters.
+        Returns: (list_of_paths, error_message)
+        """
+        masters = []
+        
+        for i in range(1, 4):
+            param_name = f'master{i}'
+            if param_name in query and query[param_name][0]:
+                path = query[param_name][0]
+                
+                # Check for sequential parameter gap
+                if i > 1 and not masters:
+                    return [], f"Invalid URL parameters: {param_name} specified without prior masters"
+                
+                # Validate path
+                is_valid, msg = self.validate_url_path(path)
+                if not is_valid:
+                    return [], f"Invalid path in {param_name}: {msg}"
+                
+                # Check for duplicates
+                if path in masters:
+                    return [], f"Duplicate file: {path} cannot be selected multiple times"
+                
+                masters.append(path)
+        
+        return masters, ""
+    
+    def render_config_tree(self, configs: list, selected_paths: list = None) -> str:
+        """Render config tree navigation with multi-select support."""
+        if selected_paths is None:
+            selected_paths = []
+        
+        current_category = None
+        html = ['<ul class="config-tree">']
+        
+        for cfg in configs:
+            # Category header
+            if cfg['category'] != current_category:
+                if current_category:
+                    html.append('</ul></li>')
+                current_category = cfg['category']
+                html.append(f'<li style="margin-top: 1rem;"><strong style="color: var(--text-muted); font-size: 0.8rem; text-transform: uppercase;">{current_category}</strong><ul style="list-style: none; padding-left: 0.5rem;">')
+            
+            # Check if this config is selected and get its order
+            is_selected = cfg['path'] in selected_paths
+            selection_order = ''
+            if is_selected:
+                order = selected_paths.index(cfg['path']) + 1
+                selection_order = f'<span class="selection-order">{order}</span>'
+            
+            active_class = 'active' if is_selected else ''
+            encoded_path = urllib.parse.quote(cfg['path'])
+            
+            # Build onclick handler for multi-select
+            if selected_paths:
+                # If we already have selections, append to them
+                if is_selected:
+                    # Deselect if already selected
+                    new_selection = [p for p in selected_paths if p != cfg['path']]
+                else:
+                    # Add to selection if less than 3
+                    if len(selected_paths) < 3:
+                        new_selection = selected_paths + [cfg['path']]
+                    else:
+                        new_selection = selected_paths  # Max reached
+                
+                # Build new URL
+                params = []
+                for i, p in enumerate(new_selection, 1):
+                    params.append(f"master{i}={urllib.parse.quote(p)}")
+                new_url = '/compare?' + '&'.join(params) if params else '/'
+                
+                html.append(f'''
+                    <li class="tree-item {active_class}" onclick="handleConfigClick(event, '{encoded_path}', {len(selected_paths)})">
+                        <span>⭐</span>
+                        <span>{cfg['name']}</span>
+                        {selection_order}
+                    </li>
+                ''')
+            else:
+                # Single select mode
+                html.append(f'''
+                    <li class="tree-item {active_class}" onclick="handleConfigClick(event, '{encoded_path}', 0)">
+                        <span>⭐</span>
+                        <span>{cfg['name']}</span>
+                        {selection_order}
+                    </li>
+                ''')
+        
+        if current_category:
+            html.append('</ul></li>')
+        
+        html.append('</ul>')
+        return ''.join(html)
+    
+    def render_multi_pane_view(self, master_paths: list, edit_mode: bool, sync_scroll: bool, csrf_token: str) -> str:
+        """Render multi-pane view for 1-3 master configs."""
+        num_panes = len(master_paths)
+        if num_panes == 0:
+            return '<div class="empty-state"><div class="empty-state-icon">⚙️</div><p>No master configs selected</p></div>'
+        
+        # Determine grid layout class
+        if num_panes == 1:
+            grid_class = 'single-pane'
+        elif num_panes == 2:
+            grid_class = 'dual-pane'
+        else:
+            grid_class = 'triple-pane'
+        
+        # Build panes
+        panes_html = []
+        pane_data = []
+        
+        for i, path in enumerate(master_paths, 1):
+            content, content_hash = self.read_file_content(path)
+            pane_data.append({
+                'path': path,
+                'content': content,
+                'hash': content_hash,
+                'index': i
+            })
+            
+            # Determine unsaved status (will be tracked client-side)
+            unsaved_indicator = '<span class="unsaved-indicator hidden">●</span>'
+            
+            # Render content based on edit mode
+            if edit_mode:
+                # Editable textarea with HTML-escaped content
+                escaped_content = self.escape_html(content)
+                content_html = f'''
+                    <textarea class="config-editor" 
+                              data-path="{self.escape_html(path)}" 
+                              data-hash="{content_hash or ''}"
+                              data-pane="{i}"
+                              spellcheck="false">{escaped_content}</textarea>
+                '''
+            else:
+                # Read-only pre/code view
+                content_html = f'<pre class="config-viewer" data-pane="{i}"><code>{self.escape_html(content)}</code></pre>'
+            
+            pane_html = f'''
+                <div class="panel pane-{i}" data-pane="{i}">
+                    <div class="panel-header">
+                        <div class="panel-header-left">
+                            <span class="panel-title">⭐ Master Config {i}/{num_panes}</span>
+                            <span class="text-muted panel-path">{path}</span>
+                            {unsaved_indicator}
+                        </div>
+                        {f'<button class="save-pane-btn hidden" data-pane="{i}" onclick="savePane({i})">💾 Save</button>' if edit_mode else ''}
+                    </div>
+                    <div class="panel-content" data-pane="{i}">
+                        {content_html}
+                    </div>
+                </div>
+            '''
+            panes_html.append(pane_html)
+        
+        # Generate pane data for JavaScript
+        pane_data_json = json.dumps(pane_data)
+        
+        # Build the multi-pane container
+        content_html = f'''
+            <div class="multi-pane-view {grid_class}" id="multiPaneView" data-sync="{str(sync_scroll).lower()}">
+                {''.join(panes_html)}
+            </div>
+            
+            <script>
+                // Store pane data for JavaScript
+                window.PANE_DATA = {pane_data_json};
+                window.EDIT_MODE = {'true' if edit_mode else 'false'};
+                window.SYNC_SCROLL = {'true' if sync_scroll else 'false'};
+                window.CSRF_TOKEN = '{csrf_token}';
+            </script>
+        '''
+        
+        return content_html
+    
+    def check_resource_status(self) -> dict:
+        """Check if other IDE services are running"""
+        import socket
+        services = {
+            'files': {'host': 'localhost', 'port': 9765},
+            'viewer': {'host': 'localhost', 'port': 9766},
+            'terminal': {'host': 'localhost', 'port': 9768},
+        }
+        status = {}
+        for name, info in services.items():
+            try:
+                sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
+                sock.settimeout(0.5)
+                result = sock.connect_ex(('127.0.0.1', info['port']))
+                sock.close()
+                status[name] = result == 0
+            except:
+                status[name] = False
+        return status
+    
+    def get_main_javascript(self, edit_mode: bool) -> str:
+        """Get the main JavaScript code for the Config Inspector"""
+        # This is a long JavaScript string - could be moved to a separate file
+        # For now, keeping inline to avoid breaking existing functionality
+        return '''
+    <script>
+        // Track dirty state per pane
+        window.DIRTY_PANES = new Set();
+        
+        // Handle config tree click with multi-select support
+        function handleConfigClick(event, path, currentSelectionCount) {
+            const isMultiSelect = event.ctrlKey || event.metaKey;
+            
+            if (isMultiSelect) {
+                event.preventDefault();
+                
+                // Build new selection
+                let currentPaths = window.PANE_DATA ? window.PANE_DATA.map(p => p.path) : [];
+                const index = currentPaths.indexOf(path);
+                
+                if (index >= 0) {
+                    // Deselect
+                    currentPaths.splice(index, 1);
+                } else if (currentPaths.length < 3) {
+                    // Add to selection (max 3)
+                    currentPaths.push(path);
+                }
+                
+                // Navigate to new URL
+                const params = currentPaths.map((p, i) => `master${i+1}=${encodeURIComponent(p)}`);
+                const newUrl = params.length > 0 ? '/compare?' + params.join('&') : '/';
+                window.location.href = newUrl;
+            } else {
+                // Single select - just navigate
+                window.location.href = '/compare?master1=' + encodeURIComponent(path);
+            }
+        }
+        
+        // Clear all selections
+        function clearSelection() {
+            window.location.href = '/';
+        }
+        
+        // Toggle edit mode
+        function toggleEditMode() {
+            if (window.DIRTY_PANES.size > 0) {
+                const files = Array.from(window.DIRTY_PANES).map(pane => {
+                    const paneData = window.PANE_DATA.find(p => p.index === pane);
+                    return paneData ? paneData.path : 'Unknown';
+                });
+                if (!confirm(`You have unsaved changes in:\n${files.join('\\n')}\n\nDiscard changes and exit edit mode?`)) {
+                    return;
+                }
+            }
+            
+            const url = new URL(window.location);
+            const currentEdit = url.searchParams.get('edit') === 'true';
+            url.searchParams.set('edit', (!currentEdit).toString());
+            window.location.href = url.toString();
+        }
+        
+        // Toggle sync scroll
+        function toggleSyncScroll() {
+            const checkbox = document.getElementById('syncScrollCheckbox');
+            const url = new URL(window.location);
+            url.searchParams.set('sync', checkbox.checked.toString());
+            window.location.href = url.toString();
+        }
+        
+        // Save a single pane
+        async function savePane(paneIndex) {
+            const textarea = document.querySelector(`textarea[data-pane="${paneIndex}"]`);
+            if (!textarea) return;
+            
+            const path = textarea.dataset.path;
+            const content = textarea.value;
+            const originalHash = textarea.dataset.hash;
+            
+            await saveFile(path, content, originalHash, paneIndex);
+        }
+        
+        // Save all panes
+        async function saveAllPanes() {
+            const textareas = document.querySelectorAll('textarea.config-editor');
+            const results = [];
+            
+            for (const textarea of textareas) {
+                const paneIndex = parseInt(textarea.dataset.pane);
+                const path = textarea.dataset.path;
+                const content = textarea.value;
+                const originalHash = textarea.dataset.hash;
+                
+                const result = await saveFile(path, content, originalHash, paneIndex, false);
+                results.push({ paneIndex, success: result.success });
+            }
+            
+            // Show summary notification
+            const successCount = results.filter(r => r.success).length;
+            const totalCount = results.length;
+            
+            if (successCount === totalCount) {
+                showNotification(`All ${totalCount} files saved successfully`, 'success');
+                window.DIRTY_PANES.clear();
+                updateUnsavedIndicators();
+                updateSaveAllButton();
+            } else {
+                showNotification(`${successCount}/${totalCount} files saved`, 'warning');
+            }
+        }
+        
+        // Save a file via API
+        async function saveFile(path, content, originalHash, paneIndex, showToast = true) {
+            try {
+                const response = await fetch('/save', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                        'X-CSRF-Token': window.CSRF_TOKEN
+                    },
+                    body: JSON.stringify({
+                        path: path,
+                        content: content,
+                        original_hash: originalHash,
+                        csrf_token: window.CSRF_TOKEN
+                    })
+                });
+                
+                const result = await response.json();
+                
+                if (result.success) {
+                    if (showToast) {
+                        showNotification(`Saved: ${path}`, 'success');
+                    }
+                    
+                    // Trigger save success animation on the panel
+                    const panel = document.querySelector(`.pane-${paneIndex}`);
+                    if (panel) {
+                        panel.classList.add('save-success');
+                        setTimeout(() => panel.classList.remove('save-success'), 1000);
+                    }
+                    
+                    // Clear dirty state for this pane
+                    window.DIRTY_PANES.delete(paneIndex);
+                    updateUnsavedIndicators();
+                    updateSaveAllButton();
+                    
+                    // Update the hash in the textarea
+                    const textarea = document.querySelector(`textarea[data-pane="${paneIndex}"]`);
+                    if (textarea && result.new_hash) {
+                        textarea.dataset.hash = result.new_hash;
+                    }
+                    
+                    return { success: true };
+                } else {
+                    if (showToast) {
+                        showNotification(`Failed: ${result.message}`, 'error');
+                    }
+                    return { success: false, message: result.message };
+                }
+            } catch (error) {
+                if (showToast) {
+                    showNotification(`Error: ${error.message}`, 'error');
+                }
+                return { success: false, message: error.message };
+            }
+        }
+        
+        // Show notification toast
+        function showNotification(message, type = 'info') {
+            const existing = document.querySelector('.notification-toast');
+            if (existing) existing.remove();
+            
+            const toast = document.createElement('div');
+            toast.className = `notification-toast ${type}`;
+            toast.textContent = message;
+            document.body.appendChild(toast);
+            
+            setTimeout(() => {
+                toast.classList.add('show');
+            }, 10);
+            
+            setTimeout(() => {
+                toast.classList.remove('show');
+                setTimeout(() => toast.remove(), 300);
+            }, 3000);
+        }
+        
+        // Update unsaved change indicators
+        function updateUnsavedIndicators() {
+            document.querySelectorAll('.unsaved-indicator').forEach(indicator => {
+                const pane = indicator.closest('.panel').dataset.pane;
+                if (window.DIRTY_PANES.has(parseInt(pane))) {
+                    indicator.classList.remove('hidden');
+                } else {
+                    indicator.classList.add('hidden');
+                }
+            });
+        }
+        
+        // Update save all button visibility
+        function updateSaveAllButton() {
+            const btn = document.getElementById('saveAllBtn');
+            if (window.EDIT_MODE && window.DIRTY_PANES.size > 0) {
+                btn.classList.remove('hidden');
+            } else {
+                btn.classList.add('hidden');
+            }
+        }
+        
+        // Track content changes
+        function onContentChange(paneIndex) {
+            window.DIRTY_PANES.add(paneIndex);
+            updateUnsavedIndicators();
+            updateSaveAllButton();
+            
+            // Show save button for this pane
+            const saveBtn = document.querySelector(`.save-pane-btn[data-pane="${paneIndex}"]`);
+            if (saveBtn) saveBtn.classList.remove('hidden');
+        }
+        
+        function setupSyncScroll() {
+            if (!window.SYNC_SCROLL) return;
+            
+            const panes = document.querySelectorAll('.panel-content');
+            let isSyncing = false;
+            
+            panes.forEach(sourcePane => {
+                sourcePane.addEventListener('scroll', () => {
+                    if (isSyncing || !window.SYNC_SCROLL) return;
+                    
+                    isSyncing = true;
+                    requestAnimationFrame(() => {
+                        const scrollTop = sourcePane.scrollTop;
+                        const scrollLeft = sourcePane.scrollLeft;
+                        
+                        panes.forEach(targetPane => {
+                            if (targetPane !== sourcePane) {
+                                targetPane.scrollTop = scrollTop;
+                                targetPane.scrollLeft = scrollLeft;
+                            }
+                        });
+                        
+                        isSyncing = false;
+                    });
+                });
+            });
+        }
+        
+        // Setup keyboard shortcuts
+        function setupKeyboardShortcuts() {
+            document.addEventListener('keydown', (e) => {
+                const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+                const cmdKey = isMac ? e.metaKey : e.ctrlKey;
+                
+                if (!cmdKey) return;
+                
+                // Ctrl/Cmd+S: Save focused pane
+                if (e.key === 's' && !e.shiftKey) {
+                    e.preventDefault();
+                    if (!window.EDIT_MODE) return;
+                    
+                    const activeElement = document.activeElement;
+                    if (activeElement && activeElement.classList.contains('config-editor')) {
+                        const paneIndex = parseInt(activeElement.dataset.pane);
+                        savePane(paneIndex);
+                    }
+                }
+                
+                // Ctrl/Cmd+Shift+S: Save all panes
+                if (e.key === 'S' || (e.key === 's' && e.shiftKey)) {
+                    e.preventDefault();
+                    if (!window.EDIT_MODE || window.DIRTY_PANES.size === 0) return;
+                    saveAllPanes();
+                }
+                
+                // Ctrl/Cmd+E: Toggle edit mode
+                if (e.key === 'e' || e.key === 'E') {
+                    e.preventDefault();
+                    toggleEditMode();
+                }
+            });
+        }
+        
+        // Warn about unsaved changes on page unload
+        function setupBeforeUnload() {
+            window.addEventListener('beforeunload', (e) => {
+                if (window.DIRTY_PANES.size > 0) {
+                    e.preventDefault();
+                    e.returnValue = '';
+                    return '';
+                }
+            });
+        }
+        
+        document.addEventListener('DOMContentLoaded', () => {
+            document.querySelectorAll('textarea.config-editor').forEach(textarea => {
+                const paneIndex = parseInt(textarea.dataset.pane);
+                textarea.addEventListener('input', () => onContentChange(paneIndex));
+            });
+            setupSyncScroll();
+            setupKeyboardShortcuts();
+            setupBeforeUnload();
+            updateSaveAllButton();
+        });
+    </script>
+'''
+    
+    def _get_template_path(self) -> Path:
+        """Override to use shared template"""
+        return Path(__file__).parent.parent / 'shared' / 'templates' / 'base.html'
+    
+    def do_GET(self):
+        """Handle GET requests"""
+        parsed = urllib.parse.urlparse(self.path)
+        path = parsed.path
+        query = urllib.parse.parse_qs(parsed.query)
+        
+        # Health check
+        if path == '/health':
+            self.handle_health_check('config-inspector', ['multi-pane', 'edit-mode', 'sync-scroll'])
+            return
+
+        # API: List all master configs
+        if path == '/api/masters':
+            master_configs = self.discover_master_configs()
+            self.send_json_response({
+                'status': 'ok',
+                'count': len(master_configs),
+                'configs': master_configs
+            })
+            return
+
+        # API: Get specific config content
+        if path == '/api/config':
+            config_path = query.get('path', [''])[0]
+            if not config_path:
+                self.send_json_response({
+                    'status': 'error',
+                    'message': 'Missing path parameter'
+                }, 400)
+                return
+
+            content, content_hash = self.read_file_content(config_path)
+            if content is None:
+                self.send_json_response({
+                    'status': 'error',
+                    'message': f'Config not found: {config_path}'
+                }, 404)
+                return
+
+            self.send_json_response({
+                'status': 'ok',
+                'path': config_path,
+                'content': content,
+                'hash': content_hash
+            })
+            return
+
+        # Static files
+        if path.startswith('/static/'):
+            static_path = Path(__file__).parent.parent / 'shared' / path[1:]
+            if static_path.exists():
+                with open(static_path, 'r', encoding='utf-8') as f:
+                    content = f.read()
+                self.send_css_response(content)
+            else:
+                self.send_error_response(404, 'Not found')
+            return
+        
+        # Main page or compare view
+        if path in ('/', '/compare'):
+            master_configs = self.discover_master_configs()
+            
+            # Parse multi-master parameters
+            selected_paths, error_msg = self.parse_multi_master_params(query)
+            
+            if error_msg:
+                sidebar = self.render_config_tree(master_configs)
+                error_html = f'<div class="empty-state"><div class="empty-state-icon">❌</div><p>{self.escape_html(error_msg)}</p></div>'
+                csrf_token = self.generate_csrf_token()
+                self.send_html_response(self.render_page(
+                    'Config Inspector',
+                    error_html,
+                    icon='⚙️',
+                    sidebar=sidebar,
+                    scripts=f'<script>window.CSRF_TOKEN = "{csrf_token}";</script>'
+                ))
+                return
+            
+            # Get edit and sync params
+            edit_mode = query.get('edit', ['false'])[0].lower() == 'true'
+            sync_scroll = query.get('sync', ['false'])[0].lower() == 'true'
+            
+            # If no selection, use first config as default
+            if not selected_paths and master_configs:
+                # Prefer Project Root configs first
+                root_configs = [c for c in master_configs if c['category'] == 'Project Root']
+                if root_configs:
+                    selected_paths = [root_configs[0]['path']]
+                else:
+                    selected_paths = [master_configs[0]['path']]
+            
+            # Build sidebar with multi-select support
+            sidebar = self.render_config_tree(master_configs, selected_paths)
+            
+            # Generate CSRF token
+            csrf_token = self.generate_csrf_token()
+            
+            # Build header controls
+            edit_toggle_class = 'active' if edit_mode else ''
+            sync_checked = 'checked' if sync_scroll else ''
+            has_selection = selected_paths and len(selected_paths) > 0
+            
+            header_controls = f'''
+                <div class="header-controls">
+                    <label class="sync-scroll-label">
+                        <input type="checkbox" id="syncScrollCheckbox" {sync_checked} onchange="toggleSyncScroll()">
+                        <span>🔗 Sync Scroll</span>
+                    </label>
+                    <button class="edit-mode-btn {edit_toggle_class}" id="editModeBtn" onclick="toggleEditMode()" title="Ctrl+E">
+                        ✏️ Edit Mode
+                    </button>
+                    <button class="save-all-btn hidden" id="saveAllBtn" onclick="saveAllPanes()" title="Ctrl+Shift+S">
+                        💾 Save All
+                    </button>
+                    {f'<button class="clear-selection-btn" onclick="clearSelection()">❌ Clear</button>' if has_selection else ''}
+                </div>
+            '''
+            
+            # Build multi-pane content
+            if selected_paths:
+                content_html = self.render_multi_pane_view(
+                    selected_paths, edit_mode, sync_scroll, csrf_token
+                )
+            else:
+                content_html = '<div class="empty-state"><div class="empty-state-icon">⚙️</div><p>No master configs found</p></div>'
+            
+            # Check service status for other IDE components
+            resource_status = self.check_resource_status()
+            
+            # Get JavaScript
+            scripts = self.get_main_javascript(edit_mode)
+            
+            # Build the complete page
+            page = self.render_page(
+                'Config Inspector',
+                content_html,
+                icon='⚙️',
+                sidebar=sidebar,
+                controls=header_controls,
+                scripts=scripts
+            )
+            
+            # Add resource status placeholders if they exist in template
+            page = page.replace('{files_available}', 'true' if resource_status.get('files') else 'false')
+            page = page.replace('{viewer_available}', 'true' if resource_status.get('viewer') else 'false')
+            page = page.replace('{terminal_available}', 'true' if resource_status.get('terminal') else 'false')
+            
+            self.send_html_response(page)
+            return
+        
+        # 404
+        self.send_html_response(self.render_page(
+            'Not Found',
+            '<div class="empty-state"><div class="empty-state-icon">❓</div>Page not found</div>',
+            icon='❓'
+        ), 404)
+    
+    def do_POST(self):
+        """Handle POST requests for save operations"""
+        parsed = urllib.parse.urlparse(self.path)
+        path = parsed.path
+        
+        # Validate Content-Length header for DoS prevention
+        content_length = self.headers.get('Content-Length')
+        is_valid, msg = ConfigService.validate_request_content_length(content_length)
+        if not is_valid:
+            self.send_json_response({
+                'success': False,
+                'message': f'Invalid request: {msg}'
+            }, 400)
+            return
+        
+        # Read request body
+        content_length = int(content_length)
+        body = self.rfile.read(content_length).decode('utf-8')
+        
+        try:
+            data = json.loads(body)
+        except json.JSONDecodeError:
+            self.send_json_response({
+                'success': False,
+                'message': 'Invalid JSON in request body'
+            }, 400)
+            return
+        
+        # Validate CSRF token
+        csrf_token = data.get('csrf_token', '')
+        if not self.validate_csrf_token(csrf_token):
+            self.send_json_response({
+                'success': False,
+                'message': 'Invalid CSRF token'
+            }, 403)
+            return
+        
+        # Handle save endpoints
+        if path == '/save':
+            self._handle_save_single(data)
+        elif path == '/save-all':
+            self._handle_save_all(data)
+        else:
+            self.send_json_response({
+                'success': False,
+                'message': 'Unknown endpoint'
+            }, 404)
+    
+    def _handle_save_single(self, data: dict):
+        """Handle single file save"""
+        file_path = data.get('path', '')
+        content = data.get('content', '')
+        original_hash = data.get('original_hash', '')
+        
+        # Validate path
+        is_valid, msg = self.validate_url_path(file_path)
+        if not is_valid:
+            self.send_json_response({
+                'success': False,
+                'message': f'Invalid path: {msg}'
+            }, 400)
+            return
+        
+        # Validate file type
+        is_valid, msg = ConfigService.validate_file_type(file_path)
+        if not is_valid:
+            self.send_json_response({
+                'success': False,
+                'message': msg
+            }, 400)
+            return
+        
+        # Resolve path
+        resolved = ConfigService.validate_write_path(file_path)
+        if not resolved:
+            self.send_json_response({
+                'success': False,
+                'message': 'Path validation failed'
+            }, 400)
+            return
+        
+        # Perform atomic write
+        result = ConfigService.atomic_write(resolved, content, original_hash, create_backup=True)
+        
+        # Compute new hash if successful
+        new_hash = None
+        if result.success:
+            new_hash = ConfigService.compute_content_hash(content)
+        
+        self.send_json_response({
+            'success': result.success,
+            'message': result.message,
+            'new_hash': new_hash,
+            'backup_path': str(result.backup_path) if result.backup_path else None
+        }, 200 if result.success else 409)
+    
+    def _handle_save_all(self, data: dict):
+        """Handle batch save of multiple files"""
+        files = data.get('files', [])
+        
+        if not isinstance(files, list):
+            self.send_json_response({
+                'success': False,
+                'message': 'Invalid request: files must be an array'
+            }, 400)
+            return
+        
+        results = []
+        all_success = True
+        
+        for file_data in files:
+            file_path = file_data.get('path', '')
+            content = file_data.get('content', '')
+            original_hash = file_data.get('original_hash', '')
+            
+            # Validate
+            is_valid, msg = self.validate_url_path(file_path)
+            if not is_valid:
+                results.append({
+                    'path': file_path,
+                    'success': False,
+                    'message': f'Invalid path: {msg}'
+                })
+                all_success = False
+                continue
+            
+            is_valid, msg = ConfigService.validate_file_type(file_path)
+            if not is_valid:
+                results.append({
+                    'path': file_path,
+                    'success': False,
+                    'message': msg
+                })
+                all_success = False
+                continue
+            
+            # Save
+            resolved = ConfigService.validate_write_path(file_path)
+            if not resolved:
+                results.append({
+                    'path': file_path,
+                    'success': False,
+                    'message': 'Path validation failed'
+                })
+                all_success = False
+                continue
+            
+            result = ConfigService.atomic_write(resolved, content, original_hash, create_backup=True)
+            
+            results.append({
+                'path': file_path,
+                'success': result.success,
+                'message': result.message,
+                'new_hash': ConfigService.compute_content_hash(content) if result.success else None
+            })
+            
+            if not result.success:
+                all_success = False
+        
+        self.send_json_response({
+            'success': all_success,
+            'message': f'{sum(1 for r in results if r["success"])}/{len(results)} files saved',
+            'results': results
+        }, 200 if all_success else 207)  # 207 Multi-Status for partial success
+
+
+def main():
+    """Run the config inspector server"""
+    run_server(
+        ConfigInspectorHandler,
+        PORT,
+        '⚙️  Tilt IDE Config Inspector',
+        '🔍 Compare master .star configs with auto-generated outputs\n   ✏️  Multi-pane editing with Ctrl+S, Ctrl+Shift+S, Ctrl+E'
+    )
+
+
+if __name__ == '__main__':
+    main()