@xyo-network/react-chain-provider 1.16.1 → 1.16.3

package/src/hooks/useAccountBalanceHistory.ts

@@ -0,0 +1,104 @@
+import {
+  type Address, type Hex,
+  hexToBigInt,
+  toHex,
+} from '@xylabs/hex'
+import { usePromise } from '@xylabs/react-promise'
+import { isUndefined } from '@xylabs/typeof'
+import type { AttoXL1, XL1BlockRange } from '@xyo-network/xl1-protocol'
+import type { AccountBalanceHistoryItem, XyoViewer } from '@xyo-network/xl1-protocol-sdk'
+
+import type { AccountBalanceHistoryItemRow } from '../types/index.ts'
+
+export const formatAccountBalanceHistory = (address: Address, history: AccountBalanceHistoryItem[]): AccountBalanceHistoryItemRow[] => {
+  let results: AccountBalanceHistoryItemRow[] = []
+  for (const item of history) {
+    const [blockBw, txBw, transfer] = item
+    if (address === transfer.from) {
+      for (const [to, amount] of Object.entries(transfer.transfers)) {
+        results.push({
+          amount: hexToBigInt(amount as Hex),
+          blockNumber: blockBw.block,
+          from: transfer.from,
+          timestamp: blockBw.$epoch,
+          key: globalThis.crypto.randomUUID(),
+          to: to as Address,
+          txHash: txBw?._hash,
+          debug: item,
+          type: 'send',
+        })
+      }
+    } else {
+      results.push({
+        amount: hexToBigInt(transfer.transfers[address] as Hex),
+        blockNumber: blockBw.block,
+        from: transfer.from,
+        key: globalThis.crypto.randomUUID(),
+        timestamp: blockBw.$epoch,
+        to: address,
+        txHash: txBw?._hash,
+        debug: item,
+        type: 'receive',
+      })
+    }
+  }
+  return results
+}
+
+const findMinimumBlock = (history: AccountBalanceHistoryItem[]): number => {
+  // since taking Math.min of an empty array returns Infinity
+  if (history.length === 0) return 0
+  const blockNumbers = history.map(([blockBw]) => blockBw.block)
+  const min = Math.min(...blockNumbers)
+  return Math.max(min - 1, 0)
+}
+
+const balanceForRange = (address: Address, results: AccountBalanceHistoryItem[]): [AttoXL1, AttoXL1] => {
+  const totalReceivedBalance = results?.reduce((a, [_block, _tx, transfer]) => {
+    return a + hexToBigInt(transfer.transfers[address] ?? toHex(0))
+  }, 0n)
+  // eslint-disable-next-line unicorn/no-array-reduce
+  const totalSentBalance = results?.reduce((a, [_block, _tx, transfer]) => {
+    return (transfer.from === address) ? a + Object.values(transfer.transfers).reduce((a, v) => a + (v ? hexToBigInt(v) : 0n), 0n) : a
+  }, 0n)
+  return [totalReceivedBalance, totalSentBalance] as [AttoXL1, AttoXL1]
+}
+
+export const useAccountBalanceHistory = (address?: Address, viewer?: XyoViewer, refresh?: number) => {
+  return usePromise(async () => {
+    if (isUndefined(viewer) || isUndefined(address)) return
+
+    // Pagination Values
+    let page = 1
+    let lastBlock: number
+    const maxPage = 10
+    const pagedHistory: AccountBalanceHistoryItem[] = []
+
+    // Fetch first page to get starting lastBlock
+    const history = await viewer.accountBalanceHistory(address)
+    if (history.length > 0) {
+      pagedHistory.push(...history)
+      // Set lastBlock to one less than the lowest block in the first page
+      lastBlock = findMinimumBlock(history)
+      while (page < maxPage) {
+        // Fetch next page
+        const nextHistory = await viewer.accountBalanceHistory(address, [0, lastBlock] as XL1BlockRange)
+        // Break if no more history
+        if (nextHistory.length === 0) break
+        // Update lastBlock and append to pagedHistory
+        lastBlock = findMinimumBlock(nextHistory)
+        pagedHistory.push(...nextHistory)
+        // Increment page
+        // Even if we are going to go over and break the loop, we still want to increment to show the answer was truncated
+        page++
+      }
+    }
+    const formattedHistory = formatAccountBalanceHistory(address, pagedHistory)
+
+    return {
+      history: formattedHistory,
+      balance: balanceForRange(address, pagedHistory),
+      truncated: page >= maxPage,
+    }
+  }, [address, viewer, refresh])
+}

package/src/hooks/useConnectAccount.ts

@@ -20,7 +20,7 @@ export const useConnectAccount = (gatewayName: GatewayName = MainNetwork.id, tim
   const connectSigner = useCallback(async () => {
     try {
       const assertedGateway = assertEx(gateway, () => `Gateway ${gatewayName} is not available`)
-      const signer = await assertedGateway.signer()
+      const signer = await assertedGateway.signer
       const address = await signer.address()
       setAddress(address)
       return address

package/src/hooks/useNetwork.ts

@@ -1,12 +1,12 @@
 import { isUndefined } from '@xylabs/typeof'
 import type { DefaultNetworkIds } from '@xyo-network/xl1-protocol'
-import { MemoryXyoNetwork } from '@xyo-network/xl1-rpc'
+import { SimpleXyoNetwork } from '@xyo-network/xl1-protocol-sdk'
 import { useMemo } from 'react'
 
 export const useNetwork = (id?: DefaultNetworkIds) => {
   const network = useMemo(() => {
     if (isUndefined(id)) return
-    return new MemoryXyoNetwork(id)
+    return new SimpleXyoNetwork(id)
   }, [id])
 
   return network

package/src/hooks/useSigner.ts

@@ -1,8 +1,9 @@
 import type { AccountInstance } from '@xyo-network/account-model'
-import type { XyoConnection, XyoSigner } from '@xyo-network/xl1-protocol-sdk'
-import { MemoryXyoSigner } from '@xyo-network/xl1-rpc'
+import {
+  SimpleXyoSigner, type XyoConnection, type XyoSigner,
+} from '@xyo-network/xl1-protocol-sdk'
 import { useMemo } from 'react'
 
 export const useSigner = (_provider?: XyoConnection, account?: AccountInstance) => {
-  return useMemo<XyoSigner | undefined>(() => account ? new MemoryXyoSigner(account) : undefined, [account])
+  return useMemo<XyoSigner | undefined>(() => account ? new SimpleXyoSigner(account) : undefined, [account])
 }

package/src/hooks/viewer/UseStepRewardWeightTest.stories.tsx

@@ -8,7 +8,6 @@ import {
   isDefined, isDefinedNotNull, isUndefined,
 } from '@xylabs/typeof'
 import { LocalNetwork } from '@xyo-network/chain-network-model'
-import { ErrorRender } from '@xyo-network/react-error'
 import {
   asXL1BlockNumber, XL1Amount, XL1Places,
 } from '@xyo-network/xl1-protocol'
@@ -25,7 +24,7 @@ const inIframe = globalThis.self !== window.top
 
 const UseStepRewardWeightTest: React.FC = () => {
   const defaultDestination = LocalNetwork.id
-  const [viewer, viewerError] = useViewerFromWallet(defaultDestination)
+  const viewer = useViewerFromWallet(defaultDestination)
   const [error, setError] = useState<Error | null>(null)
   const [result, setResult] = useState<number | null | undefined>()
   const [loading, setLoading] = useState(false)
@@ -56,7 +55,6 @@ const UseStepRewardWeightTest: React.FC = () => {
             </Alert>
           )
         : null}
-      <ErrorRender error={viewerError} />
       {isUndefined(wallet)
         ? (
             <Alert severity="warning">

package/src/hooks/viewer/useViewerFromWallet.stories.tsx

@@ -4,7 +4,6 @@ import { ButtonEx } from '@xylabs/react-button'
 import { isDefined, isDefinedNotNull } from '@xylabs/typeof'
 import { MainNetwork } from '@xyo-network/chain-network-model'
 import { isXyoGlobal } from '@xyo-network/react-chain-model'
-import { ErrorRender } from '@xyo-network/react-error'
 import type { HydratedBlock } from '@xyo-network/xl1-protocol'
 import React, { useState } from 'react'
 
@@ -15,7 +14,7 @@ const inIframe = globalThis.self !== window.top
 
 const UseViewerFromWalletStoryTemplate: React.FC = () => {
   const defaultDestination = MainNetwork.id
-  const [viewer, viewerError] = useViewerFromWallet(defaultDestination)
+  const viewer = useViewerFromWallet(defaultDestination)
   const [error, setError] = useState<Error | null>(null)
   const [result, setResult] = useState<HydratedBlock | null | undefined>()
   const [loading, setLoading] = useState(false)
@@ -45,7 +44,6 @@ const UseViewerFromWalletStoryTemplate: React.FC = () => {
             </Alert>
           )
         : null}
-      <ErrorRender error={viewerError} />
       {hasXyoGlobal
         ? null
         : (

package/src/hooks/viewer/useViewerFromWallet.ts

@@ -1,4 +1,3 @@
-import { usePromise } from '@xylabs/react-promise'
 import { isDefined, isDefinedNotNull } from '@xylabs/typeof'
 import type { GatewayName } from '@xyo-network/xl1-protocol'
 
@@ -15,12 +14,10 @@ export const useViewerFromWallet = (networkId?: GatewayName) => {
     gateway, error, isLoading,
   } = useGateway(networkId)
 
-  return usePromise(async () => {
-    if (isDefinedNotNull(error)) return null
-    if (isLoading) return
-    if (isDefined(gateway) && isDefined(networkId)) {
-      const connection = await gateway?.connection()
-      return connection?.viewer
-    }
-  }, [gateway, networkId])
+  if (isDefinedNotNull(error)) return null
+  if (isLoading) return
+  if (isDefined(gateway) && isDefined(networkId)) {
+    const connection = gateway?.connection
+    return connection?.viewer
+  }
 }

package/src/index.ts

@@ -1,2 +1,3 @@
 export * from './components/index.ts'
 export * from './hooks/index.ts'
+export * from './types/index.ts'

package/src/types/account/BalanceHistoryItemRow.ts

@@ -0,0 +1,14 @@
+import type { Address, Hash } from '@xylabs/hex'
+import type { AccountBalanceHistoryItem } from '@xyo-network/xl1-protocol-sdk'
+
+export interface AccountBalanceHistoryItemRow {
+  amount: bigint
+  blockNumber: number
+  debug: AccountBalanceHistoryItem
+  from: Address
+  key: string
+  timestamp: number
+  to: Address
+  txHash: Hash | undefined
+  type: 'send' | 'receive'
+}

package/src/types/account/Table.ts

@@ -0,0 +1,14 @@
+import type { AccountBalanceHistoryItemRow } from './BalanceHistoryItemRow.ts'
+
+export type TableHeadingLabels = 'Tx Hash' | 'BlockNumber' | 'Timestamp' | 'From' | 'To' | 'Amount' | 'Debug'
+export type TableHeadings = { [key in keyof AccountBalanceHistoryItemRow]: TableHeadingLabels }
+
+export const TableHeadingLabels: TableHeadingLabels[] = [
+  'Tx Hash',
+  'BlockNumber',
+  'Timestamp',
+  'From',
+  'To',
+  'Amount',
+  'Debug',
+] as const

package/src/types/account/index.ts

@@ -0,0 +1,2 @@
+export * from './BalanceHistoryItemRow.ts'
+export * from './Table.ts'

package/src/types/index.ts

@@ -0,0 +1 @@
+export * from './account/index.ts'