From c250f1d344082b1d494f2e9f1d78d61367cb853b Mon Sep 17 00:00:00 2001 From: Tomas Rawski Date: Thu, 3 Oct 2024 00:06:41 -0300 Subject: [PATCH] fix errors with hooks --- .../javascript/solana/about/programs.mdx | 2 +- docs/appkit/next/core/hooks.mdx | 1 - docs/appkit/next/ethers5/hooks.mdx | 14 -- docs/appkit/next/solana/about/programs.mdx | 2 +- docs/appkit/react/core/hooks.mdx | 157 +++++++----------- docs/appkit/react/core/open.mdx | 48 ++++++ docs/appkit/react/ethers/hooks.mdx | 14 -- docs/appkit/react/solana/about/programs.mdx | 2 +- docs/appkit/react/solana/hooks.mdx | 12 -- docs/appkit/vue/solana/programs.mdx | 2 +- 10 files changed, 108 insertions(+), 146 deletions(-) create mode 100644 docs/appkit/react/core/open.mdx diff --git a/docs/appkit/javascript/solana/about/programs.mdx b/docs/appkit/javascript/solana/about/programs.mdx index 668688d2..28763dbb 100644 --- a/docs/appkit/javascript/solana/about/programs.mdx +++ b/docs/appkit/javascript/solana/about/programs.mdx @@ -23,7 +23,7 @@ function deserializeCounterAccount(data) { } } -const { address, currentChain } = useAppKitAccount() +const { address } = useAppKitAccount() const { walletProvider, connection } = useAppKitProvider() async function onIncrementCounter() { diff --git a/docs/appkit/next/core/hooks.mdx b/docs/appkit/next/core/hooks.mdx index a95d783a..abfc6eaa 100644 --- a/docs/appkit/next/core/hooks.mdx +++ b/docs/appkit/next/core/hooks.mdx @@ -41,7 +41,6 @@ export default function Component() { - ## useDisconnect diff --git a/docs/appkit/next/ethers5/hooks.mdx b/docs/appkit/next/ethers5/hooks.mdx index 11924a78..4081d744 100644 --- a/docs/appkit/next/ethers5/hooks.mdx +++ b/docs/appkit/next/ethers5/hooks.mdx @@ -1,19 +1,5 @@ import Button from '../../../components/button' -### useAppKitAccount - -Hook that returns the client's information. - -```tsx -import { useAppKitAccount } from '@reown/appkit/react' - -function Components() { - const { address, chainId, isConnected } = useAppKitAccount() - - //... -} -``` - ### switchNetwork ```tsx diff --git a/docs/appkit/next/solana/about/programs.mdx b/docs/appkit/next/solana/about/programs.mdx index 13da8c73..11e10302 100644 --- a/docs/appkit/next/solana/about/programs.mdx +++ b/docs/appkit/next/solana/about/programs.mdx @@ -23,7 +23,7 @@ function deserializeCounterAccount(data?: Buffer): { count: number } { } } -const { address, currentChain } = useAppKitAccount() +const { address } = useAppKitAccount() const { walletProvider, connection } = useAppKitProvider() async function onIncrementCounter() { diff --git a/docs/appkit/react/core/hooks.mdx b/docs/appkit/react/core/hooks.mdx index 2c88d352..5e63b693 100644 --- a/docs/appkit/react/core/hooks.mdx +++ b/docs/appkit/react/core/hooks.mdx @@ -4,136 +4,108 @@ import PlatformTabItem from '../../../components/PlatformTabItem' import WagmiHooks from '../wagmi/hooks.mdx' import EthersHooks from '../ethers/hooks.mdx' -import SolanaHooks from '../solana/hooks.mdx' + +import OpenModal from './open.mdx' # Hooks Hooks are functions that will help you control the modal, subscribe to wallet events and interact with them and smart contracts. -## useAppKit +## useAppKitAccount -Control the modal with the `useAppKit` hook +Hook for accessing account data and connection status. - - +List of possible `status`: "reconnecting" | "connected" | "disconnected" | "connecting" | undefined -```ts -import { useAppKit } from '@reown/appkit/react' +The `caipAddress` is composed by `network:chainId:address`. An Example for an Ethereum mainnet address is eip155:1:0xab16a96D359eC26a11e2C2b3d8f8B8942d5Bfcdb -export default function Component() { - const { open, close } = useAppKit() - - open() +```ts +import { useAppKitAccount } from "@reown/appkit/react"; - //... +export default Component(){ + const { address, isConnected, caipAddress, status } = useAppKitAccount() } ``` - - +## useAppKit + +Control the modal with the `useAppKit` hook ```ts -import { useAppKit } from '@reown/appkit/react' +import { useAppKit } from "@reown/appkit/react"; export default function Component() { const { open, close } = useAppKit() - - open() - - //... } ``` - - - -```ts -import { useAppKit } from '@reown/appkit/react' + -export default function Component() { - const { open, close } = useAppKit() +## useDisconnect - open() + - //... -} -``` + - - +To disconnect the session call the wagmi hook: ```ts -import { useAppKit } from '@reown/appkit/react' +import { useDisconnect } from 'wagmi' -export default function Component() { - const { open, close } = useAppKit() +const { disconnect } = useDisconnect() - open() +disconnect() +``` + + - //... -} +To disconnect the session using a hook in ethers v5, you need to install this package and use the `useDisconnect` hook in this way: + +```bash npm2yarn +npm install @reown/appkit-ethers5 ``` +```ts +import { useDisconnect } from '@reown/appkit-ethers5/react' + +const { disconnect } = useDisconnect() + +disconnect() +``` - + -You can also select the modal's view when calling the `open` function +To disconnect the session using a hook in ethers, you need to install this package and use the `useDisconnect` hook in this way: -```ts -open({ view: 'Account' }) +```bash npm2yarn +npm install @reown/appkit-ethers ``` -List of views you can select +```ts +import { useDisconnect } from '@reown/appkit-ethers/react' - +const { disconnect } = useDisconnect() -## useDisconnect +disconnect() +``` + + + +To disconnect the session using a hook in Solana, you need to install this package and use the `useDisconnect` hook in this way: + +```bash npm2yarn +npm install @reown/appkit-solana +``` ```ts -// import useDisconnect from wagmi if on EVM -//import useDisconnect from @reown/appkit-solana/react if on Solana +import { useDisconnect } from '@reown/appkit-solana/react' const { disconnect } = useDisconnect() disconnect() ``` + + ## useWalletInfo @@ -153,23 +125,6 @@ export default Component(){ ``` -## useAppKitAccount - -Hook for accessing account data and connection status. - -List of possible status: "reconnecting" | "connected" | "disconnected" | "connecting" | undefined - -```ts -import { useAppKitAccount } from "@reown/appkit/react"; - - -export default Component(){ - const { address, isConnected, status } = useAppKitAccount() - - //... -} -``` - ## Ethereum Library diff --git a/docs/appkit/react/core/open.mdx b/docs/appkit/react/core/open.mdx new file mode 100644 index 00000000..ac995236 --- /dev/null +++ b/docs/appkit/react/core/open.mdx @@ -0,0 +1,48 @@ +import Table from '../../../components/Table' + +You can also select the modal's view when calling the `open` function + +```ts +open({ view: 'Account' }) +``` + +List of views you can select + +
\ No newline at end of file diff --git a/docs/appkit/react/ethers/hooks.mdx b/docs/appkit/react/ethers/hooks.mdx index c2a8ac2e..4081d744 100644 --- a/docs/appkit/react/ethers/hooks.mdx +++ b/docs/appkit/react/ethers/hooks.mdx @@ -1,19 +1,5 @@ import Button from '../../../components/button' -### useAppKitAccount - -Hook that returns the client's information. - -```tsx -import { useAppKitAccount } from '@reown/base/react' - -function Components() { - const { address, status, isConnected } = useAppKitAccount() - - //... -} -``` - ### switchNetwork ```tsx diff --git a/docs/appkit/react/solana/about/programs.mdx b/docs/appkit/react/solana/about/programs.mdx index 13da8c73..11e10302 100644 --- a/docs/appkit/react/solana/about/programs.mdx +++ b/docs/appkit/react/solana/about/programs.mdx @@ -23,7 +23,7 @@ function deserializeCounterAccount(data?: Buffer): { count: number } { } } -const { address, currentChain } = useAppKitAccount() +const { address } = useAppKitAccount() const { walletProvider, connection } = useAppKitProvider() async function onIncrementCounter() { diff --git a/docs/appkit/react/solana/hooks.mdx b/docs/appkit/react/solana/hooks.mdx index 963dc39a..09655dac 100644 --- a/docs/appkit/react/solana/hooks.mdx +++ b/docs/appkit/react/solana/hooks.mdx @@ -47,15 +47,3 @@ function SignMessage() { return } ``` - -### useAppKitError - -```ts -import { useAppKitError } from '@reown/solana/react' - -function Components() { - const { error } = useAppKitError() - - //... -} -``` diff --git a/docs/appkit/vue/solana/programs.mdx b/docs/appkit/vue/solana/programs.mdx index 5de1a72c..36adb802 100644 --- a/docs/appkit/vue/solana/programs.mdx +++ b/docs/appkit/vue/solana/programs.mdx @@ -17,7 +17,7 @@ import { useAppKitAccount, useAppKitProvider } from '@reown/appkit/vue' export default { setup() { const counterMessage = ref(''); - const { address, currentChain } = useAppKitAccount(); + const { address } = useAppKitAccount(); const { walletProvider, connection } = useAppKitProvider(); function deserializeCounterAccount(data) {