File size: 1,755 Bytes
efc9173 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 |
"use client";
import React, { useState } from "react";
import { useDaily } from "@daily-co/daily-react";
import Setup from "./Setup";
import Story from "./Story";
type State =
| "idle"
| "connecting"
| "connected"
| "started"
| "finished"
| "error";
export default function Call() {
const daily = useDaily();
const [state, setState] = useState<State>("idle");
const [room, setRoom] = useState<string | null>(null);
async function start() {
setState("connecting");
if (!daily) return;
// Create a new room for the story session
try {
const response = await fetch("/start_bot", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
});
const { room_url, token } = await response.json();
// Keep a reference to the room url for later
setRoom(room_url);
// Join the WebRTC session
await daily.join({
url: room_url,
token,
videoSource: false,
startAudioOff: true,
});
setState("connected");
// Disable local audio, the bot will say hello first
daily.setLocalAudio(false);
setState("started");
} catch (error) {
setState("error");
}
}
async function leave() {
await daily?.leave();
setState("finished");
}
if (state === "error") {
return (
<div className="flex items-center mx-auto">
<p className="text-red-500 font-semibold bg-white px-4 py-2 shadow-xl rounded-lg">
This demo is currently at capacity. Please try again later.
</p>
</div>
);
}
if (state === "started") {
return <Story handleLeave={() => leave()} />;
}
return <Setup handleStart={() => start()} />;
}
|