From 67c7506c4daa03476afda1b33d4253c033eb126e Mon Sep 17 00:00:00 2001 From: Mati Dastugue Date: Thu, 9 Jul 2020 01:06:49 -0300 Subject: [PATCH 1/3] Wallet enhancements --- src/components/Header/components/Provider.tsx | 6 +- .../ProviderInfo/ProviderAccessible.tsx | 47 +++-- .../WalletIcon/icons/icon-authereum.png | Bin 0 -> 4578 bytes .../WalletIcon/icons/icon-coinbase.svg | 31 ++++ .../WalletIcon/icons/icon-dapper.png | Bin 0 -> 1268 bytes .../WalletIcon/icons/icon-dapper@2x.png | Bin 0 -> 2259 bytes .../WalletIcon/icons/icon-fortmatic.svg | 11 ++ .../WalletIcon/icons/icon-ledger.svg | 1 + .../WalletIcon/icons/icon-metamask.png | Bin 0 -> 1254 bytes .../WalletIcon/icons/icon-metamask@2x.png | Bin 0 -> 2156 bytes .../WalletIcon/icons/icon-opera-touch.png | Bin 0 -> 1630 bytes .../WalletIcon/icons/icon-opera-touch@2x.png | Bin 0 -> 2769 bytes .../WalletIcon/icons/icon-opera.png | Bin 0 -> 1266 bytes .../WalletIcon/icons/icon-opera@2x.png | Bin 0 -> 2159 bytes .../WalletIcon/icons/icon-portis.svg | 1 + .../WalletIcon/icons/icon-torus.svg | 170 ++++++++++++++++++ .../WalletIcon/icons/icon-trezor.svg | 5 + .../WalletIcon/icons/icon-trust.svg | 7 + .../WalletIcon/icons/icon-unilogin.svg | 77 ++++++++ .../WalletIcon/icons/icon-wallet-connect.svg | 9 + .../components/WalletIcon/icons/index.ts | 93 ++++++++++ .../Header/components/WalletIcon/index.tsx | 38 ++++ src/components/Header/index.tsx | 4 +- src/logic/wallets/getWeb3.ts | 2 + 24 files changed, 484 insertions(+), 18 deletions(-) create mode 100644 src/components/Header/components/WalletIcon/icons/icon-authereum.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-coinbase.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-dapper.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-dapper@2x.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-fortmatic.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-ledger.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-metamask.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-metamask@2x.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera-touch.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera-touch@2x.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera@2x.png create mode 100644 src/components/Header/components/WalletIcon/icons/icon-portis.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-torus.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-trezor.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-trust.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-unilogin.svg create mode 100644 src/components/Header/components/WalletIcon/icons/icon-wallet-connect.svg create mode 100644 src/components/Header/components/WalletIcon/icons/index.ts create mode 100644 src/components/Header/components/WalletIcon/index.tsx diff --git a/src/components/Header/components/Provider.tsx b/src/components/Header/components/Provider.tsx index 86b30343..8f2032c0 100644 --- a/src/components/Header/components/Provider.tsx +++ b/src/components/Header/components/Provider.tsx @@ -6,7 +6,7 @@ import * as React from 'react' import Col from 'src/components/layout/Col' import Divider from 'src/components/layout/Divider' -import { md, screenSm, sm } from 'src/theme/variables' +import { screenSm, sm } from 'src/theme/variables' const styles = () => ({ root: { @@ -26,8 +26,8 @@ const styles = () => ({ flex: '1 1 auto', padding: sm, [`@media (min-width: ${screenSm}px)`]: { - paddingLeft: md, - paddingRight: md, + paddingLeft: sm, + paddingRight: sm, }, }, expand: { diff --git a/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx b/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx index fa1ce9c9..a60d53d8 100644 --- a/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx +++ b/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx @@ -1,18 +1,25 @@ import { withStyles } from '@material-ui/core/styles' -import Dot from '@material-ui/icons/FiberManualRecord' import * as React from 'react' +import NetworkLabel from '../NetworkLabel' import CircleDot from 'src/components/Header/components/CircleDot' import Identicon from 'src/components/Identicon' import Col from 'src/components/layout/Col' import Paragraph from 'src/components/layout/Paragraph' import { shortVersionOf } from 'src/logic/wallets/ethAddresses' +import WalletIcon from '../WalletIcon' import { connected as connectedBg, screenSm, sm } from 'src/theme/variables' const styles = () => ({ network: { fontFamily: 'Averta, sans-serif', }, + networkLabel: { + '& div': { + paddingRight: sm, + paddingLeft: sm, + }, + }, identicon: { display: 'none', [`@media (min-width: ${screenSm}px)`]: { @@ -33,6 +40,12 @@ const styles = () => ({ display: 'block', }, }, + providerContainer: { + display: 'flex', + flex: 1, + alignItems: 'center', + width: '100px', + }, account: { alignItems: 'start', display: 'flex', @@ -42,25 +55,27 @@ const styles = () => ({ paddingRight: sm, }, address: { + marginLeft: '5px', letterSpacing: '-0.5px', }, }) -const ProviderInfo = ({ classes, connected, network, provider, userAddress }) => { - const providerText = `${provider} [${network}]` +interface ProviderInfoProps { + classes: Record + connected: boolean + provider: string + userAddress: string +} + +const ProviderInfo: React.FC = ({ classes, connected, provider, userAddress }) => { const cutAddress = connected ? shortVersionOf(userAddress, 4) : 'Connection Error' const color = connected ? 'primary' : 'warning' const identiconAddress = userAddress || 'random' return ( <> - {connected && ( - <> - - - - )} {!connected && } + weight="bolder" data-testid="connected-wallet" > - {providerText} - - - {cutAddress} + {provider} +
+ {connected && } + + {cutAddress} + +
+ + + ) diff --git a/src/components/Header/components/WalletIcon/icons/icon-authereum.png b/src/components/Header/components/WalletIcon/icons/icon-authereum.png new file mode 100644 index 0000000000000000000000000000000000000000..c0150acf3a825afe1ea5b86af67ac9a62d2f547a GIT binary patch literal 4578 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 Js;@ak{|jSoS*-v7 literal 0 HcmV?d00001 diff --git a/src/components/Header/components/WalletIcon/icons/icon-coinbase.svg b/src/components/Header/components/WalletIcon/icons/icon-coinbase.svg new file mode 100644 index 00000000..7c6cb2e2 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-coinbase.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-dapper.png b/src/components/Header/components/WalletIcon/icons/icon-dapper.png new file mode 100644 index 0000000000000000000000000000000000000000..ea7997987910f380e5eceefb44cd0927298e337c GIT binary patch literal 1268 zcmVEqky;oaun-RAGh@8HeTJvDuk6V(Nq;;P>$T@#g%&knp#C z?WbbtrC#XwmB#GW@$T01^3(MCiNKsq=Je0?`KsIZyy^AL_4dZ__RaVCpw#uw_w>y4 z@yhY_&Gqxj^YzX4^vv}5v*Y#5_3g{;^vv}0%k%Wi^a+|z(*OVfV{}qZQveAtM`Vat zBNM0H?DX!%_jm2M@$>fh`aAFZ|NsC0|Ng80|MCC-|NsC0|NsC0|Nrj)|NsC0|NsC0 z|NsC0|L_0*|NsC0|Nr*w@^JY7?ep;S@9y;3R-wkP*QfHeSGuua=!Ogy0009QNklGrPn7)n^*S3|<{ z$QC5W-g%Da!r7R%8EnhO%wHXrmUMDcz(dw`_LoCB?2|!+k?F(e=qkS$mUS=0ekL0L z-_RBe(vJRIc>Y)=PFtK*TrJ2t_vp#%?UQiVSyhh|nJ1WsCbSmTQyBm>s}!@sgFbgo z4HV;;&$S~Uz^pJSN)5bB_AU?I@MuN}vKL?3q12tl>{EC?DOW1gWnchZs&EMNDcED;sUUv=obw-RrT(dOfzF;ndMG&6PUFI2uqidu1+*7*hws zfplfKvglPKH)2&&7e%rj+U2DbNhuj(b>>u32IFJ6t)Idtha;*bo3d+@!p@-S)=Q`2 z9}tDZf9Tm!P78uh9UB7-Ib=_(3h4re+A)z0I2s-qwa{%pUn^AfN8Fsz0d(pl-x!nm zJ>0el3Iw_C*fbT|-t@8BShKSpH~W-bm@S|3TYX4-ZR}gB(~<00CYD4 z!@~#X+67+SABQq+ja!gxS@ffTlK7Oc%%?PQt553po1iP(+D%XM)orqrKpc{cY|5cX zUaiKq9|PLooz>lPXe&;z`q|1LUG~0*eihfgfKDKR}Rd78zVN(JBVLv`zHYkcJx5z z!_y56hu<3ld?#yTiyM0jCiYo^A~2NtgE57a^Zyt41McnLAc7UCl;m3W15x5~{EA(U e-P1t#f*AnDwv_yrg^yVP0000E_Jn(A`u-s$1m zto>u8|6QN|R-6A=oc?R5{a&E|TAlw|oc~*% z|6-#5da(bAx&Nrk|Iy_C?DYTl`u~~2{`~&`|NsATtpCN`|GL)Y-Rl40?fLZn^5^{F z$oR>g^0avE!;|po*80+}^t*-bolfV8D&mA9;D8$7jWgqeAK;~2=-R#ZmqX>~+wJPu z?UOv@tZC}+%j@mb@%Ovv@7MPEmCN$a^!cLI__E>m#`5;e_V&&8^UL$=$m{mZ_VUZ} z^2_q_%kt39r%nI>09tfXPE!B~6CWyBYdcSy!Q$@o*06i{?u+p8^Y{4r{Qm#{|Ns8~ z|NsC0|NsC0|NsC0|NsB)|NsC0|NsC0|NsC0|NsC0|NsB)?*ISn?(psQ?)35Q@a@s5 z^qi-;K_g!J000LXNkliD}EXchSN&Jn|3(_SSF7G&hm7qfZ zGo8Cr^3292{>m>Y;^+fi$U0mdS2~1A>AmTTQpvK_DJF+ly|Yq<@AT3;fIJTch?o&b zPhvj6$mHdCoG6)l$4{;EqO5ABD$63*Iy;+>coEW}?ybGb^0I1<#u&?(3ER|Fp>dVQ z?o%Hu?L%F(-RSB^h6VagV%yc^oXbwVC(E)?7LNmz+{zutz&Fg;FK}FGnuX6e7ZLM+YEid84u32 z&*%O7$VXVq86miCAm47FTibtzDPTnTcN>^}mXG_G198`BmA%7@84zNfON1P-I}iAGd?>g&$dkrXMCYIG z^3ZP-2g10w_g+&ZQfM|Z9bD+f;Bq;3-~VZDG=M@JZgx|@-~9E>j6lkp&Y@igPNYAuO04?2hb|LYM|)9{rD>XNyrBq0`U^3yVbeGm@E8*f_0^WA z2oD&{AO_?9B3O$97i^$v9C*elUtr_BtPuE%5)*smZ!o1u*7G*7|1Nfeg~&T`h(%Lu z;+Hp1CT}XIhJR<2qCpmMe`uo3VQX%c;pSZB$b(2qcE1|a2t3a}oT{qcKApU+YWNP` ztg<^7IcPETJ(zd7+xO+M1ulka9QcfRez?M+$&_CIc<69FfY8%N%rfY zjCR@1?|{BA2~(V{XBD^jYEsoTIQ&hpt8@z^wH2n3=%Jx!U~W-H!|i?q9e{q2Aa z;F`Ps>PjU|TsHdahPZYU$#@{LnXaLTi3iRDAmEMy$S0#{x;tZ-Fm)|W!5hVh$gfMv zCGDm21_OcM@XxKdz))E+G~0r(HPw9hCm#i*+KYxV5Xo-=JT&nC@9;KEs4PjQDM|8x zCYa+Q{jU_eK&~DH0yw_0($UW)M(i>*3heUi{ue2Mlo#r4e$OTU*g;ZbG^zvTwzvo;$)hgD!Y&)3^1wp*Iea$Q28qMcHl$ z^7@t>cZQyv#tp%eJY-1$`%P71lo?N6cSiq}XhTI*X&DQVLy(o#y@dYS^HBZIZHI1z?s zoQ{#DDT0XRd-i;QV++J{P4i|Zx3z9Tv?EB|jvOG=T hRY{U$pOYp}at}6|j_y<-!1(|G002ovPDHLkV1hfI#jOAU literal 0 HcmV?d00001 diff --git a/src/components/Header/components/WalletIcon/icons/icon-fortmatic.svg b/src/components/Header/components/WalletIcon/icons/icon-fortmatic.svg new file mode 100644 index 00000000..a24833fd --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-fortmatic.svg @@ -0,0 +1,11 @@ + + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-ledger.svg b/src/components/Header/components/WalletIcon/icons/icon-ledger.svg new file mode 100644 index 00000000..02b81e95 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-ledger.svg @@ -0,0 +1 @@ + diff --git a/src/components/Header/components/WalletIcon/icons/icon-metamask.png b/src/components/Header/components/WalletIcon/icons/icon-metamask.png new file mode 100644 index 0000000000000000000000000000000000000000..e8270510cbc8d17bb99a0ffdb0e4e0278755c1a6 GIT binary patch literal 1254 zcmVuj(Ngm^VB=U$Om|-=`a3ZN*A;hz%!?UNtu%;s%93dYcA{`wfARu*X zW^!m^A|D`+Paf!jB;|i3@P{LSNFMWvBw_frj3n)ZB=w6U?t~@yjU^#k8nOG$3?pWK4HJ-T(jqN_0|AQviGV4wC*80|+aoa6O+{{k}#Y9Q*#p?W^`^ z4eH`JQqE(G`TZ__#_p54*YdaJmDq_$;^xh@%*or+`uS+cshedaVl;-F{IvdEP;pKG z00PcQL_t(|UWL+EUm8sm2Ji)fAfSMPAgExA-9%0A{e7L;Ug*8qyXob#=gcfKE5BU$ zTyV30<~ehA1t-4IIpNlTN=%O4s{E-*N!lF#7Yv17Mtxkl!jdF~BjW=F>BV4RI`%5c z)m%;@nM`_^Nr!@g`}3w*-Mz>D>lp!MyGM8I08veZD%HYfigk`Mm6uwmNFyVRu~Kg4 zqzLbf0Ap_7&>)6M)WLo}@1A3G47&j^munvqCt?N1T6sx&%C`iQIV|787BCsc+65I( zvL%ftDB!gX8JtmR=0Hhq7wdF6hdIZ|F{-2o(ZNoBSfQpt_;V`(z{1f!K3U(Tl@KzDn`ij6467BRTaas{prnVdw zC|We4!+Hj7?M?-`8e2Zr?6BitM9~6PIl94uMXevXT(8w?^;-43j^MrOrD}|q`m>yA zVx?X>Z=7AW>ewK!|L2Ph54!+Ibf=Z}*~R5W6^St1!PWKB5Wm2HL%OA2U$v1+4)4i~ zu?z5CBwL5YV-e}ZsjGc9Ths<($)a7a>M-8()ihPU>N|3U>VO2CVSv0KdtPj}GG{QV(P<4Wslx3rs z%@DU`Vkb~(A9h58QKwV*z4P&%AS})+H(a?44{@jS*<7q^naK!9~A+=I%tCh<<+k`R~)XU|*tV;^{zUjD5`@ zy?qt;dM9QCnic)oN``Kc2hLpcdgE~~sBQLHhSCmj zT~kV(VKU#MY~znbN=Zm=WnYnHI*(d3i+^{fn2vx*9_4=|=YS-AMjnMq9)n39=z%1R zPaer}BkY4D_>Cm$f+XL4B&}c|wPq!uSs$8KAN7kQ^NJ+!h9s3#AHQlM*Lfu6ek1XS zB<_VI`i>;_j3m@=A>67|WB>pFLUdA2Qveh2z00vx1L_t(| zUaXeMZlgdDh8-ar0Wo8P;zZsiCo3Ao(nvYYY2KxGcJFI4&psv)x@j7mgTEt(PgQ?+ zRnt<_aVC1}Mwl+KySH-zpiOV$>N^(~pu@o}Ttfm<$f)ye!QJEEfzqW>kU?hO(CBw} z55HcYea%$3x)ucm-D?H4+i$N3F}U|;DwhoetcKW(_QT^7+6D-+IKiY}bxlexK(!iM z`|bDrbFdBI1?I1?D&Mh9K?yoC6=6T!zrrA3FvIsSAoEJ$6ACK)c`Nhd{`rMP4CN+t z++SS4lGD{Er0T+6{2qz~2tf{ulg|d6$~;;?0Zuj_0$~6J*kOr5%2+O}M}Z3Le~4^_ z!cZDlidBh!2-J9yDBEyZ7FSB8%f1b2NJ7!ZautdfwDxk3Xq}84-UV4u#09>v3ZthsHIx=b7v7!t3@mY}Fh@E|V@#S|p3nQ-_(ZhX z@+cYe=E~?EF`>_e7%+7W`OR&XEf7SfLUw`+F%>c{+YGJQb%YR}Lt#7@Vrf?Sg&o*U zfh917_qk#4m|(uzdxp4RU9H)baSHi(BEe?O1exB~8b>M47tVPt>@*Y?7lhiS*Q7Ji z?Ap5@7wdjgoIv`C+vEqJtI-A(KS2!Q1@|2GqOYK?-E*O3F8D?uJ-$JBR zm~PHAQt#rF`-JGQ!n`t$*|X?X7d#7VD6{Qw_5Vhnx}b_DxnNY;-M)vZ{6k{6L^a$D zN}Tva6*jxql9)Obo5BTyknipcr=!Tk2M2hV^< zV|E{bd;vUq&m5g&WC#SfG@48GwakuyV&E`*9}8U`qB7r$WiLgpz1AYw1aTg2q#Prb zoe5m|QZGp03uPXw6MHLJQ6Q6ARJJ{uX>*6RE09%~YkM^4C;tsWfh@zSWZ34aup|m* z6QwA+-qjEDJ3P6p74Z08_~itus>%wjQ;}tPDa(I6<6Zd<3C7_ns?1Q;>9=KgRpL4= zq{_3A+O7S>%Q7t*jO(aQb?R(19?v2frop@NbUafIe&*|}P#155-YVTcqw!!cxL?X$ zkKUy$UH�&A}@^SxF#cTToG#(?~TKkEg26`e}K~(fI3k$ag>@$1lW%9)R<&qx;9m z_xPkhV8$|cIi2^gQRHN$fJ9HthI&2g`_pVXdK`r^gY{Dhjffk8%qbm9aW+!fqSssC zIoT!a7ATg3-X>))Se0TM@MvX=g^dA#F8xGzEp#ZJ@pPMEC+cQBz@BZs;%0miYzG_8 zW{1%_8^XAptda&x$M-kgQK>l2>Lz8G-T#)krq4G8$6`Mr%WW^xcCgn~6=-0Ggkg)8 zR$AH^r$Q$!m}Lcyi^w>2K?HIg+hPkUwprQE+Lp;$Vgd&vI_EkB1ZetB5c_a!TVyNi zDqRytm>fvy%9Ji(co1P{rSlDww@C*;h_`mhUg84)5y@mZCMLFCD@V`l5T)B#Fdm3} zJFslLvMpK?yX zdwV*WM2_o-i||F^WgqDMvjhbu)2($Xxk9_SU*#RVEad7Jx@z|hk~RpTQ7h+iQSk76 z)ZD-9_lGGq?aSkrzyAL18C%@NwG0{v)Q-zirm(r$+s$9Am;IqYIMf=AhE}a_EL($4 z2?j5VWobu5{av-u4-;-Ghy6=J=we7UNcNR+yxZAJf2e&_KdEYcO`}4p()JTi56UJq zjbf)FQIn8-J|CW6l_<1+pIjTv#n=O9<(x#1X{)es)O;5j)@UdEb0u=%|Cd6${=WMD i{QUf6zus)Ond@IegqM9tmitWr0000 zc3wUGEoN+7!dI;mb1Sizr#ZD;^;E%5%;^tWZ+R*eCg=r-A&)g>So9DI=OyNi5+oPy z;3aBr@>2Ba++>~Mb9hO*G+vVS8uCE8<*d_f{!_s~*8cAtx8?;3*J%<(Tl5+B2}R@s z!p%Apkmj(HnBcg(APutk4z#LG1<{4h%k;ZlmKPG24MoIpnZ}IIWBg&~2`4UzG0hX+*R(?7F;PneF<@+&3cX&n{9b+%;CY5G zFXC6|^mDlcA?G((ul5~VM7&36s37J$Jd3zEt>4SF6HDCw>{b)w6re!oiUZu7Dh*r# zS%*pkiKt>fbN=dWd__JcNou!3E@*&(`1jLLF~<62X8Sm+`_R7l^GN_vpK7Ddc~u=n zJgN+(f*2(6T&aS=U38-%5Y$b}NN~@Btl+SV{$-tsXkADKR3A%9BC^)N&Ls+lDRiEp zDxIM;BBgpsdDk;p#evNtYfgC_S!*hZs5Qw9q{r16ljdDvE0-#Wu8oY=orsbdNO-)4 z3SyD*y7iXs4()2pij~xvNtkF~Zvkmve_j&Cv6&!RB{rgvL`7;#K=)GVtZ!iHwg?~q zk&@_He~pKUAdJy^5R3`dP(du(J!2yBTLTL3(Rih%dxNEf2~@&FQ0A279p|Ul#`AKNlnr|b+nr@(i81fheQ78(RxfcnGmj#+SKltY@H|m?nLzU2yi31u+qleNp)PKr6G}lLqo7J?u<1g**Y%v|2N4>3 z?C%f^0krhTtqu|;31YYTa164R6w&oDkVqC@rGgmpm>d>LABVO%ETG3Q{veSmx=v-6 z=vvlszvEn!gG=-xvvm-F^HpCdF*d7d@wak^xB+ya;cMnP^C zRS>O+$z;uPgE4hDU{5L}j(Q#?G!R22s7HRZBGx@f(m+hce!I!iBme$@gPqO>>?KTG z4L(9p0h}4l1V4^Nta;q@Vxcq!vMf5;V9B@^p7i2MSR!Epag4nZe|F+n4+$CTB^~w~ zB4(v$%=ftDQ=WD2p=86E2jXqycI+l9h`njIq(hm0xT6~(B5V7Y3PhEx$64sI58c5; zT8EWRkb9+CPaeruQbFvgeDx9xoibm2$Xi@jLq^)_HY2Jwca38PHAgE!_5%=m(`mty zx1Hyvz3sS=yzDUF45a7xo>lz1Xf0Dk@ux(|_@-BhwE1}|h=G+pi3B40UQ@0W^qqDD zuW8+<8M3-hCrm&LulH4pmXy>BrCwSpn;sY@YjiM6(&zwTBBahS(y94AvNd24ftX?F zC{hy0voC7V8yp5o+nvh%BS%_SeNa++D=CSCZ_H>JOgZ32%a-@HB zA20rWV2b#+emBLx_RSFg)~D!mkcJrYNPizX49{49iEg2+>W?l82upwMv>4z$(r}|? c?Y|-Z0i|=!cIc?6WB>pF07*qoM6N<$f_{w$@Bjb+ literal 0 HcmV?d00001 diff --git a/src/components/Header/components/WalletIcon/icons/icon-opera-touch@2x.png b/src/components/Header/components/WalletIcon/icons/icon-opera-touch@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..cea9af817adb5ec03a9e2ea26d8376925a8ea742 GIT binary patch literal 2769 zcmV;?3NH1DP)z_jotLqcO%^ z4sfzjowYjEViIsTu=X{l?WHuw++C-~O2J_?*Gzc$VLJ0oboRJA(LWe?=whB^B&3No zzVL04IIsBob&5B$_oYafS5@~_TJoAVziKC&)>X1PwE9*clC?X}S~cq~E{8W1aPe!D zSTE+4FS%h9Z*n!!G_mlZGsb8ns8(9^R$KV%Ymm4;&3h-OLyhx$E2m~7oIa84Y9yzb zFS(}nWH#BgHt^Y5s*y0bHppEcsk1uL$V$K8U!sgJvtKOH zUn|UCDaKwVyrMP5ULvvaZj8S{%m06UzgUn?7N}MqwRtX?P9MjOJDgQ0(@ZMp)n$w5 zZH7dP_CBNdE<>3|j{Ho4Ro^~gqT2A&op7nYu zrdL+>T_BHGQTAL#^&|mPIga2@Z1#UDsZJb(CkkIuV)jdS_J}R8NPzW9d-Y}`mtH{j zIJ5XX7IjQ=_C*P_9{ly6951JoODu7Qvm)Q3>W?b z1`I41f8O%fz(p})B{2SfJqj1iG-F^RP)P2QBFF5dW^M3<*$^vuMo=kh{)fZ;-DSgA zy0g@HakK1`u|zki=$+Nk`|`NW!i(^MspR~bm;Ga?{ENzthGCQt z{69)YqtlvQdi^M(ce%`3l%>Fb1C=b7(|-!tW;wRdC`#%y4Ey|(LP)VXv)*>kGh4se zT-sqJ^~@xz@rP`GHn{)DnYDe=GD^@kn$?bmY&(hCLKnBIrNqv0&5kXk*R?x1qw(vj z9UiWE9LeQ^(IgU$26K@WuU5kXVYE_b&LYJu56TrI!K9;4cT`nM2K_=sR<{zz6;s*cTr$HQi-3Mw4J0%pI zt0g3ZcJ0O$9beR)pcP0NynpdrqaBamL}MFkCa2SBTHA=BCeK5ubY3#4C7=bW%Xm#l zU4Mu<<%-%XVukwi>O+HAtD?$ayun?jJ_PIvv4jR3NK3@a&b7v3^Ql?G{3YSW7|4onW>9JAvCX zwny*`fhS4EeYdzdpZK5PVnc7tA_7l>Th?2`>k$ZQD9Zt9K?($PZk7MQ&Ap=QJ=NGY z;b6cGgp63rgxB?dw@A93C&;>KAVfS-sgx@`<+&H%b3yk{d6MNjAZT!Evck7psZ9R} z5ZEm{#O3o+5fB7LzFpj@RROCL_vFc7M>hq84USKq;wF0~C^+=<_8qQ6CW1g1J@NiG z+||Sg0C1rH5bqs!EKr~gbnoUB5uEOYfR--Y-F?HBtiP=woZ7r1{9Ste{-kxq0UW*? zc!3M|O29?JVvI z4s{&^=alN&Zc`^(wDup^AF!9(8`Jn=2b6lxS0<7T`lXb*flD0- zp`ctskq}Qm2d2?FyTdF9rnnlipv3d-Biwz@P0FH;AP4y?dQkY}ISWk@`Sd;rUYPEu zYB(N6(Eaw}wbg{dww^~nVlMRbQ$_`!&k1Q|q``I&T<&S6TKN~z4O=;2gN`h|FFDziaJ9-0U z;oyu@#6N6jXaScGR)<+0FA_g`wExZ$F61{;?>8t?AgJgd3o`9XKVX*hPE&sSiU2Ix z_C=ZXD2VYJH2Dn{^mxJzmNtae0H>MG9|1gE7P2FNZoZVjdx-&4;gCv!UWDwB()foH zYYBn1gt-X?CDn>aR1x4=vSakpT4F{RoY9*KGm~|q9zp@ z&yhBb_tLRmIa9i)arqtsqYmcO-`n1Fdj8}_`g$8m7gdgj&^SX=fXEn5&tuYk7d@`i z$tKnK)HA@LLOsaT5uV5Op`yX1!E%gCH8J~a7Tp34RmrJ**l}?VH~;EtkFTXkb37fI z)-bNX#4I#bTo8a3!QzX#S97gX0ar_LaaBXXUx1YruSzfpSgd>j?Co8(dAquX0)fEL zgx4Ef!6h>*Ls$NhIh1^99tm@BI$sa;?v^o5@Tj38Alo zGG)<5JtD~-} z9n)R0HrCY@!sw&XdS%S6tf~iVL5vnx)!I?g+E`#c%1Np7kVvbPcKcX?-L6zi%Z=?n Xjjj`2N~Qfa00000NkvXXu0mjf8N*v; literal 0 HcmV?d00001 diff --git a/src/components/Header/components/WalletIcon/icons/icon-opera.png b/src/components/Header/components/WalletIcon/icons/icon-opera.png new file mode 100644 index 0000000000000000000000000000000000000000..02fc963099ea76e2d4c5dd005bcbfb64243198f6 GIT binary patch literal 1266 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 literal 0 HcmV?d00001 diff --git a/src/components/Header/components/WalletIcon/icons/icon-portis.svg b/src/components/Header/components/WalletIcon/icons/icon-portis.svg new file mode 100644 index 00000000..6bda7082 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-portis.svg @@ -0,0 +1 @@ + diff --git a/src/components/Header/components/WalletIcon/icons/icon-torus.svg b/src/components/Header/components/WalletIcon/icons/icon-torus.svg new file mode 100644 index 00000000..e1930217 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-torus.svg @@ -0,0 +1,170 @@ + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-trezor.svg b/src/components/Header/components/WalletIcon/icons/icon-trezor.svg new file mode 100644 index 00000000..894808a1 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-trezor.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-trust.svg b/src/components/Header/components/WalletIcon/icons/icon-trust.svg new file mode 100644 index 00000000..348434a2 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-trust.svg @@ -0,0 +1,7 @@ + + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-unilogin.svg b/src/components/Header/components/WalletIcon/icons/icon-unilogin.svg new file mode 100644 index 00000000..5fb7355c --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-unilogin.svg @@ -0,0 +1,77 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/Header/components/WalletIcon/icons/icon-wallet-connect.svg b/src/components/Header/components/WalletIcon/icons/icon-wallet-connect.svg new file mode 100644 index 00000000..c26556ce --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/icon-wallet-connect.svg @@ -0,0 +1,9 @@ + + + diff --git a/src/components/Header/components/WalletIcon/icons/index.ts b/src/components/Header/components/WalletIcon/icons/index.ts new file mode 100644 index 00000000..579a9eb0 --- /dev/null +++ b/src/components/Header/components/WalletIcon/icons/index.ts @@ -0,0 +1,93 @@ +// Icons +import metamaskIcon from './icon-metamask.png' +import metamaskIcon2x from './icon-metamask@2x.png' +import walletConnectIcon from './icon-wallet-connect.svg' +import trezorIcon from './icon-trezor.svg' +import ledgerIcon from './icon-ledger.svg' +import dapperIcon from './icon-dapper.png' +import dapperIcon2x from './icon-dapper@2x.png' +import fortmaticIcon from './icon-fortmatic.svg' +import portisIcon from './icon-portis.svg' +import authereumIcon from './icon-authereum.png' +import torusIcon from './icon-torus.svg' +import uniloginIcon from './icon-unilogin.svg' +import coinbaseIcon from './icon-coinbase.svg' +import operaIcon from './icon-opera.png' +import operaIcon2x from './icon-opera@2x.png' + +import { WALLET_PROVIDER } from 'src/logic/wallets/getWeb3' + +interface WalletObjectsProps { + [key: string]: TValue +} + +interface IconValue { + src: string + srcSet: string + height: number +} + +const WALLET_ICONS: WalletObjectsProps = { + [WALLET_PROVIDER.METAMASK]: { + src: metamaskIcon, + srcSet: metamaskIcon2x, + height: 25, + }, + [WALLET_PROVIDER.WALLETCONNECT]: { + src: walletConnectIcon, + srcSet: walletConnectIcon, + height: 25, + }, + [WALLET_PROVIDER.TREZOR]: { + src: trezorIcon, + srcSet: trezorIcon, + height: 25, + }, + [WALLET_PROVIDER.LEDGER]: { + src: ledgerIcon, + srcSet: ledgerIcon, + height: 25, + }, + [WALLET_PROVIDER.DAPPER]: { + src: dapperIcon, + srcSet: dapperIcon2x, + height: 25, + }, + [WALLET_PROVIDER.FORTMATIC]: { + src: fortmaticIcon, + srcSet: fortmaticIcon, + height: 25, + }, + [WALLET_PROVIDER.PORTIS]: { + src: portisIcon, + srcSet: portisIcon, + height: 25, + }, + [WALLET_PROVIDER.AUTHEREUM]: { + src: authereumIcon, + srcSet: authereumIcon, + height: 25, + }, + [WALLET_PROVIDER.TORUS]: { + src: torusIcon, + srcSet: torusIcon, + height: 30, + }, + [WALLET_PROVIDER.UNILOGIN]: { + src: uniloginIcon, + srcSet: uniloginIcon, + height: 25, + }, + [WALLET_PROVIDER.OPERA]: { + src: operaIcon, + srcSet: operaIcon2x, + height: 25, + }, + [WALLET_PROVIDER.WALLETLINK]: { + src: coinbaseIcon, + srcSet: coinbaseIcon, + height: 25, + }, +} + +export default WALLET_ICONS diff --git a/src/components/Header/components/WalletIcon/index.tsx b/src/components/Header/components/WalletIcon/index.tsx new file mode 100644 index 00000000..0c6b6de5 --- /dev/null +++ b/src/components/Header/components/WalletIcon/index.tsx @@ -0,0 +1,38 @@ +import { makeStyles } from '@material-ui/core/styles' +import * as React from 'react' + +import Col from 'src/components/layout/Col' +import Img from 'src/components/layout/Img' +import WALLET_ICONS from './icons' + +const useStyles = makeStyles({ + container: { + marginLeft: '5px', + marginRight: '10px', + letterSpacing: '-0.5px', + }, + icon: { + maxWidth: 'none', + }, +}) + +interface WalletIconProps { + provider: string +} + +const WalletIcon: React.FC = ({ provider }) => { + const classes = useStyles() + return ( + + {provider} + + ) +} + +export default WalletIcon diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx index 7fa8242a..0b0def46 100644 --- a/src/components/Header/index.tsx +++ b/src/components/Header/index.tsx @@ -55,13 +55,13 @@ class HeaderComponent extends React.PureComponent { getProviderInfoBased = () => { const { hasError } = this.state - const { available, loaded, network, provider, userAddress } = this.props + const { available, loaded, provider, userAddress } = this.props if (hasError || !loaded) { return } - return + return } getProviderDetailsBased = () => { diff --git a/src/logic/wallets/getWeb3.ts b/src/logic/wallets/getWeb3.ts index 24549816..80edba38 100644 --- a/src/logic/wallets/getWeb3.ts +++ b/src/logic/wallets/getWeb3.ts @@ -23,9 +23,11 @@ export const WALLET_PROVIDER = { PORTIS: 'PORTIS', FORTMATIC: 'FORTMATIC', SQUARELINK: 'SQUARELINK', + UNILOGIN: 'UNILOGIN', WALLETCONNECT: 'WALLETCONNECT', OPERA: 'OPERA', DAPPER: 'DAPPER', + WALLETLINK: 'WALLETLINK', AUTHEREUM: 'AUTHEREUM', LEDGER: 'LEDGER', TREZOR: 'TREZOR', From 0237de751f9a054ebfe5c7b30a1ea7a1cab4dd26 Mon Sep 17 00:00:00 2001 From: Mati Dastugue Date: Fri, 17 Jul 2020 12:21:05 -0300 Subject: [PATCH 3/3] Feedback PR --- .../ProviderInfo/ProviderAccessible.tsx | 10 ++++---- .../WalletIcon/icons/icon-dapper@2x.png | Bin 2259 -> 0 bytes .../WalletIcon/icons/icon-metamask@2x.png | Bin 2156 -> 0 bytes .../WalletIcon/icons/icon-opera-touch@2x.png | Bin 2769 -> 0 bytes .../WalletIcon/icons/icon-opera@2x.png | Bin 2159 -> 0 bytes .../components/WalletIcon/icons/index.ts | 24 ++++-------------- .../Header/components/WalletIcon/index.tsx | 3 +-- 7 files changed, 11 insertions(+), 26 deletions(-) delete mode 100644 src/components/Header/components/WalletIcon/icons/icon-dapper@2x.png delete mode 100644 src/components/Header/components/WalletIcon/icons/icon-metamask@2x.png delete mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera-touch@2x.png delete mode 100644 src/components/Header/components/WalletIcon/icons/icon-opera@2x.png diff --git a/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx b/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx index a60d53d8..009455bd 100644 --- a/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx +++ b/src/components/Header/components/ProviderInfo/ProviderAccessible.tsx @@ -1,4 +1,4 @@ -import { withStyles } from '@material-ui/core/styles' +import { makeStyles } from '@material-ui/core/styles' import * as React from 'react' import NetworkLabel from '../NetworkLabel' @@ -10,7 +10,7 @@ import { shortVersionOf } from 'src/logic/wallets/ethAddresses' import WalletIcon from '../WalletIcon' import { connected as connectedBg, screenSm, sm } from 'src/theme/variables' -const styles = () => ({ +const useStyles = makeStyles({ network: { fontFamily: 'Averta, sans-serif', }, @@ -61,13 +61,13 @@ const styles = () => ({ }) interface ProviderInfoProps { - classes: Record connected: boolean provider: string userAddress: string } -const ProviderInfo: React.FC = ({ classes, connected, provider, userAddress }) => { +const ProviderInfo = ({ connected, provider, userAddress }: ProviderInfoProps): React.ReactElement => { + const classes = useStyles() const cutAddress = connected ? shortVersionOf(userAddress, 4) : 'Connection Error' const color = connected ? 'primary' : 'warning' const identiconAddress = userAddress || 'random' @@ -101,4 +101,4 @@ const ProviderInfo: React.FC = ({ classes, connected, provide ) } -export default withStyles(styles as any)(ProviderInfo) +export default ProviderInfo diff --git a/src/components/Header/components/WalletIcon/icons/icon-dapper@2x.png b/src/components/Header/components/WalletIcon/icons/icon-dapper@2x.png deleted file mode 100644 index f7efc26f71440ed81d5b7c60233a9345895c4a5a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2259 zcmV;^2rT!BP)E_Jn(A`u-s$1m zto>u8|6QN|R-6A=oc?R5{a&E|TAlw|oc~*% z|6-#5da(bAx&Nrk|Iy_C?DYTl`u~~2{`~&`|NsATtpCN`|GL)Y-Rl40?fLZn^5^{F z$oR>g^0avE!;|po*80+}^t*-bolfV8D&mA9;D8$7jWgqeAK;~2=-R#ZmqX>~+wJPu z?UOv@tZC}+%j@mb@%Ovv@7MPEmCN$a^!cLI__E>m#`5;e_V&&8^UL$=$m{mZ_VUZ} z^2_q_%kt39r%nI>09tfXPE!B~6CWyBYdcSy!Q$@o*06i{?u+p8^Y{4r{Qm#{|Ns8~ z|NsC0|NsC0|NsC0|NsB)|NsC0|NsC0|NsC0|NsC0|NsB)?*ISn?(psQ?)35Q@a@s5 z^qi-;K_g!J000LXNkliD}EXchSN&Jn|3(_SSF7G&hm7qfZ zGo8Cr^3292{>m>Y;^+fi$U0mdS2~1A>AmTTQpvK_DJF+ly|Yq<@AT3;fIJTch?o&b zPhvj6$mHdCoG6)l$4{;EqO5ABD$63*Iy;+>coEW}?ybGb^0I1<#u&?(3ER|Fp>dVQ z?o%Hu?L%F(-RSB^h6VagV%yc^oXbwVC(E)?7LNmz+{zutz&Fg;FK}FGnuX6e7ZLM+YEid84u32 z&*%O7$VXVq86miCAm47FTibtzDPTnTcN>^}mXG_G198`BmA%7@84zNfON1P-I}iAGd?>g&$dkrXMCYIG z^3ZP-2g10w_g+&ZQfM|Z9bD+f;Bq;3-~VZDG=M@JZgx|@-~9E>j6lkp&Y@igPNYAuO04?2hb|LYM|)9{rD>XNyrBq0`U^3yVbeGm@E8*f_0^WA z2oD&{AO_?9B3O$97i^$v9C*elUtr_BtPuE%5)*smZ!o1u*7G*7|1Nfeg~&T`h(%Lu z;+Hp1CT}XIhJR<2qCpmMe`uo3VQX%c;pSZB$b(2qcE1|a2t3a}oT{qcKApU+YWNP` ztg<^7IcPETJ(zd7+xO+M1ulka9QcfRez?M+$&_CIc<69FfY8%N%rfY zjCR@1?|{BA2~(V{XBD^jYEsoTIQ&hpt8@z^wH2n3=%Jx!U~W-H!|i?q9e{q2Aa z;F`Ps>PjU|TsHdahPZYU$#@{LnXaLTi3iRDAmEMy$S0#{x;tZ-Fm)|W!5hVh$gfMv zCGDm21_OcM@XxKdz))E+G~0r(HPw9hCm#i*+KYxV5Xo-=JT&nC@9;KEs4PjQDM|8x zCYa+Q{jU_eK&~DH0yw_0($UW)M(i>*3heUi{ue2Mlo#r4e$OTU*g;ZbG^zvTwzvo;$)hgD!Y&)3^1wp*Iea$Q28qMcHl$ z^7@t>cZQyv#tp%eJY-1$`%P71lo?N6cSiq}XhTI*X&DQVLy(o#y@dYS^HBZIZHI1z?s zoQ{#DDT0XRd-i;QV++J{P4i|Zx3z9Tv?EB|jvOG=T hRY{U$pOYp}at}6|j_y<-!1(|G002ovPDHLkV1hfI#jOAU diff --git a/src/components/Header/components/WalletIcon/icons/icon-metamask@2x.png b/src/components/Header/components/WalletIcon/icons/icon-metamask@2x.png deleted file mode 100644 index dec1e044d28d9f1595cfb673c190dc11c43254cd..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2156 zcmV-y2$T1TP) zT~kV(VKU#MY~znbN=Zm=WnYnHI*(d3i+^{fn2vx*9_4=|=YS-AMjnMq9)n39=z%1R zPaer}BkY4D_>Cm$f+XL4B&}c|wPq!uSs$8KAN7kQ^NJ+!h9s3#AHQlM*Lfu6ek1XS zB<_VI`i>;_j3m@=A>67|WB>pFLUdA2Qveh2z00vx1L_t(| zUaXeMZlgdDh8-ar0Wo8P;zZsiCo3Ao(nvYYY2KxGcJFI4&psv)x@j7mgTEt(PgQ?+ zRnt<_aVC1}Mwl+KySH-zpiOV$>N^(~pu@o}Ttfm<$f)ye!QJEEfzqW>kU?hO(CBw} z55HcYea%$3x)ucm-D?H4+i$N3F}U|;DwhoetcKW(_QT^7+6D-+IKiY}bxlexK(!iM z`|bDrbFdBI1?I1?D&Mh9K?yoC6=6T!zrrA3FvIsSAoEJ$6ACK)c`Nhd{`rMP4CN+t z++SS4lGD{Er0T+6{2qz~2tf{ulg|d6$~;;?0Zuj_0$~6J*kOr5%2+O}M}Z3Le~4^_ z!cZDlidBh!2-J9yDBEyZ7FSB8%f1b2NJ7!ZautdfwDxk3Xq}84-UV4u#09>v3ZthsHIx=b7v7!t3@mY}Fh@E|V@#S|p3nQ-_(ZhX z@+cYe=E~?EF`>_e7%+7W`OR&XEf7SfLUw`+F%>c{+YGJQb%YR}Lt#7@Vrf?Sg&o*U zfh917_qk#4m|(uzdxp4RU9H)baSHi(BEe?O1exB~8b>M47tVPt>@*Y?7lhiS*Q7Ji z?Ap5@7wdjgoIv`C+vEqJtI-A(KS2!Q1@|2GqOYK?-E*O3F8D?uJ-$JBR zm~PHAQt#rF`-JGQ!n`t$*|X?X7d#7VD6{Qw_5Vhnx}b_DxnNY;-M)vZ{6k{6L^a$D zN}Tva6*jxql9)Obo5BTyknipcr=!Tk2M2hV^< zV|E{bd;vUq&m5g&WC#SfG@48GwakuyV&E`*9}8U`qB7r$WiLgpz1AYw1aTg2q#Prb zoe5m|QZGp03uPXw6MHLJQ6Q6ARJJ{uX>*6RE09%~YkM^4C;tsWfh@zSWZ34aup|m* z6QwA+-qjEDJ3P6p74Z08_~itus>%wjQ;}tPDa(I6<6Zd<3C7_ns?1Q;>9=KgRpL4= zq{_3A+O7S>%Q7t*jO(aQb?R(19?v2frop@NbUafIe&*|}P#155-YVTcqw!!cxL?X$ zkKUy$UH�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 Xjjj`2N~Qfa00000NkvXXu0mjf8N*v; diff --git a/src/components/Header/components/WalletIcon/icons/icon-opera@2x.png b/src/components/Header/components/WalletIcon/icons/icon-opera@2x.png deleted file mode 100644 index 726b314de233e58244f1571efea3cf2f367ea20e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2159 zcmV-#2$1)QP)4;KDONv{VJ ztq2m{GB>sl6#q+0#1S0-OH2P6EczKM{uwOn8YsjL9L*0Jvj!CUMn#@%5F7bMMyCT3rUVWDOicC{DWL-d z%^V@r6(YzXA?rFiwG9uh3JTs3Bh?Qc>J%ot2^H`aDES#G-YqfqM@RG+DYq09>=Y>M zJUss!E&oeP{2DC&8!h-4EB_lVrw0fBOic9`D&P?#$O#3G z$RQ!I5D>c<7^wght^pRj1{t9Q1Fj4V`bI{#1{m2ZE3g6=>J%rV1qQYf68=g`-4G+f z92~?68|@V*-Y_w_1sJpu5&K9;#2+8H6&2JeD%LA3p8)}y008PYH^37jzfun{0001L zbW%=J01qK72Nf3q1PoXshZ{}!$NTX?FE=;)*7$CDL#6U;rh9L)SN`9X)A7A|omj1m-s95#>$?fgl>-yf-x%%ME z=>G2S>-ajp!H)m{1+Ym(K~#9!o!Ey{6ImR<@!ux9+1*q~fsjB*=q2qa&W6;`vYBf`egyZ%H10!Y~YzeE0YA_6-vtES^!tCl+Vfz2>+$ zvp1@>Ol##>_+_g2>@07zZ=YX!?0qxa6LPE!`~pUsV2}1o6~yoNo3qMna7ORCDiZVg2+a=melIv}u)@}T5R@DP_n0E8{`k-aJnka$Q*dxNFL@aS1uv!Cb{ zGoVN+enP>uWOQvSc|M|LJyg8B_DN>#vtE!bIDy=dC>0!u*MD9^?&L;Tu-6#&Pebx& ztl`k2RaxYMvmq>X+TX}bXs7waXmY^@2!{vH%#1v^+3@ooGuX);)(o0DQK82=NySR6$Dz4qj9P zFs)=T2dL=Ie|d=H0;s&cLAfEb4QTLU;}YsE)d5^QB8nPxaUm{Ra-~RX%v4EWj4(0$QRXY*Xf_E61oYVp( zL;LfOa?f+%HzGJ{1WMe=x#x%z2S=qZ>L7FSKh&F(f}_ar_;G@Bh!cJvC1`;T&k@0w zPPjRa&Df!90B((A!#T7Qs>q-b62>Qx;cOo0*lM34f7&4XFKn`rrJT?>i+Zz{ z3}D>CMz3=~C+XF!+^Zf2tbgF(#7!$uVY?P_u!{w*Wot!lYs*Nv$vum&kOCgqs)-d` ztl}y61O>NiZ2-J>0swP;WeRfwg`&1~ zB(nhaI8kkEYN~~Ui1?(~0l7el3ihb4PL0V;HB%gC?nD3w(*@YWR*h}Qjg2*m5eGb* ziG!uKgYCac6q_v(2kapSJUFs~bK^0xaY_^E*i{5juc_$g^y(I(SeX-Hi%al;vDGXb z5OOLXKS8dAT{Pp44Uk(LqB$i6k#LLVlZYM3ERda7%jqZgk;-X5ik3yBAJY7x56n6}U?WaIYd=1xiGz_yM`wdAp}N-oWnv--anl za<@qb1c{aPaPc1Y;A?GDPkMDyK~lQAq_lzxx`vX#n6qs!{G7y%=ktTJph0fI3?SLedl73#C?Kop$ zAp+5od}HAs()Wj{v;FIV1Ka&CKh~vrGy+5TBnO#`yX&@Z@w8svW@@%002ovPDHLkV1h9_-+urA diff --git a/src/components/Header/components/WalletIcon/icons/index.ts b/src/components/Header/components/WalletIcon/icons/index.ts index 579a9eb0..541f7cbb 100644 --- a/src/components/Header/components/WalletIcon/icons/index.ts +++ b/src/components/Header/components/WalletIcon/icons/index.ts @@ -1,11 +1,9 @@ // Icons import metamaskIcon from './icon-metamask.png' -import metamaskIcon2x from './icon-metamask@2x.png' import walletConnectIcon from './icon-wallet-connect.svg' import trezorIcon from './icon-trezor.svg' import ledgerIcon from './icon-ledger.svg' import dapperIcon from './icon-dapper.png' -import dapperIcon2x from './icon-dapper@2x.png' import fortmaticIcon from './icon-fortmatic.svg' import portisIcon from './icon-portis.svg' import authereumIcon from './icon-authereum.png' @@ -13,79 +11,67 @@ import torusIcon from './icon-torus.svg' import uniloginIcon from './icon-unilogin.svg' import coinbaseIcon from './icon-coinbase.svg' import operaIcon from './icon-opera.png' -import operaIcon2x from './icon-opera@2x.png' import { WALLET_PROVIDER } from 'src/logic/wallets/getWeb3' -interface WalletObjectsProps { - [key: string]: TValue -} +type WalletProviderNames = typeof WALLET_PROVIDER[keyof typeof WALLET_PROVIDER] interface IconValue { src: string - srcSet: string height: number } +type WalletObjectsProps = { + [key in WalletProviderNames]: Tvalue +} + const WALLET_ICONS: WalletObjectsProps = { [WALLET_PROVIDER.METAMASK]: { src: metamaskIcon, - srcSet: metamaskIcon2x, height: 25, }, [WALLET_PROVIDER.WALLETCONNECT]: { src: walletConnectIcon, - srcSet: walletConnectIcon, height: 25, }, [WALLET_PROVIDER.TREZOR]: { src: trezorIcon, - srcSet: trezorIcon, height: 25, }, [WALLET_PROVIDER.LEDGER]: { src: ledgerIcon, - srcSet: ledgerIcon, height: 25, }, [WALLET_PROVIDER.DAPPER]: { src: dapperIcon, - srcSet: dapperIcon2x, height: 25, }, [WALLET_PROVIDER.FORTMATIC]: { src: fortmaticIcon, - srcSet: fortmaticIcon, height: 25, }, [WALLET_PROVIDER.PORTIS]: { src: portisIcon, - srcSet: portisIcon, height: 25, }, [WALLET_PROVIDER.AUTHEREUM]: { src: authereumIcon, - srcSet: authereumIcon, height: 25, }, [WALLET_PROVIDER.TORUS]: { src: torusIcon, - srcSet: torusIcon, height: 30, }, [WALLET_PROVIDER.UNILOGIN]: { src: uniloginIcon, - srcSet: uniloginIcon, height: 25, }, [WALLET_PROVIDER.OPERA]: { src: operaIcon, - srcSet: operaIcon2x, height: 25, }, [WALLET_PROVIDER.WALLETLINK]: { src: coinbaseIcon, - srcSet: coinbaseIcon, height: 25, }, } diff --git a/src/components/Header/components/WalletIcon/index.tsx b/src/components/Header/components/WalletIcon/index.tsx index 0c6b6de5..01cf7267 100644 --- a/src/components/Header/components/WalletIcon/index.tsx +++ b/src/components/Header/components/WalletIcon/index.tsx @@ -20,7 +20,7 @@ interface WalletIconProps { provider: string } -const WalletIcon: React.FC = ({ provider }) => { +const WalletIcon = ({ provider }: WalletIconProps): React.ReactElement => { const classes = useStyles() return ( @@ -29,7 +29,6 @@ const WalletIcon: React.FC = ({ provider }) => { className={classes.icon} height={WALLET_ICONS[provider].height} src={WALLET_ICONS[provider].src} - srcSet={WALLET_ICONS[provider].srcSet} /> )