{
  "jsonrpc": "2.0",
  "id": 1,
  "result": {
    "tools": [
      {
        "name": "render_order_status_card",
        "description": "Renders an interactive real-time order tracking card with action buttons.",
        "inputSchema": {
          "type": "object",
          "properties": {
            "orderId": { "type": "string", "description": "Unique UUID of the order" },
            "status": { 
              "type": "string", 
              "enum": ["pending", "processing", "shipped", "delivered", "cancelled"] 
            },
            "carrier": { "type": "string" },
            "trackingNumber": { "type": "string" },
            "estimatedDelivery": { "type": "string", "format": "date-time" },
            "allowedActions": {
              "type": "array",
              "items": { "type": "string", "enum": ["cancel", "expedite", "return"] }
            }
          },
          "required": ["orderId", "status", "allowedActions"]
        }
      }
    ]
  }
}

// File: cmd/mcp-ui-server/main.go
package main

import (
	"bufio"
	"context"
	"encoding/json"
	"fmt"
	"io"
	"os"
	"os/signal"
	"syscall"
)

// JSONRPCRequest models an incoming MCP JSON-RPC 2.0 request.
type JSONRPCRequest struct {
	JSONRPC string          `json:"jsonrpc"`
	ID      interface{}     `json:"id"`
	Method  string          `json:"method"`
	Params  json.RawMessage `json:"params,omitempty"`
}

// JSONRPCResponse models an outgoing MCP JSON-RPC 2.0 response.
type JSONRPCResponse struct {
	JSONRPC string      `json:"jsonrpc"`
	ID      interface{} `json:"id"`
	Result  interface{} `json:"result,omitempty"`
	Error   *RPCError   `json:"error,omitempty"`
}

type RPCError struct {
	Code    int    `json:"code"`
	Message string `json:"message"`
}

// ToolDescriptor defines an MCP tool contract.
type ToolDescriptor struct {
	Name        string      `json:"name"`
	Description string      `json:"description"`
	InputSchema interface{} `json:"inputSchema"`
}

func main() {
	ctx, cancel := signal.NotifyContext(context.Background(), os.Interrupt, syscall.SIGTERM)
	defer cancel()

	reader := bufio.NewReader(os.Stdin)
	writer := bufio.NewWriter(os.Stdout)

	for {
		select {
		case <-ctx.Done():
			return
		default:
			line, err := reader.ReadBytes('\n')
			if err != nil {
				if err == io.EOF {
					return
				}
				continue
			}

			var req JSONRPCRequest
			if err := json.Unmarshal(line, &req); err != nil {
				sendError(writer, nil, -32700, "Parse error")
				continue
			}

			handleRequest(writer, &req)
		}
	}
}

func handleRequest(w *bufio.Writer, req *JSONRPCRequest) {
	switch req.Method {
	case "initialize":
		sendResponse(w, req.ID, map[string]interface{}{
			"protocolVersion": "2024-11-05",
			"capabilities":    map[string]interface{}{"tools": map[string]bool{"listChanged": true}},
			"serverInfo":      map[string]string{"name": "generative-ui-server", "version": "1.0.0"},
		})

	case "tools/list":
		sendResponse(w, req.ID, map[string]interface{}{
			"tools": []ToolDescriptor{
				{
					Name:        "render_order_status_card",
					Description: "Renders an interactive real-time order tracking card with action buttons.",
					InputSchema: map[string]interface{}{
						"type": "object",
						"properties": map[string]interface{}{
							"orderId":        map[string]string{"type": "string"},
							"status":         map[string]interface{}{"type": "string", "enum": []string{"shipped", "delivered"}},
							"trackingNumber": map[string]string{"type": "string"},
							"allowedActions": map[string]interface{}{"type": "array", "items": map[string]string{"type": "string"}},
						},
						"required": []string{"orderId", "status", "allowedActions"},
					},
				},
			},
		})

	case "tools/call":
		var callParams struct {
			Name      string          `json:"name"`
			Arguments json.RawMessage `json:"arguments"`
		}
		if err := json.Unmarshal(req.Params, &callParams); err != nil {
			sendError(w, req.ID, -32602, "Invalid params")
			return
		}

		if callParams.Name == "render_order_status_card" {
			// Returns UI component spec encapsulated in MCP content blocks
			sendResponse(w, req.ID, map[string]interface{}{
				"content": []map[string]interface{}{
					{
						"type": "text",
						"text": fmt.Sprintf("UI_COMPONENT_SPEC:%s", string(callParams.Arguments)),
					},
				},
			})
			return
		}

		sendError(w, req.ID, -32601, "Tool not found")
	}
}

func sendResponse(w *bufio.Writer, id interface{}, result interface{}) {
	resp := JSONRPCResponse{JSONRPC: "2.0", ID: id, Result: result}
	data, _ := json.Marshal(resp)
	w.Write(data)
	w.WriteByte('\n')
	w.Flush()
}

func sendError(w *bufio.Writer, id interface{}, code int, message string) {
	resp := JSONRPCResponse{JSONRPC: "2.0", ID: id, Error: &RPCError{Code: code, Message: message}}
	data, _ := json.Marshal(resp)
	w.Write(data)
	w.WriteByte('\n')
	w.Flush()
}

// hooks/useMcpGenerativeUI.ts
import { useState, useCallback } from "react";
import { componentRegistry } from "@/lib/mcp/registry";

export interface GenerativeUIMessage {
  id: string;
  role: "user" | "assistant" | "system";
  content: string;
  uiComponent?: {
    name: string;
    props: Record<string, unknown>;
  };
}

export function useMcpGenerativeUI() {
  const [messages, setMessages] = useState<GenerativeUIMessage[]>([]);
  const [isStreaming, setIsStreaming] = useState<boolean>(false);

  const sendMessage = useCallback(async (prompt: string) => {
    setIsStreaming(true);
    const userMsg: GenerativeUIMessage = { id: crypto.randomUUID(), role: "user", content: prompt };
    setMessages((prev) => [...prev, userMsg]);

    const assistantMsgId = crypto.randomUUID();
    setMessages((prev) => [...prev, { id: assistantMsgId, role: "assistant", content: "" }]);

    try {
      const response = await fetch("/api/agent/stream", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ prompt }),
      });

      if (!response.body) throw new Error("Null response body");

      const reader = response.body.getReader();
      const decoder = new TextDecoder();
      let buffer = "";

      while (true) {
        const { done, value } = await reader.read();
        if (done) break;

        buffer += decoder.decode(value, { stream: true });
        const lines = buffer.split("\n\n");
        buffer = lines.pop() || "";

        for (const line of lines) {
          if (!line.startsWith("data: ")) continue;
          const payload = JSON.parse(line.replace("data: ", ""));

          if (payload.type === "text_chunk") {
            setMessages((prev) =>
              prev.map((msg) =>
                msg.id === assistantMsgId ? { ...msg, content: msg.content + payload.text } : msg
              )
            );
          } else if (payload.type === "ui_tool_call") {
            // Validate component against registry
            const validatedProps = componentRegistry.validate(payload.componentName, payload.props);
            if (validatedProps) {
              setMessages((prev) =>
                prev.map((msg) =>
                  msg.id === assistantMsgId
                    ? {
                        ...msg,
                        uiComponent: {
                          name: payload.componentName,
                          props: validatedProps,
                        },
                      }
                    : msg
                )
              );
            }
          }
        }
      }
    } finally {
      setIsStreaming(false);
    }
  }, []);

  return { messages, isStreaming, sendMessage };
}

// lib/mcp/registry.ts
import React from "react";
import { z } from "zod";

export const OrderStatusCardSchema = z.object({
  orderId: z.string().min(1),
  status: z.enum(["pending", "processing", "shipped", "delivered", "cancelled"]),
  trackingNumber: z.string().optional(),
  estimatedDelivery: z.string().optional(),
  allowedActions: z.array(z.enum(["cancel", "expedite", "return"])).default([]),
});

export type OrderStatusCardProps = z.infer<typeof OrderStatusCardSchema>;

export interface ComponentEntry<T = any> {
  name: string;
  schema: z.ZodSchema<T>;
  component: React.ComponentType<T>;
  requiredRole?: string;
}

class ComponentRegistry {
  private registry = new Map<string, ComponentEntry>();

  register<T>(entry: ComponentEntry<T>) {
    this.registry.set(entry.name, entry);
  }

  validate(name: string, rawProps: unknown): Record<string, unknown> | null {
    const entry = this.registry.get(name);
    if (!entry) {
      console.warn(`[ComponentRegistry] Unknown component requested: ${name}`);
      return null;
    }

    const parseResult = entry.schema.safeParse(rawProps);
    if (!parseResult.success) {
      console.error(`[ComponentRegistry] Schema validation failed for ${name}:`, parseResult.error.format());
      return null;
    }

    return parseResult.data;
  }

  getComponent(name: string): React.ComponentType<any> | null {
    return this.registry.get(name)?.component || null;
  }
}

export const componentRegistry = new ComponentRegistry();

// components/mcp/OrderStatusCard.tsx
import React, { useState } from "react";
import { OrderStatusCardProps } from "@/lib/mcp/registry";

interface Props extends OrderStatusCardProps {
  onAction?: (actionName: string, payload: Record<string, unknown>) => Promise<void>;
}

export const OrderStatusCard: React.FC<Props> = ({ orderId, status, allowedActions, onAction }) => {
  const [loading, setLoading] = useState(false);

  const handleAction = async (action: string) => {
    if (!onAction) return;
    setLoading(true);
    try {
      await onAction(action, { orderId, timestamp: new Date().toISOString() });
    } finally {
      setLoading(false);
    }
  };

  return (
    <div className="rounded-xl border border-slate-700 bg-slate-900 p-5 shadow-lg">
      <div className="flex items-center justify-between">
        <h4 className="text-lg font-semibold text-white">Order #{orderId}</h4>
        <span className="rounded-full bg-blue-500/20 px-3 py-1 text-xs font-medium text-blue-400">
          {status.toUpperCase()}
        </span>
      </div>
      <div className="mt-4 flex gap-2">
        {allowedActions.map((action) => (
          <button
            key={action}
            disabled={loading}
            onClick={() => handleAction(action)}
            className="rounded-lg bg-emerald-600 px-4 py-2 text-sm font-medium text-white hover:bg-emerald-500 disabled:opacity-50"
          >
            {loading ? "Processing..." : action.toUpperCase()}
          </button>
        ))}
      </div>
    </div>
  );
};

<!-- Secure Iframe Sandboxing Sandbox -->
<iframe
  src="https://sandbox.yourdomain.com/embed"
  sandbox="allow-scripts"
  referrerpolicy="no-referrer"
  csp="default-src 'none'; script-src 'self'; style-src 'unsafe-inline';"
/>