Skip to content

Commit 4538441

Browse files
saminacodessaminacodes
committed
nebula doc restructure (#5964)
--- title: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" --- NEB-73 ## Notes for the reviewer Mostly documentation changes to add Nebula restructure and also add tutorial for the Eliza Plugin ## How to test View preview. <!-- start pr-codex --> --- ## PR-Codex overview This PR focuses on enhancing the `Nebula` documentation and user experience by adding new content, updating existing descriptions, and introducing a new `RocketIcon`. It also restructures the sidebar and adds new pages for getting started and Eliza plugin integration. ### Detailed summary - Added new `RocketIcon` to the `sidebar`. - Updated `Nebula` description in `page.mdx` for improved clarity. - Introduced `get-started` page with setup instructions for the `Nebula API`. - Improved `Eliza` plugin documentation with new prerequisites and setup steps. - Updated sidebar links and removed the old `Use Cases` section. - Added images for better visual guidance in documentation. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex -->
1 parent 913f2e4 commit 4538441

File tree

10 files changed

+300
-70
lines changed

10 files changed

+300
-70
lines changed

‎apps/portal/src/app/nebula/assets/keys.png‎

300 KB
Loading

‎apps/portal/src/app/nebula/assets/nebula-diagram.png‎

37.1 KB
Loading

‎apps/portal/src/app/nebula/assets/new-project.png‎

328 KB
Loading

‎apps/portal/src/app/nebula/get-started/page.mdx‎

Lines changed: 174 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
import { Step, Steps, DocImage, Callout } from "@doc";
2+
import NewProject from "../assets/new-project.png";
3+
import KeysSetup from "../assets/keys.png";
4+
5+
# Get Started
6+
7+
Learn how to get set up and started with the Nebula API to successfully prepare and enable a connected user to sign a transfer .
8+
9+
## Prerequisites
10+
11+
Before you begin, ensure you have the following:
12+
13+
- A thirdweb account
14+
- A blockchain wallet for executing transactions
15+
- Node.js and npm or yarn installed on your system
16+
17+
## Obtain Client ID & Secret Key
18+
19+
<Steps>
20+
21+
<Step title="Create project">
22+
23+
Navigate to the [projects dashboard](https://thirdweb.com/) and create a new project.
24+
25+
<DocImage src={NewProject} alt="Create a new project"/>
26+
27+
</Step>
28+
29+
<Step title="Obtain keys">
30+
31+
Setup your project and obtain your client ID and secret key. Please note your secret key somewhere safe as it is not recoverable.
32+
33+
<Callout variant="warning" title="Client Id vs Secret Key">
34+
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.
35+
36+
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.
37+
</Callout>
38+
39+
<DocImage src={KeysSetup} alt="Obtain keys"/>
40+
41+
</Step>
42+
43+
</Steps>
44+
45+
## Setup API (TypeScript SDK)
46+
47+
<Steps>
48+
49+
<Step title="Install SDK">
50+
51+
Install the TypeScript SDK
52+
53+
```bash
54+
npm install thirdweb
55+
```
56+
</Step>
57+
58+
<Step title="Environment Variables">
59+
60+
Setup environmental variables.
61+
62+
<Callout variant="warning" title="Storing Secret Keys">
63+
Ensure you keep your secret key and private key safe and do not expose it in your codebase. We recommend using a
64+
secret key manager such as [AWS Secret Manager](https://aws.amazon.com/secrets-manager/) or [Google Secret Manager](https://cloud.google.com/secret-manager).
65+
</Callout>
66+
67+
```jsx
68+
THIRDWEB_SECRET_KEY=your_thirdweb_secret_key
69+
EOA_PRIVATE_KEY=your_wallet_private_key
70+
```
71+
</Step>
72+
73+
<Step title="Import Libraries">
74+
75+
Import required libraries from thirdweb.
76+
77+
```jsx
78+
import {
79+
createThirdwebClient,
80+
prepareTransaction,
81+
sendTransaction,
82+
privateKeyToAccount,
83+
} from "thirdweb";
84+
```
85+
</Step>
86+
87+
<Step title="Create Function to Handle Response">
88+
This function processes the API's response and executes blockchain transactions.
89+
90+
```jsx
91+
async function handleNebulaResponse(response) {
92+
const client = createThirdwebClient({
93+
secretKey: process.env.THIRDWEB_SECRET_KEY,
94+
});
95+
96+
const account = privateKeyToAccount({
97+
client,
98+
privateKey: process.env.EOA_PRIVATE_KEY,
99+
});
100+
101+
if (response.actions && response.actions.length > 0) {
102+
const action = response.actions[0];
103+
const txData = JSON.parse(action.data);
104+
105+
try {
106+
const transaction = prepareTransaction({
107+
to: txData.to,
108+
data: txData.data,
109+
value: BigInt(txData.value),
110+
chain: txData.chainId,
111+
client,
112+
});
113+
114+
const result = await sendTransaction({
115+
transaction,
116+
account,
117+
});
118+
119+
console.log("Transaction Successful:", result);
120+
return result;
121+
} catch (error) {
122+
console.error("Error executing transaction:", error);
123+
throw error;
124+
}
125+
}
126+
}
127+
```
128+
</Step>
129+
130+
<Step title="Call Nebula API">
131+
132+
Send a request to the Nebula API to interpret your natural language command and retrieve the transaction details.
133+
134+
```jsx
135+
const response = await fetch("https://nebula-api.thirdweb.com/chat", {
136+
method: "POST",
137+
headers: {
138+
"Content-Type": "application/json",
139+
"x-secret-key": process.env.THIRDWEB_SECRET_KEY,
140+
},
141+
body: JSON.stringify({
142+
message: "send 0.001 ETH on Sepolia to vitalik.eth",
143+
execute_config: {
144+
mode: "client",
145+
signer_wallet_address: "0xYourWalletAddress",
146+
},
147+
}),
148+
});
149+
150+
const data = await response.json();
151+
await handleNebulaResponse(data);
152+
```
153+
</Step>
154+
155+
<Step title="Example Response">
156+
157+
The response from the API will contain the transaction details.
158+
159+
```jsx
160+
Transaction Successful: {
161+
transactionHash: "0x123abc...",
162+
blockNumber: 1234567,
163+
...
164+
}
165+
```
166+
</Step>
167+
168+
Congratulations! You have successfully set up the Nebula API and executed a transaction using the thirdweb SDK.
169+
</Steps>
170+
171+
### Additional Resources
172+
173+
- [Nebula API Documentation](https://portal.thirdweb.com/nebula/api-reference)
174+
- [thirdweb SDK Documentation](https://portal.thirdweb.com/typescript/v5)

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

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,24 @@
11
import { PencilRulerIcon, HandCoinsIcon, BlocksIcon, WorkflowIcon, ShieldCheckIcon, CirclePlusIcon } from "lucide-react";
22
import { DocImage, createMetadata, FeatureCard } from "@doc";
3+
import NebulaDiagram from "./assets/nebula-diagram.png";
34

45

56
# What is Nebula?
67

7-
Natural language model with blockchain reasoning, autonomous transaction capabilities and real-time access to the blockchain.
8+
Natural language model with improved blockchain reasoning, autonomous transaction capabilities, and real-time access to the blockchain.
89

910
Nebula is currently available in Alpha. [Join the waitlist.](https://thirdweb.com/nebula)
1011

12+
<DocImage src={NebulaDiagram} />
13+
1114
## Features
1215

1316
<div
1417
className="my-4 grid gap-2 md:grid-cols-2 lg:grid-cols-2 "
1518
>
1619
<FeatureCard
1720
title="Proprietary Blockchain Model"
18-
description="Trained on over 2,400+ EVM networks and 1M+ contracts"
21+
description="Trained on over 2,500+ EVM networks and 1M+ contracts"
1922
iconUrl={<PencilRulerIcon />}
2023
/>
2124

‎apps/portal/src/app/nebula/plugins/eliza/page.mdx‎

Lines changed: 90 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,96 @@
1-
import { Callout } from '@doc'
1+
import { Callout, OpenSourceCard, Step, Steps, DocImage } from '@doc'
2+
import NewProject from "../../assets/new-project.png";
3+
import KeysSetup from "../../assets/keys.png";
24

35
# Eliza
46

5-
<Callout variant='info' title='Coming Soon'>
7+
Eliza is a simple, fast, and lightweight AI agent framework to build flexible, scalable, and secure conversational agents.
68

7-
We are actively developing plugins to develop with other frameworks and languages.
9+
With the thirdweb plugin, you can easily integrate Nebula into an AI agent built with Eliza to provide increasingly accurate read, write, and reasoning capabilities to blockchain-related prompts:
810

9-
If you have a specific request, please [contact us](https://thirdweb.com/contact).
11+
<OpenSourceCard
12+
title="Nebula Plugin"
13+
href="https://github.com/elizaOS/eliza/tree/main/packages/plugin-thirdweb"/>
1014

11-
</Callout>
15+
16+
## Prerequisites
17+
18+
- Create a thirdweb account
19+
- Node.js 23+ and pnpm 9+ installed
20+
21+
## Obtain Client ID & Secret Key
22+
23+
<Steps>
24+
25+
<Step title="Create project">
26+
27+
Navigate to the [projects dashboard](https://thirdweb.com/) and create a new project.
28+
29+
<DocImage src={NewProject} alt="Create a new project"/>
30+
31+
</Step>
32+
33+
<Step title="Obtain keys">
34+
35+
Setup your project and obtain your client ID and secret key. Please note your secret key somewhere safe as it is not recoverable.
36+
37+
<Callout variant="warning" title="Client Id vs Secret Key">
38+
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.
39+
40+
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.
41+
</Callout>
42+
43+
<DocImage src={KeysSetup} alt="Obtain keys"/>
44+
45+
</Step>
46+
47+
</Steps>
48+
49+
## Setup Eliza Starter
50+
51+
If you have not created a project with Eliza, it is recommended to start with the Eliza Starter repository:
52+
53+
<Steps>
54+
<Step title="Clone Starter">
55+
<Callout variant='info' title='Version'>
56+
The Nebula plugin is only available on version 0.1.8 of Eliza and above and is available by default.
57+
</Callout>
58+
59+
Clone the starter repository
60+
61+
```bash
62+
git clone https://github.com/elizaos/eliza-starter.git
63+
```
64+
</Step>
65+
66+
<Step title="Environment Variables">
67+
Create a .env file and add your secret key and any other environmental variables:
68+
69+
```bash
70+
THIRDWEB_SECRET_KEY=your_secret_key
71+
```
72+
73+
<Callout variant="warning" title="Client Id vs Secret Key">
74+
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.
75+
76+
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.
77+
</Callout>
78+
</Step>
79+
80+
<Step title="Install Dependencies">
81+
```bash
82+
pnpm i
83+
```
84+
</Step>
85+
86+
<Step title="Start Eliza">
87+
```bash
88+
pnpm start
89+
```
90+
</Step>
91+
92+
</Steps>
93+
94+
### Additional Resources
95+
96+
- [Eliza Documentation](https://elizaos.github.io/eliza/)

‎apps/portal/src/app/nebula/sidebar.tsx‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import type { SideBar } from "@/components/Layouts/DocLayout";
22
import {
3-
BrickIcon,
43
CodeIcon,
54
EditIcon,
65
NebulaSideIcon,
76
PluginIcon,
87
QuestionIcon,
8+
RocketIcon,
99
TroubleshootIcon,
1010
} from "@/icons";
1111

@@ -17,26 +17,15 @@ export const sidebar: SideBar = {
1717
href: "/nebula",
1818
icon: <NebulaSideIcon />,
1919
},
20-
{
21-
name: "Use Cases",
22-
href: "/nebula/use-cases",
23-
icon: <BrickIcon />,
24-
},
2520
{
2621
name: "Prompt Guide",
2722
href: "/nebula/prompt-guide",
2823
icon: <EditIcon />,
2924
},
3025
{
31-
name: "Plugins",
32-
href: "/nebula/plugins",
33-
icon: <PluginIcon />,
34-
links: [
35-
{
36-
name: "Eliza",
37-
href: "/nebula/plugins/eliza",
38-
},
39-
],
26+
name: "Get Started",
27+
href: "/nebula/get-started",
28+
icon: <RocketIcon />,
4029
},
4130
{
4231
name: "API Reference",
@@ -101,6 +90,17 @@ export const sidebar: SideBar = {
10190
},
10291
],
10392
},
93+
{
94+
name: "Plugins",
95+
href: "/nebula/plugins",
96+
icon: <PluginIcon />,
97+
links: [
98+
{
99+
name: "Eliza",
100+
href: "/nebula/plugins/eliza",
101+
},
102+
],
103+
},
104104
{
105105
name: "Troubleshoot",
106106
href: "/nebula/troubleshoot",

0 commit comments

Comments
 (0)