Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
@imhson
imhson committed Mar 22, 2024
1 parent 1f52647 commit 904c165
Show file tree
Hide file tree
Showing 5 changed files with 115 additions and 64 deletions.
8 changes: 7 additions & 1 deletion app/(private)/components/revealForgingResult.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,9 +82,15 @@ export const RevealForgingResult = ({
<div className='relative mt-8'>
<Image src={isUsedShield ? GoldRing : SilverRing} alt='' className='w-[158px] h-[168px]' />
<div className='absolute top-1/2 -translate-x-1/2 left-1/2 -translate-y-1/2'>
<Gem type={prize} className='w-20 h-20' />
<Gem type={prize.class.toLowerCase()} className='w-20 h-20' />
</div>
</div>
<Link
target='_blank'
href={`${getConfig().SEEKHYPE_V2_DRAGON_COLLECTION_ENDPOINT}/${prize.tokenId}`}
className='text-xs mt-2'>
ID: <span>{prize.tokenId}</span>
</Link>
<div onClick={onClose} className='mt-4'>
<Image src={IconClose} alt='' className='w-8 h-8 cursor-pointer' />
</div>
Expand Down
121 changes: 70 additions & 51 deletions app/(private)/jackpot/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,15 @@ import FilledButton from '@/components/button/filled'
import Gem from '@/components/gem'
import GemWithFrame from '@/components/gem/gemWithFrame'
import { Bangkok, Context } from '@/provider'
import { GET_JACKPOT, wish } from '@/services'
import { useQuery } from '@apollo/client'
import { Dropdown, DropdownItem, DropdownMenu, DropdownTrigger } from '@nextui-org/react'
import { Map } from 'immutable'
import moment from 'moment'
import Image from 'next/image'
import { useContext, useEffect, useMemo, useState } from 'react'
import Countdown from 'react-countdown'
import { toast } from 'react-toastify'
const initList = {
w1: 0,
w2: 0,
Expand Down Expand Up @@ -58,8 +61,10 @@ export default function Page() {
() => Array.from(selectedRankKey).join(', ').replaceAll('_', ' '),
[selectedRankKey]
)
const [selectedGems, setSelectedGems] = useState<(string | undefined)[]>([undefined, undefined, undefined])
const [selectedGems, setSelectedGems] = useState<(string | undefined)[]>([])
const [gems, setGems] = useState<any>(Map(initList))
const { data: jackpotData } = useQuery(GET_JACKPOT)
const [loading, setLoading] = useState(false)

useEffect(() => {
const gemList = assets.reduce(
Expand All @@ -69,16 +74,22 @@ export default function Page() {
},
{ ...initList }
)
for (let i = 0; i < 3; i++) {
for (let i = 0; i < jackpotData?.jackpots?.[0]?.slot; i++) {
if (selectedGems[i] != undefined) {
;(gemList as any)[selectedGems[i] as string]--
}
}
setGems(Map(gemList))
}, [selectedGems.filter((g) => !g).length, assets?.length])

useEffect(() => {
if (jackpotData?.jackpots?.[0]?.slot) {
setSelectedGems(new Array(jackpotData?.jackpots?.[0]?.slot).fill(undefined))
}
}, [jackpotData?.jackpots])

const addGemHandler = (type: string) => {
for (let i = 0; i < 3; i++) {
for (let i = 0; i < jackpotData?.jackpots?.[0]?.slot; i++) {
if (selectedGems[i] == undefined) {
selectedGems[i] = type
break
Expand All @@ -87,6 +98,28 @@ export default function Page() {
setSelectedGems([...selectedGems])
}

const wishHandler = async () => {
try {
setLoading(true)
const tokens = []
for (let i = 0; i < jackpotData?.jackpots?.[0]?.slot; i++) {
const asset = assets.find((asset) => asset.type == selectedGems[i])
tokens.push({
token_id: asset?.token_id as string,
contract_address: asset?.cw721_contract.smart_contract.address as string,
})
}
const res = await wish(tokens)
setLoading(false)
} catch (error: any) {
setLoading(false)
console.log(error.message)
toast(error.message || 'Failed to forge gem', {
type: 'error',
})
}
}

return (
<div className='ml-2 flex flex-wrap gap-5 justify-center'>
<div className='relative'>
Expand All @@ -100,64 +133,50 @@ export default function Page() {
<Image src={Machine} alt='' className='w-[236px] h-[252px]' />
</div>
<div className='text-xs text-[#FFFFFF] mt-8'>
The Dragon will appear and fulfill your wish at at 2 pm, 24th Mar 2024 (UTC +7)
{`The Dragon will appear and fulfill your wish at ${moment()
.add(14, 'd')
.format('h a, Do MMM YYYY')} (UTC +7)`}
</div>
<div className='mt-4 flex gap-4'>
<div className='relative'>
<Image src={GemSlot} alt='' className='w-[87px] h-[93px]' />
{selectedGems[0] && (
<div
className='absolute inset-0 grid place-items-center cursor-pointer [&>div]:hover:visible'
onClick={() => setSelectedGems([undefined, selectedGems[1], selectedGems[2]])}>
<div className='absolute inset-0 grid place-items-center invisible'>
<div className='bg-[#000]/50 h-10 w-10 rounded-full grid place-items-center'>
<Image src={IconClose} alt='' className='w-5 h-5' />
</div>
</div>
<Gem type={selectedGems[0]} className='h-10 w-10' />
</div>
)}
</div>
<div className='relative'>
<Image src={GemSlot} alt='' className='w-[87px] h-[93px]' />
{selectedGems[1] && (
<div
className='absolute inset-0 grid place-items-center cursor-pointer [&>div]:hover:visible'
onClick={() => setSelectedGems([selectedGems[0], undefined, selectedGems[2]])}>
<div className='absolute inset-0 grid place-items-center invisible'>
<div className='bg-[#000]/50 h-10 w-10 rounded-full grid place-items-center'>
<Image src={IconClose} alt='' className='w-5 h-5' />
</div>
</div>
<Gem type={selectedGems[1]} className='h-10 w-10' />
</div>
)}
</div>
<div className='relative'>
<Image src={GemSlot} alt='' className='w-[87px] h-[93px]' />
{selectedGems[2] && (
<div
className='absolute inset-0 grid place-items-center cursor-pointer [&>div]:hover:visible'
onClick={() => setSelectedGems([selectedGems[0], selectedGems[1], undefined])}>
<div className='absolute inset-0 grid place-items-center invisible'>
<div className='bg-[#000]/50 h-10 w-10 rounded-full grid place-items-center'>
<Image src={IconClose} alt='' className='w-5 h-5' />
{!!jackpotData?.jackpots?.[0] && (
<div className='mt-4 flex gap-4'>
{[...(Array(jackpotData.jackpots?.[0]?.slot).keys() as any)].map((index) => (
<div className='relative'>
<Image src={GemSlot} alt='' className='w-[87px] h-[93px]' />
{selectedGems[index] && (
<div
className='absolute inset-0 grid place-items-center cursor-pointer [&>div]:hover:visible'
onClick={() => {
const newData = [...selectedGems]
newData[index] = undefined
setSelectedGems(newData)
}}>
<div className='absolute inset-0 grid place-items-center invisible'>
<div className='bg-[#000]/50 h-10 w-10 rounded-full grid place-items-center'>
<Image src={IconClose} alt='' className='w-5 h-5' />
</div>
</div>
<Gem type={selectedGems[index] as string} className='h-10 w-10' />
</div>
</div>
<Gem type={selectedGems[2]} className='h-10 w-10' />
)}
</div>
)}
))}
</div>
</div>
<FilledButton className='mt-8'>Wish</FilledButton>
)}
<FilledButton
className='mt-8'
disabled={selectedGems.filter((g) => g).length != jackpotData.jackpots?.[0]?.slot}
onClick={wishHandler}
isLoading={loading}>
Wish
</FilledButton>
</div>
</div>
</div>
<div className='relative'>
<Image src={TopBar2} alt='' className='w-[352px] relative z-10' />
<div className='relative bg-[#E6D8B9] rounded-b-[4px] p-4 -top-2 w-[338px] mx-auto text-[#292929]'>
<div className={`text-[#6D3A0A] font-bold ${Bangkok.className} text-2xl`}>Your Gems</div>
<div className='mt-2 text-sm'>Select gems here to forge</div>
<div className='mt-2 text-sm'>Select gems here to wish</div>
<div className='my-4 flex gap-4'>
<div className='flex-1'>
<Dropdown>
Expand Down Expand Up @@ -243,7 +262,7 @@ export default function Page() {
</Dropdown>
</div>
</div>
<div className='overflow-auto h-[394px] pr-4 grid grid-cols-4 text-sm font-semibold'>
<div className='overflow-auto h-[394px] pr-4 grid grid-cols-4 text-sm font-semibold auto-rows-min gap-4'>
{['w', 'b', 'g', 'r']
.filter((c) => Array.from(selectedColorKey)[0] == 'all_colors' || Array.from(selectedColorKey)[0][0] == c)
.map((color: string) => {
Expand Down
10 changes: 5 additions & 5 deletions components/header/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,18 +46,18 @@ export function Header() {
<div>{shorten(address, 8, 8)}</div>
<CopyToClipboard text={address}>
<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'>
<g clip-path='url(#clip0_2132_5264)'>
<g clipPath='url(#clip0_2132_5264)'>
<path
d='M13.3333 6H7.33333C6.59695 6 6 6.59695 6 7.33333V13.3333C6 14.0697 6.59695 14.6667 7.33333 14.6667H13.3333C14.0697 14.6667 14.6667 14.0697 14.6667 13.3333V7.33333C14.6667 6.59695 14.0697 6 13.3333 6Z'
stroke='white'
stroke-linecap='round'
stroke-linejoin='round'
strokeLinecap='round'
strokeLinejoin='round'
/>
<path
d='M3.33337 10H2.66671C2.31309 10 1.97395 9.85956 1.7239 9.60952C1.47385 9.35947 1.33337 9.02033 1.33337 8.66671V2.66671C1.33337 2.31309 1.47385 1.97395 1.7239 1.7239C1.97395 1.47385 2.31309 1.33337 2.66671 1.33337H8.66671C9.02033 1.33337 9.35947 1.47385 9.60952 1.7239C9.85956 1.97395 10 2.31309 10 2.66671V3.33337'
stroke='white'
stroke-linecap='round'
stroke-linejoin='round'
strokeLinecap='round'
strokeLinejoin='round'
/>
</g>
<defs>
Expand Down
2 changes: 1 addition & 1 deletion public/config.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
"HOROSCOPE_CHAINKEY":"euphoria",
"COSMOSKIT_CHAINKEY": "auratestnet",
"SEEKHYPE_DRAGON_COLLECTION_ENDPOINT": "https://staging.seekhype.io/collection/cw721-long-371",
"SEEKHYPE_V2_DRAGON_COLLECTION_ENDPOINT": "https://staging.seekhype.io/collection/cw721-long-371",
"SEEKHYPE_V2_DRAGON_COLLECTION_ENDPOINT": "https://staging.seekhype.io/nft/dragon-gem-v2-438",
"DRAGON_GEM_COLLECTION_CONTRACT_ADDRESS": "aura14rrxnmkpnvcmeknjzma0myeepdxaa86wh5837959ek37dmrl2lxqfg66z0",
"V2_DRAGON_GEM_COLLECTION_CONTRACT_ADDRESS": "aura1m8thl7lrkka8993c4cxky5st3ewetuv5kkelzya7drdeqrgl5qcs2lqhgs",
"SHIELD_COLLECTION_CONTRACT_ADDRESS": "aura12urfchczsz972jvzawyf38dm87vzhsnymrf4y0shzf4dpdnq0s2sq3pakh",
Expand Down
38 changes: 32 additions & 6 deletions services/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,17 @@ export const GET_REQUEST_MANAGER = gql`
}
}
`
export const GET_JACKPOT = gql`
query GET_JACKPOT {
jackpots(limit: 1, where: { status: { _eq: "active" } }) {
id
max_star
winner_id
winning_numbers
slot
}
}
`
export const GET_USER_CODE = (id: string) => gql`
query GET_USER_CODE {
task_referrals(where: { referee_id: { _eq: ${id} } }) {
Expand Down Expand Up @@ -201,7 +212,7 @@ export const openLixi = async (id: string) => {
})
return res
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}
export const claimPrize = async (walletAddress: string) => {
Expand All @@ -211,7 +222,7 @@ export const claimPrize = async (walletAddress: string) => {
})
return res
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}
export const linkWallet = async (signedDoc: any, signature: any) => {
Expand All @@ -222,15 +233,15 @@ export const linkWallet = async (signedDoc: any, signature: any) => {
})
return res
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}
export const validateQuest = async (id: string) => {
try {
const res = await privateAxios.get(`${getConfig().REST_API_ENDPOINT}/campaigns/${id}/validate`)
return res.data
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}
export const forgeGem = async (
Expand All @@ -255,12 +266,27 @@ export const forgeGem = async (
})
return res
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}
export const wish = async (
gems: {
contract_address: string
token_id: string
}[]
) => {
try {
const res = await privateAxios.post(`${getConfig().REST_API_ENDPOINT}/jackpots/1/purchase`, {
tokens: gems
})
return res
} catch (error: any) {
return error
}
}
export const sample = async () => {
try {
} catch (error: any) {
window.alert(error?.message || 'Something went wrong')
return error
}
}

0 comments on commit 904c165

Please sign in to comment.