Skip to content

Commit

Permalink
Add ENS lookup, fix explorer urls, disable helia/ipfs
Browse files Browse the repository at this point in the history
  • Loading branch information
philogicae committed May 21, 2024
1 parent 8492be2 commit e5e3a63
Show file tree
Hide file tree
Showing 9 changed files with 8,442 additions and 11,687 deletions.
20,016 changes: 8,356 additions & 11,660 deletions package-lock.json

Large diffs are not rendered by default.

8 changes: 1 addition & 7 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "front-aleph-account-page",
"version": "0.8.1",
"version": "0.8.2",
"private": true,
"scripts": {
"dev": "next dev",
Expand All @@ -22,21 +22,15 @@
"@aleph-sdk/solana": "^1.0.3",
"@aleph-sdk/superfluid": "^1.0.4",
"@fortawesome/fontawesome-svg-core": "^6.3.0",
"@helia/unixfs": "^1.4.1",
"@hookform/resolvers": "^3.1.1",
"@libp2p/mplex": "^9.0.5",
"@libp2p/noise": "^12.0.1",
"@libp2p/websockets": "^7.0.5",
"@types/node": "18.14.1",
"@types/react": "18.0.28",
"@types/react-dom": "18.0.11",
"@web3modal/ethers5": "^4.2.1",
"eslint": "8.35.0",
"eslint-config-next": "13.2.1",
"ethers": "^5.7.2",
"helia": "^2.0.1",
"jszip": "^3.10.1",
"libp2p": "^0.46.7",
"lottie-react": "^2.4.0",
"next": "^13.3.0",
"react": "18.2.0",
Expand Down
9 changes: 7 additions & 2 deletions src/components/common/Header/cmp.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import {
useHeader,
} from '@/hooks/pages/useHeader'
import AutoBreadcrumb from '@/components/common/AutoBreadcrumb'
import { BlockchainId, blockchains } from '@/domain/connect/base'
import { useEnsNameLookup } from '@/hooks/common/useENSLookup'

export type AccountButtonProps = UseAccountButtonProps & {
isMobile?: boolean
Expand All @@ -39,6 +41,8 @@ export const AccountButton = ({ isMobile, ...rest }: AccountButtonProps) => {
handleDisplayWalletPicker,
} = useAccountButton(rest)

const ensName = useEnsNameLookup(account?.address)

return (
<>
<Button
Expand All @@ -51,7 +55,8 @@ export const AccountButton = ({ isMobile, ...rest }: AccountButtonProps) => {
onClick={handleDisplayWalletPicker}
>
<div tw="flex items-center gap-3">
{!isMobile && (account ? ellipseAddress(account.address) : 'Connect')}
{!isMobile &&
(account ? ensName || ellipseAddress(account.address) : 'Connect')}
{(isMobile || account) && (
<StyledIcon
$network={selectedNetwork}
Expand All @@ -72,7 +77,7 @@ export const AccountButton = ({ isMobile, ...rest }: AccountButtonProps) => {
onConnect={handleConnect}
onDisconnect={handleDisconnect}
address={account?.address}
addressHref={`https://etherscan.io/address/${account?.address}`}
addressHref={`${blockchains[(selectedNetwork?.id || 'ETH') as BlockchainId].explorerUrl}address/${account?.address}`}
balance={accountBalance}
$isOpen={walletPickerOpen}
$position={walletPosition}
Expand Down
2 changes: 1 addition & 1 deletion src/domain/connect/base.ts
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export const blockchains: Record<BlockchainId, Blockchain> = {
chainId: 1,
eip155: true,
currency: 'ETH',
explorerUrl: 'https://etherscan.io',
explorerUrl: 'https://etherscan.io/',
rpcUrl: 'https://eth.drpc.org',
},
[BlockchainId.AVAX]: {
Expand Down
15 changes: 15 additions & 0 deletions src/domain/ens.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import { providers } from 'ethers'

const provider = new providers.JsonRpcProvider('https://eth.drpc.org')

export const EnsNameLookup = async (
address?: string,
): Promise<string | undefined> => {
return (address && (await provider.lookupAddress(address))) || undefined
}

export const EnsAddressLookup = async (
ens?: string,
): Promise<string | undefined> => {
return (ens && (await provider.resolveName(ens))) || undefined
}
57 changes: 42 additions & 15 deletions src/helpers/ipfs.ts
Original file line number Diff line number Diff line change
@@ -1,20 +1,47 @@
import { createLibp2p } from 'libp2p'
/* import { createLibp2p } from 'libp2p'
import { webSockets } from '@libp2p/websockets'
import { all as allFilters } from '@libp2p/websockets/filters'
import { mplex } from '@libp2p/mplex'
import { noise } from '@libp2p/noise'
import { webTransport } from '@libp2p/webtransport'
import { yamux } from '@chainsafe/libp2p-yamux'
import { noise } from '@chainsafe/libp2p-noise'
import { bootstrap } from '@libp2p/bootstrap'
import { kadDHT } from '@libp2p/kad-dht'
/**
* Creates a custom LibP2P node using WebSockets
*/
export const getP2PNode = async () =>
await createLibp2p({
transports: [
webSockets({
// connect to all sockets, even insecure ones
filter: allFilters,
}),
],
streamMuxers: [mplex()],
// Requires: npm i libp2p @libp2p/websockets @libp2p/webtransport @chainsafe/libp2p-yamux @chainsafe/libp2p-noise @libp2p/bootstrap @libp2p/kad-dht
const peers = [
'/dnsaddr/bootstrap.libp2p.io/p2p/QmNnooDu7bfjPFoTZYxMNLWUQJyrVwtbZg5gBMjTezGAJN',
'/dnsaddr/bootstrap.libp2p.io/p2p/QmQCU2EcMqAqQPR2i9bChDtGNJchTbq5TbXJJ16u19uLTa',
'/dnsaddr/bootstrap.libp2p.io/p2p/QmbLHAnMoJPWSCR5Zhtx6BHJX9KiKNN6tpvbUcqanj75Nb',
'/dnsaddr/bootstrap.libp2p.io/p2p/QmcZf59bWwK5XFi76CZX8cbJ4BhTzzA3gU1ZjYZcYW3dwt',
]
export const getP2PNode = async () => {
const node = await createLibp2p({
//transports: [webSockets({ filter: allFilters }), webTransport()],
transports: [webSockets(), webTransport()],
streamMuxers: [yamux()],
connectionEncryption: [noise()],
peerDiscovery: [bootstrap({ list: peers })],
services: { dht: kadDHT({ clientMode: false }) },
})
node.services.dht.setMode('server')
console.log(node.peerId.toString())
node.getMultiaddrs().forEach((ma) => console.log(ma.toString()))
node.addEventListener('peer:discovery', (evt) => {
const peer = evt.detail
node
.dial(peer.id)
.then(() => console.log('Found peer: ', evt.detail.id.toString()))
.catch((err) => {
console.log(`Could not dial ${peer.id}`, err)
})
})
node.addEventListener('peer:connect', (evt) => {
console.log(`Connected to ${evt.detail.toString()}`)
})
node.addEventListener('peer:disconnect', (evt) => {
console.log(`Disconnected from ${evt.detail.toString()}`)
})
return node
} */
2 changes: 1 addition & 1 deletion src/hooks/common/useConnection.ts
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ export const useConnection = ({
}
}, [triggerOnMount, provider])

// @note: Switch the blockchain network without recconecting to the providers
// @note: Switch the blockchain network without reconnecting to the providers
useEffect(() => {
if (!triggerOnMount) return

Expand Down
18 changes: 18 additions & 0 deletions src/hooks/common/useENSLookup.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { useEffect, useState } from 'react'
import { EnsNameLookup, EnsAddressLookup } from '@/domain/ens'

export const useEnsNameLookup = (address?: string) => {
const [ensName, setEnsName] = useState('')
useEffect(() => {
EnsNameLookup(address).then((name) => name && setEnsName(name))
}, [address])
return ensName
}

export const useEnsAddressLookup = (ens?: string) => {
const [ensAddress, setEnsAddress] = useState('')
useEffect(() => {
EnsAddressLookup(ens).then((address) => address && setEnsAddress(address))
}, [ens])
return ensAddress
}
2 changes: 1 addition & 1 deletion src/types/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,6 @@ export {}
declare global {
interface Window {
ethereum: import('ethers').providers.ExternalProvider
helia: import('@helia/interface').Helia | undefined
//helia: import('@helia/interface').Helia | undefined
}
}

0 comments on commit e5e3a63

Please sign in to comment.