Skip to content
Merged
Show file tree
Hide file tree
Changes from 10 commits
Commits
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
Original file line number Diff line number Diff line change
@@ -1,16 +1,20 @@
"use client";

import type React from "react";
import { type Dispatch, type SetStateAction, useMemo } from "react";
import { CodeClient } from "@/components/ui/code/code.client";
import { TabButtons } from "@/components/ui/tabs";
import { cn } from "@/lib/utils";

export type CodeEnvironment =
| "api"
| "javascript"
| "typescript"
| "react"
| "react-native"
| "unity";
| "dotnet"
| "unity"
| "curl";

type SupportedEnvironment = {
environment: CodeEnvironment;
Expand All @@ -20,6 +24,10 @@ type SupportedEnvironment = {
type CodeSnippet = Partial<Record<CodeEnvironment, string>>;

const Environments: SupportedEnvironment[] = [
{
environment: "api",
title: "API",
},
{
environment: "javascript",
title: "JavaScript",
Expand All @@ -36,10 +44,18 @@ const Environments: SupportedEnvironment[] = [
environment: "react-native",
title: "React Native",
},
{
environment: "dotnet",
title: ".NET",
},
{
environment: "unity",
title: "Unity",
},
{
environment: "curl",
title: "cURL",
},
];

interface CodeSegmentProps {
Expand Down Expand Up @@ -122,9 +138,14 @@ export const CodeSegment: React.FC<CodeSegmentProps> = ({
: activeEnvironment === "react" ||
activeEnvironment === "react-native"
? "tsx"
: activeEnvironment === "unity"
: activeEnvironment === "unity" ||
activeEnvironment === "dotnet"
? "cpp"
: activeEnvironment
: activeEnvironment === "api"
? "javascript"
: activeEnvironment === "curl"
? "bash"
: activeEnvironment
}
/>
)}
Expand Down
206 changes: 189 additions & 17 deletions apps/dashboard/src/@/components/contracts/code-overview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,23 @@ export default function Component() {
events: [preparedEvent]
});
}`,
unity: `using Thirdweb;

// Get your contract
var contract = await ThirdwebManager.Instance.GetContract(
address: "{{contract_address}}",
chainId: {{chainId}},
);

// Listen to contract events
var events = await contract.Events("{{function}}");`,
dotnet: `using Thirdweb;
Comment thread
coderabbitai[bot] marked this conversation as resolved.

// Get your contract
var contract = await ThirdwebContract.Create(client, "{{contract_address}}", {{chainId}});

// Listen to contract events
var events = await contract.Events("{{function}}");`,
},
install: {
javascript: "npm i thirdweb",
Expand All @@ -73,6 +90,9 @@ export default function Component() {
unity: `// Download the .unitypackage from the latest release:
// https://github.com/thirdweb-dev/unity-sdk/releases
// and drag it into your project`,
dotnet: `// Install the thirdweb SDK via NuGet:
// dotnet add package Thirdweb
// Or search for "Thirdweb" in your NuGet package manager`,
},
read: {
javascript: `import { readContract } from "thirdweb";
Expand Down Expand Up @@ -100,6 +120,33 @@ export default function Component() {
params: [{{args}}]
});
}`,
unity: `using Thirdweb;

// Get your contract
var contract = await ThirdwebManager.Instance.GetContract(
address: "{{contract_address}}",
chainId: {{chainId}}
);

// Read from the contract
var result = await contract.Read<T>(
"{{function}}",
{{args}}
);`,
dotnet: `using Thirdweb;

// Get your contract
var contract = await ThirdwebContract.Create(
client,
"{{contract_address}}",
{{chainId}}
);

// Read from the contract
var result = await contract.Read<T>(
"{{function}}",
{{args}}
);`,
Comment thread
0xFirekeeper marked this conversation as resolved.
},
setup: {
javascript: `import { createThirdwebClient, getContract } from "thirdweb";
Expand Down Expand Up @@ -165,11 +212,19 @@ function App() {
`,
unity: `using Thirdweb;

// Reference the SDK
var sdk = ThirdwebManager.Instance.SDK;
// Get your contract
var contract = await ThirdwebManager.Instance.GetContract(
address: "{{contract_address}}",
chainId: {{chainId}}
);`,
dotnet: `using Thirdweb;

// Get your contract
var contract = sdk.GetContract("{{contract_address}}");`,
var contract = await ThirdwebContract.Create(
client,
"{{contract_address}}",
{{chainId}}
);`,
},
write: {
javascript: `import { prepareContractCall, sendTransaction } from "thirdweb";
Expand Down Expand Up @@ -213,6 +268,123 @@ export default function Component() {
sendTransaction(transaction);
}
}`,
unity: `using Thirdweb;

// Get your contract
var contract = await ThirdwebManager.Instance.GetContract(
address: "{{contract_address}}",
chainId: {{chainId}}
);

// Write to the contract
var transactionReceipt = await contract.Write(
wallet,
contract,
"{{function}}",
weiValue,
{{args}}
);`,
dotnet: `using Thirdweb;

// Get your contract
var contract = await ThirdwebContract.Create(
client,
"{{contract_address}}",
{{chainId}}
);

// Write to the contract
var transactionReceipt = await contract.Write(
wallet,
contract,
"{{function}}",
weiValue,
{{args}}
);`,
},
api: {
read: `const response = await fetch('https://api.thirdweb.com/v1/contracts/read', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'x-secret-key': '<YOUR_SECRET_KEY>'
},
body: JSON.stringify({
calls: [
{
contractAddress: "{{contract_address}}",
method: "{{function}}",
params: [{{args}}]
}
],
chainId: {{chainId}}
})
});

const data = await response.json();`,
write: `const response = await fetch('https://api.thirdweb.com/v1/contracts/write', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'x-secret-key': '<YOUR_SECRET_KEY>'
},
body: JSON.stringify({
calls: [
{
contractAddress: "{{contract_address}}",
method: "{{function}}",
params: [{{args}}]
}
],
chainId: {{chainId}},
from: "<YOUR_WALLET_ADDRESS>"
})
});

const data = await response.json();`,
events: `const response = await fetch('https://api.thirdweb.com/v1/contracts/{{chainId}}/{{contract_address}}/events?eventSignature={{function}}', {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'x-secret-key': '<YOUR_SECRET_KEY>'
}
});

const data = await response.json();`,
},
Comment thread
0xFirekeeper marked this conversation as resolved.
curl: {
read: `curl https://api.thirdweb.com/v1/contracts/read \\
--request POST \\
--header 'Content-Type: application/json' \\
--header 'x-secret-key: <YOUR_SECRET_KEY>' \\
--data '{
"calls": [
{
"contractAddress": "{{contract_address}}",
"method": "{{function}}",
"params": [{{args}}]
}
],
"chainId": {{chainId}}
}'`,
write: `curl -X POST https://api.thirdweb.com/v1/contracts/write \\
Comment thread
coderabbitai[bot] marked this conversation as resolved.
-H "Content-Type: application/json" \\
-H "x-secret-key: <YOUR_SECRET_KEY>" \\
-d '{
"calls": [
{
"contractAddress": "{{contract_address}}",
"method": "{{function}}",
"params": [{{args}}]
}
],
"chainId": {{chainId}},
"from": "<YOUR_WALLET_ADDRESS>"
}'`,
events: `curl https://api.thirdweb.com/v1/contracts/{{chainId}}/{{contract_address}}/events?eventSignature={{function}} \\
--request GET \\
--header 'Content-Type: application/json' \\
--header 'x-secret-key: <YOUR_SECRET_KEY>'`,
Comment thread
0xFirekeeper marked this conversation as resolved.
},
Comment thread
coderabbitai[bot] marked this conversation as resolved.
};

Expand Down Expand Up @@ -269,20 +441,17 @@ return (

public async void ConnectWallet()
{
// Reference to your Thirdweb SDK
var sdk = ThirdwebManager.Instance.SDK;

// Configure the connection
var connection = new WalletConnection(
provider: WalletProvider.SmartWallet, // The wallet provider you want to connect to (Required)
chainId: 1, // The chain you want to connect to (Required)
password: "myEpicPassword", // If using a local wallet as personal wallet (Optional)
email: "email@email.com", // If using an email wallet as personal wallet (Optional)
personalWallet: WalletProvider.LocalWallet // The personal wallet you want to use with your Account (Optional)
var wallet = await ConnectWallet(
new WalletOptions(
provider: WalletProvider.InAppWallet,
chainId: {{chainId}},
inAppWalletOptions: new InAppWalletOptions(
authprovider: AuthProvider.Google,
executionMode: ExecutionMode.EIP7702Sponsored
)
)
);

// Connect the wallet
string address = await sdk.wallet.Connect(connection);
string address = await wallet.GetAddress();
}`,
},
},
Expand Down Expand Up @@ -490,6 +659,9 @@ export function formatSnippet(
: "event",
});
break;
case "api":
// For API, we don't need special extension handling, just use the standard templates
break;
}
Comment thread
0xFirekeeper marked this conversation as resolved.
}
// end hacks on hacks on hacks -- now just hacks on hacks from here on out
Expand Down Expand Up @@ -533,7 +705,7 @@ export function CodeOverview(props: {
| undefined;

const [environment, setEnvironment] = useState<CodeEnvironment>(
defaultEnvironment || "javascript",
defaultEnvironment || "api",
);

const [tab, setTab] = useState("write");
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -112,14 +112,48 @@ function ContractFunctionInner(props: ContractFunctionProps) {
: "write"
: ("events" as const);

const codeSnippet = formatSnippet(COMMANDS[commandsKey], {
const baseSnippet = formatSnippet(COMMANDS[commandsKey], {
args: fn.inputs?.map((i) => i.name || ""),
chainId: contract.chain.id,
contractAddress: contract.address,
extensionNamespace,
fn,
});

// Safety check: Only include API snippet if the command exists in COMMANDS.api
const apiSnippet = COMMANDS.api[commandsKey]
? formatSnippet(
{ api: COMMANDS.api[commandsKey] },
{
args: fn.inputs?.map((i) => i.name || ""),
chainId: contract.chain.id,
contractAddress: contract.address,
extensionNamespace,
fn,
},
)
: {};

// Safety check: Only include cURL snippet if the command exists in COMMANDS.curl
const curlSnippet = COMMANDS.curl[commandsKey]
? formatSnippet(
{ curl: COMMANDS.curl[commandsKey] },
{
args: fn.inputs?.map((i) => i.name || ""),
chainId: contract.chain.id,
contractAddress: contract.address,
extensionNamespace,
fn,
},
)
: {};

const codeSnippet = {
...baseSnippet,
...apiSnippet,
...curlSnippet,
};
Comment thread
0xFirekeeper marked this conversation as resolved.

return (
<div className="flex flex-col gap-1.5">
<div className="flex items-center flex-wrap gap-2 border-b pb-3 mb-3">
Expand Down
Loading