Skip to content

Commit 748767d

Browse files
authored
docs: fix and simplify button handler example (#1054)
## Summary Fix incorrect event handler in README and improve code clarity ## Problem The example code from the README didn't work when implemented - the `handleClick` was returning functions instead of executing them. ## Solution This PR makes the handler execute functions directly for a more straightforward implementation. Since handler functions from `useWalletMultiButton` can be `undefined`, the code uses optional chaining for concise null checks. The higher-order function pattern was removed to prioritize readability in the example.
1 parent e25e797 commit 748767d

File tree

1 file changed

+19
-15
lines changed

1 file changed

+19
-15
lines changed

packages/core/react/README.md

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -57,23 +57,27 @@ function CustomConnectButton() {
5757
label = 'Select Wallet';
5858
break;
5959
}
60-
const handleClick = useCallback(() => {
61-
switch (buttonState) {
62-
case 'connected':
63-
return onDisconnect;
64-
case 'connecting':
65-
case 'disconnecting':
66-
break;
67-
case 'has-wallet':
68-
return onConnect;
69-
case 'no-wallet':
70-
return onSelectWallet;
71-
break;
72-
}
73-
}, [buttonState, onDisconnect, onConnect, onSelectWallet]);
7460
return (
7561
<>
76-
<button disabled={buttonState === 'connecting' || buttonState === 'disconnecting'} onClick={handleClick}>
62+
<button
63+
disabled={buttonState === 'connecting' || buttonState === 'disconnecting'}
64+
onClick={() => {
65+
switch (buttonState) {
66+
case 'connected':
67+
onDisconnect?.();
68+
break;
69+
case 'connecting':
70+
case 'disconnecting':
71+
break;
72+
case 'has-wallet':
73+
onConnect?.();
74+
break;
75+
case 'no-wallet':
76+
onSelectWallet?.();
77+
break;
78+
}
79+
}}
80+
>
7781
{label}
7882
</button>
7983
{walletModalConfig ? (

0 commit comments

Comments
 (0)