feat: bee-js revamp (#690)

* chore: initial commit

* refactor: remove unnecessary wrappers

* style: add missing newline

* chore: bump bee-js

* chore: ignore any cast in fdp

* fix: remove cid import

* fix: make TextEncoder and TextDecoder available in jest

* refactor: dedupe stamp ttl second conversion

* refactor: use convenience methods from bee-js

* feat: update to bee-js for restored ens support

* fix: bump bee-js to get download fix

* fix: resolve feed before downloading reference

* fix: fix token displays

* fix: fix token input modal error message

* refactor: remove wallet balance provider

* chore: remove dead code

* refactor: upcoming bee js 0.15.0 (#692)

* chore: initial commit

* fix: do not break page when duration seconds is 0

* ci: remove cache

* chore: upgrade bee-js

* feat: bee-js and bee v2.6 compatibility

* chore: switch upcoming/bee-js to ethersphere/bee-js
This commit is contained in:
Cafe137
2025-07-16 17:10:14 +02:00
committed by GitHub
parent 082a8f52ef
commit 1249c0df71
62 changed files with 675 additions and 16303 deletions
+29 -56
View File
@@ -1,18 +1,20 @@
import {
AllSettlements,
BeeModes,
BZZ,
ChainState,
ChequebookAddressResponse,
ChequebookBalanceResponse,
LastChequesResponse,
NodeAddresses,
NodeInfo,
Peer,
PeerBalance,
Topology,
WalletBalance,
} from '@ethersphere/bee-js'
import { ReactChild, ReactElement, createContext, useContext, useEffect, useState } from 'react'
import { createContext, ReactChild, ReactElement, useContext, useEffect, useState } from 'react'
import { useLatestBeeRelease } from '../hooks/apiHooks'
import { BzzToken } from '../models/BzzToken'
import { Token } from '../models/Token'
import type { Balance, ChequebookBalance, Settlements } from '../types'
import { Context as SettingsContext } from './Settings'
const LAUNCH_GRACE_PERIOD = 15_000
@@ -50,13 +52,13 @@ interface ContextInterface {
topology: Topology | null
chequebookAddress: ChequebookAddressResponse | null
peers: Peer[] | null
chequebookBalance: ChequebookBalance | null
stake: BzzToken | null
peerBalances: Balance[] | null
chequebookBalance: ChequebookBalanceResponse | null
stake: BZZ | null
peerBalances: PeerBalance[] | null
peerCheques: LastChequesResponse | null
settlements: Settlements | null
settlements: AllSettlements | null
chainState: ChainState | null
chainId: number | null
walletBalance: WalletBalance | null
latestBeeRelease: LatestBeeRelease | null
isLoading: boolean
lastUpdate: number | null
@@ -86,7 +88,7 @@ const initialValues: ContextInterface = {
peerCheques: null,
settlements: null,
chainState: null,
chainId: null,
walletBalance: null,
latestBeeRelease: null,
isLoading: true,
lastUpdate: null,
@@ -107,7 +109,7 @@ function getStatus(
apiHealth: boolean,
topology: Topology | null,
chequebookAddress: ChequebookAddressResponse | null,
chequebookBalance: ChequebookBalance | null,
chequebookBalance: ChequebookBalanceResponse | null,
error: Error | null,
startedAt: number,
): Status {
@@ -173,13 +175,13 @@ export function Provider({ children }: Props): ReactElement {
const [topology, setNodeTopology] = useState<Topology | null>(null)
const [chequebookAddress, setChequebookAddress] = useState<ChequebookAddressResponse | null>(null)
const [peers, setPeers] = useState<Peer[] | null>(null)
const [chequebookBalance, setChequebookBalance] = useState<ChequebookBalance | null>(null)
const [stake, setStake] = useState<BzzToken | null>(null)
const [peerBalances, setPeerBalances] = useState<Balance[] | null>(null)
const [chequebookBalance, setChequebookBalance] = useState<ChequebookBalanceResponse | null>(null)
const [stake, setStake] = useState<BZZ | null>(null)
const [peerBalances, setPeerBalances] = useState<PeerBalance[] | null>(null)
const [peerCheques, setPeerCheques] = useState<LastChequesResponse | null>(null)
const [settlements, setSettlements] = useState<Settlements | null>(null)
const [settlements, setSettlements] = useState<AllSettlements | null>(null)
const [chainState, setChainState] = useState<ChainState | null>(null)
const [chainId, setChainId] = useState<number | null>(null)
const [walletBalance, setWalletBalance] = useState<WalletBalance | null>(null)
const [startedAt] = useState(Date.now())
const { latestBeeRelease } = useLatestBeeRelease()
@@ -232,38 +234,6 @@ export function Provider({ children }: Props): ReactElement {
isRefreshing = true
setError(null)
// Wrap the chequebook balance call to return BZZ values as Token object
const chequeBalanceWrapper = async () => {
const { totalBalance, availableBalance } = await beeApi.getChequebookBalance({ timeout: TIMEOUT })
return {
totalBalance: new Token(totalBalance),
availableBalance: new Token(availableBalance),
}
}
// Wrap the balances call to return BZZ values as Token object
const peerBalanceWrapper = async () => {
const { balances } = await beeApi.getAllBalances({ timeout: TIMEOUT })
return balances.map(({ peer, balance }) => ({ peer, balance: new Token(balance) }))
}
// Wrap the settlements call to return BZZ values as Token object
const settlementsWrapper = async () => {
const { totalReceived, settlements, totalSent } = await beeApi.getAllSettlements({ timeout: TIMEOUT })
return {
totalReceived: new Token(totalReceived),
totalSent: new Token(totalSent),
settlements: settlements.map(({ peer, received, sent }) => ({
peer,
received: new Token(received),
sent: new Token(sent),
})),
}
}
const promises = [
// API health
beeApi
@@ -320,26 +290,29 @@ export function Provider({ children }: Props): ReactElement {
// Wallet
beeApi
.getWalletBalance({ timeout: TIMEOUT })
.then(({ chainID }) => setChainId(chainID))
.catch(() => setChainId(null)),
.then(setWalletBalance)
.catch(() => setWalletBalance(null)),
// Chequebook balance
chequeBalanceWrapper()
beeApi
.getChequebookBalance({ timeout: TIMEOUT })
.then(setChequebookBalance)
.catch(() => setChequebookBalance(null)),
beeApi
.getStake({ timeout: TIMEOUT })
.then(stake => setStake(new BzzToken(stake)))
.then(stake => setStake(stake))
.catch(() => setStake(null)),
// Peer balances
peerBalanceWrapper()
.then(setPeerBalances)
beeApi
.getAllBalances({ timeout: TIMEOUT })
.then(x => setPeerBalances(x.balances))
.catch(() => setPeerBalances(null)),
// Settlements
settlementsWrapper()
beeApi
.getAllSettlements()
.then(setSettlements)
.catch(() => setSettlements(null)),
]
@@ -398,7 +371,7 @@ export function Provider({ children }: Props): ReactElement {
peerCheques,
settlements,
chainState,
chainId,
walletBalance,
latestBeeRelease,
isLoading,
lastUpdate,
+1 -1
View File
@@ -68,7 +68,7 @@ export function Provider({ children }: Props): ReactElement {
setIsLoading(true)
const stamps = await beeApi.getAllPostageBatch()
setStamps(stamps.filter(x => x.exists).map(enrichStamp))
setStamps(stamps.map(enrichStamp))
setLastUpdate(Date.now())
setError(null)
} catch (e) {
-88
View File
@@ -1,88 +0,0 @@
import { createContext, ReactChild, ReactElement, useContext, useEffect, useState } from 'react'
import { Context as SettingsContext } from './Settings'
import { Context as BeeContext } from './Bee'
import { WalletAddress } from '../utils/wallet'
interface ContextInterface {
balance: WalletAddress | null
error: Error | null
isLoading: boolean
lastUpdate: number | null
start: (frequency?: number) => void
stop: () => void
refresh: () => Promise<void>
}
const initialValues: ContextInterface = {
balance: null,
error: null,
isLoading: false,
lastUpdate: null,
start: () => {}, // eslint-disable-line
stop: () => {}, // eslint-disable-line
refresh: () => Promise.reject(),
}
export const Context = createContext<ContextInterface>(initialValues)
export const Consumer = Context.Consumer
interface Props {
children: ReactChild
}
export function Provider({ children }: Props): ReactElement {
const { rpcProvider } = useContext(SettingsContext)
const { nodeAddresses } = useContext(BeeContext)
const [balance, setBalance] = useState<WalletAddress | null>(initialValues.balance)
const [error, setError] = useState<Error | null>(initialValues.error)
const [isLoading, setIsLoading] = useState<boolean>(initialValues.isLoading)
const [lastUpdate, setLastUpdate] = useState<number | null>(initialValues.lastUpdate)
const [frequency, setFrequency] = useState<number | null>(null)
useEffect(() => {
if (nodeAddresses?.ethereum && rpcProvider) {
WalletAddress.make(nodeAddresses.ethereum, rpcProvider).then(setBalance)
} else {
setBalance(null)
}
}, [nodeAddresses, rpcProvider])
const refresh = async () => {
// Don't want to refresh when already refreshing
if (isLoading) return
if (!balance) return
try {
setIsLoading(true)
setBalance(await balance.refresh())
setLastUpdate(Date.now())
} catch (e) {
setError(e as Error)
} finally {
setIsLoading(false)
}
}
const start = (freq = 30000) => setFrequency(freq)
const stop = () => setFrequency(null)
// Start the update loop
useEffect(() => {
refresh()
// Start autorefresh only if the frequency is set
if (frequency) {
const interval = setInterval(refresh, frequency)
return () => clearInterval(interval)
}
}, [frequency]) // eslint-disable-line react-hooks/exhaustive-deps
return (
<Context.Provider value={{ balance, error, isLoading, lastUpdate, start, stop, refresh }}>
{children}
</Context.Provider>
)
}