Function createProxyMiddleware

packages/cli/src/proxy.ts:30–144

(
    targetPort: number,
    projectCwd?: string,
    isFresh?: () => boolean,
    getComparisonPhase?: () => ComparisonPhase | null
)

 * and injects the Awel host script into HTML responses.
 */
export function createProxyMiddleware(
    targetPort: number,
    projectCwd?: string,
    isFresh?: () => boolean,
    getComparisonPhase?: () => ComparisonPhase | null
) {
    return async (c: any, _next: () => Promise<void>) => {
        const url = new URL(c.req.url);
        const comparisonPhase = getComparisonPhase?.();

        // Serve creation mode dashboard when fresh AND not in comparing phase.
        // In comparing phase, show the actual app with the comparison overlay instead.
        if (isFresh?.() && comparisonPhase !== 'comparing') {
            const accept = c.req.header('accept') || '';
            const isNavigation = accept.includes('text/html');
            if (isNavigation) {
                const html = getCreationModeHtml();
                if (html) {
                    return new Response(html, {
                        status: 200,
                        headers: { 'Content-Type': 'text/html; charset=utf-8' },
                    });
                }
            }
        }

        const targetUrl = `http://localhost:${targetPort}${url.pathname}${url.search}`;

        try {
            // Clone headers and remove Accept-Encoding to get uncompressed response
            const headers = new Headers(c.req.raw.headers);
            headers.delete('accept-encoding');

            const response = await fetch(targetUrl, {
                method: c.req.method,
                headers,
                body: c.req.method !== 'GET' && c.req.method !== 'HEAD'
                    ? await c.req.raw.arrayBuffer()
                    : undefined,
            });

            // Handle null body status codes (204, 304, etc.) - pass through without body
            const nullBodyStatuses = [101, 204, 205, 304];
            if (nullBodyStatuses.includes(response.status)) {
                return new Response(null, {
                    status: response.status,
                    headers: response.headers,
                });
            }

            const contentType = response.headers.get('content-type') || '';

            // If it's HTML, inject the Awel host script
            if (contentType.includes('text/html')) {
                let html = await response.text();

                // Inject project CWD (for source-map resolution) and the host script
                const cwdScript = projectCwd