Skip to content

Use cached wallet_getCapabilities #542

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 24, 2024
Merged
Show file tree
Hide file tree
Changes from all 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
31 changes: 19 additions & 12 deletions advanced/dapps/react-dapp-v2/src/contexts/JsonRpcContext.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export function JsonRpcContextProvider({
const [pending, setPending] = useState(false);
const [result, setResult] = useState<IFormattedRpcResponse | null>();
const [isTestnet, setIsTestnet] = useState(getLocalStorageTestnetFlag());

const [lastTxId, setLastTxId] = useState<`0x${string}`>()
const [kadenaAccount, setKadenaAccount] = useState<KadenaAccount | null>(
null
);
Expand Down Expand Up @@ -517,16 +517,21 @@ export function JsonRpcContextProvider({
);
}

const params = [address]
// The wallet_getCapabilities "caching" should ultimately move into the provider.
// check the session.sessionProperties first for capabilities
const capabilitiesJson = session?.sessionProperties?.['capabilities']
const walletCapabilities = capabilitiesJson && JSON.parse(capabilitiesJson)
let capabilities = walletCapabilities[address] as GetCapabilitiesResult|undefined
// send request for wallet_getCapabilities
const capabilities = await client!.request<GetCapabilitiesResult>({
topic: session!.topic,
chainId,
request: {
method: DEFAULT_EIP5792_METHODS.WALLET_GET_CAPABILITIES,
params: params,
},
});
if(!capabilities)
capabilities = await client!.request<GetCapabilitiesResult>({
topic: session!.topic,
chainId,
request: {
method: DEFAULT_EIP5792_METHODS.WALLET_GET_CAPABILITIES,
params: [address],
},
});

// format displayed result
return {
Expand All @@ -548,8 +553,8 @@ export function JsonRpcContextProvider({
`Missing rpcProvider definition for chainId: ${chainId}`
);
}
//hardcoded valid userOpHash
const params = ['0xbab6e5b397964c0d867ccef539f929cb7ed2d0da3ae128a81ba8804bd92c572a']
if(lastTxId === undefined) throw new Error(`Last transaction ID is undefined, make sure previous call to sendCalls returns successfully. `);
const params = [lastTxId]
// send request for wallet_getCallsStatus
const getCallsStatusResult = await client!.request<GetCallsResult>({
topic: session!.topic,
Expand Down Expand Up @@ -607,6 +612,8 @@ export function JsonRpcContextProvider({
params: [sendCallsRequestParams],
},
});
// store the last transactionId to use it for wallet_getCallsReceipt
setLastTxId((txId && txId.startsWith('0x')) ? txId as `0x${string}` : undefined)
// format displayed result
return {
method: DEFAULT_EIP5792_METHODS.WALLET_SEND_CALLS,
Expand Down
52 changes: 52 additions & 0 deletions advanced/dapps/react-dapp-v2/src/modals/RequestLoaderModal.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import * as React from "react";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks very similar to the old one - why a new one?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

its just some text changes on the modal, it don't need any approval or reject action on wallet side.
I can refactor the old one to take these messages as props.


import Loader from "../components/Loader";
import { SContainer, STable, SRow, SKey, SValue } from "../components/shared";

import { SModalContainer, SModalTitle, SModalParagraph } from "./shared";

interface RequestModalProps {
pending: boolean;
result: any;
}

const RequestLoaderModal = (props: RequestModalProps) => {
const { pending, result } = props;
return (
<>
{pending ? (
<SModalContainer>
<SModalTitle>{"Pending JSON-RPC Request"}</SModalTitle>
<SContainer>
<Loader />
<SModalParagraph>
{"Waiting response from your wallet"}
</SModalParagraph>
</SContainer>
</SModalContainer>
) : result ? (
<SModalContainer>
<SModalTitle>
{result.valid
? "JSON-RPC Request Success"
: "JSON-RPC Request Failed"}
</SModalTitle>
<STable>
{Object.keys(result).map((key) => (
<SRow key={key}>
<SKey>{key}</SKey>
<SValue>{result[key].toString()}</SValue>
</SRow>
))}
</STable>
</SModalContainer>
) : (
<SModalContainer>
<SModalTitle>{"JSON-RPC Request Failed"}</SModalTitle>
</SModalContainer>
)}
</>
);
};

export default RequestLoaderModal;
6 changes: 5 additions & 1 deletion advanced/dapps/react-dapp-v2/src/pages/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ import Icon from "../components/Icon";
import OriginSimulationDropdown from "../components/OriginSimulationDropdown";
import LoaderModal from "../modals/LoaderModal";
import { numberToHex } from "@walletconnect/encoding";
import RequestLoaderModal from "../modals/RequestLoaderModal";

// Normal import does not work here
const { version } = require("@walletconnect/sign-client/package.json");
Expand All @@ -58,6 +59,7 @@ const Home: NextPage = () => {
const openPairingModal = () => setModal("pairing");
const openPingModal = () => setModal("ping");
const openRequestModal = () => setModal("request");
const openRequestLoaderModal = () => setModal("requestLoader");
const openDisconnectModal = () => setModal("disconnect");

// Initialize the WalletConnect client.
Expand Down Expand Up @@ -194,7 +196,7 @@ const Home: NextPage = () => {
[DEFAULT_EIP5792_METHODS.WALLET_GET_CAPABILITIES]: {
method: DEFAULT_EIP5792_METHODS.WALLET_GET_CAPABILITIES,
callback: async (chainId: string, address: string) => {
openRequestModal();
openRequestLoaderModal();
await ethereumRpc.testWalletGetCapabilities(chainId, address);
},
},
Expand Down Expand Up @@ -500,6 +502,8 @@ const Home: NextPage = () => {
);
case "ping":
return <PingModal pending={isRpcRequestPending} result={rpcResult} />;
case "requestLoader":
return <RequestLoaderModal pending={isRpcRequestPending} result={rpcResult} />;
case "disconnect":
return <LoaderModal title={"Disconnecting..."} />;
default:
Expand Down
Loading