74d868e · bridge · git.iko.soy

git.iko.soy/bridge

wc: handle missing peer icon

- fallback to showing 'Icon Unavailable'

commit74d868e25c4a14f4decf3849a8df2b210edeb03b authortomholford <tomholford@users.noreply.github.com> dateThu 12 Aug 2021, 23:24 (5 years ago) parent7a88f9d

2 files changed+16−3

compare with master

unifiedsplit

src/lib/useWalletConnect.ts+13−1 src/views/Login/WalletConnect.tsx+3−2

src/lib/useWalletConnect.ts+13−1

@@ -2,7 +2,7 @@ import WalletConnect from '@walletconnect/client';

22import QRCodeModal from '@walletconnect/qrcode-modal';

33import { ITxData } from '@walletconnect/types';

5−import { useEffect, useState } from 'react';

5+import { useEffect, useMemo, useState } from 'react';

66import { Just } from 'folktale/maybe';

88import { useWallet } from 'store/wallet';

@@ -103,6 +103,17 @@ export const useWalletConnect = () => {

103103 return connector.connected;

104104 };

105105

106+ const peerIcon = useMemo(() => {

107+ if (!peerMeta?.icons) {

108+ return null;

109+ }

110+

111+ // Some peers return a list of empty string(s) :)

112+ const iconCandidates = peerMeta.icons.filter(pm => pm !== '');

113+

114+ return iconCandidates.length > 0 ? iconCandidates[0] : null;

115+ }, [peerMeta]);

116+

106117 const signTransaction = async ({

107118 from,

108119 to,

@@ -219,6 +230,7 @@ export const useWalletConnect = () => {

219230 connector,

220231 disconnect,

221232 isConnected,

233+ peerIcon,

222234 peerMeta,

223235 resetConnector,

224236 signTransaction,

src/views/Login/WalletConnect.tsx+3−2

@@ -19,6 +19,7 @@ const WalletConnectLogin = ({ className, goHome }) => {

1919 connector,

2020 disconnect,

2121 isConnected,

22+ peerIcon,

2223 peerMeta,

2324 } = useWalletConnect();

2425

@@ -41,8 +42,8 @@ const WalletConnectLogin = ({ className, goHome }) => {

4142 <Grid.Item full className="f6 gray5 mt3 mb3">

4243 <Grid>

4344 <Grid.Item style={{ gridArea: 'auto / 3 / auto / 5' }}>

44− {peerMeta.icons && peerMeta.icons.length > 0 ? (

45− <Image src={peerMeta.icons[0]} />

45+ {peerIcon ? (

46+ <Image src={peerIcon} />

4647 ) : (

4748 <LegacyText>Icon Unavailable</LegacyText>

4849 )}