@fishaudio/agent-react

React hooks and components for Fish Audio voice agents, built on @fishaudio/agent-client.

Installation

npm install @fishaudio/agent-react

Requires React 18+.

Quickstart

"use client";

import { useConversation } from "@fishaudio/agent-react";

export function VoiceWidget() {
  const conversation = useConversation();

  const start = async () => {
    const sessionToken = await fetch("/api/voice-session", { method: "POST" }).then((r) => r.json());
    await conversation.startSession({ sessionToken });
  };

  return conversation.status === "connected" ? (
    <button onClick={() => conversation.endSession()}>
      End call{conversation.isSpeaking ? " · speaking" : ""}
    </button>
  ) : (
    <button onClick={start}>Start call</button>
  );
}

The hook ends the session automatically when the component unmounts. Start calls made from the required user interaction path are safe under React StrictMode's effect replay.

Documentation

• React overview — quickstart, Next.js.
• useConversation — session lifecycle as a hook.
• Provider — share one conversation across a component tree.
• useAgentMessages — build a streaming chat UI.
• Audio visualization — useAudioLevels and <AgentAudioVisualizer />.

Authentication, events, client tools, and errors are documented with the client SDK — everything there applies here.