Skip to content
Merged
Show file tree
Hide file tree
Changes from 4 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
2 changes: 1 addition & 1 deletion example/with-next-js/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"@bandprotocol/bandchain.js": "^3.0.3",
"@bandprotocol/bandchain.js": "file:../../packages/bandchainjs",
"@bandprotocol/obi-ts": "^1.0.0",
"chain-registry": "^1.69.15",
"cosmjs-utils": "^0.1.0",
Expand Down
2 changes: 1 addition & 1 deletion example/with-next-js/src/app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default function RootLayout({
return (
<html lang="en">
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased w-full flex`}
className={`${geistSans.variable} ${geistMono.variable} antialiased w-full flex text-black`}
>
<Sidebar />
<div className={"p-2 min-h-screen bg-slate-50 w-full pl-[380px]"}>
Expand Down
4 changes: 4 additions & 0 deletions example/with-next-js/src/app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
import { AllBalanceExample } from "@/components/AllBalanceExample";
import { CreateTunnelExample } from "@/components/CreateTunnelExample";
import { EditRouteExample } from "@/components/EditRouteExample";
import { RequestDataExample } from "@/components/RequestDataExample";
import { SendTokenExample } from "@/components/SendTokenExample";

Expand All @@ -9,6 +11,8 @@ export default function Home() {
<AllBalanceExample />
<SendTokenExample />
<RequestDataExample />
<CreateTunnelExample />
<EditRouteExample />
</main>
</div>
);
Expand Down
156 changes: 156 additions & 0 deletions example/with-next-js/src/components/CreateTunnelExample.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,156 @@
"use client";

import { band } from "@bandprotocol/bandchain.js";
import { useState } from "react";

import { getSignerClient } from "@/utils";

import CodeBlock from "./common/CodeBlock";
import CodeDefault from "./common/CodeDefault";
import { ExampleTemplateLayout } from "./layouts/ExampleTemplateLayout";

const CreateTunnelButton = ({
handleOnClick,
}: {
handleOnClick?: () => void;
}) => {
return (
<button
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
onClick={handleOnClick}
>
Create Tunnel
</button>
);
};

export const CreateTunnelExample = () => {
const creatorAddress = "band1qjte252y5wk3vj0tk2cmgw64pwkxsg0n22pa4k";
const [isCreating, setIsCreating] = useState(false);
const [result, setResult] = useState("");

const createTunnel = async () => {
setIsCreating(true);
const signer = await getSignerClient();
const { createTunnel } = band.tunnel.v1beta1.MessageComposer.withTypeUrl;

const msg = createTunnel({
creator: creatorAddress,
route: {
typeUrl: "/band.tunnel.v1beta1.IBCHookRoute",
value: band.tunnel.v1beta1.IBCHookRoute.encode({
channelId: "channel-0",
destinationContractAddress:
"0x3C8dfD80EF1292cdCF7A04aaC5C2677a83180a3D",
}).finish(),
},
signalDeviations: [
{
signalId: "CS:BTC-USD",
softDeviationBps: BigInt(10000),
hardDeviationBps: BigInt(10000),
},
],
interval: BigInt(3600),
initialDeposit: [
{
denom: "uband",
amount: "1000000",
},
],
});

const fee = {
amount: [
{
denom: "uband",
amount: "5000",
},
],
gas: "200000",
};

console.log(msg);

const response = await signer.signAndBroadcast(
creatorAddress,
[msg],
fee,
"create tunnel from bandchain.js example"
);

setResult(
JSON.parse(
JSON.stringify(response, (_key, value) =>
typeof value === "bigint" ? value.toString() : value
)
)
);
setIsCreating(false);
};

return (
<ExampleTemplateLayout
id="MsgCreateTunnel"
title="band.tunnel.v1beta1.MsgCreateTunnel"
exampleChildren={
<CodeBlock
code={`import { band } from "@bandprotocol/bandchain.js";
import { getSignerClient } from "@/utils";

const createTunnel = async () => {
const signer = await getSignerClient();
const { createTunnel } = band.tunnel.v1beta1.MessageComposer.withTypeUrl;

const msg = createTunnel({
creator: "band1qjte252y5wk3vj0tk2cmgw64pwkxsg0n22pa4k",
route: {
typeUrl: "/band.tunnel.v1beta1.TSSRoute",
value: band.tunnel.v1beta1.TSSRoute.encode({
destinationChainId: "arbitrum-sepolia-testnet",
destinationContractAddress: "0x3C8dfD80EF1292cdCF7A04aaC5C2677a83180a3D",
encoder: 1,
}).finish(),
},
signalDeviations: [
{
signalId: "CS:BTC-USD",
softDeviationBps: BigInt(10000),
hardDeviationBps: BigInt(10000),
},
],
interval: BigInt(3600),
initialDeposit: [
{
denom: "uband",
amount: "1000000",
},
],
});

const fee = {
amount: [{ denom: "uband", amount: "5000" }],
gas: "200000",
};

const response = await signer.signAndBroadcast(
"band1qjte252y5wk3vj0tk2cmgw64pwkxsg0n22pa4k",
[msg],
fee,
"create tunnel from bandchain.js example"
);

return response;
};`}
/>
}
resultChildren={
<>
<CreateTunnelButton handleOnClick={createTunnel} />
{isCreating && <p>Creating tunnel...</p>}
<CodeDefault>{JSON.stringify(result, null, 2)}</CodeDefault>
</>
}
/>
);
};
133 changes: 133 additions & 0 deletions example/with-next-js/src/components/EditRouteExample.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,133 @@
"use client";

import { band } from "@bandprotocol/bandchain.js";
import { useState } from "react";

import { getSignerClient } from "@/utils";

import CodeBlock from "./common/CodeBlock";
import CodeDefault from "./common/CodeDefault";
import { ExampleTemplateLayout } from "./layouts/ExampleTemplateLayout";

const UpdateRouteButton = ({
handleOnClick,
}: {
handleOnClick?: () => void;
}) => {
return (
<button
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
onClick={handleOnClick}
>
Update Route
</button>
);
};

export const EditRouteExample = () => {
const fromAddress = "band1qjte252y5wk3vj0tk2cmgw64pwkxsg0n22pa4k";
const tunnelId = "593"; // Example tunnel ID
const [isUpdating, setIsUpdating] = useState(false);
const [result, setResult] = useState("");

const updateRoute = async () => {
setIsUpdating(true);
const signer = await getSignerClient();
const { updateRoute } = band.tunnel.v1beta1.MessageComposer.withTypeUrl;

const msg = updateRoute({
creator: fromAddress,
tunnelId: BigInt(tunnelId),
route: {
typeUrl: "/band.tunnel.v1beta1.IBCHookRoute",
value: band.tunnel.v1beta1.IBCHookRoute.encode({
channelId: "channel-2",
destinationContractAddress:
"0x3C8dfD80EF1292cdCF7A04aaC5C2677a83180a3D",
}).finish(),
},
});

const fee = {
amount: [
{
denom: "uband",
amount: "5000",
},
],
gas: "200000",
};

console.log(msg);

const response = await signer.signAndBroadcast(
fromAddress,
[msg],
fee,
"update route from bandchain.js example"
);

setResult(
JSON.parse(
JSON.stringify(response, (_key, value) =>
typeof value === "bigint" ? value.toString() : value
)
)
);
setIsUpdating(false);
};

return (
<ExampleTemplateLayout
id="MsgUpdateRoute"
title="band.tunnel.v1beta1.MsgUpdateRoute"
exampleChildren={
<CodeBlock
code={`import { band } from "@bandprotocol/bandchain.js";
import { getSignerClient } from "@/utils";

const updateRoute = async () => {
const fromAddress = "band1qjte252y5wk3vj0tk2cmgw64pwkxsg0n22pa4k";
const tunnelId = "1";
const signer = await getSignerClient();
const { updateRoute } = band.tunnel.v1beta1.MessageComposer.withTypeUrl;

const msg = updateRoute({
creator: fromAddress,
tunnelId: BigInt(tunnelId),
route: {
typeUrl: "/band.tunnel.v1beta1.IBCHookRoute",
value: band.tunnel.v1beta1.IBCHookRoute.encode({
destinationChainId: "arbitrum-sepolia-testnet",
destinationContractAddress: "0x3C8dfD80EF1292cdCF7A04aaC5C2677a83180a3D",
encoder: 1,
}).finish(),
},
});

const fee = {
amount: [{ denom: "uband", amount: "5000" }],
gas: "200000",
};

const response = await signer.signAndBroadcast(
fromAddress,
[msg],
fee,
"update route from bandchain.js example"
);

return response;
};`}
/>
}
resultChildren={
<>
<UpdateRouteButton handleOnClick={updateRoute} />
{isUpdating && <p>Updating route...</p>}
<CodeDefault>{JSON.stringify(result, null, 2)}</CodeDefault>
</>
}
/>
);
};
1 change: 1 addition & 0 deletions example/with-next-js/src/components/RequestDataExample.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -111,6 +111,7 @@ const RequestDataButton = () => {
sender: fromAddress,
prepareGas: BigInt(200000),
executeGas: BigInt(200000),
tssEncoder: 1,
});

const handleRequestDataButton = async () => {
Expand Down
Loading