@growae/reactive-react 0.0.1 → 0.0.2

package/src/hooks/index.ts

@@ -1,69 +1,322 @@
 // Connection hooks
-export { useConfig, type UseConfigParameters, type UseConfigReturnType } from './useConfig.js'
-export { useConnect, type UseConnectParameters, type UseConnectReturnType } from './useConnect.js'
-export { useDisconnect, type UseDisconnectParameters, type UseDisconnectReturnType } from './useDisconnect.js'
-export { useReconnect, type UseReconnectParameters, type UseReconnectReturnType } from './useReconnect.js'
-export { useConnection, type UseConnectionParameters, type UseConnectionReturnType } from './useConnection.js'
-export { useConnections, type UseConnectionsParameters, type UseConnectionsReturnType } from './useConnections.js'
-export { useConnectors, type UseConnectorsParameters, type UseConnectorsReturnType } from './useConnectors.js'
-export { useNetworkId, type UseNetworkIdParameters, type UseNetworkIdReturnType } from './useNetworkId.js'
-export { useNetworks, type UseNetworksParameters, type UseNetworksReturnType } from './useNetworks.js'
-export { useSwitchNetwork, type UseSwitchNetworkParameters, type UseSwitchNetworkReturnType } from './useSwitchNetwork.js'
-export { useNodeClient, type UseNodeClientParameters, type UseNodeClientReturnType } from './useNodeClient.js'
-export { useConnectorClient, type UseConnectorClientParameters, type UseConnectorClientReturnType } from './useConnectorClient.js'
+export {
+  useConfig,
+  type UseConfigParameters,
+  type UseConfigReturnType,
+} from './useConfig'
+export {
+  useConnect,
+  type UseConnectParameters,
+  type UseConnectReturnType,
+} from './useConnect'
+export {
+  useDisconnect,
+  type UseDisconnectParameters,
+  type UseDisconnectReturnType,
+} from './useDisconnect'
+export {
+  useReconnect,
+  type UseReconnectParameters,
+  type UseReconnectReturnType,
+} from './useReconnect'
+export {
+  useConnection,
+  type UseConnectionParameters,
+  type UseConnectionReturnType,
+} from './useConnection'
+export {
+  useActiveAccount,
+  type UseActiveAccountParameters,
+  type UseActiveAccountReturnType,
+} from './useActiveAccount'
+export {
+  useSwitchActiveAccount,
+  type UseSwitchActiveAccountParameters,
+  type UseSwitchActiveAccountReturnType,
+} from './useSwitchActiveAccount'
+export {
+  useConnections,
+  type UseConnectionsParameters,
+  type UseConnectionsReturnType,
+} from './useConnections'
+export {
+  useConnectors,
+  type UseConnectorsParameters,
+  type UseConnectorsReturnType,
+} from './useConnectors'
+export {
+  useNetworkId,
+  type UseNetworkIdParameters,
+  type UseNetworkIdReturnType,
+} from './useNetworkId'
+export {
+  useNetworks,
+  type UseNetworksParameters,
+  type UseNetworksReturnType,
+} from './useNetworks'
+export {
+  useSwitchNetwork,
+  type UseSwitchNetworkParameters,
+  type UseSwitchNetworkReturnType,
+} from './useSwitchNetwork'
+export {
+  useNodeClient,
+  type UseNodeClientParameters,
+  type UseNodeClientReturnType,
+} from './useNodeClient'
+export {
+  useConnectorClient,
+  type UseConnectorClientParameters,
+  type UseConnectorClientReturnType,
+} from './useConnectorClient'
 
 // Chain read hooks
-export { useBalance, type UseBalanceParameters, type UseBalanceReturnType } from './useBalance.js'
-export { useHeight, type UseHeightParameters, type UseHeightReturnType } from './useHeight.js'
-export { useAccount, type UseAccountParameters, type UseAccountReturnType } from './useAccount.js'
-export { useBlock, type UseBlockParameters, type UseBlockReturnType } from './useBlock.js'
-export { useTransaction, type UseTransactionParameters, type UseTransactionReturnType } from './useTransaction.js'
-export { useTransactionCount, type UseTransactionCountParameters, type UseTransactionCountReturnType } from './useTransactionCount.js'
-export { useWaitForTransaction, type UseWaitForTransactionParameters, type UseWaitForTransactionReturnType } from './useWaitForTransaction.js'
-export { useContractBytecode, type UseContractBytecodeParameters, type UseContractBytecodeReturnType } from './useContractBytecode.js'
-export { useEstimateGas, type UseEstimateGasParameters, type UseEstimateGasReturnType } from './useEstimateGas.js'
+export {
+  useBalance,
+  type UseBalanceParameters,
+  type UseBalanceReturnType,
+} from './useBalance'
+export {
+  useHeight,
+  type UseHeightParameters,
+  type UseHeightReturnType,
+} from './useHeight'
+export {
+  useAccount,
+  type UseAccountParameters,
+  type UseAccountReturnType,
+} from './useAccount'
+export {
+  useBlock,
+  type UseBlockParameters,
+  type UseBlockReturnType,
+} from './useBlock'
+export {
+  useTransaction,
+  type UseTransactionParameters,
+  type UseTransactionReturnType,
+} from './useTransaction'
+export {
+  useTransactionCount,
+  type UseTransactionCountParameters,
+  type UseTransactionCountReturnType,
+} from './useTransactionCount'
+export {
+  useWaitForTransaction,
+  type UseWaitForTransactionParameters,
+  type UseWaitForTransactionReturnType,
+} from './useWaitForTransaction'
+export {
+  useWaitForTransactionConfirm,
+  type UseWaitForTransactionConfirmParameters,
+  type UseWaitForTransactionConfirmReturnType,
+} from './useWaitForTransactionConfirm'
+export {
+  useMicroBlock,
+  type UseMicroBlockParameters,
+  type UseMicroBlockReturnType,
+} from './useMicroBlock'
+export {
+  useContractBytecode,
+  type UseContractBytecodeParameters,
+  type UseContractBytecodeReturnType,
+} from './useContractBytecode'
+export {
+  useEstimateGas,
+  type UseEstimateGasParameters,
+  type UseEstimateGasReturnType,
+} from './useEstimateGas'
 
 // Transaction hooks
-export { useSendTransaction, type UseSendTransactionParameters, type UseSendTransactionReturnType } from './useSendTransaction.js'
-export { useSpend, type UseSpendParameters, type UseSpendReturnType } from './useSpend.js'
-export { usePayForTransaction, type UsePayForTransactionParameters, type UsePayForTransactionReturnType } from './usePayForTransaction.js'
+export {
+  useSendTransaction,
+  type UseSendTransactionParameters,
+  type UseSendTransactionReturnType,
+} from './useSendTransaction'
+export {
+  useSpend,
+  type UseSpendParameters,
+  type UseSpendReturnType,
+} from './useSpend'
+export {
+  usePayForTransaction,
+  type UsePayForTransactionParameters,
+  type UsePayForTransactionReturnType,
+} from './usePayForTransaction'
+export {
+  useBuildTransaction,
+  type UseBuildTransactionParameters,
+  type UseBuildTransactionReturnType,
+} from './useBuildTransaction'
+export {
+  useTransferFunds,
+  type UseTransferFundsParameters,
+  type UseTransferFundsReturnType,
+} from './useTransferFunds'
 
 // Signing hooks
-export { useSignMessage, type UseSignMessageParameters, type UseSignMessageReturnType } from './useSignMessage.js'
-export { useSignTypedData, type UseSignTypedDataParameters, type UseSignTypedDataReturnType } from './useSignTypedData.js'
-export { useSignTransaction, type UseSignTransactionParameters, type UseSignTransactionReturnType } from './useSignTransaction.js'
-export { useVerifyMessage, type UseVerifyMessageParameters, type UseVerifyMessageReturnType } from './useVerifyMessage.js'
-export { useVerifyTypedData, type UseVerifyTypedDataParameters, type UseVerifyTypedDataReturnType } from './useVerifyTypedData.js'
+export {
+  useSignMessage,
+  type UseSignMessageParameters,
+  type UseSignMessageReturnType,
+} from './useSignMessage'
+export {
+  useSignTypedData,
+  type UseSignTypedDataParameters,
+  type UseSignTypedDataReturnType,
+} from './useSignTypedData'
+export {
+  useSignTransaction,
+  type UseSignTransactionParameters,
+  type UseSignTransactionReturnType,
+} from './useSignTransaction'
+export {
+  useVerifyMessage,
+  type UseVerifyMessageParameters,
+  type UseVerifyMessageReturnType,
+} from './useVerifyMessage'
+export {
+  useVerifyTypedData,
+  type UseVerifyTypedDataParameters,
+  type UseVerifyTypedDataReturnType,
+} from './useVerifyTypedData'
+export {
+  useSignDelegation,
+  type UseSignDelegationParameters,
+  type UseSignDelegationReturnType,
+} from './useSignDelegation'
 
 // Contract hooks
-export { useDeployContract, type UseDeployContractParameters, type UseDeployContractReturnType } from './useDeployContract.js'
-export { useCallContract, type UseCallContractParameters, type UseCallContractReturnType } from './useCallContract.js'
-export { useReadContract, type UseReadContractParameters, type UseReadContractReturnType } from './useReadContract.js'
-export { useReadContracts, type UseReadContractsParameters, type UseReadContractsReturnType } from './useReadContracts.js'
-export { useSimulateContract, type UseSimulateContractParameters, type UseSimulateContractReturnType } from './useSimulateContract.js'
-export { useContractEvents, type UseContractEventsParameters, type UseContractEventsReturnType } from './useContractEvents.js'
+export {
+  useDeployContract,
+  type UseDeployContractParameters,
+  type UseDeployContractReturnType,
+} from './useDeployContract'
+export {
+  useCallContract,
+  type UseCallContractParameters,
+  type UseCallContractReturnType,
+} from './useCallContract'
+export {
+  useReadContract,
+  type UseReadContractParameters,
+  type UseReadContractReturnType,
+} from './useReadContract'
+export {
+  useReadContracts,
+  type UseReadContractsParameters,
+  type UseReadContractsReturnType,
+} from './useReadContracts'
+export {
+  useSimulateContract,
+  type UseSimulateContractParameters,
+  type UseSimulateContractReturnType,
+} from './useSimulateContract'
+export {
+  useContractEvents,
+  type UseContractEventsParameters,
+  type UseContractEventsReturnType,
+} from './useContractEvents'
+export {
+  useCompileContract,
+  type UseCompileContractParameters,
+  type UseCompileContractReturnType,
+} from './useCompileContract'
 
 // AENS hooks
-export { usePreclaimName, type UsePreclaimNameParameters, type UsePreclaimNameReturnType } from './usePreclaimName.js'
-export { useClaimName, type UseClaimNameParameters, type UseClaimNameReturnType } from './useClaimName.js'
-export { useUpdateName, type UseUpdateNameParameters, type UseUpdateNameReturnType } from './useUpdateName.js'
-export { useTransferName, type UseTransferNameParameters, type UseTransferNameReturnType } from './useTransferName.js'
-export { useRevokeName, type UseRevokeNameParameters, type UseRevokeNameReturnType } from './useRevokeName.js'
-export { useResolveName, type UseResolveNameParameters, type UseResolveNameReturnType } from './useResolveName.js'
+export {
+  usePreclaimName,
+  type UsePreclaimNameParameters,
+  type UsePreclaimNameReturnType,
+} from './usePreclaimName'
+export {
+  useClaimName,
+  type UseClaimNameParameters,
+  type UseClaimNameReturnType,
+} from './useClaimName'
+export {
+  useUpdateName,
+  type UseUpdateNameParameters,
+  type UseUpdateNameReturnType,
+} from './useUpdateName'
+export {
+  useTransferName,
+  type UseTransferNameParameters,
+  type UseTransferNameReturnType,
+} from './useTransferName'
+export {
+  useRevokeName,
+  type UseRevokeNameParameters,
+  type UseRevokeNameReturnType,
+} from './useRevokeName'
+export {
+  useResolveName,
+  type UseResolveNameParameters,
+  type UseResolveNameReturnType,
+} from './useResolveName'
+export {
+  useNameEntry,
+  type UseNameEntryParameters,
+  type UseNameEntryReturnType,
+} from './useNameEntry'
 
 // Oracle hooks
-export { useRegisterOracle, type UseRegisterOracleParameters, type UseRegisterOracleReturnType } from './useRegisterOracle.js'
-export { useQueryOracle, type UseQueryOracleParameters, type UseQueryOracleReturnType } from './useQueryOracle.js'
-export { useRespondToQuery, type UseRespondToQueryParameters, type UseRespondToQueryReturnType } from './useRespondToQuery.js'
-export { useOracleState, type UseOracleStateParameters, type UseOracleStateReturnType } from './useOracleState.js'
-export { useOracleQueries, type UseOracleQueriesParameters, type UseOracleQueriesReturnType } from './useOracleQueries.js'
+export {
+  useRegisterOracle,
+  type UseRegisterOracleParameters,
+  type UseRegisterOracleReturnType,
+} from './useRegisterOracle'
+export {
+  useQueryOracle,
+  type UseQueryOracleParameters,
+  type UseQueryOracleReturnType,
+} from './useQueryOracle'
+export {
+  useRespondToQuery,
+  type UseRespondToQueryParameters,
+  type UseRespondToQueryReturnType,
+} from './useRespondToQuery'
+export {
+  useOracleState,
+  type UseOracleStateParameters,
+  type UseOracleStateReturnType,
+} from './useOracleState'
+export {
+  useOracleQueries,
+  type UseOracleQueriesParameters,
+  type UseOracleQueriesReturnType,
+} from './useOracleQueries'
 
 // Channel hooks
-export { useOpenChannel, type UseOpenChannelParameters, type UseOpenChannelReturnType } from './useOpenChannel.js'
-export { useCloseChannel, type UseCloseChannelParameters, type UseCloseChannelReturnType } from './useCloseChannel.js'
-export { useChannelDeposit, type UseChannelDepositParameters, type UseChannelDepositReturnType } from './useChannelDeposit.js'
+export {
+  useOpenChannel,
+  type UseOpenChannelParameters,
+  type UseOpenChannelReturnType,
+} from './useOpenChannel'
+export {
+  useCloseChannel,
+  type UseCloseChannelParameters,
+  type UseCloseChannelReturnType,
+} from './useCloseChannel'
+export {
+  useChannelDeposit,
+  type UseChannelDepositParameters,
+  type UseChannelDepositReturnType,
+} from './useChannelDeposit'
 
 // Watcher hooks
-export { useWatchHeight, type UseWatchHeightParameters, type UseWatchHeightReturnType } from './useWatchHeight.js'
-export { useWatchConnection, type UseWatchConnectionParameters, type UseWatchConnectionReturnType } from './useWatchConnection.js'
-export { useWatchConnectors, type UseWatchConnectorsParameters, type UseWatchConnectorsReturnType } from './useWatchConnectors.js'
+export {
+  useWatchHeight,
+  type UseWatchHeightParameters,
+  type UseWatchHeightReturnType,
+} from './useWatchHeight'
+export {
+  useWatchConnection,
+  type UseWatchConnectionParameters,
+  type UseWatchConnectionReturnType,
+} from './useWatchConnection'
+export {
+  useWatchConnectors,
+  type UseWatchConnectorsParameters,
+  type UseWatchConnectorsReturnType,
+} from './useWatchConnectors'

package/src/hooks/useAccount.test.ts

@@ -1,5 +1,5 @@
-import { describe, it, expect } from 'vitest'
-import { useAccount } from './useAccount.js'
+import { describe, expect, it } from 'vitest'
+import { useAccount } from './useAccount'
 
 describe('useAccount', () => {
   it('should be a function', () => {

package/src/hooks/useAccount.ts

@@ -1,19 +1,21 @@
 'use client'
 
 import {
+  type GetAccountErrorType,
   type GetAccountParameters,
   type GetAccountReturnType,
-  type GetAccountErrorType,
   getAccount,
 } from '@growae/reactive'
 import type { Compute } from '@growae/reactive'
-import { type UseQueryReturnType, useQuery } from '../utils/query.js'
-import type { ConfigParameter } from '../types/properties.js'
-import { useConfig } from './useConfig.js'
-import { useNetworkId } from './useNetworkId.js'
+import type { ConfigParameter } from '../types/properties'
+import { type UseQueryReturnType, useQuery } from '../utils/query'
+import { useActiveAccount } from './useActiveAccount'
+import { useConfig } from './useConfig'
+import { useNetworkId } from './useNetworkId'
 
 export type UseAccountParameters = Compute<
-  GetAccountParameters & ConfigParameter & { enabled?: boolean }
+  Omit<GetAccountParameters, 'address'> &
+    ConfigParameter & { address?: string | undefined; enabled?: boolean }
 >
 
 export type UseAccountReturnType = UseQueryReturnType<
@@ -26,18 +28,26 @@ export function useAccount(
 ): UseAccountReturnType {
   const config = useConfig(parameters)
   const networkId = useNetworkId({ config })
+  const activeAccount = useActiveAccount({ config })
+
+  const address = parameters.address ?? activeAccount.address
 
   return useQuery({
-    queryKey: ['account', {
-      address: parameters.address,
-      networkId: parameters.networkId ?? networkId,
-      height: parameters.height,
-      hash: parameters.hash,
-    }],
-    queryFn: () => getAccount(config, {
-      ...parameters,
-      networkId: parameters.networkId ?? networkId,
-    }),
-    enabled: Boolean(parameters.address) && (parameters.enabled ?? true),
+    queryKey: [
+      'account',
+      {
+        address,
+        networkId: parameters.networkId ?? networkId,
+        height: parameters.height,
+        hash: parameters.hash,
+      },
+    ],
+    queryFn: () =>
+      getAccount(config, {
+        ...parameters,
+        address: address as string,
+        networkId: parameters.networkId ?? networkId,
+      }),
+    enabled: Boolean(address) && (parameters.enabled ?? true),
   }) as UseAccountReturnType
 }

package/src/hooks/useActiveAccount.test.ts

@@ -0,0 +1,28 @@
+// @vitest-environment jsdom
+import { createConfig } from '@growae/reactive'
+import { mainnet } from '@growae/reactive'
+import { mock } from '@growae/reactive'
+import { renderHook } from '@testing-library/react'
+import { createElement } from 'react'
+import { describe, expect, it } from 'vitest'
+import { ReactiveProvider } from '../context'
+import { useActiveAccount } from './useActiveAccount'
+
+function createWrapper(config: ReturnType<typeof createConfig>) {
+  return ({ children }: { children: React.ReactNode }) =>
+    createElement(ReactiveProvider, { config }, children)
+}
+
+describe('useActiveAccount', () => {
+  it('returns disconnected state when not connected', () => {
+    const config = createConfig({
+      networks: [mainnet],
+      connectors: [mock({ accounts: ['ak_test123'] })],
+    })
+    const { result } = renderHook(() => useActiveAccount(), {
+      wrapper: createWrapper(config),
+    })
+    expect(result.current.isConnected).toBe(false)
+    expect(result.current.address).toBeUndefined()
+  })
+})

package/src/hooks/useActiveAccount.ts

@@ -0,0 +1,40 @@
+'use client'
+
+import {
+  type GetActiveAccountReturnType,
+  getActiveAccount,
+  watchActiveAccount,
+} from '@growae/reactive'
+import { useSyncExternalStore } from 'react'
+import type { ConfigParameter } from '../types/properties'
+import { useConfig } from './useConfig'
+
+export type UseActiveAccountParameters = ConfigParameter
+
+export type UseActiveAccountReturnType = GetActiveAccountReturnType
+
+export function useActiveAccount(
+  parameters: UseActiveAccountParameters = {},
+): UseActiveAccountReturnType {
+  const config = useConfig(parameters)
+
+  // Snapshot must be a primitive — returning a new object every call causes
+  // useSyncExternalStore to see it as "changed" on every render → infinite loop.
+  // We snapshot just the address string (or null) and derive the full object below.
+  useSyncExternalStore(
+    (onChange) =>
+      watchActiveAccount(config, {
+        onChange: () => onChange(),
+      }),
+    () => {
+      const a = getActiveAccount(config)
+      return a.isConnected ? a.address : null
+    },
+    () => {
+      const a = getActiveAccount(config)
+      return a.isConnected ? a.address : null
+    },
+  )
+
+  return getActiveAccount(config)
+}

package/src/hooks/useBalance.test.ts

@@ -1,18 +1,18 @@
 // @vitest-environment jsdom
-import { describe, it, expect, vi } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 
 vi.mock('@aeternity/aepp-sdk', () => ({
   Node: vi.fn().mockImplementation(() => ({})),
 }))
 
-import { createElement } from 'react'
-import { renderHook } from '@testing-library/react'
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { useBalance } from './useBalance.js'
-import { ReactiveProvider } from '../context.js'
 import { createConfig } from '@growae/reactive'
 import { testnet } from '@growae/reactive'
 import { mock } from '@growae/reactive'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { renderHook } from '@testing-library/react'
+import { createElement } from 'react'
+import { ReactiveProvider } from '../context'
+import { useBalance } from './useBalance'
 
 const TEST_ACCOUNTS = [
   'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
@@ -48,8 +48,7 @@ describe('useBalance', () => {
     const { result } = renderHook(
       () =>
         useBalance({
-          address:
-            'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
+          address: 'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
         }),
       { wrapper },
     )
@@ -63,10 +62,7 @@ describe('useBalance', () => {
 
   it('should be idle without address', () => {
     const { wrapper } = createWrapper()
-    const { result } = renderHook(
-      () => useBalance({} as any),
-      { wrapper },
-    )
+    const { result } = renderHook(() => useBalance({} as any), { wrapper })
     expect(result.current.fetchStatus).toBe('idle')
   })
 })

package/src/hooks/useBalance.ts

@@ -1,19 +1,21 @@
 'use client'
 
 import {
+  type GetBalanceErrorType,
   type GetBalanceParameters,
   type GetBalanceReturnType,
-  type GetBalanceErrorType,
   getBalance,
 } from '@growae/reactive'
 import type { Compute } from '@growae/reactive'
-import { type UseQueryReturnType, useQuery } from '../utils/query.js'
-import type { ConfigParameter } from '../types/properties.js'
-import { useConfig } from './useConfig.js'
-import { useNetworkId } from './useNetworkId.js'
+import type { ConfigParameter } from '../types/properties'
+import { type UseQueryReturnType, useQuery } from '../utils/query'
+import { useActiveAccount } from './useActiveAccount'
+import { useConfig } from './useConfig'
+import { useNetworkId } from './useNetworkId'
 
 export type UseBalanceParameters = Compute<
-  GetBalanceParameters & ConfigParameter & { enabled?: boolean }
+  Omit<GetBalanceParameters, 'address'> &
+    ConfigParameter & { address?: string | undefined; enabled?: boolean }
 >
 
 export type UseBalanceReturnType = UseQueryReturnType<
@@ -26,17 +28,25 @@ export function useBalance(
 ): UseBalanceReturnType {
   const config = useConfig(parameters)
   const networkId = useNetworkId({ config })
+  const activeAccount = useActiveAccount({ config })
+
+  const address = parameters.address ?? activeAccount.address
 
   return useQuery({
-    queryKey: ['balance', {
-      address: parameters.address,
-      networkId: parameters.networkId ?? networkId,
-      format: parameters.format,
-    }],
-    queryFn: () => getBalance(config, {
-      ...parameters,
-      networkId: parameters.networkId ?? networkId,
-    }),
-    enabled: Boolean(parameters.address) && (parameters.enabled ?? true),
+    queryKey: [
+      'balance',
+      {
+        address,
+        networkId: parameters.networkId ?? networkId,
+        format: parameters.format,
+      },
+    ],
+    queryFn: () =>
+      getBalance(config, {
+        ...parameters,
+        address: address as string,
+        networkId: parameters.networkId ?? networkId,
+      }),
+    enabled: Boolean(address) && (parameters.enabled ?? true),
   }) as UseBalanceReturnType
 }

package/src/hooks/useBlock.test.ts

@@ -1,5 +1,5 @@
-import { describe, it, expect } from 'vitest'
-import { useBlock } from './useBlock.js'
+import { describe, expect, it } from 'vitest'
+import { useBlock } from './useBlock'
 
 describe('useBlock', () => {
   it('should be a function', () => {