feat(example): wire tool-cancelled and teardown in basic-host

Update basic-host example to properly use the new notifications:

- Send sendToolCancelled when tool call promise rejects
- Send sendResourceTeardown when React component unmounts
- Store appBridge ref for cleanup access

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: ochafik

examples/basic-host/src/implementation.ts

@@ -186,11 +186,19 @@ export async function initializeApp(
   log.info("Sending tool call input to MCP App:", input);
   appBridge.sendToolInput({ arguments: input });
 
-  // Schedule tool call result to be sent to MCP App
-  resultPromise.then((result) => {
-    log.info("Sending tool call result to MCP App:", result);
-    appBridge.sendToolResult(result);
-  });
+  // Schedule tool call result (or cancellation) to be sent to MCP App
+  resultPromise.then(
+    (result) => {
+      log.info("Sending tool call result to MCP App:", result);
+      appBridge.sendToolResult(result);
+    },
+    (error) => {
+      log.error("Tool call failed, sending cancellation to MCP App:", error);
+      appBridge.sendToolCancelled({
+        reason: error instanceof Error ? error.message : String(error),
+      });
+    },
+  );
 }
 
 /**

examples/basic-host/src/index.tsx

@@ -176,6 +176,7 @@ interface AppIFramePanelProps {
 }
 function AppIFramePanel({ toolCallInfo }: AppIFramePanelProps) {
   const iframeRef = useRef<HTMLIFrameElement | null>(null);
+  const appBridgeRef = useRef<ReturnType<typeof newAppBridge> | null>(null);
 
   useEffect(() => {
     const iframe = iframeRef.current!;
@@ -186,9 +187,20 @@ function AppIFramePanel({ toolCallInfo }: AppIFramePanelProps) {
       // `toolCallInfo`.
       if (firstTime) {
         const appBridge = newAppBridge(toolCallInfo.serverInfo, iframe);
+        appBridgeRef.current = appBridge;
         initializeApp(iframe, appBridge, toolCallInfo);
       }
     });
+
+    // Cleanup: send teardown notification before unmounting
+    return () => {
+      if (appBridgeRef.current) {
+        log.info("Sending teardown notification to MCP App");
+        appBridgeRef.current.sendResourceTeardown({}).catch((err) => {
+          log.warn("Teardown request failed (app may have already closed):", err);
+        });
+      }
+    };
   }, [toolCallInfo]);
 
   return (