@iota/dapp-kit 0.7.0 → 0.8.0

package/src/components/ConnectButton.tsx

@@ -3,6 +3,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { ReactNode } from 'react';
+import type { WalletWithRequiredFeatures } from '@iota/wallet-standard';
 
 import { useCurrentAccount } from '../hooks/wallet/useCurrentAccount.js';
 import { AccountDropdownMenu } from './AccountDropdownMenu.js';
@@ -14,12 +15,14 @@ type ConnectButtonProps = {
     connectText?: ReactNode;
     size?: React.ComponentProps<typeof Button>['size'];
     iotaNamesEnabled?: boolean;
+    onConnected?: (params: { wallet: WalletWithRequiredFeatures }) => void;
 } & React.ComponentProps<typeof Button>;
 
 export function ConnectButton({
     connectText = 'Connect Wallet',
     size,
     iotaNamesEnabled = true,
+    onConnected,
     ...buttonProps
 }: ConnectButtonProps) {
     const currentAccount = useCurrentAccount();
@@ -31,6 +34,7 @@ export function ConnectButton({
         />
     ) : (
         <ConnectModal
+            onConnected={onConnected}
             trigger={
                 <StyleMarker>
                     <Button {...buttonProps} size={size}>

package/src/components/connect-modal/ConnectModal.tsx

@@ -45,13 +45,23 @@ type UncontrolledModalProps = {
 type ConnectModalProps = {
     /** The trigger button that opens the dialog. */
     trigger: NonNullable<ReactNode>;
+
+    onConnected?: (params: { wallet: WalletWithRequiredFeatures }) => void;
 } & (ControlledModalProps | UncontrolledModalProps);
 
-export function ConnectModal({ trigger, open, defaultOpen, onOpenChange }: ConnectModalProps) {
+export function ConnectModal({
+    trigger,
+    open,
+    defaultOpen,
+    onOpenChange,
+    onConnected,
+}: ConnectModalProps) {
     const [isModalOpen, setModalOpen] = useState(open ?? defaultOpen);
     const [currentView, setCurrentView] = useState<ConnectModalView>();
     const [selectedWallet, setSelectedWallet] = useState<WalletWithRequiredFeatures>();
-    const { mutate, isError } = useConnectWallet();
+    const { mutate, isError } = useConnectWallet({
+        onConnected,
+    });
 
     const resetSelection = () => {
         setSelectedWallet(undefined);

package/src/hooks/wallet/useConnectWallet.ts

@@ -28,12 +28,15 @@ type ConnectWalletResult = StandardConnectOutput;
 type UseConnectWalletMutationOptions = Omit<
     UseMutationOptions<ConnectWalletResult, Error, ConnectWalletArgs, unknown>,
     'mutationFn'
->;
+> & {
+    onConnected?: (params: { wallet: WalletWithRequiredFeatures }) => void;
+};
 
 /**
  * Mutation hook for establishing a connection to a specific wallet.
  */
 export function useConnectWallet({
+    onConnected,
     mutationKey,
     ...mutationOptions
 }: UseConnectWalletMutationOptions = {}): UseMutationResult<
@@ -65,6 +68,8 @@ export function useConnectWallet({
                     connectResult.supportedIntents,
                 );
 
+                onConnected?.({ wallet });
+
                 return { accounts: connectedIotaAccounts };
             } catch (error) {
                 setConnectionStatus('disconnected');