Prerequisites
Para Setup Required
Installation
Library Setup
- Proto Signer
- Amino Signer
Use the Proto signer for transaction operations like sending tokens, staking, and IBC transfers.
Install and configure CosmJS for use with Para SDK on Cosmos chains
npm install @cosmjs/stargate @cosmjs/proto-signing @cosmjs/amino --save-exact
import { useCosmjsProtoSigner } from "@getpara/react-sdk/cosmos";
import { SigningStargateClient, StargateClient } from "@cosmjs/stargate";
import { useState, useEffect } from "react";
const RPC_URL = "https://rpc.cosmos.directory/cosmoshub";
export function useCosmosClient() {
const { protoSigner, isLoading } = useCosmjsProtoSigner();
const [publicClient, setPublicClient] = useState<StargateClient>();
const [signingClient, setSigningClient] = useState<SigningStargateClient>();
useEffect(() => {
StargateClient.connect(RPC_URL).then(setPublicClient);
}, []);
useEffect(() => {
if (!protoSigner) {
setSigningClient(undefined);
return;
}
SigningStargateClient.connectWithSigner(RPC_URL, protoSigner).then(setSigningClient);
}, [protoSigner]);
const address = protoSigner?.address;
return { publicClient, signingClient, address, isLoading };
}
import { useCosmjsAminoSigner } from "@getpara/react-sdk/cosmos";
import { makeSignDoc } from "@cosmjs/amino";
const CHAIN_ID = "cosmoshub-4";
export function useSignMessage() {
const { aminoSigner, isLoading } = useCosmjsAminoSigner();
const address = aminoSigner?.address;
const signMessage = async (message: string) => {
if (!aminoSigner || !address) return;
const signDoc = makeSignDoc(
[{ type: "sign/MsgSignData", value: { signer: address, data: btoa(message) } }],
{ amount: [], gas: "0" },
CHAIN_ID,
"",
0,
0
);
const { signature } = await aminoSigner.signAmino(address, signDoc);
return signature.signature;
};
return { signMessage, address, isLoading };
}