Display validator message on page
This commit is contained in:
parent
000d4ff846
commit
8646544060
@ -3,7 +3,8 @@ REACT_APP_ETHEREUM_MAINNET_CHAIN_ID=1
|
|||||||
REACT_APP_LACONICD_CHAIN_ID=laconic_9000-1
|
REACT_APP_LACONICD_CHAIN_ID=laconic_9000-1
|
||||||
REACT_APP_REGISTRY_GQL_ENDPOINT=http://localhost:9473/api
|
REACT_APP_REGISTRY_GQL_ENDPOINT=http://localhost:9473/api
|
||||||
REACT_APP_LACONICD_RPC_ENDPOINT=http://localhost:26657
|
REACT_APP_LACONICD_RPC_ENDPOINT=http://localhost:26657
|
||||||
REACT_APP_LACONICD_DENOM=alnt
|
|
||||||
REACT_APP_FAUCET_ENDPOINT=http://localhost:4000
|
REACT_APP_FAUCET_ENDPOINT=http://localhost:4000
|
||||||
REACT_APP_WALLET_META_URL=http://localhost:3000
|
REACT_APP_WALLET_META_URL=http://localhost:3000
|
||||||
REACT_APP_SUMSUB_API_ENDPOINT=
|
REACT_APP_SUMSUB_API_ENDPOINT=
|
||||||
|
REACT_APP_STAKING_AMOUNT=1000000000000000
|
||||||
|
REACT_APP_LACONICD_DENOM=alnt
|
||||||
|
@ -4,6 +4,8 @@
|
|||||||
"private": true,
|
"private": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@cerc-io/registry-sdk": "^0.2.5",
|
"@cerc-io/registry-sdk": "^0.2.5",
|
||||||
|
"@cosmjs/encoding": "^0.32.4",
|
||||||
|
"@cosmjs/proto-signing": "^0.32.4",
|
||||||
"@cosmjs/stargate": "^0.32.4",
|
"@cosmjs/stargate": "^0.32.4",
|
||||||
"@emotion/react": "^11.11.4",
|
"@emotion/react": "^11.11.4",
|
||||||
"@emotion/styled": "^11.11.0",
|
"@emotion/styled": "^11.11.0",
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import React, { useEffect } from "react";
|
import React, { useEffect } from "react";
|
||||||
import {useLocation, useNavigate, useParams } from "react-router-dom";
|
import {useNavigate, useParams } from "react-router-dom";
|
||||||
|
|
||||||
import { Button, Box, Container, Typography, colors } from "@mui/material";
|
import { Button, Box, Container, Typography, colors } from "@mui/material";
|
||||||
|
|
||||||
|
@ -1,14 +1,98 @@
|
|||||||
import { Box, MenuItem, Select, Typography } from '@mui/material'
|
import { Box, MenuItem, Select, Typography } from '@mui/material'
|
||||||
import React from 'react'
|
import React, { useMemo, useState } from 'react'
|
||||||
import { useWalletConnectContext } from '../context/WalletConnectContext'
|
import { enqueueSnackbar } from 'notistack';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
|
||||||
|
import { MsgCreateValidatorEncodeObject } from '@cosmjs/stargate';
|
||||||
|
import { fromBech32, toBech32 } from '@cosmjs/encoding';
|
||||||
|
import { LoadingButton } from '@mui/lab';
|
||||||
|
|
||||||
|
import { useWalletConnectContext } from '../context/WalletConnectContext'
|
||||||
|
import { encodePubkey } from '@cosmjs/proto-signing';
|
||||||
|
|
||||||
const CreateValidator = () => {
|
const CreateValidator = () => {
|
||||||
const {session} = useWalletConnectContext();
|
const {session, signClient} = useWalletConnectContext();
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
// TODO: Handle
|
||||||
|
const [cosmosAddress, setCosmosAddress] = useState('');
|
||||||
|
const [isLoading, setIsLoading] = useState(false);
|
||||||
|
const [pubkey, setPubkey] = useState('');
|
||||||
|
|
||||||
if (!session){
|
if (!session){
|
||||||
navigate("/connect-wallet")
|
navigate("/connect-wallet")
|
||||||
}
|
}
|
||||||
|
const changePrefix = (address: string, newPrefix: string): string => {
|
||||||
|
return toBech32(newPrefix, fromBech32(address).data);
|
||||||
|
}
|
||||||
|
|
||||||
|
const createValidatorMessage: MsgCreateValidatorEncodeObject =
|
||||||
|
useMemo(() => {
|
||||||
|
return {
|
||||||
|
typeUrl: "/cosmos.staking.v1beta1.MsgCreateValidator",
|
||||||
|
value: {
|
||||||
|
description: {
|
||||||
|
moniker: "dockerNode",
|
||||||
|
identity: "",
|
||||||
|
website: "",
|
||||||
|
securityContact: "",
|
||||||
|
details: "",
|
||||||
|
},
|
||||||
|
commission: {
|
||||||
|
maxChangeRate: "10000000000000000", // 0.01
|
||||||
|
maxRate: "200000000000000000", // 0.2
|
||||||
|
rate: "100000000000000000", // 0.1
|
||||||
|
},
|
||||||
|
minSelfDelegation: "1",
|
||||||
|
delegatorAddress: cosmosAddress,
|
||||||
|
validatorAddress: changePrefix(cosmosAddress, "laconicvaloper"),
|
||||||
|
pubkey: encodePubkey({
|
||||||
|
type: "tendermint/PubKeyEd25519",
|
||||||
|
value: pubkey,
|
||||||
|
}),
|
||||||
|
value: {
|
||||||
|
amount: process.env.REACT_APP_STAKING_AMOUNT!,
|
||||||
|
denom: process.env.REACT_APP_LACONICD_DENOM!,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}, [cosmosAddress, pubkey]);
|
||||||
|
|
||||||
|
const sendTransaction = async (
|
||||||
|
transactionMessage: MsgCreateValidatorEncodeObject
|
||||||
|
) => {
|
||||||
|
|
||||||
|
try {
|
||||||
|
setIsLoading(true);
|
||||||
|
|
||||||
|
const params = { transactionMessage, signer: cosmosAddress };
|
||||||
|
const responseFromWallet = await signClient!.request<{
|
||||||
|
code: number;
|
||||||
|
}>({
|
||||||
|
topic: session!.topic,
|
||||||
|
chainId: `cosmos:${process.env.REACT_APP_LACONICD_CHAIN_ID}`,
|
||||||
|
request: {
|
||||||
|
method: "cosmos_sendTransaction",
|
||||||
|
params,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
if (responseFromWallet.code !== 0) {
|
||||||
|
enqueueSnackbar("Transaction not sent", { variant: "error" });
|
||||||
|
} else {
|
||||||
|
navigate("/onboarding-success", {
|
||||||
|
state: {
|
||||||
|
cosmosAddress
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
enqueueSnackbar("Error in sending transaction", { variant: "error" });
|
||||||
|
} finally {
|
||||||
|
setIsLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
@ -20,7 +104,52 @@ const CreateValidator = () => {
|
|||||||
>
|
>
|
||||||
<Typography variant="h5">Create a validator</Typography>
|
<Typography variant="h5">Create a validator</Typography>
|
||||||
<Typography variant="body1">Select Laconic account:</Typography>
|
<Typography variant="body1">Select Laconic account:</Typography>
|
||||||
|
<Select
|
||||||
|
labelId="demo-simple-select-label"
|
||||||
|
id="demo-simple-select"
|
||||||
|
value={cosmosAddress}
|
||||||
|
onChange={(e: any) => {
|
||||||
|
setCosmosAddress(e.target.value);
|
||||||
|
}}
|
||||||
|
style={{ maxWidth: "600px", display: "block" }}
|
||||||
|
>
|
||||||
|
{session?.namespaces.cosmos.accounts.map((address, index) => (
|
||||||
|
<MenuItem value={address.split(":")[2]} key={index}>
|
||||||
|
{address.split(":")[2]}
|
||||||
|
</MenuItem>
|
||||||
|
))}
|
||||||
|
</Select>
|
||||||
|
{Boolean(cosmosAddress) && (
|
||||||
|
<div>
|
||||||
|
<Box
|
||||||
|
sx={{
|
||||||
|
backgroundColor: "lightgray",
|
||||||
|
padding: 3,
|
||||||
|
wordWrap: "break-word",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<pre style={{ whiteSpace: "pre-wrap", margin: 0 }}>
|
||||||
|
{/* TODO: Use replacer for Uint8 array */}
|
||||||
|
{JSON.stringify(createValidatorMessage, null, 2)}{" "}
|
||||||
|
</pre>
|
||||||
|
</Box>
|
||||||
|
<Box
|
||||||
|
marginTop={1}
|
||||||
|
>
|
||||||
|
<LoadingButton
|
||||||
|
variant="contained"
|
||||||
|
onClick={async () => {
|
||||||
|
await sendTransaction(createValidatorMessage);
|
||||||
|
}}
|
||||||
|
loading={isLoading}
|
||||||
|
>
|
||||||
|
Send transaction
|
||||||
|
</LoadingButton>
|
||||||
|
</Box>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user