20237133797

Committed 15 Dec 2025 03:10PM UTC coverage: 79.68% (-0.4%) from 80.089%

Build # 20237133797

Build Type

Pull #783

github

Committed by

web-flow

Commit Message

Merge 8aebebbbf into cced0c7fe

Pull Request Pull Request #783: feat: implement MCP-UI support

Run Details

1471 of 1927 branches covered (76.34%)

Branch coverage included in aggregate %.

57 of 238 new or added lines in 13 files covered. (23.95%)

26 existing lines in 1 file now uncovered.

6744 of 8383 relevant lines covered (80.45%)

84.67 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/ui/hooks/useRenderData.ts

import { useEffect, useState } from "react";

/** Expected structure of the postMessage data from parent window */
interface RenderDataMessage {
    type: string;
    payload?: {
        renderData?: unknown;
    };
}

/** Return type for the useRenderData hook */
interface UseRenderDataResult<T> {
    data: T | null;
    isLoading: boolean;
    error: string | null;
}

/**
 * Hook for receiving render data from parent window via postMessage
 * This is used by iframe-based UI components that receive data from an MCP client
 *
 * @template T - The type of data expected in the renderData payload
 * @returns An object containing:
 *   - data: The received render data (or null if not yet received)
 *   - isLoading: Whether data is still being loaded
 *   - error: Error message if message validation failed
 *
 * @example
 * ```tsx
 * interface MyData {
 *   items: string[];
 * }
 *
 * function MyComponent() {
 *   const { data, isLoading, error } = useRenderData<MyData>();
 *   // ...
 * }
 * ```
 */
export function useRenderData<T = unknown>(): UseRenderDataResult<T> {
    const [data, setData] = useState<T | null>(null);
    const [isLoading, setIsLoading] = useState(true);
    const [error, setError] = useState<string | null>(null);

    useEffect(() => {
        const handleMessage = (event: MessageEvent<RenderDataMessage>): void => {
            if (event.data?.type !== "ui-lifecycle-iframe-render-data") {
                // Silently ignore messages that aren't for us
                return;
            }

            if (!event.data.payload || typeof event.data.payload !== "object") {
                const errorMsg = "Invalid payload structure received";
                setError(errorMsg);
                setIsLoading(false);
                return;
            }

            const renderData = event.data.payload.renderData;

            if (renderData === undefined || renderData === null) {
                setIsLoading(false);
                // Not an error - parent may intentionally send null
                return;
            }

            if (typeof renderData !== "object") {
                const errorMsg = `Expected object but received ${typeof renderData}`;
                setError(errorMsg);
                setIsLoading(false);
                return;
            }

            setData(renderData as T);
            setIsLoading(false);
            setError(null);
        };

        window.addEventListener("message", handleMessage);
        window.parent.postMessage({ type: "ui-lifecycle-iframe-ready" }, "*");

        return (): void => {
            window.removeEventListener("message", handleMessage);
        };
    }, []);

    return {
        data,
        isLoading,
        error,
    };
}

NEW 1	import { useEffect, useState } from "react";	×
2
3	/** Expected structure of the postMessage data from parent window */
4	interface RenderDataMessage {
5	type: string;
6	payload?: {
7	renderData?: unknown;
8	};
9	}
10
11	/** Return type for the useRenderData hook */
12	interface UseRenderDataResult<T> {
13	data: T \| null;
14	isLoading: boolean;
15	error: string \| null;
16	}
17
18	/**
19	* Hook for receiving render data from parent window via postMessage
20	* This is used by iframe-based UI components that receive data from an MCP client
21	*
22	* @template T - The type of data expected in the renderData payload
23	* @returns An object containing:
24	* - data: The received render data (or null if not yet received)
25	* - isLoading: Whether data is still being loaded
26	* - error: Error message if message validation failed
27	*
28	* @example
29	* ```tsx
30	* interface MyData {
31	* items: string[];
32	* }
33	*
34	* function MyComponent() {
35	* const { data, isLoading, error } = useRenderData<MyData>();
36	* // ...
37	* }
38	* ```
39	*/
NEW 40	export function useRenderData<T = unknown>(): UseRenderDataResult<T> {	×
NEW 41	const [data, setData] = useState<T \| null>(null);	×
NEW 42	const [isLoading, setIsLoading] = useState(true);	×
NEW 43	const [error, setError] = useState<string \| null>(null);	×
44
NEW 45	useEffect(() => {	×
NEW 46	const handleMessage = (event: MessageEvent<RenderDataMessage>): void => {	×
NEW 47	if (event.data?.type !== "ui-lifecycle-iframe-render-data") {	×
48	// Silently ignore messages that aren't for us
NEW 49	return;	×
NEW 50	}	×
51
NEW 52	if (!event.data.payload \|\| typeof event.data.payload !== "object") {	×
NEW 53	const errorMsg = "Invalid payload structure received";	×
NEW 54	setError(errorMsg);	×
NEW 55	setIsLoading(false);	×
NEW 56	return;	×
NEW 57	}	×
58
NEW 59	const renderData = event.data.payload.renderData;	×
60
NEW 61	if (renderData === undefined \|\| renderData === null) {	×
NEW 62	setIsLoading(false);	×
63	// Not an error - parent may intentionally send null
NEW 64	return;	×
NEW 65	}	×
66
NEW 67	if (typeof renderData !== "object") {	×
NEW 68	const errorMsg = `Expected object but received ${typeof renderData}`;	×
NEW 69	setError(errorMsg);	×
NEW 70	setIsLoading(false);	×
NEW 71	return;	×
NEW 72	}	×
73
NEW 74	setData(renderData as T);	×
NEW 75	setIsLoading(false);	×
NEW 76	setError(null);	×
NEW 77	};	×
78
NEW 79	window.addEventListener("message", handleMessage);	×
NEW 80	window.parent.postMessage({ type: "ui-lifecycle-iframe-ready" }, "*");	×
81
NEW 82	return (): void => {	×
NEW 83	window.removeEventListener("message", handleMessage);	×
NEW 84	};	×
NEW 85	}, []);	×
86
NEW 87	return {	×
NEW 88	data,	×
NEW 89	isLoading,	×
NEW 90	error,	×
NEW 91	};	×
NEW 92	}	×

mongodb-js / mongodb-mcp-server / 20237133797

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous