Skip to content

Commit 9db59ee

Browse files
webmaster128webmaster128
authored
Merge pull request #22 from CosmWasm/upgrade-cosmjs
Upgrade to CosmJS v0.25
2 parents ee64885 + f5dbc76 commit 9db59ee

19 files changed

+236
-220
lines changed

‎package.json

+25-23
Original file line numberDiff line numberDiff line change
@@ -3,29 +3,6 @@
33
"version": "0.1.0",
44
"private": true,
55
"license": "Apache-2.0",
6-
"dependencies": {
7-
"@cosmjs/cosmwasm": "^0.24.0-alpha.22",
8-
"@cosmjs/encoding": "^0.24.0-alpha.22",
9-
"@cosmjs/launchpad": "^0.24.0-alpha.22",
10-
"@cosmjs/math": "^0.24.0-alpha.22",
11-
"@cosmjs/stargate": "^0.24.0-alpha.22",
12-
"@cosmjs/tendermint-rpc": "^0.24.0-alpha.22",
13-
"@cosmjs/utils": "^0.24.0-alpha.22",
14-
"@testing-library/jest-dom": "^5.11.4",
15-
"@testing-library/react": "^11.1.0",
16-
"@testing-library/user-event": "^12.1.10",
17-
"@types/jest": "^26.0.15",
18-
"@types/node": "^12.0.0",
19-
"@types/react": "^16.9.53",
20-
"@types/react-dom": "^16.9.8",
21-
"react": "^17.0.1",
22-
"react-dom": "^17.0.1",
23-
"react-router-dom": "^5.2.0",
24-
"react-scripts": "4.0.0",
25-
"tailwindcss": "^1.9.6",
26-
"typescript": "^4.0.3",
27-
"web-vitals": "^0.2.4"
28-
},
296
"scripts": {
307
"build:tailwind": "tailwindcss build src/index.css -o src/tailwind.output.css",
318
"prebuild": "NODE_ENV=production yarn build:tailwind",
@@ -36,6 +13,7 @@
3613
"start:base": "react-scripts start",
3714
"start": "yarn start:musselnet",
3815
"start:musselnet": "REACT_APP_NETWORK=musselnet yarn start:base",
16+
"start:oysternet": "REACT_APP_NETWORK=oysternet yarn start:base",
3917
"test": "react-scripts test",
4018
"eject": "react-scripts eject"
4119
},
@@ -54,6 +32,30 @@
5432
"last 1 safari version"
5533
]
5634
},
35+
"dependencies": {
36+
"@cosmjs/cosmwasm": "^0.25.4",
37+
"@cosmjs/encoding": "^0.25.4",
38+
"@cosmjs/launchpad": "^0.25.4",
39+
"@cosmjs/math": "^0.25.4",
40+
"@cosmjs/stargate": "^0.25.4",
41+
"@cosmjs/tendermint-rpc": "^0.25.4",
42+
"@cosmjs/utils": "^0.25.4",
43+
"@testing-library/jest-dom": "^5.11.4",
44+
"@testing-library/react": "^11.1.0",
45+
"@testing-library/user-event": "^12.1.10",
46+
"@types/jest": "^26.0.15",
47+
"@types/node": "^12.0.0",
48+
"@types/react": "^16.9.53",
49+
"@types/react-dom": "^16.9.8",
50+
"long": "^4.0.0",
51+
"react": "^17.0.1",
52+
"react-dom": "^17.0.1",
53+
"react-router-dom": "^5.2.0",
54+
"react-scripts": "4.0.0",
55+
"tailwindcss": "^1.9.6",
56+
"typescript": "^4.0.3",
57+
"web-vitals": "^0.2.4"
58+
},
5759
"devDependencies": {
5860
"@types/react-router-dom": "^5.1.6",
5961
"@typescript-eslint/eslint-plugin": "^4.7.0",

‎src/App/components/ChannelCounterpartyData.tsx

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from "react";
2+
3+
import { IbcChannelCounterparty } from "../../types/ibc";
4+
import { style } from "../style";
5+
6+
interface CounterpartyDataProps {
7+
readonly counterparty?: IbcChannelCounterparty | null;
8+
}
9+
10+
export function CounterpartyData({ counterparty }: CounterpartyDataProps): JSX.Element {
11+
return (
12+
<div className="flex flex-col m-2 ml-0">
13+
<span className={style.subtitle}>Counterparty</span>
14+
{counterparty?.portId && <span>Port ID: {counterparty.portId}</span>}
15+
{counterparty?.channelId && <span>Channel ID: {counterparty.channelId}</span>}
16+
</div>
17+
);
18+
}

‎src/App/components/ConnectionCounterpartyData.tsx

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { toHex } from "@cosmjs/encoding";
2+
import React from "react";
3+
4+
import { IbcConnectionCounterparty } from "../../types/ibc";
5+
import { style } from "../style";
6+
7+
interface CounterpartyDataProps {
8+
readonly counterparty?: IbcConnectionCounterparty | null;
9+
}
10+
11+
export function CounterpartyData({ counterparty }: CounterpartyDataProps): JSX.Element {
12+
return (
13+
<div className="flex flex-col m-2 ml-0">
14+
<span className={style.subtitle}>Counterparty</span>
15+
{counterparty?.clientId && <span>Client ID: {counterparty.clientId}</span>}
16+
{counterparty?.connectionId && <span>Connection ID: {counterparty.connectionId}</span>}
17+
{counterparty?.prefix?.keyPrefix?.length ? (
18+
<span>Prefix: {toHex(counterparty?.prefix?.keyPrefix)}</span>
19+
) : null}
20+
</div>
21+
);
22+
}

‎src/App/components/CounterpartyData.tsx

-24
This file was deleted.

‎src/App/routes/Acknowledgement/index.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export function Acknowledgement(): JSX.Element {
2525
const sequenceNumber = Number.parseInt(sequence, 10);
2626

2727
(async function updateAckResponse() {
28-
const ackResponse = await getClient().ibc.unverified.packetAcknowledgement(
28+
const ackResponse = await getClient().ibc.channel.packetAcknowledgement(
2929
portId,
3030
channelId,
3131
sequenceNumber,
@@ -38,9 +38,9 @@ export function Acknowledgement(): JSX.Element {
3838
<div className="container mx-auto flex flex-col">
3939
<Navigation />
4040
<span className={style.title}>Data</span>
41-
{portId ? <span>Port ID: {portId}</span> : null}
42-
{channelId ? <span>Channel ID: {channelId}</span> : null}
43-
{sequence ? <span>Sequence: {sequence}</span> : null}
41+
{portId && <span>Port ID: {portId}</span>}
42+
{channelId && <span>Channel ID: {channelId}</span>}
43+
{sequence && <span>Sequence: {sequence}</span>}
4444
{ackResponse?.acknowledgement ? (
4545
<div className="flex flex-col">
4646
<span>Proof: {ackResponse.proof?.length ? toHex(ackResponse.proof) : "–"}</span>

‎src/App/routes/Channel/AcknowledgementsList.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -27,11 +27,11 @@ export function AcknowledgementsList({
2727

2828
useEffect(() => {
2929
(async function updatePacketAcknowledgementsResponse() {
30-
const acketAcknowledgementsResponse = await getClient().ibc.unverified.packetAcknowledgements(
30+
const packetAcknowledgementsResponse = await getClient().ibc.channel.packetAcknowledgements(
3131
portId,
3232
channelId,
3333
);
34-
setPacketAcknowledgementsResponse(acketAcknowledgementsResponse);
34+
setPacketAcknowledgementsResponse(packetAcknowledgementsResponse);
3535
})();
3636
}, [getClient, portId, channelId]);
3737

‎src/App/routes/Channel/ChannelData.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import React, { useEffect, useState } from "react";
44
import { useClient } from "../../../contexts/ClientContext";
55
import { IbcChannelResponse } from "../../../types/ibc";
66
import { printIbcChannelState, printIbcOrder } from "../../../utils/ibc";
7-
import { CounterpartyData } from "../../components/CounterpartyData";
7+
import { CounterpartyData } from "../../components/ChannelCounterpartyData";
88
import { HeightData } from "../../components/HeightData";
99
import { style } from "../../style";
1010

@@ -19,16 +19,16 @@ export function ChannelData({ portId, channelId }: ChannelDataProps): JSX.Elemen
1919

2020
useEffect(() => {
2121
(async function updateChannelResponse() {
22-
const channelResponse = await getClient().ibc.unverified.channel(portId, channelId);
22+
const channelResponse = await getClient().ibc.channel.channel(portId, channelId);
2323
setChannelResponse(channelResponse);
2424
})();
2525
}, [getClient, portId, channelId]);
2626

2727
return channelResponse?.channel ? (
2828
<div>
2929
<div className={style.title}>Data</div>
30-
{portId ? <div>Port ID: {portId}</div> : null}
31-
{channelId ? <div>Channel ID: {channelId}</div> : null}
30+
{portId && <div>Port ID: {portId}</div>}
31+
{channelId && <div>Channel ID: {channelId}</div>}
3232
<div>Proof: {channelResponse.proof?.length ? toHex(channelResponse.proof) : "–"}</div>
3333
<HeightData height={channelResponse.proofHeight} />
3434
<div className="flex flex-col">
@@ -39,7 +39,7 @@ export function ChannelData({ portId, channelId }: ChannelDataProps): JSX.Elemen
3939
<span>
4040
Ordering: {channelResponse.channel.ordering ? printIbcOrder(channelResponse.channel.ordering) : "–"}
4141
</span>
42-
<CounterpartyData counterparty={channelResponse.channel.counterparty} />
42+
<CounterpartyData counterparty={channelResponse.channel.counterparty ?? null} />
4343
<span>
4444
Connection hops:{" "}
4545
{channelResponse.channel.connectionHops ? channelResponse.channel.connectionHops.join(", ") : "–"}

‎src/App/routes/Channel/CommitmentsList.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export function CommitmentsList({ connectionId, portId, channelId }: Commitments
2121

2222
useEffect(() => {
2323
(async function updatePacketCommitmentsResponse() {
24-
const packetCommitmentsResponse = await getClient().ibc.unverified.packetCommitments(portId, channelId);
24+
const packetCommitmentsResponse = await getClient().ibc.channel.packetCommitments(portId, channelId);
2525
setPacketCommitmentsResponse(packetCommitmentsResponse);
2626
})();
2727
}, [getClient, portId, channelId]);

‎src/App/routes/Channel/NextSequenceReceiveData.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export function NextSequenceReceiveData({ portId, channelId }: NextSequenceRecei
1717

1818
useEffect(() => {
1919
(async function updateNextSequenceReceiveResponse() {
20-
const nextSequenceReceiveResponse = await getClient().ibc.unverified.nextSequenceReceive(
20+
const nextSequenceReceiveResponse = await getClient().ibc.channel.nextSequenceReceive(
2121
portId,
2222
channelId,
2323
);

‎src/App/routes/Channel/UnreceivedAcksList.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export function UnreceivedAcksList({ portId, channelId, sequence }: UnreceivedAc
1616

1717
useEffect(() => {
1818
(async function updateUnreceivedAcksResponse() {
19-
const unreceivedAcksResponse = await getClient().ibc.unverified.unreceivedAcks(portId, channelId, [
19+
const unreceivedAcksResponse = await getClient().ibc.channel.unreceivedAcks(portId, channelId, [
2020
sequence,
2121
]);
2222
setUnreceivedAcksResponse(unreceivedAcksResponse);

‎src/App/routes/Channel/UnreceivedPacketsList.tsx

+3-5
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,9 @@ export function UnreceivedPacketsList({
2020

2121
useEffect(() => {
2222
(async function updateUnreceivedPacketsResponse() {
23-
const unreceivedPacketsResponse = await getClient().ibc.unverified.unreceivedPackets(
24-
portId,
25-
channelId,
26-
[sequence],
27-
);
23+
const unreceivedPacketsResponse = await getClient().ibc.channel.unreceivedPackets(portId, channelId, [
24+
sequence,
25+
]);
2826
setUnreceivedPacketsResponse(unreceivedPacketsResponse);
2927
})();
3028
}, [getClient, portId, channelId, sequence]);

‎src/App/routes/Commitment/index.tsx

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { toHex } from "@cosmjs/encoding";
2+
import Long from "long";
23
import React, { useEffect, useState } from "react";
34
import { useParams } from "react-router-dom";
45

@@ -25,10 +26,10 @@ export function Commitment(): JSX.Element {
2526
const sequenceNumber = Number.parseInt(sequence, 10);
2627

2728
(async function updateCommitmentResponse() {
28-
const commitmentResponse = await getClient().ibc.unverified.packetCommitment(
29+
const commitmentResponse = await getClient().ibc.channel.packetCommitment(
2930
portId,
3031
channelId,
31-
sequenceNumber,
32+
Long.fromNumber(sequenceNumber),
3233
);
3334
setCommitmentResponse(commitmentResponse);
3435
})();
@@ -38,9 +39,9 @@ export function Commitment(): JSX.Element {
3839
<div className="container mx-auto flex flex-col">
3940
<Navigation />
4041
<span className={style.title}>Data</span>
41-
{portId ? <span>Port ID: {portId}</span> : null}
42-
{channelId ? <span>Channel ID: {channelId}</span> : null}
43-
{sequence ? <span>Sequence: {sequence}</span> : null}
42+
{portId && <span>Port ID: {portId}</span>}
43+
{channelId && <span>Channel ID: {channelId}</span>}
44+
{sequence && <span>Sequence: {sequence}</span>}
4445
{commitmentResponse?.commitment ? (
4546
<div className="flex flex-col">
4647
<span>Proof: {commitmentResponse.proof?.length ? toHex(commitmentResponse.proof) : "–"}</span>

‎src/App/routes/Connection/ChannelsList.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -22,15 +22,15 @@ export function ChannelsList({ connectionId }: ChannelsListProps): JSX.Element {
2222

2323
useEffect(() => {
2424
(async function updateChannelsResponse() {
25-
const channelsResponse = await getClient().ibc.unverified.connectionChannels(connectionId);
25+
const channelsResponse = await getClient().ibc.channel.connectionChannels(connectionId);
2626
setChannelsResponse(channelsResponse);
2727
})();
2828
}, [connectionId, getClient]);
2929

3030
async function loadMoreChannels(): Promise<void> {
3131
if (!channelsResponse?.pagination?.nextKey?.length) return;
3232

33-
const newChannelsResponse = await getClient().ibc.unverified.connectionChannels(
33+
const newChannelsResponse = await getClient().ibc.channel.connectionChannels(
3434
connectionId,
3535
channelsResponse.pagination.nextKey,
3636
);

‎src/App/routes/Connection/ConnectionData.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import React, { useEffect, useState } from "react";
44
import { useClient } from "../../../contexts/ClientContext";
55
import { IbcConnectionResponse } from "../../../types/ibc";
66
import { printIbcConnectionState } from "../../../utils/ibc";
7-
import { CounterpartyData } from "../../components/CounterpartyData";
7+
import { CounterpartyData } from "../../components/ConnectionCounterpartyData";
88
import { HeightData } from "../../components/HeightData";
99
import { style } from "../../style";
1010

@@ -18,15 +18,15 @@ export function ConnectionData({ connectionId }: ConnectionDataProps): JSX.Eleme
1818

1919
useEffect(() => {
2020
(async function updateConnectionResponse() {
21-
const connectionResponse = await getClient().ibc.unverified.connection(connectionId);
21+
const connectionResponse = await getClient().ibc.connection.connection(connectionId);
2222
setConnectionResponse(connectionResponse);
2323
})();
2424
}, [getClient, connectionId]);
2525

2626
return connectionResponse?.connection ? (
2727
<div>
2828
<div className={style.title}>Data</div>
29-
{connectionId ? <div>Connection ID: {connectionId}</div> : null}
29+
{connectionId && <div>Connection ID: {connectionId}</div>}
3030
<div>Proof: {connectionResponse.proof?.length ? toHex(connectionResponse.proof) : "–"}</div>
3131
<HeightData height={connectionResponse.proofHeight} />
3232
<div className="flex flex-col">
@@ -50,7 +50,7 @@ export function ConnectionData({ connectionId }: ConnectionDataProps): JSX.Eleme
5050
) : (
5151
<span className={style.subtitle}>No versions found</span>
5252
)}
53-
<CounterpartyData counterparty={connectionResponse.connection.counterparty} />
53+
<CounterpartyData counterparty={connectionResponse.connection.counterparty ?? null} />
5454
</div>
5555
</div>
5656
) : (

‎src/App/routes/Connections/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export function Connections(): JSX.Element {
3030

3131
useEffect(() => {
3232
(async function updateConnectionsResponse() {
33-
const connectionsResponse = await getClient().ibc.unverified.connections();
33+
const connectionsResponse = await getClient().ibc.connection.connections();
3434
setConnectionsResponse(connectionsResponse);
3535

3636
const nonEmptyClientIds =
@@ -48,7 +48,7 @@ export function Connections(): JSX.Element {
4848
async function loadMoreConnections(): Promise<void> {
4949
if (!connectionsResponse?.pagination?.nextKey?.length) return;
5050

51-
const newConnectionsResponse = await getClient().ibc.unverified.connections(
51+
const newConnectionsResponse = await getClient().ibc.connection.connections(
5252
connectionsResponse.pagination.nextKey,
5353
);
5454

‎src/config.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,11 @@ const musselnet: AppConfig = {
1515
rpcUrl: "https://rpc.musselnet.cosmwasm.com",
1616
};
1717

18-
const configs: NetworkConfigs = { local, musselnet };
18+
const oysternet: AppConfig = {
19+
rpcUrl: "rpc.oysternet.cosmwasm.com",
20+
};
21+
22+
const configs: NetworkConfigs = { local, musselnet, oysternet };
1923

2024
function getAppConfig(): AppConfig {
2125
const network = process.env.REACT_APP_NETWORK;

‎src/contexts/ClientContext.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { IbcExtension, QueryClient, setupIbcExtension } from "@cosmjs/stargate";
2-
import { adaptor34, Client as TendermintClient } from "@cosmjs/tendermint-rpc";
2+
import { Tendermint34Client } from "@cosmjs/tendermint-rpc";
33
import React, { useEffect } from "react";
44

55
import { config } from "../config";
@@ -21,14 +21,14 @@ const ClientContext = React.createContext<ClientContextType>(defaultClientContex
2121
export const useClient = (): ClientContextType => React.useContext(ClientContext);
2222

2323
export function ClientProvider({ children }: React.HTMLAttributes<HTMLOrSVGElement>): JSX.Element {
24-
const [tmClient, setTmClient] = React.useState<TendermintClient>();
24+
const [tmClient, setTmClient] = React.useState<Tendermint34Client>();
2525
const [ibcClient, setIbcClient] = React.useState<IbcClient>();
2626
const [value, setValue] = React.useState<ClientContextType>(defaultClientContext);
2727
const [clientsAvailable, setClientsAvailable] = React.useState(false);
2828

2929
useEffect(() => {
3030
(async function updateTmClient() {
31-
const tmClient = await TendermintClient.connect(config.rpcUrl, adaptor34);
31+
const tmClient = await Tendermint34Client.connect(config.rpcUrl);
3232
setTmClient(tmClient);
3333
})();
3434
}, []);

0 commit comments

Comments
 (0)