Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update eleven-labs setup README.md #35

Closed
wants to merge 1 commit into from
Closed

Update eleven-labs setup README.md #35

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 20 additions & 5 deletions typescript/examples/eleven-labs/conversational-agent/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

This example uses the ElevenLabs base project described [here](https://elevenlabs.io/docs/conversational-ai/guides/conversational-ai-guide-nextjs) and follows the steps to add client tool calling described [here](https://elevenlabs.io/docs/conversational-ai/customization/client-tools).

https://github.com/user-attachments/assets/67c7f2d2-0b6a-4e0a-b24b-423e35a94c69
https://github.com/user-attachments/assets/2a53b2af-eefe-46c7-a3d4-9441eefe0f81

Comment on lines 3 to 6
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Id explain what we're building. This is describing more how we build it, which is harder to parse

Sometihng on the lines of

This example builds a conversational agent with ElevenLabs, that can query the balance in your wallet and recommend you which tokens to buy, with some special touch ✨

It is built on top of the ElevenLabs base project, and implements both functionalities using tool calling.

## Setup

Expand All @@ -11,12 +11,15 @@ https://github.com/user-attachments/assets/67c7f2d2-0b6a-4e0a-b24b-423e35a94c69
```
cp .example.env .env
```
`NEXT_PUBLIC_ELEVEN_LABS_AGENT_ID` - create an agent [here](https://elevenlabs.io/app/conversational-ai), and copy agent ID
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i didnt go through this, just double checking that we dont need to enable any special configs or anything

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nope just make an agent and copy the ID


2. Create an ElevenLabs agent and get the agent ID. You can follow this guide: https://elevenlabs.io/docs/conversational-ai/docs/agent-setup
`NEXT_PUBLIC_SEPOLIA_RPC_URL` - create your first app on [Alchemy](https://dashboard.alchemy.com/apps), and go to the Networks tab to copy Ethereum Sepolia API key

3. Set the `NEXT_PUBLIC_ELEVEN_LABS_AGENT_ID` environment variable with the agent ID.
`NEXT_PUBLIC_COINGECKO_API_KEY` - create your demo account API key on the Coingecko developer [dashboard](https://www.coingecko.com/en/developers/dashboard)

4. ElevenLabs requires you to register each tool manually through the ElevenLabs dashboard. To make it easier, we've added a `logTools` option to the `getOnChainTools` function. This will log the tools with their respective descriptions and parameters to the console.
2. Run `pnpm install` on the root directory (/goat). Then, go to the /conversational-agent directory to run `pnpm install && build`. After a successful build, run the app with `pnpm dev`, connect your wallet, and start the conversation!
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it's better to just put this as commands they can copy paste

Also, the first oen is incorrect, they need to be in the typescript/ folder, and they need to do pnpm i && pnpm build


**Note**: ElevenLabs requires you to register each tool manually through the ElevenLabs dashboard. To make it easier, we've added a `logTools` option to the `getOnChainTools` function. This will log the tools with their respective descriptions and parameters to the console.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would not describe this as a note. I would make this step 3: Install tools in ElevenLabs console.

Also, in step 2, i would remove "run the app with pnpm dev, connect your wallet, and start the conversation!" as it wont work, until they do step 3, right?

Instead:

  • step 3 could say "run pnpm dev and copy this output... blah"
  • we can add a step 4 which is to actually run the agent, which says "run the app with pnpm dev, connect your wallet, and start the conversation!"

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

but if they dont run the app, they cant see the tools logged


```typescript
const tools = await getOnChainTools({
Expand All @@ -26,5 +29,17 @@ const tools = await getOnChainTools({
},
});
```
When you load the site, the console logs each tool that is called, which you would need to add into your agent's dashboard as a `client tool`. The logs will look something like this:

```
get_eth_balance

Description: This tool returns the ETH balance of an EVM wallet.

Parameters:

- address (optional) (string): The address to get the balance of, defaults to the address of the wallet
```
Add it in the Eleven Labs Agent console like so:

5. Run the app with `pnpm dev`, connect your wallet, and start the conversation!
<img width="576" alt="Screenshot 2024-12-09 at 6 04 09 PM" src="https://github.com/user-attachments/assets/3e713bc4-9830-4487-b9f8-515cfe050d7a">
Loading