Skip to content

Commit 3d8dd08

Browse files
joaquim-vergesjoaquim-verges
committed
[Docs] Update API endpoints and add frontend/backend examples
1 parent cf22c23 commit 3d8dd08

File tree

21 files changed

+751
-224
lines changed

21 files changed

+751
-224
lines changed

‎apps/portal/src/app/Header.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,10 @@ export const connectLinks: Array<{
119119
] as const;
120120

121121
const apisLinks = [
122+
{
123+
href: "https://api.thirdweb.com/reference",
124+
name: "HTTP API",
125+
},
122126
{
123127
href: "https://insight.thirdweb.com/reference",
124128
name: "Insight",
@@ -281,6 +285,22 @@ export function Header() {
281285
</nav>
282286

283287
<div className="flex items-center gap-3">
288+
<div className="px-1">
289+
<DropdownLinks
290+
category="AI"
291+
links={[
292+
{
293+
href: "/ai/mcp",
294+
name: "MCP",
295+
},
296+
{
297+
href: "/ai/llms-txt",
298+
name: "LLMs.txt",
299+
},
300+
]}
301+
onLinkClick={() => setShowBurgerMenu(false)}
302+
/>
303+
</div>
284304
<div className="px-1">
285305
<DropdownLinks
286306
category="SDKs"

‎apps/portal/src/app/ai/layout.tsx‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { createMetadata } from "@doc";
2+
import { BookIcon, ZapIcon } from "lucide-react";
3+
import { DocLayout } from "@/components/Layouts/DocLayout";
4+
5+
export default async function Layout(props: { children: React.ReactNode }) {
6+
return (
7+
<DocLayout
8+
editPageButton={true}
9+
sideBar={{
10+
links: [
11+
{
12+
name: "MCP Server",
13+
icon: <ZapIcon />,
14+
href: "/ai/mcp",
15+
},
16+
{
17+
name: "llms.txt",
18+
icon: <BookIcon />,
19+
href: "/ai/llm-txt",
20+
},
21+
],
22+
name: "AI",
23+
}}
24+
>
25+
<div>{props.children}</div>
26+
</DocLayout>
27+
);
28+
}
29+
30+
export const metadata = createMetadata({
31+
description: "AI tools for agents and LLM clients.",
32+
title: "thirdweb AI",
33+
});

‎apps/portal/src/app/ai/llm-txt/page.mdx‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# llms.txt
2+
3+
Use these llms.txt files to instruct your LLM on how to use the thirdweb API.
4+
5+
### thirdweb API reference
6+
7+
The [thirdweb HTTP API reference](https://api.thirdweb.com/reference) as markdown.
8+
9+
Available at: https://api.thirdweb.com/llms.txt
10+
11+
### Typescript SDK quick reference
12+
13+
Contains a table of contents for the thirdweb Typescript SDK documentation.
14+
15+
Available at: https://portal.thirdweb.com/llms.txt
16+
17+
### Typescript SDK full documentation
18+
19+
Contains the entire thirdweb Typescript SDK documentation as markdown. Requires large context windows.
20+
21+
Available at: https://portal.thirdweb.com/llms-full.txt

‎apps/portal/src/app/ai/mcp/page.mdx‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
# MCP server
2+
3+
You can use the thirdweb MCP server to interact with the thirdweb API from your agents or LLM client.
4+
5+
### Remote MCP endpoint
6+
7+
You can access the MCP server at the following url, with your project secret key.
8+
9+
```http
10+
# endpoint
11+
POST https://api.thirdweb.com/mcp
12+
13+
# auth header (required)
14+
x-secret-key <your-project-secret-key>
15+
```
16+
17+
### Usage with agents
18+
19+
Use your favorite agent framework to plug in the MCP server as a collection of tools for your agent. Refer to your agent framework's documentation for more information.
20+
21+
#### Example usage with langchain:
22+
23+
```python
24+
from langchain_mcp_adapters.client import MultiServerMCPClient
25+
from langgraph.prebuilt import create_react_agent
26+
27+
client = MultiServerMCPClient(
28+
{
29+
"thirdweb-api": {
30+
"transport": "streamable_http",
31+
"url": "https://api.thirdweb-dev.com/mcp",
32+
"headers": {
33+
"x-secret-key": "<your-project-secret-key>"
34+
},
35+
}
36+
}
37+
)
38+
tools = await client.get_tools()
39+
agent = create_react_agent("openai:gpt-4.1", tools)
40+
response = await agent.ainvoke({"messages": "create a server wallet called 'my-wallet'"})
41+
```
42+
43+
### Usage with LLM clients
44+
45+
You can also use the MCP server on your own LLM client, like cursor, claude code and more. Refer to your LLM client's documentation for more information.
46+
47+
#### Example usage with Cursor:
48+
49+
Add the following to your `.cursor/mcp.json` file:
50+
51+
```json
52+
{
53+
"mcpServers": {
54+
"thirdweb-api": {
55+
"url": "https://api.thirdweb-dev.com/mcp",
56+
"headers": {
57+
"x-secret-key": "<your-project-secret-key>"
58+
}
59+
}
60+
}
61+
}
62+
```

‎apps/portal/src/app/contracts/page.mdx‎

Lines changed: 59 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,6 @@ export const metadata = createMetadata({
3434

3535
Read, write, and deploy smart contracts on any EVM compatible blockchain.
3636

37-
---
38-
3937
<Tabs defaultValue="http">
4038
<TabsList>
4139
<TabsTrigger value="http" className="flex items-center gap-2 [&>p]:mb-0">
@@ -71,19 +69,16 @@ Read, write, and deploy smart contracts on any EVM compatible blockchain.
7169
<TabsContent value="http">
7270
### Read a Contract
7371

74-
You can read contract data efficiently using the [contract read API](https://engine.thirdweb.com/reference).
72+
You can read contract data efficiently using the [contract read API](https://api.thirdweb.com/reference#tag/contracts/post/v1/contracts/read).
7573

7674
```http
77-
GET /v1/contract/read
75+
GET https://api.thirdweb.com/v1/contracts/read
7876
Content-Type: application/json
79-
x-secret-key: <your-project-secret-key>
77+
x-client-id: <your-project-client-id>
8078
8179
{
82-
"readOptions": {
83-
"chainId": "1" // your chain id
84-
"from": "0x...", // optional, if you want to read from a specific address
85-
},
86-
"params": [{
80+
"chainId": "1" // your chain id
81+
"calls": [{
8782
"contractAddress": "0x...",
8883
"method": "function allowance(address owner, address spender)",
8984
"params": ["0x...", "0x..."],
@@ -93,33 +88,65 @@ Read, write, and deploy smart contracts on any EVM compatible blockchain.
9388

9489
You can batch multiple contract reads in a single request, and the response will be an array of results or errors.
9590

91+
Authentication requires either `x-secret-key` (backend) or `x-client-id` (frontend) to be set in the request headers.
92+
9693
### Write to a Contract
9794

98-
You can write to a contract using the [contract write API](https://engine.thirdweb.com/reference).
99-
100-
```http
101-
POST /v1/contract/write
102-
Content-Type: application/json
103-
x-secret-key: <your-project-secret-key>
104-
105-
{
106-
"executionOptions": {
107-
"from": "0x...", // your server wallet address
108-
"chainId": "1" // your chain id
109-
},
110-
"params": [{
111-
"contractAddress": "0x...",
112-
"method": "function transfer(address to, uint256 amount)",
113-
"params": ["0x...", "1000000000000000000"],
114-
}]
115-
}
116-
```
95+
You can write to a contract using the [contract write API](https://api.thirdweb.com/reference#tag/contracts/post/v1/contracts/write).
11796

118-
You can batch multiple contract writes in a single request, and the transactions will be batched atomically onchain.
97+
<Tabs defaultValue="frontend">
98+
<TabsList>
99+
<TabsTrigger value="frontend">Frontend</TabsTrigger>
100+
<TabsTrigger value="backend">Backend</TabsTrigger>
101+
</TabsList>
119102

120-
### Deploy a Contract
103+
<TabsContent value="frontend">
104+
105+
On the frontend, use your project client ID and the users's auth token to send a transaction on their behalf.
106+
107+
```http
108+
POST https://api.thirdweb.com/v1/contracts/write
109+
Content-Type: application/json
110+
x-client-id: <your-project-client-id>
111+
Authorization: Bearer <user-auth-token>
112+
113+
{
114+
"from": "0x...", // the user wallet address
115+
"chainId": "1" // the chain id
116+
"calls": [{
117+
"contractAddress": "0x...",
118+
"method": "function transfer(address to, uint256 amount)",
119+
"params": ["0x...", "1000000000000000000"],
120+
}],
121+
}
122+
```
123+
124+
</TabsContent>
121125

122-
You can deploy a contract using the [contract deploy API](https://engine.thirdweb.com/reference).
126+
<TabsContent value="backend">
127+
128+
On the backend, use your project secret key to send a transaction from any of your server wallets.
129+
130+
```http
131+
POST https://api.thirdweb.com/v1/contracts/write
132+
Content-Type: application/json
133+
x-secret-key: <your-project-secret-key>
134+
135+
{
136+
"from": "0x...", // your server wallet address
137+
"chainId": "1" // your chain id
138+
"calls": [{
139+
"contractAddress": "0x...",
140+
"method": "function transfer(address to, uint256 amount)",
141+
"params": ["0x...", "1000000000000000000"],
142+
}],
143+
}
144+
```
145+
146+
</TabsContent>
147+
</Tabs>
148+
149+
You can batch multiple contract writes in a single request, and the transactions will be batched atomically onchain.
123150

124151
</TabsContent>
125152

‎apps/portal/src/app/page.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -112,6 +112,11 @@ function ReferenceSection() {
112112
<section>
113113
<SectionTitle anchorId="backend" title="Backend APIs" />
114114
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
115+
<SDKCard
116+
href="https://api.thirdweb.com/reference"
117+
icon={ConnectIcon}
118+
title="HTTP API"
119+
/>
115120
<SDKCard
116121
href="https://engine.thirdweb.com/reference"
117122
icon={EngineIcon}
@@ -127,11 +132,6 @@ function ReferenceSection() {
127132
icon={BridgeIcon}
128133
title="Payments"
129134
/>
130-
<SDKCard
131-
href="/wallets/get-users"
132-
icon={ConnectIcon} // TODO: actual openAPI docs
133-
title="Wallets"
134-
/>
135135
<SDKCard
136136
href="/bundler"
137137
icon={ConnectIcon} // TODO: actual openAPI docs

‎apps/portal/src/app/payments/fund/page.mdx‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
import {
2+
Callout,
3+
createMetadata,
4+
Tabs,
5+
TabsList,
6+
TabsTrigger,
7+
TabsContent,
8+
ArticleIconCard
9+
} from "@doc";
10+
import {
11+
ReactIcon,
12+
} from "@/icons";
13+
import { ZapIcon } from "lucide-react";
14+
15+
export const metadata = createMetadata({
16+
image: {
17+
title: "Fund Wallet",
18+
icon: "payments",
19+
},
20+
title: "Fund Wallet",
21+
description: "Fund wallets with crypto using the BuyWidget.",
22+
});
23+
24+
# Fund wallets
25+
26+
Fund wallets with crypto using the `BuyWidget`.
27+
28+
<Tabs defaultValue="react">
29+
<TabsList>
30+
<TabsTrigger value="react" className="flex items-center gap-2 [&>p]:mb-0">
31+
<ReactIcon className="w-4 h-4 mr-2" />
32+
React
33+
</TabsTrigger>
34+
</TabsList>
35+
36+
<TabsContent value="react">
37+
38+
### Fund a wallet with the `BuyWidget`
39+
40+
```tsx
41+
import { BuyWidget } from "thirdweb/react";
42+
import { createThirdwebClient } from "thirdweb";
43+
import { base } from "thirdweb/chains";
44+
45+
const client = createThirdwebClient({
46+
clientId: "YOUR_CLIENT_ID",
47+
});
48+
49+
function ProductPage() {
50+
return (
51+
<div>
52+
<h1>Fund Wallet</h1>
53+
<p>Top your wallet with crypto</p>
54+
55+
<BuyWidget
56+
client={client}
57+
chain={base}
58+
token="0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913" // USDC on Base
59+
amount="5" // top up 5 USDC by default (user can change this)
60+
name="Fund Wallet"
61+
description="Top up your wallet with crypto"
62+
onSuccess={() => {
63+
alert("Top up successful!");
64+
// Redirect or update UI
65+
}}
66+
/>
67+
</div>
68+
);
69+
}
70+
```
71+
72+
The BuyWidget handles the complete payment flow, supporting both crypto and fiat payments across 50+ chains.
73+
</TabsContent>
74+
</Tabs>
75+
76+
## View it in action:
77+
78+
<ArticleIconCard
79+
title="Fund Wallet Live Demo"
80+
description="Top up your wallet with crypto using the BuyWidget"
81+
icon={ReactIcon}
82+
href="https://playground.thirdweb.com/connect/pay/transactions"
83+
/>
84+
85+
## Going Further
86+
87+
- [Custom Payment Data](/payments/custom-data) - Attach metadata to payments
88+
- [Webhooks](/payments/webhooks) - Get notified when payments complete
89+
90+
## API Reference
91+
92+
- [BuyWidget](/references/typescript/v5/BuyWidget)

0 commit comments

Comments
 (0)