Voice Calls

pnpm install @tixae-labs/web-sdk@latest

npm install @tixae-labs/web-sdk@latest

"use client";
import React from "react";
import { WebCall } from "@tixae-labs/web-sdk";

const VoiceCallPage = () => {
  const [voiceState, setVoiceState] = React.useState<WebCall | null>(null);

  async function initVoice() {
    const voice = new WebCall();
    console.log("Starting voice call...");

    await voice.init({
      agentId: "", // Replace with a valid agentId from your TIXAE Dashboard URL (e.g., "enit5lczmqbz1s7d")
      region: "",  // Replace with a valid region (e.g., "eu" or "na")
    });

    // Set up event listeners
    voice.on("call-start", () => {
      console.log("Call has started...");
    });

    voice.on("final_transcript", (data) => {
      console.log("Transcript:", data);
    });

    voice.on("conversation-update", (data) => {
      console.log("Conversation update:", data);
    });

    voice.on("call-ended", () => {
      console.log("Call ended");
    });

    voice.on("error", (data) => {
      console.error("Call error:", data);
    });

    setVoiceState(voice);
  }

  React.useEffect(() => {
    initVoice();
  }, []);

  return (
    <div className="min-h-screen flex justify-center items-center">
      <button onClick={() => voiceState?.startCall()}>
        Start Call
      </button>
      <button onClick={() => voiceState?.endCall()}>
        End Call
      </button>
    </div>
  );
};

export default VoiceCallPage;

voice.on("call-start", () => {
      console.log(`call has started..`);
});

voice.on("call-ended", () => {
    console.log(`call-ended`);
});

voice.on("final_transcript", (data) => {
    console.log(`data`, data);
});

voice.on("conversation-update", (data) => {
    console.log(`conversation-update`, data);
});

voice.on("error", (data) => {
    console.log(`error`, data);
});