From c32710b8a6853d782d9162b097b99f11d3daaad1 Mon Sep 17 00:00:00 2001 From: Kushdeep Singh Date: Wed, 19 Feb 2025 11:34:21 +0530 Subject: [PATCH 1/3] DMAPP-160: Add chain filters WIP --- assets/ui/base@1x.png | Bin 0 -> 522 bytes assets/ui/base@2x.png | Bin 0 -> 996 bytes assets/ui/base@3x.png | Bin 0 -> 1436 bytes assets/ui/cyber@1x.png | Bin 0 -> 1369 bytes assets/ui/cyber@2x.png | Bin 0 -> 2548 bytes assets/ui/cyber@3x.png | Bin 0 -> 3676 bytes assets/ui/ethereum.png | Bin 9844 -> 0 bytes assets/ui/ethereum@1x.png | Bin 0 -> 1183 bytes assets/ui/ethereum@2x.png | Bin 0 -> 2228 bytes assets/ui/ethereum@3x.png | Bin 0 -> 3178 bytes assets/ui/optimism.png | Bin 715 -> 0 bytes assets/ui/optimism@1x.png | Bin 0 -> 796 bytes assets/ui/optimism@2x.png | Bin 0 -> 1533 bytes assets/ui/optimism@3x.png | Bin 0 -> 2238 bytes assets/ui/polygon.png | Bin 808 -> 0 bytes assets/ui/polygon@1x.png | Bin 0 -> 1126 bytes assets/ui/polygon@2x.png | Bin 0 -> 2072 bytes assets/ui/polygon@3x.png | Bin 0 -> 3025 bytes assets/ui/polygonZkEVM.png | Bin 1051 -> 0 bytes assets/ui/polygonZkEVM@1x.png | Bin 0 -> 1182 bytes assets/ui/polygonZkEVM@2x.png | Bin 0 -> 2139 bytes assets/ui/polygonZkEVM@3x.png | Bin 0 -> 3106 bytes src/Globals.ts | 1 + src/components/dropdown/Dropdown.tsx | 148 ++++++++++++++++++++++ src/components/dropdown/Dropdown.types.ts | 11 ++ src/components/dropdown/index.ts | 2 + src/components/ui/ChannelsDisplayer.tsx | 37 +++++- src/env.config.js | 29 +++++ src/helpers/ChainHelper.ts | 51 +++++++- 29 files changed, 274 insertions(+), 5 deletions(-) create mode 100644 assets/ui/base@1x.png create mode 100644 assets/ui/base@2x.png create mode 100644 assets/ui/base@3x.png create mode 100644 assets/ui/cyber@1x.png create mode 100644 assets/ui/cyber@2x.png create mode 100644 assets/ui/cyber@3x.png delete mode 100644 assets/ui/ethereum.png create mode 100644 assets/ui/ethereum@1x.png create mode 100644 assets/ui/ethereum@2x.png create mode 100644 assets/ui/ethereum@3x.png delete mode 100644 assets/ui/optimism.png create mode 100644 assets/ui/optimism@1x.png create mode 100644 assets/ui/optimism@2x.png create mode 100644 assets/ui/optimism@3x.png delete mode 100644 assets/ui/polygon.png create mode 100644 assets/ui/polygon@1x.png create mode 100644 assets/ui/polygon@2x.png create mode 100644 assets/ui/polygon@3x.png delete mode 100644 assets/ui/polygonZkEVM.png create mode 100644 assets/ui/polygonZkEVM@1x.png create mode 100644 assets/ui/polygonZkEVM@2x.png create mode 100644 assets/ui/polygonZkEVM@3x.png create mode 100644 src/components/dropdown/Dropdown.tsx create mode 100644 src/components/dropdown/Dropdown.types.ts create mode 100644 src/components/dropdown/index.ts diff --git a/assets/ui/base@1x.png b/assets/ui/base@1x.png new file mode 100644 index 0000000000000000000000000000000000000000..4f648e0a286e7cddf26d5aa0f0210b27fef11257 GIT binary patch literal 522 zcmV+l0`>igP)$ z%-KkeRtDsY4W9Vu5$7?(lIA$cK;|rqfAEn-H{@K6o2F_|gZQ`-Kc(EQP0%lK`SQ;m z#Q!xx2jas@+@fE^#H8*eW_Q`(If6L6hBj`GRzOStg_x8W$*<4~95{*wY4@fiU#}EW z1*yO_(jbjKGq}Jl(lM0^SfqkOZQxT3e(RF3;NnC*o`!9>bJD17$fE{{8L-hG^$VbBcZefnJ`LD_bIL#_-jB-T$nV6kyc{TNyC(P=rlZU zx*f7OwfxkKw|j&mW6L{lFYOnnO-3ZR$cNWe!}2`$!+PnnC3t!M13RycFo6R@djJ3c M07*qoM6N<$f)UQ$3jhEB literal 0 HcmV?d00001 diff --git a/assets/ui/base@2x.png b/assets/ui/base@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..220883baee49faf3888611b3dbc8060f52f5c611 GIT binary patch literal 996 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 bo(}&5Jn&_1=tL{uU1g)U4LP@>(k zMKv1K>CHO}bh&VaE-zl8&q`DDS#gTy)xxqi?N*A~?G$Zj>7{|TjkF=&OZUfnC^)R6 zL&@DQ2fD*=!->W5Bjl)~e%oW-6ga(Ki~Lr)U?5`Y1po*knzbCc9e1SG>35h4j^ z^W%qg1Q;a`K<+1Q{l?h)Y5=}tZ|5-WYTxOjwYQI8NvK4D56A;=+)`6kc-EVT2>yj{`7d-mX`y_-x$p4L*x9Gk3^As9IMLOD$O4t+@_s4qZ)t=`? z^U&$`v{v+HE{}*aw;>DcBL*Pg#i`fm>e4mx3+q;q?CBy|b9#-aUsm2(c3tTuCasB) z(l4i{h1A-(ujj%9(HDt`@`}|usXuP7+qc?3Ow45tX!)EZ0YCru2^0D}p=UXEeUYrG zrSjkd0P0ZdTB-CvE0GVSKoP(C($7TG&}w-0u~d46k6Zclm{9=>L;ybo*f$m_{`(oS zbNRpo08k3SN9>br9YM;!;_vtV!>B+o1H}H*Gajp0J^QBPf4^hw zy-`%j(1cQr3Dp8o3X{YEX3@GpE7m*9l_019NsuQ2x|8ug&61^UKWcyskn5!?^ij%C zV=?P+ts1H%c&Pvki+O+=>)}HT} z&%RMHH;D)+LFzBmaPPlObg1M7SGk)If+UF<6Y$~uw)SkJC)Phnk3R4ib+&XayEd~l zLl>vc)8x&w^v?Cup3g$`D1NI$e|i0U57FZFb-&~vP*mI9Ww%j+mdG&I7QR3tz>oLG zjK94tV_tiD_pTrSz~4a5u`MU)caQ$rC`1BOCq)gIuDE)Q-&KCa9C%ZZ> z4EpVDV@3sj0rS8;hrjxq*bZS>a>7#IbrxBjcsp||)2;uoiEAu+T0Ikz9~gP~ARXI$ zqVCN5!QqY1c@iP10e!FCym0{sIidGR@!5_iWCEm!AkD&qdNyAgc!e4Th}hHnB#C_x z@{x;o_{2`d%44@}huKw_8-PT8JpAZ9_40BNTwXoMt{^Rw? z)o}ddW9&86&2P`+P?x<=pGV-`wj5pwI3i~s(8H4e=Xm_%Ur>khW% z8Q?^ly-%sX;@zegWw}No30i`VFauD-MZt#s;>N-?dgbzqB=tj5!a#x_gEogO-fbLB znNqnrfIUe>I2#fq;ou(+=ot(jEkMA&3u)1`q&~o>NhZCRs*qqFq|`XqP&)a=3`lB# zS^OxwL$qfO=Wb4zdl7Be?}r-K@uq+STLD=_27E9iST+iu>SJqii%|pzr#~g;4Z!g$ z$LRa#zG-aR3kZYzE(~iG?e}!9rOj)^>pR+c5*$+1Q|fB(&n}GJ;%bp_pdszo*`F3D z_L0A;6y*Pp=#AI@&VlM$0E&U*JNN0kzN3oMm!Ohh3Q)nJwNDFAP#fG+>Z+DYmO5@z z{S&BNYj&D_d~P*nBjLt|Yf{TSES!hhL;~C*4i?({hf;Ts>8lxIAy1>yLuFRI zXC^9u@X}Y3VjK7|G3_rcA8VC_^xE{aaui$5fhghOXv##OgYl-+jhCO_FIS~t@S+M( zC|*`BC$MlK2NfU9DNG{zmMN|KJZPn@*YXLRB z@P$L70xA%TIz^pL+!=!!2BkJ20LheCzt99=iTuJB4|zIjja)vVHoGZuJ%}XWu(qwu zdS5!Qb>Y@CHCq*!edGZiVbDcR8^U(4-$8iSHv1^-bO8cT+=&A3D2uyYn7U>?cptM5 z?DQ_*y^EY*0s!Bs9ZVyUFu!;iqyRt^0U@Y;#Ah#s zRDbxLYJwn!^hRBep&m%D2;4GX{Pyno0tPidq2oJ%|4^>wgX4h5rCiDNy3swxI0*0000< KMNUMnLSTZjeb@W| literal 0 HcmV?d00001 diff --git a/assets/ui/cyber@3x.png b/assets/ui/cyber@3x.png new file mode 100644 index 0000000000000000000000000000000000000000..417e0e48f8356225f1d2e9d1f53546a8aa79daef GIT binary patch literal 3676 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 literal 0 HcmV?d00001 diff --git a/assets/ui/ethereum@2x.png b/assets/ui/ethereum@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..76ad9214bda0fe5498f4b9b2be70877e1daf2eb3 GIT binary patch literal 2228 zcmV;l2ut^gP)DJc{Qkf5oAfD`2eoFJ9BaH`v+NQgtz6B12Q_rkU0 zMsMUo3qq<92n0mLNTGmAio-_>B&kCc$BFHIkD2GL<8QCM^Fn`8>crmKJM(7#Gw;I! z3=?_hYS;<|2Q3i&N{O%l2rB_ypj5czLLm}D!LkBKDCK-Fgor!YY&`nbt^^oFfB_;W z7X|~Cbx?tLvBJ=15s<)tV~&)Q(PKR^V1~^Bk8P=EsxnmKxMDFRK>R0JFyPo5G=HvJ)+i4xZ6 z#Blcsuh)ByfZ_4v8E)hEJ=6w0-8OK7_c%H{zI4Xx^`0CsGPX1WN)7=d?QH^{eX;`{ zLnj0S%p`GhQxj=l~jd?9K*&nWrCZhaH_3Z0QiN`>p_Rqd*OKiG;ci7#U9< z=N@^Yd%FeCKG9M5d(XWg*xKH-9yf*}VSMRSy-R9-DyhA~d;$X;dSP3|bNe0+feDm? zNWJP%)d5uJb%SF7629KsDus{4u&gVj=@~Y=H~5u#p0TzziAR zjPTXM)MN?s;2=F%xUv~Ee`2`Ve#`#Vkihq!Os(Wy7i>K>yj)L`!YIq%` zfQiYHlGy{6Qi|09Bzh0uSN~?o=){#A#DB`d%ugAZ`#smt5hRAaxACTeu&jZA5OzPs z0|$+2{`HiEKmK;$`id-hej(}TA2PD1+k(zps)zey4~5{PYYt>{Jok%JB>KONBIVA4{%igcd|pdypU|o@N($A z$Ptz$U?)15oI#GDDEMre!2y&4zyM8l0vN3qFJ~Kuc`Hb%Ds+M-OPA(z;1?DL&`4dJ z%fe>hIzlithb#{GW_BI^Ms?1w?iyLrDv)zXR2@(KgBJq&00M&!%wt`rADYHe>lzI5 zIznP*t)wNaq!dWSRJYJ}i;ks$Pl_9#iDOu9=x~ur=S7wDg^Z_i$g+Zrwp$8B z0(|o4KRGz^>h{9aHfyMlEWJgeoo+x<}k zL?mu#4F^JsctB?Cm>uM)-Jg7!*2Z^t=9j?lxihGro7N+yv_8yV&BB8yl;N@*rf|Q8 zk>nILPb8)!s;;0?hsf0i6OOdw`kiqX^;fQruorvyqo@bPkYQ)ft-#zL8zbkY#mtYH zin2y|-hY3a4*O!xeUWAgeL6@1iHYHzck55UaGL@qt}Hk(bs<&q98Hkkc)3$+1kD); z3S-iTzZN&9!lV%-aQpXlR2WZ<7MJk^R=*fM>QAwi`Vbf)Jt!V+7fOq_U+=0|Epqex zna4Y-E`ly#lSS#niKFBsJr-nncx)*NjQawl1C$E2mc%J7NFS)o={eo@;e>T0w zI{I$-)9)Mm0!p3+MyNENJ-<@(bxI3L30n27Wjyi2T!z(njiU;Os0t3q1p-lg@ZA*_ zGy6*x(_sx-<DV#%kAefDN4l4}qky0=r)X%Fe92n}e$-_2t?q>TSBcb` zh=TOGg7?l|*N@FWdCv{yzLT}1#m|*EfT92!Fwch!y^_>|x9a(NYIfN3p1|BM9(|%> z1#{xqPV|t70W(w@XMbs2%Ba=7^c(-;idOzAhpMZtKRa1*2$)lWID0--R}U!ff4pp9 zWl5m$Wvm0$UaIN<3KJ8lKsxZj`BcrveY=$473BP}u-xrY@}F+Wtm;r_kqab@QmniDNyZ^{!~R<%&)i z!XSzRGiRn&bV|@Rmx+>x#Pj!FA5VME<0Cuvaz}z&8skPvo|+sV*}2!tl})XMjhtK< zRl+iImWU5^I-k1UXzJ7fipeNeha+I1MEZulNv7nHW{l7Ow-$)JlMGuSc|jODRM|W# zhAr-)TBWWYzLtaaxnf%!|KA)zqb}>0xyEnd6N&~q=tOX{?zK(*;-r+PbE!ZyI@;|k z9r?aGOKD*{gGM8Q(eRD8GyomE#2u$0Wr_X1ok4q-j+zoeeK>YAe|fqVH&SGP4r2)+ z`tc*fkUy0YhSEEsOppJQ8vV7hVM(#wfGN#+~egW(9a3r literal 0 HcmV?d00001 diff --git a/assets/ui/ethereum@3x.png b/assets/ui/ethereum@3x.png new file mode 100644 index 0000000000000000000000000000000000000000..95fcc8328396da1757465b4d2fe73559f26d379d GIT binary patch literal 3178 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 diff --git a/assets/ui/optimism@1x.png b/assets/ui/optimism@1x.png new file mode 100644 index 0000000000000000000000000000000000000000..1a6be497cc906acc0f447734be29b592b711d858 GIT binary patch literal 796 zcmV+%1LOROP)F=J=cFbb#j6n8r-Ie{!-gPk?3HaQ=uLx4-^#!SC_YA*86`Hk2byFhTCga)Gh&M z=YZWkps@}7YYo~e=KybZ$owwQ+)lCORW0cmOUU-8Yf8$0?%$bgR}M9Lz(*1mZ>S*} zq;Zn)S-hzuC(bWu+1OH#*#BymkpiCrl25oR#t27m=iEE3WphhQOGH7d%VKtJ@a^l5 zBF#ux)HR?5U_4yEr|qNDaTrJn z=g0}jRO?-8XY1-w_ww89jBZYo*85}ukL*^=gD88xmlrxXQ!?lB28xCxt>iu#$FWI~ z>L?C%o0j!cGIR0xTSQ9cbc1^VqNy|gGl&~}v5lX%^dN(+E z7ZX(#*m=q$FzY4_58}B}V7&24dOko_=xupJmfHG}FQ+j=Jd;0OmA@*n*KwDE~kJ0000a literal 0 HcmV?d00001 diff --git a/assets/ui/optimism@2x.png b/assets/ui/optimism@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..e6e84cb5ab478edc4c69e572734f9759e9108442 GIT binary patch literal 1533 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 M07*qoM6N<$g3)3>m;e9( literal 0 HcmV?d00001 diff --git a/assets/ui/polygon.png b/assets/ui/polygon.png deleted file mode 100644 index 8f955aa7a8396a2b1e7f17346cd1a6a735c2b667..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 808 zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM3?#3wJbQ|PfiX3}C&U%Vt+ah!W&5DP`cbvh z;|7N()pk$IZJt#)Jg>5UTm$6VKdrHQTI2An#vaP9c6eH2|F{|`YX>BsR)N%jq^cc& zTnHOZJ_VYFDu}5Dq!?&XjpLJA$0v2pPwQNs*1JA!aC_R|{6^(CKx4c{1{%&o@yA8eXH}<~Y zIrHPLSs!=L`M77^$Nh^w9bNtT_}b6M*L^v)>C5RYU(W6LdVc5E^Si!Y0HWPrFYWtw z<-oTq2fy7t`{UmEANMc(xPS5IgG)ajU;Fvw`p>5~e?7bP>*f95uOIz>^Z57s7k@s! z{`2YepD*wKe*N(G+sD5@zW)39?cdMu|9<`W_xtC+zkmP#1EPQbfk4cC&jDaS>y!lf z1v7|BN=eJe$|-pI`1%E8W@YE(=H*YEF?05ud5czU-L`$l^&2;DfBf|M%kMvb<-bqg z3)IJ$UpZZBOZap0l2rLoAyu8x)`kLuz#YGz%{>D{s= zOuG7dPR0K^&#ImN6>^1Bua>(#`sk4!yHeznsr3$@>YWv)``9KFN62~z2zR)?J<+tz3RhE{pr7&ZH`Z3SnzxAfdfY+ z=S6Wc?()3$E+@%ytC>q!z%ItSD(TN$*=`R@aw#W!N$Ku|8omIy45poyK!J! zoIc-LyFGto*xiCN6|`bgbYfmEmh+#yd8tE$Qws0;<H2wg_PIR{lRJJSRUDgCUOm}iON5b@%ss=ArScN<#OfG=(Z)h%$J(`njxgN@xNA DH~+am diff --git a/assets/ui/polygon@1x.png b/assets/ui/polygon@1x.png new file mode 100644 index 0000000000000000000000000000000000000000..2491efd00ef2bc994c1806e0c9a28a2c2cf2b26c GIT binary patch literal 1126 zcmV-s1eyDZP)Ujz%*^wi7iXBJGt)F}4@`!<_h!y{=ic}38;zR8V6K=- z#F9Ck^gc&Yk4BW{=G5QrvLrHvMsICfKA&|eW5Z*;nxvH&MM0V?MDy5d@q`$bf0Grew3cp*>; z7eT&ze7P9Ek#o8llCWRwFScn?M1OcZg zLrVEh)3lzbhaZhhG3kt|2O!6;*p?J@ig!aLXbAzK;3J%n!WnO7EJz=Xd{cJ-S&w|c z9aj(_G76HH!KaJVyXBnJX_ z3Ji?dq8G_RD`uBB5c42%pox!DxMAmcyFNzEqs+v2En6QBBW_xNi$Pu`2|hn+4((+z sJE-CFoG(+u=Q-KWXL)z^Ct4K#0Lud2nXPlK1poj507*qoM6N<$g2Lbj1poj5 literal 0 HcmV?d00001 diff --git a/assets/ui/polygon@2x.png b/assets/ui/polygon@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..5abd0029ee72d16de7e218835762d7ea74f9deb2 GIT binary patch literal 2072 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 literal 0 HcmV?d00001 diff --git a/assets/ui/polygonZkEVM@2x.png b/assets/ui/polygonZkEVM@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..f23c89c78affd2a2c8b2bc42c36964b1d3ce69e5 GIT binary patch literal 2139 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 = ({style, data}) => { + const [isVisible, setIsVisible] = useState(false); + const [selectedOption, setSelectedOption] = useState(data[0]); + const [dropdownTop, setDropdownTop] = useState(0); + const buttonRef = useRef(null); + + const openDropdown = () => { + if (buttonRef.current) { + buttonRef.current?.measure( + ( + _fx: number, + _fy: number, + _width: number, + height: number, + _px: number, + py: number, + ) => { + setDropdownTop(py + height - 10); + }, + ); + } + setTimeout(() => setIsVisible(true), 100); + }; + + const handleSelect = (option: any) => { + setSelectedOption(option); + setTimeout(() => setIsVisible(false), 100); + }; + return ( + <> + {/* Dropdown Field */} + + {selectedOption?.icon && ( + + )} + + + + {/* Dropdown Options */} + + setTimeout(() => setIsVisible(false), 100)}> + + item.value} + renderItem={({item}) => ( + handleSelect(item)}> + {item.icon && ( + + )} + {item.label} + + )} + ItemSeparatorComponent={() => } + /> + + + + + ); +}; + +export {Dropdown}; + +const styles = StyleSheet.create({ + mainView: { + backgroundColor: Globals.COLORS.WHITE, + borderWidth: 1.5, + borderColor: Globals.COLORS.BORDER_DROPDOWN, + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', + padding: 12, + borderRadius: 12, + }, + caretIcon: { + height: 24, + width: 24, + resizeMode: 'contain', + }, + overlay: { + flex: 1, + }, + dropdownContainer: { + backgroundColor: Globals.COLORS.WHITE, + borderWidth: 1, + borderColor: Globals.COLORS.BORDER_DROPDOWN, + padding: 8, + borderRadius: 12, + maxHeight: 350, + }, + option: { + flexDirection: 'row', + alignItems: 'center', + padding: 4, + borderRadius: 8, + }, + activeOption: { + backgroundColor: Globals.COLORS.PILL_BG_DEFAULT, + }, + optionGap: { + height: 12, + }, + optionIcon: { + height: 24, + width: 24, + resizeMode: 'contain', + }, + optionText: { + marginLeft: 4, + }, +}); diff --git a/src/components/dropdown/Dropdown.types.ts b/src/components/dropdown/Dropdown.types.ts new file mode 100644 index 000000000..57d20ca8b --- /dev/null +++ b/src/components/dropdown/Dropdown.types.ts @@ -0,0 +1,11 @@ +import {ImageSourcePropType, ViewStyle} from 'react-native'; +import {chainNameType} from 'src/helpers/ChainHelper'; + +export type DropdownProps = { + style?: ViewStyle; + data: { + value: string; + label: string; + icon: ImageSourcePropType | null; + }[]; +}; diff --git a/src/components/dropdown/index.ts b/src/components/dropdown/index.ts new file mode 100644 index 000000000..7b97b2e60 --- /dev/null +++ b/src/components/dropdown/index.ts @@ -0,0 +1,2 @@ +export * from './Dropdown'; +export * from './Dropdown.types'; diff --git a/src/components/ui/ChannelsDisplayer.tsx b/src/components/ui/ChannelsDisplayer.tsx index 3847a4e4e..e79b096a3 100644 --- a/src/components/ui/ChannelsDisplayer.tsx +++ b/src/components/ui/ChannelsDisplayer.tsx @@ -14,6 +14,8 @@ import EPNSActivity from 'src/components/loaders/EPNSActivity'; import ChannelItem from 'src/components/ui/ChannelItem'; import {usePushApi} from 'src/contexts/PushApiContext'; import {useSheets} from 'src/contexts/SheetContext'; +import ENV_CONFIG from 'src/env.config'; +import {ChainHelper} from 'src/helpers/ChainHelper'; import useChannels from 'src/hooks/channel/useChannels'; import useSubscriptions from 'src/hooks/channel/useSubscriptions'; import { @@ -24,6 +26,7 @@ import { import GLOBALS from '../../Globals'; import Globals from '../../Globals'; +import {Dropdown} from '../dropdown'; import {ChannelCategories} from './ChannelCategories'; const ChannelsDisplayer = () => { @@ -67,10 +70,24 @@ const ChannelsDisplayer = () => { setSelectedCategory(category as string); }; + const getSelectChains = (chainIdList: Array) => { + return chainIdList?.map((key: number) => { + return { + value: key.toString(), + label: + ChainHelper.networkName?.[ + key as keyof typeof ChainHelper.networkName + ] ?? '', + icon: ChainHelper.chainIdToLogo(key), + }; + }); + }; + return ( {/* Render Search Bar */} + {/* Render Search Bar */} { handleChannelSearch(e); }} value={search} - placeholder={'Search for channel name or address'} + placeholder={'Search for channel name...'} placeholderTextColor="#7D7F89" /> + + {/* Render Dropdown Field */} + {/* Render Channel Categories(tags) */} @@ -189,14 +212,18 @@ const styles = StyleSheet.create({ searchBarWrapper: { paddingHorizontal: 16, marginBottom: 24, + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', }, searchView: { flexDirection: 'row', alignItems: 'center', borderRadius: 16, backgroundColor: GLOBALS.COLORS.BG_SEARCH_BAR, - height: 42, - paddingHorizontal: 8, + height: 48, + paddingHorizontal: 12, + width: '70%', }, searchBar: { fontSize: 14, @@ -216,6 +243,10 @@ const styles = StyleSheet.create({ marginVertical: 24, }, footerLoadingView: {paddingVertical: 10}, + dropdownField: { + width: '25%', + height: 48, + }, }); export default ChannelsDisplayer; diff --git a/src/env.config.js b/src/env.config.js index e8dbb34f9..d26e11a93 100644 --- a/src/env.config.js +++ b/src/env.config.js @@ -91,4 +91,33 @@ export default { // Contract Addresses CONTRACTS: IS_PROD_ENV ? {...PROD_CONTRACTS} : {...STAGING_CONTRACTS}, + + // Allowed networks + ALLOWED_NETWORKS: IS_PROD_ENV + ? [ + 1, //for ethereum mainnet + 137, //for polygon mainnet + 56, // for bnb mainnet + // 10, // for optimism mainnet + 42161, // arbitrum mainnet + 1101, // polygon zkevm mainnet + 122, // fuse mainnet + 7560, // Cyber mainnet + 8453, //base mainnet + 59144, // Linea mainnet + ] + : [ + // 42, //for kovan + // 5, // for goerli + 11155111, // for eth sepolia + 80002, //for amoy polygon + 97, // bnb testnet + 11155420, // optimism sepolia testnet + 2442, // polygon zkevm cardona testnet + 421614, // arbitrum testnet + 123, // fuse testnet + 111557560, // Cyber testnet + 84532, //base sepolia + 59141, // Linea testnet + ], }; diff --git a/src/helpers/ChainHelper.ts b/src/helpers/ChainHelper.ts index 55a84f61d..771dbc5d1 100644 --- a/src/helpers/ChainHelper.ts +++ b/src/helpers/ChainHelper.ts @@ -1,20 +1,25 @@ import {ImageSourcePropType} from 'react-native'; -type chainNameType = +export type chainNameType = | 'ETH_TEST_SEPOLIA' | 'POLYGON_TEST_MUMBAI' + | 'POLYGON_AMOY' | 'ETH_MAINNET' | 'POLYGON_MAINNET' | 'BSC_MAINNET' | 'BSC_TESTNET' | 'OPTIMISM_MAINNET' | 'OPTIMISM_TESTNET' + | 'OPTIMISM_SEPOLIA' | 'POLYGON_ZK_EVM_TESTNET' | 'POLYGON_ZK_EVM_MAINNET' | 'ARBITRUMONE_MAINNET' | 'ARBITRUM_TESTNET' | 'FUSE_MAINNET' | 'FUSE_TESTNET' + | 'CYBER_TESTNET' + | 'CYBER_MAINNET' + | 'FUSE_TESTNET' | undefined; export const ChainHelper = { @@ -28,7 +33,9 @@ export const ChainHelper = { return 'POLYGON_MAINNET'; case 80001: return 'POLYGON_TEST_MUMBAI'; - case 1442: + case 80002: + return 'POLYGON_AMOY'; + case 2442: return 'POLYGON_ZK_EVM_TESTNET'; case 1101: return 'POLYGON_ZK_EVM_MAINNET'; @@ -40,6 +47,8 @@ export const ChainHelper = { return 'OPTIMISM_MAINNET'; case 69: return 'OPTIMISM_TESTNET'; + case 11155420: + return 'OPTIMISM_SEPOLIA'; case 42161: return 'ARBITRUMONE_MAINNET'; case 421614: @@ -48,6 +57,10 @@ export const ChainHelper = { return 'FUSE_MAINNET'; case 123: return 'FUSE_TESTNET'; + case 7560: + return 'CYBER_MAINNET'; + case 111557560: + return 'CYBER_TESTNET'; default: return undefined; } @@ -60,6 +73,7 @@ export const ChainHelper = { return require('assets/ui/ethereum.png'); case 'POLYGON_MAINNET': case 'POLYGON_TEST_MUMBAI': + case 'POLYGON_AMOY': return require('assets/ui/polygon.png'); case 'POLYGON_ZK_EVM_TESTNET': case 'POLYGON_ZK_EVM_MAINNET': @@ -69,6 +83,7 @@ export const ChainHelper = { return require('assets/ui/bnb.png'); case 'OPTIMISM_MAINNET': case 'OPTIMISM_TESTNET': + case 'OPTIMISM_SEPOLIA': return require('assets/ui/optimism.png'); case 'ARBITRUMONE_MAINNET': case 'ARBITRUM_TESTNET': @@ -76,6 +91,13 @@ export const ChainHelper = { case 'FUSE_MAINNET': case 'FUSE_TESTNET': return require('assets/ui/fuse.png'); + case 'CYBER_MAINNET': + case 'CYBER_TESTNET': + return require('assets/ui/cyber.png'); + case 'CYBER_MAINNET': + case 'CYBER_TESTNET': + return require('assets/ui/base.png'); + default: return null; } @@ -88,4 +110,29 @@ export const ChainHelper = { } return null; }, + + networkName: { + 42: 'Ethereum Kovan', + 5: 'Ethereum Goerli', + 11155111: 'Ethereum Sepolia', + 1: 'Ethereum Mainnet', + 137: 'Polygon Mainnet', + 80002: 'Polygon Amoy', + 97: 'BNB Testnet', + 56: 'BNB Mainnet', + 11155420: 'Optimism Sepolia', + 10: 'Optimism Mainnet', + 2442: 'Polygon zkEVM Testnet', + 1101: 'Polygon zkEVM Mainnet', + 42161: 'ArbitrumOne Mainnet', + 421614: 'Arbitrum Testnet', + 122: 'Fuse Mainnet', + 123: 'Fuse Testnet', + 111557560: 'Cyber Testnet', + 7560: 'Cyber Mainnet', + 8453: 'Base Mainnet', + 84532: 'Base Sepolia', + 59141: 'Linea Sepolia', + 59144: 'Linea Mainnet', + }, }; From 4116b1079548c823a6eab12d1c567e1afe1f9cee Mon Sep 17 00:00:00 2001 From: Kushdeep Singh Date: Fri, 21 Feb 2025 13:51:21 +0530 Subject: [PATCH 2/3] DMAPP- Chain filter integration - Integrated dropdown UI for chain filter in the channel screen - Updated channel list API hook to handle chain filter - Fixed interaction issue in dropdown option list - Added scroll-to-start behavior in channel category component when selecting another filter, resetting the category to default --- assets/ui/linea@1x.png | Bin 0 -> 479 bytes assets/ui/linea@2x.png | Bin 0 -> 893 bytes assets/ui/linea@3x.png | Bin 0 -> 1344 bytes src/components/dropdown/Dropdown.tsx | 42 +++++++++++++++------ src/components/dropdown/Dropdown.types.ts | 14 ++++--- src/components/ui/ChannelCategories.tsx | 21 ++++++++++- src/components/ui/ChannelsDisplayer.tsx | 43 ++++++++++++---------- src/helpers/ChainHelper.ts | 33 ++++++++++++++++- src/hooks/channel/useChannels.tsx | 18 +++++++-- 9 files changed, 126 insertions(+), 45 deletions(-) create mode 100644 assets/ui/linea@1x.png create mode 100644 assets/ui/linea@2x.png create mode 100644 assets/ui/linea@3x.png diff --git a/assets/ui/linea@1x.png b/assets/ui/linea@1x.png new file mode 100644 index 0000000000000000000000000000000000000000..9834996a33c373933c63c44df634bca7bf7abd36 GIT binary patch literal 479 zcmV<50U-W~P)?D=2tKF* zhit^2gX<>Zso=O#@L8D<8wb}-7|+D&1D9o)?7B`eRaHquv>nU`aBc83P31FnUEB7c zZs274Qj#Qp5<*xFlw~PRL{T)hrx=2Zv4`rg37dhUD2xUy#<{VHJ^Z%U)ldeEYkfc3 zk%!i9PCqzi0947i?oHFkJkKY~reed@mw^SkatRQ^fo#C}qVUN55C(+}cpDrR(6fOS z!qKvUZwSYY4SYd3E^NT-0O`ni_`nx~wGp|%HzQ0pp?eqHYX)A;r*5Dn9pQBx!SMD4 zAITVmfJ5m((6M~0Ow9V_&v2cLucxC5Sb5_jsdNn5slYh(@Ey!&nBfxA8+iJA{sS}1 VZ?QVub&dc4002ovPDHLkV1n^N#|r=e literal 0 HcmV?d00001 diff --git a/assets/ui/linea@2x.png b/assets/ui/linea@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..b53e4ef0fc0bb5f357d53400c24865c4ce91d4e9 GIT binary patch literal 893 zcmV-@1A_dCP)-Aa@Zuwpa;ZoiLS2FPxkd3C(sXE7OHghTWVpR|b;OdXZV|5KllGv8b zsxUZbKoBFnqA0F1fZuZ{e|{=>fdCpl)_WWHeamBf%7QNy0}@{q($0|T^pmV7w;OCA5BBR0tFI)=nX}~2D zmdoX>!5clY7Z@TynA%TIPtc7V^neEs4-eRGw|IYlzp0lwU=*wY1_n%dV#r4D8Sx@$ zfIz%F(g3@mSHBpk@MdGL=Fv*h!;r%Hi(x^>>2Pu13nNhD;nT5qtFv}2IPpB zm1zSc;zOeB1;{VNN6tUS0B=9I1Li0H7z1*|H6D;CGvKbWa}J9ejP%sp(fyp&rRs)L zWTVjtHStX=JKV{6fvcCsn#OS*@YJG+FhN&;4Dqu4K>uOgm*&mkufaF;yDgB|$M}~+ z0~q{w^cTh^t2>U(2hgD${X^nN!*>dS$ZwJ&F96y;@w()E6ZIPa)p5;nBN+hIQDvx! zsBe}wWB^o0l))2o04i{O8tC|dEo!un%oqd$xu3Yy0xhj^PSCCqjb8Or2<+=!(+^J0 z5!lkcfd7mLGVo(0*mp&Bn87mM;OXJ%JNQRne{QYs)^0XY~W z3Bes^2HoE|pDke>7~hZitC`^f?h<606uQc!3I!Ea*%nGFzkg<07uv!>F5nIn(D#}C z&lDmLHYcSKKQgV58+7(i(5IP}nbLtp*VN!Q+6zM13Hm-QkmtTpQ{L?{+zEVLls1hK za+hfXcLP6KBSN@+$B)(sg}hw#CD6w-hewrl1iy-#(c}iIWWT_#pmxz0yzK;9N5Sv1 zzDsUUa0D7E7-Nys#)Jth6Tz>bnNS2v+`-?Vachc!k>Fc2Ap($!8Wq7X69B2`po~?_ z3g^|-?5Yh6G*PMJ5d%m?trVkWXYDVv<8!8W5ZXe)|0mOTFreYr-RF`b^h9A~MUU1x zT`U%99LH(N%gakTpU+dJ6!-Od*9UXv1X)uUhOdIY4>BSM0?unM&=Jj;2&;;sC_M!- zia9rg=s?Vv0Bf2|CTSOz%Oz(zVw{L(ytq}hDR%ZTolZH^a?(&mY$6y#iz?hcY&ILt z^iYNTrf+bGw`h!HveM1X4f>E(#>gsfFhRlB^@B|Ye8fn|%765Q;~W+4>IeR=y{Fk> z3O&i1az{V2-EMJze-D#nEgAHMaseX>d5dVZ?*lATN!mb_BgeH4iOTT4JUl#br)yaa z_+`zVQO%D`k_3HOuh(EEM5Qvmto>nBJU>69F9r-Cbkjk~8Z6n&l_H3Gvwfgp2}5aH z)`PD&FW`y+q}gnicE!NpTve}Xcg=ZnmkgkRH5%fx51EK1AM)6=eVI57Y2(gS99UCjXwDx`jZ^$DhD%!CY35Nx5yfGY^L*css5YL7GG zN{S%61d;>nA_iC{xP)L8F~BlnfMv)4CwG!M6SiW2UBm#(BxFDW!4|*BfS(X-AvwS@ zI|GbNd=Xl)76a_EE?YqfgrV8(=3DlJe?SQfEB)?K+I4JKv)Qqf78ff3od_%y{ZFzsLAJReokCHM-4knQV_%lNWi z4ImXYN@F0V08-H_4gMS%F~MT+OEmlp7^gHWLzPYpzkd>7zDWs5ZE*KQA1H8R+w-qJG7ogMcbs;Aw7yJfHTpjkPObu@U0000 = ({style, data}) => { +const Dropdown: FC = ({style, data, onChange, value}) => { + // State const [isVisible, setIsVisible] = useState(false); const [selectedOption, setSelectedOption] = useState(data[0]); const [dropdownTop, setDropdownTop] = useState(0); const buttonRef = useRef(null); + // Set default value + useEffect(() => { + if (value.length == 0) { + setSelectedOption(data[0]); + } + }, [value]); + + // Open dropdown const openDropdown = () => { if (buttonRef.current) { buttonRef.current?.measure( @@ -36,14 +46,17 @@ const Dropdown: FC = ({style, data}) => { setTimeout(() => setIsVisible(true), 100); }; + // Handle option select const handleSelect = (option: any) => { setSelectedOption(option); setTimeout(() => setIsVisible(false), 100); + onChange(option); }; return ( <> {/* Dropdown Field */} @@ -62,15 +75,14 @@ const Dropdown: FC = ({style, data}) => { {/* Dropdown Options */} - + setTimeout(() => setIsVisible(false), 100)}> - + item.value} @@ -89,8 +101,8 @@ const Dropdown: FC = ({style, data}) => { )} ItemSeparatorComponent={() => } /> - - + + ); @@ -108,6 +120,7 @@ const styles = StyleSheet.create({ justifyContent: 'space-between', padding: 12, borderRadius: 12, + height: 48, }, caretIcon: { height: 24, @@ -116,6 +129,9 @@ const styles = StyleSheet.create({ }, overlay: { flex: 1, + position: 'relative', + zIndex: 1, + paddingHorizontal: 16, }, dropdownContainer: { backgroundColor: Globals.COLORS.WHITE, @@ -123,7 +139,8 @@ const styles = StyleSheet.create({ borderColor: Globals.COLORS.BORDER_DROPDOWN, padding: 8, borderRadius: 12, - maxHeight: 350, + maxHeight: 380, + zIndex: 2, }, option: { flexDirection: 'row', @@ -135,7 +152,7 @@ const styles = StyleSheet.create({ backgroundColor: Globals.COLORS.PILL_BG_DEFAULT, }, optionGap: { - height: 12, + marginTop: 12, }, optionIcon: { height: 24, @@ -145,4 +162,5 @@ const styles = StyleSheet.create({ optionText: { marginLeft: 4, }, + modalStyles: {margin: 0}, }); diff --git a/src/components/dropdown/Dropdown.types.ts b/src/components/dropdown/Dropdown.types.ts index 57d20ca8b..7a9394cbe 100644 --- a/src/components/dropdown/Dropdown.types.ts +++ b/src/components/dropdown/Dropdown.types.ts @@ -3,9 +3,13 @@ import {chainNameType} from 'src/helpers/ChainHelper'; export type DropdownProps = { style?: ViewStyle; - data: { - value: string; - label: string; - icon: ImageSourcePropType | null; - }[]; + data: DropdownOption[]; + onChange: (data: DropdownOption) => void; + value: string; +}; + +export type DropdownOption = { + value: string; + label: string; + icon: ImageSourcePropType | null; }; diff --git a/src/components/ui/ChannelCategories.tsx b/src/components/ui/ChannelCategories.tsx index e9ee865ee..65b6beaae 100644 --- a/src/components/ui/ChannelCategories.tsx +++ b/src/components/ui/ChannelCategories.tsx @@ -1,6 +1,5 @@ -import React, {FC, useState} from 'react'; +import React, {FC, useEffect, useRef} from 'react'; import {ScrollView, StyleSheet, View} from 'react-native'; -import Globals from 'src/Globals'; import {useChannelCategories} from 'src/hooks/channel/useChannelCategories'; import {Pill} from '../pill'; @@ -16,12 +15,30 @@ const ChannelCategories: FC = ({ value, disabled, }) => { + // Ref + const scrollViewRef = useRef(null); + + // Hooks const {isLoading, channelCategories} = useChannelCategories(); + // Scroll to start + useEffect(() => { + if (!isLoading && channelCategories?.length > 0) { + const shouldScrollToStart = channelCategories[0].value === value; + if (shouldScrollToStart && scrollViewRef.current) { + scrollViewRef.current.scrollTo({ + x: 0, + animated: true, + }); + } + } + }, [value]); + if (!isLoading && channelCategories?.length > 0) { return ( diff --git a/src/components/ui/ChannelsDisplayer.tsx b/src/components/ui/ChannelsDisplayer.tsx index e79b096a3..b92459d18 100644 --- a/src/components/ui/ChannelsDisplayer.tsx +++ b/src/components/ui/ChannelsDisplayer.tsx @@ -26,22 +26,30 @@ import { import GLOBALS from '../../Globals'; import Globals from '../../Globals'; -import {Dropdown} from '../dropdown'; +import {Dropdown, DropdownOption} from '../dropdown'; import {ChannelCategories} from './ChannelCategories'; const ChannelsDisplayer = () => { + // Get allowed chains + const chainList = ChainHelper.getSelectChains(ENV_CONFIG.ALLOWED_NETWORKS); + + // State const [search, setSearch] = React.useState(''); const [selectedCategory, setSelectedCategory] = useState( Globals.CONSTANTS.ALL_CATEGORIES, ); + const [selectedChain, setSelectedChain] = useState(''); + // Redux const channelResults = useSelector(selectChannels); + const isLoadingSubscriptions = useSelector(selectIsLoadingSubscriptions); + + // Hooks const {isLoading, isLoadingMore, resetChannelData, loadMore} = useChannels({ tag: selectedCategory, searchQuery: search, + filter: selectedChain, }); - - const isLoadingSubscriptions = useSelector(selectIsLoadingSubscriptions); const {refreshSubscriptions} = useSubscriptions(); const {userPushSDKInstance} = usePushApi(); const {openSheet} = useSheets(); @@ -68,19 +76,13 @@ const ChannelsDisplayer = () => { } resetChannelData(); setSelectedCategory(category as string); + setSelectedChain(''); }; - const getSelectChains = (chainIdList: Array) => { - return chainIdList?.map((key: number) => { - return { - value: key.toString(), - label: - ChainHelper.networkName?.[ - key as keyof typeof ChainHelper.networkName - ] ?? '', - icon: ChainHelper.chainIdToLogo(key), - }; - }); + const handleChainChange = (option: DropdownOption) => { + resetChannelData(); + setSelectedCategory(Globals.CONSTANTS.ALL_CATEGORIES); + setSelectedChain(chainList[0].value !== option.value ? option.value : ''); }; return ( @@ -106,8 +108,10 @@ const ChannelsDisplayer = () => { {/* Render Dropdown Field */} @@ -119,7 +123,7 @@ const ChannelsDisplayer = () => { /> {/* Render No Data View */} - {channelResults.length === 0 && ( + {channelResults?.length === 0 && ( {!isLoading && !isLoadingSubscriptions ? ( // Show channel not found label @@ -147,7 +151,7 @@ const ChannelsDisplayer = () => { )} {/* Render Channel List */} - {channelResults.length !== 0 && !isLoadingSubscriptions && ( + {channelResults?.length !== 0 && !isLoadingSubscriptions && ( ): DropdownOption[] => { + return chainIdList?.map((key: number) => { + return { + value: key.toString(), + label: + ChainHelper.networkName?.[ + key as keyof typeof ChainHelper.networkName + ] ?? '', + icon: ChainHelper.chainIdToLogo(key), + }; + }); + }, }; diff --git a/src/hooks/channel/useChannels.tsx b/src/hooks/channel/useChannels.tsx index 3de16ebd2..ecf775d84 100644 --- a/src/hooks/channel/useChannels.tsx +++ b/src/hooks/channel/useChannels.tsx @@ -9,11 +9,12 @@ import {addChannels, resetChannels, setChannels} from 'src/redux/channelSlice'; export type UseChannelsProps = { tag: string; searchQuery: string; + filter: string; }; const DEBOUNCE_TIMEOUT = 500; //time in millisecond which we want to wait for then to finish typing -const useChannels = ({tag, searchQuery}: UseChannelsProps) => { +const useChannels = ({tag, searchQuery, filter}: UseChannelsProps) => { const [searchTimer, setSearchTimer] = useState(); const [page, setPage] = useState(1); const [isLoading, setIsLoading] = useState(true); @@ -25,9 +26,9 @@ const useChannels = ({tag, searchQuery}: UseChannelsProps) => { const dispatch = useDispatch(); useEffect(() => { - console.log('first', {page, tag, searchQuery}); + console.log('run side effect', {page, tag, searchQuery, filter}); handleChannelInterval(); - }, [page, tag, searchQuery]); + }, [page, tag, searchQuery, filter]); const handleChannelInterval = () => { if (searchTimer) { @@ -41,15 +42,18 @@ const useChannels = ({tag, searchQuery}: UseChannelsProps) => { }; const getChannelsData = () => { - console.log('second', {page, tag, searchQuery}); + console.log('first run'); if (searchQuery.trim().length) { + console.log('search'); handleSearchAPI(); } else { + console.log('normal'); handleChannelAPI(); } }; const loadMore = () => { + console.log('load more'); if (!isEndReached && !isLoading && !isLoadingMore) { setIsLoadingMore(true); setPage(page + 1); @@ -66,7 +70,12 @@ const useChannels = ({tag, searchQuery}: UseChannelsProps) => { if (tag.length > 0 && tag !== Globals.CONSTANTS.ALL_CATEGORIES) { requestURL = `${requestURL}&tag=${tag}`; } + if (filter.length > 0) { + requestURL = `${requestURL}&filter=${filter}`; + } + console.log({requestURL}); const resJson = await fetch(requestURL).then(response => response.json()); + console.log({resJson}); if (page > 1) { dispatch(addChannels(resJson.channels)); } else { @@ -93,6 +102,7 @@ const useChannels = ({tag, searchQuery}: UseChannelsProps) => { const results = await userPushSDKInstance?.channel.search(query, { page: page, limit: GLOBALS.CONSTANTS.FEED_ITEMS_TO_PULL, + filter: filter.length > 0 ? Number(filter) : undefined, }); if (page > 1) { dispatch(addChannels(results)); From 99b68d7c6a703b7f7bb7744d97de44e8d3ff246c Mon Sep 17 00:00:00 2001 From: Kushdeep Singh Date: Mon, 24 Feb 2025 11:55:18 +0530 Subject: [PATCH 3/3] DMAPP-160: Fix platform-specific UI issue in dropdown options view --- src/components/dropdown/Dropdown.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/dropdown/Dropdown.tsx b/src/components/dropdown/Dropdown.tsx index 198417891..8fa413a44 100644 --- a/src/components/dropdown/Dropdown.tsx +++ b/src/components/dropdown/Dropdown.tsx @@ -2,6 +2,7 @@ import React, {FC, useEffect, useRef, useState} from 'react'; import { FlatList, Image, + Platform, Pressable, StyleSheet, Text, @@ -39,7 +40,9 @@ const Dropdown: FC = ({style, data, onChange, value}) => { _px: number, py: number, ) => { - setDropdownTop(py + height - 10); + const topOffset = + Platform.OS === 'ios' ? py + height + 15 : py + height - 10; + setDropdownTop(topOffset); }, ); }