feat(docs): report demo reliability events to the Thesys console

docs/README.md

@@ -45,6 +45,21 @@ a shared, cross-instance session-and-IP rate limiter, Cloud organization budgets
 an approved conversation retention/deletion process are in place. Same-origin validation is an
 additional browser safeguard, not a substitute for those cost controls.
 
+### Demo reliability monitoring
+
+The site demos (`/demos`, `/demo/github`, `/chat`, `/compare`) mount
+`components/reliability-observability.tsx`, which forwards OpenUI render events to the [Reliability
+dashboard](https://console.thesys.dev/reliability) through `@openuidev/observability-cloud`. It only
+initializes when a client API key from the [Thesys
+Console](https://console.thesys.dev/client-api-keys) is set:
+
+```bash
+NEXT_PUBLIC_THESYS_CLIENT_API_KEY=pk-th-...
+```
+
+Without the variable nothing is initialized and no events leave the browser, so local development
+needs no extra setup. The key is a publishable client key; do not use `THESYS_API_KEY` here.
+
 ## Project structure
 
 ```

docs/app/chat/layout.tsx

@@ -1,10 +1,12 @@
+import { ReliabilityObservability } from "@/components/reliability-observability";
 import { WebsiteThemeProvider } from "@/components/website-theme-provider";
 import type { ReactNode } from "react";
 import { ChatPageClient } from "./_components/chat-page-client";
 
 export default function ChatLayout({ children }: { children: ReactNode }) {
   return (
     <WebsiteThemeProvider>
+      <ReliabilityObservability />
       <ChatPageClient />
       {children}
     </WebsiteThemeProvider>

docs/app/compare/layout.tsx

@@ -1,6 +1,12 @@
+import { ReliabilityObservability } from "@/components/reliability-observability";
 import { WebsiteThemeProvider } from "@/components/website-theme-provider";
 import type { ReactNode } from "react";
 
 export default function CompareLayout({ children }: { children: ReactNode }) {
-  return <WebsiteThemeProvider>{children}</WebsiteThemeProvider>;
+  return (
+    <WebsiteThemeProvider>
+      <ReliabilityObservability />
+      {children}
+    </WebsiteThemeProvider>
+  );
 }

docs/app/demo/github/layout.tsx

@@ -1,3 +1,4 @@
+import { ReliabilityObservability } from "@/components/reliability-observability";
 import { WebsiteThemeProvider } from "@/components/website-theme-provider";
 import { createPageMetadata } from "@/lib/page-metadata";
 import type { ReactNode } from "react";
@@ -12,5 +13,10 @@ export const metadata = createPageMetadata({
 });
 
 export default function DemoGitHubLayout({ children }: { children: ReactNode }) {
-  return <WebsiteThemeProvider>{children}</WebsiteThemeProvider>;
+  return (
+    <WebsiteThemeProvider>
+      <ReliabilityObservability />
+      {children}
+    </WebsiteThemeProvider>
+  );
 }

docs/app/demos/layout.tsx

@@ -1,3 +1,4 @@
+import { ReliabilityObservability } from "@/components/reliability-observability";
 import { WebsiteThemeProvider } from "@/components/website-theme-provider";
 import { createPageMetadata } from "@/lib/page-metadata";
 import type { ReactNode } from "react";
@@ -12,5 +13,10 @@ export const metadata = createPageMetadata({
 });
 
 export default function DemosLayout({ children }: { children: ReactNode }) {
-  return <WebsiteThemeProvider>{children}</WebsiteThemeProvider>;
+  return (
+    <WebsiteThemeProvider>
+      <ReliabilityObservability />
+      {children}
+    </WebsiteThemeProvider>
+  );
 }

docs/components/reliability-observability.tsx

@@ -0,0 +1,26 @@
+"use client";
+
+import * as Observability from "@openuidev/observability-cloud";
+import { useEffect } from "react";
+
+let initialized = false;
+
+/**
+ * Reports OpenUI render events from the site demos to the Thesys reliability
+ * dashboard (console.thesys.dev/reliability). Stays inert until
+ * NEXT_PUBLIC_THESYS_CLIENT_API_KEY is set to a client API key from
+ * console.thesys.dev/client-api-keys.
+ */
+export function ReliabilityObservability() {
+  useEffect(() => {
+    if (initialized) return;
+
+    const apiKey = process.env.NEXT_PUBLIC_THESYS_CLIENT_API_KEY?.trim();
+    if (!apiKey) return;
+
+    initialized = true;
+    Observability.init({ apiKey });
+  }, []);
+
+  return null;
+}

docs/package.json

@@ -20,6 +20,7 @@
   "dependencies": {
     "@openuidev/cli": "workspace:*",
     "@openuidev/lang-core": "workspace:^",
+    "@openuidev/observability-cloud": "workspace:^",
     "@openuidev/react-headless": "workspace:^",
     "@openuidev/react-lang": "workspace:^",
     "@openuidev/react-ui": "workspace:^",