Updated all examples with clients to use the new PipecatClient

examples/word-wrangler-gemini-live/client/src/providers/PipecatProvider.tsx

@@ -0,0 +1,43 @@
+'use client';
+
+import { PipecatClient } from '@pipecat-ai/client-js';
+import { DailyTransport } from '@pipecat-ai/daily-transport';
+import { PipecatClientProvider } from '@pipecat-ai/client-react';
+import { PropsWithChildren, useEffect, useState, useRef } from 'react';
+
+export function PipecatProvider({ children }: PropsWithChildren) {
+  const [client, setClient] = useState<PipecatClient | null>(null);
+  const clientCreated = useRef(false);
+
+  useEffect(() => {
+    // Only create the client once
+    if (clientCreated.current) return;
+
+    const pcClient = new PipecatClient({
+      transport: new DailyTransport(),
+      enableMic: true,
+      enableCam: false,
+    });
+
+    setClient(pcClient);
+    clientCreated.current = true;
+
+    // Cleanup when component unmounts
+    return () => {
+      if (pcClient) {
+        pcClient.disconnect().catch((err) => {
+          console.error('Error disconnecting client:', err);
+        });
+      }
+      clientCreated.current = false;
+    };
+  }, []);
+
+  if (!client) {
+    return null;
+  }
+
+  return (
+    <PipecatClientProvider client={client}>{children}</PipecatClientProvider>
+  );
+}

examples/word-wrangler-gemini-live/client/src/providers/RTVIProvider.tsx

@@ -1,72 +0,0 @@
-"use client";
-
-import { RTVIClient } from "@pipecat-ai/client-js";
-import { DailyTransport } from "@pipecat-ai/daily-transport";
-import { RTVIClientProvider } from "@pipecat-ai/client-react";
-import { PropsWithChildren, useEffect, useState, useRef } from "react";
-import { useConfigurationSettings } from "@/contexts/Configuration";
-
-// Get the API base URL from environment variables
-// Default to "/api" if not specified
-// "/api" is the default for Next.js API routes and used
-// for the Pipecat Cloud deployed agent
-const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || "/api";
-
-console.log("Using API base URL:", API_BASE_URL);
-
-export function RTVIProvider({ children }: PropsWithChildren) {
-  const [client, setClient] = useState<RTVIClient | null>(null);
-  const config = useConfigurationSettings();
-  const clientCreated = useRef(false);
-
-  useEffect(() => {
-    // Only create the client once
-    if (clientCreated.current) return;
-
-    const transport = new DailyTransport();
-
-    const rtviClient = new RTVIClient({
-      transport,
-      params: {
-        baseUrl: API_BASE_URL,
-        endpoints: {
-          connect: "/connect",
-        },
-        requestData: {
-          personality: config.personality,
-        },
-      },
-      enableMic: true,
-      enableCam: false,
-    });
-
-    setClient(rtviClient);
-    clientCreated.current = true;
-
-    // Cleanup when component unmounts
-    return () => {
-      if (rtviClient) {
-        rtviClient.disconnect().catch((err) => {
-          console.error("Error disconnecting client:", err);
-        });
-      }
-      clientCreated.current = false;
-    };
-  }, []);
-
-  // Update the connectParams when config changes
-  useEffect(() => {
-    if (!client) return;
-
-    // Update the connect params without recreating the client
-    client.params.requestData = {
-      personality: config.personality,
-    };
-  }, [client, config.personality]);
-
-  if (!client) {
-    return null;
-  }
-
-  return <RTVIClientProvider client={client}>{children}</RTVIClientProvider>;
-}