From ec731916d9dcb14331ccc0a34428380df065ff95 Mon Sep 17 00:00:00 2001 From: rasguy92 Date: Mon, 4 Dec 2023 12:15:37 +0700 Subject: [PATCH] feat: add modal warning, cleanup apis --- src/assets/icons/HamburgerIcon.tsx | 14 ++- src/common/Button/types.ts | 5 +- src/common/ButtonForJoinableGame/index.tsx | 4 +- src/common/ButtonForWaitingGame/index.tsx | 4 +- src/common/ClaimBar/index.tsx | 14 ++- src/common/FloatingOrbs/index.tsx | 65 +++++++++----- src/common/FloatingOrbs/types.ts | 16 ++-- src/common/Section/types.tsx | 13 +++ src/common/modals/GlobalModal.tsx | 4 + src/common/modals/WebAppInBetaModal.tsx | 33 +++++++ src/common/modals/images/warning-triangle.png | Bin 0 -> 1259 bytes .../CreateGameCard/CreateCoinFlipGameCard.tsx | 2 +- .../CreateGameCard/CreateDiceGameCard.tsx | 2 +- src/components/GameCard/index.tsx | 6 +- .../JoinGameCard/JoinCoinFlipGameCard.tsx | 2 +- .../JoinGameCard/JoinDiceGamecard.tsx | 2 +- .../PlayPageGameCardsSection/index.tsx | 36 ++++++++ src/components/PlayPageHeroMobile/index.tsx | 10 +++ src/components/WegaGames/index.tsx | 53 ++++++----- src/containers/App/index.tsx | 8 +- src/containers/ErrorPage/images/404.svg | 10 +++ src/containers/ErrorPage/images/404.tsx | 61 +++++++++++++ src/containers/ErrorPage/index.tsx | 31 +++++++ src/containers/FooterMobile/index.tsx | 64 ++++++++++++++ src/containers/Layout/index.tsx | 33 +++---- src/containers/NavigationMobile/index.tsx | 82 ++++++++++++++++++ src/containers/PlayPage/index.tsx | 42 +++------ .../images/HeroIllustration.tsx | 44 ++++++++++ .../PlayPageMobile/images/internet-icon.png | Bin 0 -> 820 bytes .../images/mobile-hero-illustration.png | Bin 0 -> 10632 bytes src/containers/PlayPageMobile/index.tsx | 79 +++++++++++++++++ src/containers/Router/index.tsx | 75 +++++++++------- src/containers/WalletProvider/index.tsx | 7 +- src/hooks/index.ts | 5 +- src/hooks/useFirebaseData.ts | 3 +- src/hooks/useHamburgerTween.ts | 32 +++++++ src/hooks/useMediaQuery.ts | 8 ++ src/hooks/useWarnAppInBeta.ts | 25 ++++++ src/main.tsx | 2 + src/models/constants.ts | 5 ++ tailwind.config.cjs | 6 +- 41 files changed, 736 insertions(+), 171 deletions(-) create mode 100644 src/common/modals/WebAppInBetaModal.tsx create mode 100644 src/common/modals/images/warning-triangle.png create mode 100644 src/components/PlayPageGameCardsSection/index.tsx create mode 100644 src/components/PlayPageHeroMobile/index.tsx create mode 100644 src/containers/ErrorPage/images/404.svg create mode 100644 src/containers/ErrorPage/images/404.tsx create mode 100644 src/containers/ErrorPage/index.tsx create mode 100644 src/containers/FooterMobile/index.tsx create mode 100644 src/containers/NavigationMobile/index.tsx create mode 100644 src/containers/PlayPageMobile/images/HeroIllustration.tsx create mode 100644 src/containers/PlayPageMobile/images/internet-icon.png create mode 100644 src/containers/PlayPageMobile/images/mobile-hero-illustration.png create mode 100644 src/containers/PlayPageMobile/index.tsx create mode 100644 src/hooks/useHamburgerTween.ts create mode 100644 src/hooks/useMediaQuery.ts create mode 100644 src/hooks/useWarnAppInBeta.ts diff --git a/src/assets/icons/HamburgerIcon.tsx b/src/assets/icons/HamburgerIcon.tsx index 8352d73..883b64f 100644 --- a/src/assets/icons/HamburgerIcon.tsx +++ b/src/assets/icons/HamburgerIcon.tsx @@ -1,14 +1,13 @@ -import { SVGProps } from "react" +import { SVGProps, forwardRef } from "react" -const HamburgerIcon = (props: SVGProps) => ( +const HamburgerIcon = forwardRef((props: SVGProps, ref: any) => ( ) => ( }} d="M 1.5,0.5 A 1.5,1.5 0 0 0 0,2 1.5,1.5 0 0 0 1.5,3.5 h 19 A 1.5,1.5 0 0 0 22,2 1.5,1.5 0 0 0 20.5,0.5 Z m 12,8 A 1.5,1.5 0 0 0 12,10 a 1.5,1.5 0 0 0 1.5,1.5 h 7 A 1.5,1.5 0 0 0 22,10 1.5,1.5 0 0 0 20.5,8.5 Z m -12,8 A 1.5,1.5 0 0 0 0,18 1.5,1.5 0 0 0 1.5,19.5 h 19 A 1.5,1.5 0 0 0 22,18 1.5,1.5 0 0 0 20.5,16.5 Z" /> - ) => ( strokeLinecap: "round", }} d="m 2.0859375,0.48632812 a 1.5,1.5 0 0 0 -1.0605469,0.43945313 1.5,1.5 0 0 0 0,2.12109375 l 8.8789063,8.878906 -8.8789063,8.878907 a 1.5,1.5 0 0 0 0,2.121093 1.5,1.5 0 0 0 2.1210938,0 l 8.8789066,-8.878906 8.878906,8.878906 a 1.5,1.5 0 0 0 2.121094,0 1.5,1.5 0 0 0 0,-2.121093 l -8.878907,-8.878907 6.029297,-6.0292966 2.84961,-2.8496094 a 1.5,1.5 0 0 0 0,-2.12109375 1.5,1.5 0 0 0 -1.060547,-0.43945313 1.5,1.5 0 0 0 -1.060547,0.43945313 L 18.054688,3.7753906 12.025391,9.8046875 3.1464844,0.92578125 A 1.5,1.5 0 0 0 2.0859375,0.48632812 Z" - /> + /> */} -) - +)) export default HamburgerIcon; diff --git a/src/common/Button/types.ts b/src/common/Button/types.ts index 5f1316d..25aadad 100644 --- a/src/common/Button/types.ts +++ b/src/common/Button/types.ts @@ -23,11 +23,12 @@ interface ButtonProps { export const PrimaryButton = styled(BaseButton)( ({disabled}) => !disabled ? [ - tw`dark:text-pretu dark:bg-gradient-to-r from-oranjo-blanc to-oranjo hover:outline hover:outline-blanc`, + tw`dark:text-pretu dark:bg-gradient-to-r from-oranjo-blanc to-oranjo`, ` box-shadow: 0px 1px 5px 0px #090300; &:hover { - outline-width: 1.5px; + outline: 1.5px solid #FDFDFD; + --webkit-outline: 1.5px solid #FDFDFD; } ` ] : [ diff --git a/src/common/ButtonForJoinableGame/index.tsx b/src/common/ButtonForJoinableGame/index.tsx index 5a0aef0..0eab3e6 100644 --- a/src/common/ButtonForJoinableGame/index.tsx +++ b/src/common/ButtonForJoinableGame/index.tsx @@ -24,12 +24,12 @@ export const ButtonForJoinableGame = ({ gameType, gameId, gameUuid }: ButtonForJ > Join - : !isGamePlayable ? + : !isGamePlayable ? - : + : : isGamePlayable ? ( - + + + + + By proceeding you are aware of the risks of using Wega platform. + + + ) +} +export default WebAppInBetaModal \ No newline at end of file diff --git a/src/common/modals/images/warning-triangle.png b/src/common/modals/images/warning-triangle.png new file mode 100644 index 0000000000000000000000000000000000000000..a744f7d6d3ee20be0f3532c8b6d4c3df07c7e9b4 GIT binary patch literal 1259 zcmV;X18!8#{c_5_%JTf2dHPY^f(P>@vq#W_Ke6X2X6Oly9p$sAbY>NO- zA%VBQ9>*i_46g*w2T?mr#A~|j*++ZE&)KMxXdB9tE>xxucF zrRpVuVFFr21mIpr5foaEW5U{ZR>Vv20Ot|B+K&2k+u39hN2|y2Bm3Cy2`B=TAnirR z%IYD4LW^E<3tL4aiO`m{|8^S>Z4O=J>7GB0z+v~6C_453mD6)-7LL-V~8%+hL5y4M8>qfp=Yzq?+ z;z(mZSb+oE7|w7^+X!x901Z%^AV-8I)6d%TZ9zoSD}=S8QLb&HHbK)C#`&g$WO-~G zQWL30wo!{9M~^7=vo=Ssj<6JA?OA-l=fvs#B@XHePA!6g9G}vsAc_AU979U|o+LQ6 zqF9+A+X5d_XFVh=$MG9*i~`%(fQqOQ!E(0X0v6lYuPQi|2%5IQlJ2u$l-h>+16H<; z(gagm*v;DGGQ_Rj&s>6Rga3wZ8wH7i4W$WM%Mc!;m%(Nm;YxYiC`HhXEnw}kAln9L zf`k3Cwo!^89feNRwwd{tL4xp#-Y#&m+zzXMKUdx;6~(#d!CVn(d|LQenP3K1!Ma6W zvq(je+?uzN#JtIv)oEY#%Q8q0);yogDq^ydhj;y8cP`PE474H=OZKA3G3uN)3JF?m zq2=Ee=Ao)>6cV)Bf~N;0RWO-@mZ!396qYxv1h4;%9{4ydxGD#xa~aKgaHGgJtOR9f zoEC1-T6(X7D@v5P@leg)1mPEb<71%KUG6>p)LIIcDZw;L8D(uwfo!sS-*CP2 z`=*wZP`OdfxLWF9Qn*7h%wE&^IbsKLl*#7=;Jk@jvTG7zio;fO`u;B@p?6s(Zslo>P}tVu_y^-vGC- VR7g3=!{q<~002ovPDHLkV1l?OJ6Zq$ literal 0 HcmV?d00001 diff --git a/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx b/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx index 995edbb..51847da 100644 --- a/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx +++ b/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx @@ -155,7 +155,7 @@ export const CreateCoinFlipGameCard = ({ allowanceQuery.refetch(); if(createGameStatus === 'fulfilled' && createGameResponse) { - navigateToGameUi(`/${gameType.toLowerCase()}/play/${createGameResponse.uuid}`, 1500, { replace: true, + navigateToGameUi(`/play/${gameType.toLowerCase()}/${createGameResponse.uuid}`, 1500, { replace: true, state: { gameId: createGameResponse.id, gameUuid: createGameResponse.uuid } }); } } diff --git a/src/components/CreateGameCard/CreateDiceGameCard.tsx b/src/components/CreateGameCard/CreateDiceGameCard.tsx index e223496..83ccff0 100644 --- a/src/components/CreateGameCard/CreateDiceGameCard.tsx +++ b/src/components/CreateGameCard/CreateDiceGameCard.tsx @@ -159,7 +159,7 @@ export const CreateDiceGameCard = ({ if(playerAddress && tokenAddress){ allowanceQuery.refetch(); if(createGameStatus === 'fulfilled' && createGameResponse) { - navigateToGameUi(`/${gameType.toLowerCase()}/play/${createGameResponse.uuid}`, 1500, { replace: true, + navigateToGameUi(`/play/${gameType.toLowerCase()}/${createGameResponse.uuid}`, 1500, { replace: true, state: { gameId: createGameResponse.id, gameUuid: createGameResponse.uuid } }); } diff --git a/src/components/GameCard/index.tsx b/src/components/GameCard/index.tsx index ebc4a93..e0b3995 100644 --- a/src/components/GameCard/index.tsx +++ b/src/components/GameCard/index.tsx @@ -74,7 +74,7 @@ export const DiceGameCard = () => { Roll the dice, the player with the highest number wins. { -