chore(core): update createRivetKit to accept a client options (#1392)

Author: NathanFlurry

examples/ai-agent/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useState } from "react";
 import type { Message, registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 export function App() {
 	const aiAgent = useActor({
@@ -77,4 +76,4 @@ export function App() {
 			</div>
 		</div>
 	);
-}
+}

examples/better-auth-external-db/src/frontend/components/ChatRoom.tsx

@@ -1,11 +1,9 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useState } from "react";
 import type { registry } from "../../backend/registry";
 import { authClient } from "../auth-client";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 interface ChatRoomProps {
 	user: { id: string; email: string };

examples/chat-room/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useState } from "react";
 import type { Message, registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:6420");
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:6420");
 
 export function App() {
 	const [roomId, setRoomId] = useState("general");

examples/crdt/src/frontend/App.tsx

@@ -1,11 +1,10 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useRef, useState } from "react";
 import * as Y from "yjs";
 import { applyUpdate, encodeStateAsUpdate } from "yjs";
 import type { registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 function YjsEditor({ documentId }: { documentId: string }) {
 	const yjsDocument = useActor({
@@ -192,4 +191,4 @@ function bufferToBase64(buffer: Uint8Array): string {
 		binary += String.fromCharCode(buffer[i]);
 	}
 	return btoa(binary);
-}
+}

examples/database/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useState } from "react";
 import type { Note, registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 function NotesApp({ userId }: { userId: string }) {
 	const [notes, setNotes] = useState<Note[]>([]);
@@ -199,4 +198,4 @@ export function App() {
 			<NotesApp key={selectedUser} userId={selectedUser} />
 		</div>
 	);
-}
+}

examples/freestyle/src/frontend/App.tsx

@@ -1,13 +1,12 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useState } from "react";
 import type { Message, registry } from "../backend/registry";
 
-const client = createClient<typeof registry>({
+const { useActor } = createRivetKit<typeof registry>({
 	endpoint: import.meta.env.VITE_RIVET_ENDPOINT ?? "http://localhost:8080/api",
 	namespace: import.meta.env.VITE_RIVET_NAMESPACE,
 	runnerName: import.meta.env.VITE_RIVET_RUNNER_NAME ?? "freestyle-runner",
 });
-const { useActor } = createRivetKit(client);
 
 export function App() {
 	const [roomId, setRoomId] = useState("general");

examples/game/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useEffect, useRef, useState } from "react";
 import type { Player, registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-const { useActor } = createRivetKit(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 export function App() {
 	const [players, setPlayers] = useState<Player[]>([]);
@@ -200,4 +199,4 @@ export function App() {
 			</div>
 		</div>
 	);
-}
+}

examples/hono-bun/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useState } from "react";
 import type { registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080/rivet");
-const { useActor } = createRivetKit<typeof registry>(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080/rivet");
 
 function App() {
 	const [count, setCount] = useState(0);

examples/hono-react/src/frontend/App.tsx

@@ -1,9 +1,8 @@
-import { createClient, createRivetKit } from "@rivetkit/react";
+import { createRivetKit } from "@rivetkit/react";
 import { useState } from "react";
 import type { registry } from "../backend/registry";
 
-const client = createClient<typeof registry>("http://localhost:8080");
-const { useActor } = createRivetKit<typeof registry>(client);
+const { useActor } = createRivetKit<typeof registry>("http://localhost:8080");
 
 function App() {
 	const [count, setCount] = useState(0);

examples/next-js/src/components/Counter.tsx

@@ -1,8 +1,14 @@
 "use client";
+
+import { createRivetKit } from "@rivetkit/next-js/client";
+import type { registry } from "@/rivet/registry";
 import { useState } from "react";
-import { useActor } from "@/lib/rivet-client";
 import styles from "./Counter.module.css";
 
+export const { useActor } = createRivetKit<typeof registry>(
+	process.env.NEXT_RIVET_ENDPOINT ?? "http://localhost:3000/api/rivet",
+);
+
 export function Counter() {
 	const [count, setCount] = useState(0);
 	const [counterName, setCounterName] = useState("test-counter");