From 9f7cea04c7e26f2dc86c55a184153715de302343 Mon Sep 17 00:00:00 2001 From: dappsar Date: Thu, 16 Nov 2023 17:14:34 -0300 Subject: [PATCH 1/3] new texts to statistics --- public/locales/br/common.json | 6 ++++-- public/locales/en/common.json | 6 ++++-- public/locales/es/common.json | 4 +++- 3 files changed, 11 insertions(+), 5 deletions(-) diff --git a/public/locales/br/common.json b/public/locales/br/common.json index f62d10ea..a59d2c10 100644 --- a/public/locales/br/common.json +++ b/public/locales/br/common.json @@ -59,8 +59,10 @@ "usuario_no_en_temporada": "Este usuário não está jogando nesta temporada.", "no_paquetes_para_abrir": "Você não tem pacotes para abrir!", - "album": "Álbum", - "completar": "Completar", + "album": "Álbum", + "completo": "Completo", + "incompleto": "Incompleto", + "reclamar_premio": "Reivindicar prêmio", "carta_minteada": "Carta Minted! Você pode vê-la", "aqui": "aqui", diff --git a/public/locales/en/common.json b/public/locales/en/common.json index 9330d5bf..66b11ff6 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -59,8 +59,10 @@ "usuario_no_en_temporada": "This user is not playing this season.", "no_paquetes_para_abrir": "You have no packs to open!", - "album": "Album", - "completar": "Complete", + "album": "Album", + "completo": "Complete", + "incompleto": "Incomplete", + "reclamar_premio": "Claim Prize", "carta_minteada": "Minted Card! You can view it", "aqui": "here", diff --git a/public/locales/es/common.json b/public/locales/es/common.json index a57e201a..98f6a273 100644 --- a/public/locales/es/common.json +++ b/public/locales/es/common.json @@ -60,7 +60,9 @@ "no_paquetes_para_abrir": "No tienes paquetes para abrir!", "album": "Album", - "completar": "Completar", + "completo": "Compleo", + "incompleto": "Incompleto", + "reclamar_premio": "Reclamar Premio", "carta_minteada": "Carta Minteada! Puedes verla", "aqui": "aquí", From 2b757591aeb6327306323354d01c8e23a8f4ce31 Mon Sep 17 00:00:00 2001 From: dappsar Date: Thu, 16 Nov 2023 17:15:18 -0300 Subject: [PATCH 2/3] renamed gammaAlumbEmpty to gammaAlbumStatistics --- src/sections/Gamma/GammaAlbumInventory.jsx | 5 +- src/sections/Gamma/GammaAlbumStatistics.jsx | 64 +++++++++++++++++++++ 2 files changed, 67 insertions(+), 2 deletions(-) create mode 100644 src/sections/Gamma/GammaAlbumStatistics.jsx diff --git a/src/sections/Gamma/GammaAlbumInventory.jsx b/src/sections/Gamma/GammaAlbumInventory.jsx index f787b458..30342491 100644 --- a/src/sections/Gamma/GammaAlbumInventory.jsx +++ b/src/sections/Gamma/GammaAlbumInventory.jsx @@ -5,6 +5,7 @@ import { FcCheckmark } from 'react-icons/fc' import gammaCardsPages from './gammaCardsPages' import { storageUrlGamma } from '../../config' import { useLayoutContext } from '../../hooks' +import CustomImage from '../../components/customImage' const GammaAlbumInventory = React.forwardRef((props, book) => { const { paginationObj, setImageNumber, setCardInfo } = props @@ -36,7 +37,7 @@ const GammaAlbumInventory = React.forwardRef((props, book) => { key={index} className='grid-item' > - img + {paginationObj.user[item]?.stamped && }
{paginationObj.user[item]?.name}
{ @@ -49,7 +50,7 @@ const GammaAlbumInventory = React.forwardRef((props, book) => { ) } - return paginationObj && paginationObj.page1 + return paginationObj ? ( { + const { size } = useLayoutContext() + + const PageContext = (index, item, ) => ( +
+ {gammaCardsPages.user[item]?.stamped + ? + : } + {!gammaCardsPages.user[item]?.stamped &&
{gammaCardsPages.user[item]?.name}
} +
+ ) + + return ( + +
+
+
+ {gammaCardsPages.page1.map((item, index) => ( + + ))} +
+
+
+
+
+ {gammaCardsPages.page2.map((item, index) => ( + + ))} +
+
+ + ) +}) + +export default GammaAlbumStatistics From 5ee70ac9bdcefd3266ded5ceb2030f513da30135 Mon Sep 17 00:00:00 2001 From: dappsar Date: Thu, 16 Nov 2023 17:16:04 -0300 Subject: [PATCH 3/3] #120: complete gamma cards statistics logic --- src/sections/Gamma/GammaAlbumEmpty.jsx | 63 -------------------------- src/sections/Gamma/GammaPack.jsx | 3 +- src/sections/Gamma/index.jsx | 58 ++++++++++++++++++++---- src/styles/gamma.scss | 50 ++++++++++++++------ 4 files changed, 86 insertions(+), 88 deletions(-) delete mode 100644 src/sections/Gamma/GammaAlbumEmpty.jsx diff --git a/src/sections/Gamma/GammaAlbumEmpty.jsx b/src/sections/Gamma/GammaAlbumEmpty.jsx deleted file mode 100644 index de5e05db..00000000 --- a/src/sections/Gamma/GammaAlbumEmpty.jsx +++ /dev/null @@ -1,63 +0,0 @@ -import React from 'react' -import HTMLFlipBook from 'react-pageflip' -import gammaCardsPages from './gammaCardsPages' -import { storageUrlGamma } from '../../config' -import { useLayoutContext } from '../../hooks' - -const GammaAlbumEmpty = React.forwardRef((_, book) => { - const { size } = useLayoutContext() - - const PageContext = (index, item, ) => ( -
- {gammaCardsPages.user[item]?.stamped - ? img - : img} - {!gammaCardsPages.user[item]?.stamped &&
{gammaCardsPages.user[item]?.name}
} -
- ) - - return ( - -
-
-
- {gammaCardsPages.page1.map((item, index) => ( - - ))} -
-
-
-
-
- {gammaCardsPages.page2.map((item, index) => ( - - ))} -
-
- - ) -}) - -export default GammaAlbumEmpty diff --git a/src/sections/Gamma/GammaPack.jsx b/src/sections/Gamma/GammaPack.jsx index 541be97d..2bf00d3e 100644 --- a/src/sections/Gamma/GammaPack.jsx +++ b/src/sections/Gamma/GammaPack.jsx @@ -61,11 +61,12 @@ const GammaPack = ({ setPackIsOpen, openPackage, setOpenPackage, cardsNumbers, l animate={openPackage ? { opacity: 0, zIndex: 111111 } : ''} transition={{ duration: 1, delay: 3 }} id='bottom' src='/images/gamma/SobreBottom.png' alt='' /> + {cardsNumbers && + />} {!loaderPack && { const { mobile, startLoading, stopLoading } = useLayoutContext() const [paginationObj, setPaginationObj] = useState({}) const [paginationObjKey, setPaginationObjKey] = useState(0); + const [ cardsQtty, setCardsQtty ] = useState(0) + + const getCardsQtyy = (paginationObj) => { + let total = 0 + + if(!paginationObj) return + for (let key in paginationObj.user) { + console.log(key) + if (paginationObj.user[key].quantity > 0) { + total += 1; + } + } + + return total; + } const checkNumberOfPacks = async () => { try { @@ -70,12 +83,16 @@ const index = React.forwardRef(() => { console.error(error) } } + + useEffect(() => { + if (!paginationObj) return + setCardsQtty(getCardsQtyy(paginationObj)) + }, [paginationObj]) useEffect(() => { console.log('gamma acc', walletAddress, wallets) }, [walletAddress, wallets]) - useEffect(() => { fetchInventory() }, [walletAddress, gammaCardsContract, gammaCardsPages]) @@ -94,6 +111,10 @@ const index = React.forwardRef(() => { }) } + const handleCompleteAlbum = async () => { + console.log('handleCompleteAlbum') + } + const handleTransferPack = async () => { try { const result = await Swal.fire({ @@ -179,6 +200,7 @@ const index = React.forwardRef(() => { setLoaderPack(false) await checkNumberOfPacks() await fetchInventory() + setCardsQtty(getCardsQtyy(paginationObj)) return openedPack } } @@ -345,6 +367,12 @@ const index = React.forwardRef(() => { : { backgroundImage: 'url(\'/images/gamma/GammaFondo.png\')' }} className='hero__top__album' > + {!inventory && + + } {gammaCardsContract && inventory && !cardInfo && { setImageNumber={setImageNumber} setCardInfo={setCardInfo}/> } - {!inventory && } {gammaCardsContract && inventory && cardInfo && { } - {!mobile && !inventory && + {!mobile && !inventory && cardsQtty >= 0 &&
-

{t('album')}

-

24/120

-

{t('completar')}

+
+

+ {cardsQtty === 120 + ? `${t('album')} ${t('completo')}` + : `${t('album')} ${t('incompleto')}` + } +

+
+
+

{`${cardsQtty}/120`}

+
+ {cardsQtty===120 &&
{ handleCompleteAlbum() }} + className={cardsQtty===120 ? 'completeAlbum' : 'completeAlbum_disabled'}> +

{t('reclamar_premio')}

+
}
} } diff --git a/src/styles/gamma.scss b/src/styles/gamma.scss index ee791193..9eef46c0 100644 --- a/src/styles/gamma.scss +++ b/src/styles/gamma.scss @@ -142,36 +142,56 @@ cursor: not-allowed; } } + .gammaComplete { position: absolute; bottom: 39%; right: 7%; width: 18%; height: 40%; - background-size: 100% 100%; - background-repeat: no-repeat; display: flex; justify-content: center; flex-direction: column; align-items: center; - h2 { - font-size: 0.8rem; + .title_complete { + color: green; + font-size: 1rem; + margin: 0; } - h3 { - padding: 10px; - transition: all 0.2s ease-in; - background: #006885; - color: #000; - border: 0px; - position: relative; - box-shadow: - inset -4px 4px 1px 1px grey, - inset -4px -4px 1px 1px lightgray, - inset 4px 0px 1px 1px lightgray; + .title_incomplete { + @extend .title_complete; + color: grey; + } + .qtty_complete { + color: green; + font-size: 1rem; + margin: 0; + } + .qtty_incomplete { + @extend .title_complete; + color: grey; + } + .button_complete_common { + position: absolute; + display: flex; + justify-content: center; + align-items: center; + margin: 0; + bottom: 10%; + } + .completeAlbum { + @extend .button_complete_common; + color: black; + transition: all 0.1s ease; + cursor: pointer; &:hover { transform: scale(1.1); } } + .completeAlbum_disabled { + @extend .button_complete_common; + color: #8f8f8f; + } } .gammaAlbumsCommon {