Skip to content

Commit ba87152

Browse files
BrettClearyBrettCleary
authored
[Quests] Update quest details UI (#922)
* support playstreak eligibility * overlay quest details fixes
1 parent 7816ca7 commit ba87152

File tree

7 files changed

+161
-14
lines changed

7 files changed

+161
-14
lines changed

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,7 @@
168168
"@fortawesome/free-solid-svg-icons": "^6.1.1",
169169
"@fortawesome/react-fontawesome": "^0.1.18",
170170
"@hyperplay/check-disk-space": "^3.5.2",
171-
"@hyperplay/ui": "^1.5.2",
171+
"@hyperplay/ui": "^1.5.9",
172172
"@hyperplay/utils": "^0.0.12",
173173
"@mantine/carousel": "^7.5.1",
174174
"@mantine/core": "^7.5.1",

‎src/backend/ipcHandlers/quests.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ ipcMain.handle('getQuests', async (e, projectId) => {
1212
})
1313

1414
ipcMain.handle('getQuest', async (e, questId) => {
15-
const questResult = await fetch(`https://api.valist.io/v1/quests/${questId}`)
15+
const questResult = await fetch(`${DEV_PORTAL_URL}api/v1/quests/${questId}`)
1616
const questResultJson = await questResult.json()
1717
return questResultJson
1818
})

‎src/common/types.ts

+6-1
Original file line numberDiff line numberDiff line change
@@ -919,7 +919,7 @@ export interface Quest {
919919
id: number
920920
project_id: string
921921
name: string
922-
type: string
922+
type: 'REPUTATIONAL-AIRDROP' | 'PLAYSTREAK'
923923
status: string
924924
description: string
925925
rewards: Reward[]
@@ -928,6 +928,11 @@ export interface Quest {
928928
eligibility: {
929929
completion_threshold: number
930930
steam_games: { id: string }[]
931+
play_streak: {
932+
required_playstreak_in_days: number
933+
current_playstreak_in_days?: number
934+
last_play_session_completed_datetime_utc?: string
935+
}
931936
}
932937
}
933938

‎src/frontend/components/UI/QuestsViewer/components/QuestDetailsWrapper/index.tsx

+34-7
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { DepositContract, Reward, RewardClaimSignature } from 'common/types'
1010
import { getAmount } from '@hyperplay/utils'
1111
import { questRewardAbi } from 'frontend/abis/RewardsAbi'
1212
import authState from 'frontend/state/authState'
13+
import { getNextMidnightTimestamp } from 'frontend/helpers/getMidnightUTC'
1314

1415
export interface QuestDetailsWrapperProps {
1516
selectedQuestId: number | null
@@ -121,8 +122,24 @@ export function QuestDetailsWrapper({
121122
}
122123
}
123124

125+
function isEligible() {
126+
if (!questMeta) {
127+
return false
128+
}
129+
const currentStreak =
130+
questMeta.eligibility?.play_streak?.current_playstreak_in_days
131+
const requiredStreak =
132+
questMeta.eligibility?.play_streak?.required_playstreak_in_days
133+
if (questMeta.type === 'PLAYSTREAK' && currentStreak && requiredStreak) {
134+
return currentStreak >= requiredStreak
135+
}
136+
137+
return false
138+
}
139+
124140
if (selectedQuestId !== null && questMeta !== undefined) {
125141
const questDetailsProps: QuestDetailsProps = {
142+
questType: questMeta.type,
126143
title: questMeta.name,
127144
description: questMeta.description,
128145
eligibility: {
@@ -131,6 +148,13 @@ export function QuestDetailsWrapper({
131148
completionPercent: questMeta.eligibility.completion_threshold,
132149
eligible: false,
133150
steamAccountLinked: true
151+
},
152+
playStreak: {
153+
resetTimeInMsSinceEpoch: getNextMidnightTimestamp(),
154+
currentStreakInDays:
155+
questMeta.eligibility?.play_streak?.current_playstreak_in_days ?? 0,
156+
requiredStreakInDays:
157+
questMeta.eligibility?.play_streak?.required_playstreak_in_days ?? 0
134158
}
135159
},
136160
rewards: questMeta.rewards.map((val) => ({
@@ -147,17 +171,15 @@ export function QuestDetailsWrapper({
147171
? t('quest.errorMessage', 'There was an error with the transaction.')
148172
: undefined,
149173
isMinting: status === 'pending',
150-
isSignedIn: !!userId
174+
isSignedIn: !!userId,
175+
ctaDisabled: !isEligible()
151176
}
152177
questDetails = (
153-
<QuestDetails
154-
{...questDetailsProps}
155-
className={styles.questDetails}
156-
ctaDisabled={false}
157-
/>
178+
<QuestDetails {...questDetailsProps} className={styles.questDetails} />
158179
)
159180
} else if (questResult?.data.isLoading || questResult?.data.isFetching) {
160181
const emptyQuestDetailsProps: QuestDetailsProps = {
182+
questType: 'PLAYSTREAK',
161183
title: '',
162184
description: '',
163185
eligibility: {
@@ -166,6 +188,11 @@ export function QuestDetailsWrapper({
166188
completionPercent: 0,
167189
eligible: false,
168190
steamAccountLinked: false
191+
},
192+
playStreak: {
193+
resetTimeInMsSinceEpoch: 0,
194+
currentStreakInDays: 0,
195+
requiredStreakInDays: 1
169196
}
170197
},
171198
i18n,
@@ -182,7 +209,7 @@ export function QuestDetailsWrapper({
182209
<QuestDetails
183210
{...emptyQuestDetailsProps}
184211
className={styles.questDetails}
185-
ctaDisabled={false}
212+
ctaDisabled={true}
186213
/>
187214
)
188215
}

‎src/frontend/helpers/getMidnightUTC.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
export function getNextMidnightTimestamp() {
2+
// Get the current date and time in UTC
3+
const now = new Date()
4+
5+
// Get the timestamp for the next 00:00:00 UTC by adding 24 hours and then flooring it to the nearest day
6+
const nextMidnight = new Date(now.getTime() + 24 * 60 * 60 * 1000)
7+
nextMidnight.setUTCHours(0, 0, 0, 0)
8+
9+
return nextMidnight.valueOf()
10+
}

‎src/frontend/screens/Quests/components/QuestDetailsViewPlay/index.tsx

+15
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import styles from './index.module.scss'
66
import { useNavigate } from 'react-router-dom'
77
import { getGameInfo } from 'frontend/helpers'
88
import useGetSteamGame from 'frontend/hooks/useGetSteamGame'
9+
import { getNextMidnightTimestamp } from 'frontend/helpers/getMidnightUTC'
910

1011
export interface QuestDetailsViewPlayWrapperProps {
1112
selectedQuestId: number | null
@@ -64,6 +65,7 @@ export function QuestDetailsViewPlayWrapper({
6465
if (!questMeta || questResult.data.isLoading || questResult.data.isFetching) {
6566
return (
6667
<QuestDetails
68+
questType="PLAYSTREAK"
6769
onSignInClick={() => console.log('sign in click')}
6870
onConnectSteamAccountClick={() => console.log('steam connect click')}
6971
isSignedIn={true}
@@ -80,6 +82,11 @@ export function QuestDetailsViewPlayWrapper({
8082
completionPercent: 0,
8183
eligible: false,
8284
steamAccountLinked: false
85+
},
86+
playStreak: {
87+
resetTimeInMsSinceEpoch: 0,
88+
currentStreakInDays: 0,
89+
requiredStreakInDays: 1
8390
}
8491
}}
8592
classNames={{ root: styles.questDetailsRoot }}
@@ -102,6 +109,7 @@ export function QuestDetailsViewPlayWrapper({
102109

103110
return (
104111
<QuestDetails
112+
questType={questMeta.type}
105113
onSignInClick={() => console.log('sign in click')}
106114
onConnectSteamAccountClick={() => console.log('steam connect click')}
107115
isSignedIn={true}
@@ -118,6 +126,13 @@ export function QuestDetailsViewPlayWrapper({
118126
completionPercent: questMeta.eligibility.completion_threshold,
119127
eligible: false,
120128
steamAccountLinked: false
129+
},
130+
playStreak: {
131+
resetTimeInMsSinceEpoch: getNextMidnightTimestamp(),
132+
currentStreakInDays:
133+
questMeta.eligibility?.play_streak?.current_playstreak_in_days ?? 0,
134+
requiredStreakInDays:
135+
questMeta.eligibility?.play_streak?.required_playstreak_in_days ?? 0
121136
}
122137
}}
123138
classNames={{ root: styles.questDetailsRoot }}

‎yarn.lock

+94-4
Original file line numberDiff line numberDiff line change
@@ -1868,13 +1868,25 @@
18681868
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.0.tgz#76467a94aa888aeb22aafa43eb6ff889df3a5a7f"
18691869
integrity sha512-rBevIsj2nclStJ7AxTdfsa3ovHb1H+qApwrxcTVo+NNdeJiB9V75hsKfrkG5AwNcRUNxrPPiScGYCNmLMoh8pg==
18701870

1871+
"@fortawesome/fontawesome-common-types@6.5.2":
1872+
version "6.5.2"
1873+
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz#eaf2f5699f73cef198454ebc0c414e3688898179"
1874+
integrity sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==
1875+
18711876
"@fortawesome/fontawesome-svg-core@^6.1.1":
18721877
version "6.2.0"
18731878
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.0.tgz#11856eaf4dd1d865c442ddea1eed8ee855186ba2"
18741879
integrity sha512-Cf2mAAeMWFMzpLC7Y9H1I4o3wEU+XovVJhTiNG8ZNgSQj53yl7OCJaS80K4YjrABWZzbAHVaoHE1dVJ27AAYXw==
18751880
dependencies:
18761881
"@fortawesome/fontawesome-common-types" "6.2.0"
18771882

1883+
"@fortawesome/fontawesome-svg-core@^6.4.0":
1884+
version "6.5.2"
1885+
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz#4b42de71e196039b0d5ccf88559b8044e3296c21"
1886+
integrity sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==
1887+
dependencies:
1888+
"@fortawesome/fontawesome-common-types" "6.5.2"
1889+
18781890
"@fortawesome/free-brands-svg-icons@^6.1.1":
18791891
version "6.2.0"
18801892
resolved "https://registry.yarnpkg.com/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.2.0.tgz#ce072179677f9b5d6767f918cfbf296f357cc1d0"
@@ -1889,20 +1901,41 @@
18891901
dependencies:
18901902
"@fortawesome/fontawesome-common-types" "6.2.0"
18911903

1904+
"@fortawesome/free-regular-svg-icons@^6.4.0":
1905+
version "6.5.2"
1906+
resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.2.tgz#e8e04b4368d49920abdf1bacc63c67c870635222"
1907+
integrity sha512-iabw/f5f8Uy2nTRtJ13XZTS1O5+t+anvlamJ3zJGLEVE2pKsAWhPv2lq01uQlfgCX7VaveT3EVs515cCN9jRbw==
1908+
dependencies:
1909+
"@fortawesome/fontawesome-common-types" "6.5.2"
1910+
18921911
"@fortawesome/free-solid-svg-icons@^6.1.1":
18931912
version "6.2.0"
18941913
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.0.tgz#8dcde48109354fd7a5ece8ea48d678bb91d4b5f0"
18951914
integrity sha512-UjCILHIQ4I8cN46EiQn0CZL/h8AwCGgR//1c4R96Q5viSRwuKVo0NdQEc4bm+69ZwC0dUvjbDqAHF1RR5FA3XA==
18961915
dependencies:
18971916
"@fortawesome/fontawesome-common-types" "6.2.0"
18981917

1918+
"@fortawesome/free-solid-svg-icons@^6.4.0":
1919+
version "6.5.2"
1920+
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz#9b40b077b27400a5e9fcbf2d15b986c7be69e9ca"
1921+
integrity sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==
1922+
dependencies:
1923+
"@fortawesome/fontawesome-common-types" "6.5.2"
1924+
18991925
"@fortawesome/react-fontawesome@^0.1.18":
19001926
version "0.1.19"
19011927
resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.19.tgz#2b36917578596f31934e71f92b7cf9c425fd06e4"
19021928
integrity sha512-Hyb+lB8T18cvLNX0S3llz7PcSOAJMLwiVKBuuzwM/nI5uoBw+gQjnf9il0fR1C3DKOI5Kc79pkJ4/xB0Uw9aFQ==
19031929
dependencies:
19041930
prop-types "^15.8.1"
19051931

1932+
"@fortawesome/react-fontawesome@^0.2.0":
1933+
version "0.2.2"
1934+
resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz#68b058f9132b46c8599875f6a636dad231af78d4"
1935+
integrity sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==
1936+
dependencies:
1937+
prop-types "^15.8.1"
1938+
19061939
"@humanwhocodes/config-array@^0.10.5":
19071940
version "0.10.7"
19081941
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.10.7.tgz#6d53769fd0c222767e6452e8ebda825c22e9f0dc"
@@ -1922,6 +1955,13 @@
19221955
resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
19231956
integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
19241957

1958+
"@hyperplay/chains@^0.2.9":
1959+
version "0.2.9"
1960+
resolved "https://registry.yarnpkg.com/@hyperplay/chains/-/chains-0.2.9.tgz#4d3f4a4a5facd4b00d8f8a0a7abb9e9f8a8ae8b0"
1961+
integrity sha512-lBGN+dnNsSD2ys2/CAjfbqOdJUUYBX6IqHqc/pwEQDE6tLE1DI58mcuFY/KLPD0y9gA9hqEkbXnRmIaC7QTlAw==
1962+
dependencies:
1963+
axios "^1.4.0"
1964+
19251965
"@hyperplay/check-disk-space@^3.5.2":
19261966
version "3.5.2"
19271967
resolved "https://registry.yarnpkg.com/@hyperplay/check-disk-space/-/check-disk-space-3.5.2.tgz#367caa30fec5494e2714891aefcb021aa1fc7e2f"
@@ -1982,10 +2022,10 @@
19822022
supertest "^6.3.3"
19832023
zod "^3.22.4"
19842024

1985-
"@hyperplay/ui@^1.5.2":
1986-
version "1.5.2"
1987-
resolved "https://registry.yarnpkg.com/@hyperplay/ui/-/ui-1.5.2.tgz#21146ba3bb49acb067e71e13a25cb9a42cf91b12"
1988-
integrity sha512-7R6zbnUpvRdg3U+aqCRG2ie5/q/oLwvpz23eP4J3VSI+tk1BibUi9MqTVSwKmz8Z0aqfsqimJr1XC+SbAWcZmA==
2025+
"@hyperplay/ui@^1.5.9":
2026+
version "1.5.9"
2027+
resolved "https://registry.yarnpkg.com/@hyperplay/ui/-/ui-1.5.9.tgz#a348e0a7754c35c49af37645eddd2d5d562f0c73"
2028+
integrity sha512-/ImVfd3Yb3jMne989EVZLXlNLEE46OPRiSlNVEICbz+3NoelIKkc8BDKP0RHjl/dIT/p59oDVinHDGN/pWSMkA==
19892029

19902030
"@hyperplay/utils@^0.0.12":
19912031
version "0.0.12"
@@ -3727,6 +3767,19 @@
37273767
dependencies:
37283768
defer-to-connect "^2.0.0"
37293769

3770+
"@tabler/icons-react@^2.46.0":
3771+
version "2.47.0"
3772+
resolved "https://registry.yarnpkg.com/@tabler/icons-react/-/icons-react-2.47.0.tgz#b704e7ae98f95be8bd6e938b4b2e84cd20b0cf31"
3773+
integrity sha512-iqly2FvCF/qUbgmvS8E40rVeYY7laltc5GUjRxQj59DuX0x/6CpKHTXt86YlI2whg4czvd/c8Ce8YR08uEku0g==
3774+
dependencies:
3775+
"@tabler/icons" "2.47.0"
3776+
prop-types "^15.7.2"
3777+
3778+
"@tabler/icons@2.47.0":
3779+
version "2.47.0"
3780+
resolved "https://registry.yarnpkg.com/@tabler/icons/-/icons-2.47.0.tgz#c41c680d1947e3ab2d60af3febc4132287c60596"
3781+
integrity sha512-4w5evLh+7FUUiA1GucvGj2ReX2TvOjEr4ejXdwL/bsjoSkof6r1gQmzqI+VHrE2CpJpB3al7bCTulOkFa/RcyA==
3782+
37303783
"@tanstack/query-core@5.40.0":
37313784
version "5.40.0"
37323785
resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.40.0.tgz#c74ae8303752ed4b5a0ab848ec71a0e6e8179f83"
@@ -4536,6 +4589,18 @@
45364589
"@typescript-eslint/types" "6.13.2"
45374590
eslint-visitor-keys "^3.4.1"
45384591

4592+
"@valist/sdk@^2.9.1":
4593+
version "2.9.7"
4594+
resolved "https://registry.yarnpkg.com/@valist/sdk/-/sdk-2.9.7.tgz#57d5c25083d4e5b10d19031a73a6de0638b3f79f"
4595+
integrity sha512-DLZ1Rb7HtfNWjtF8dlIBc9s1cGlq2/zX7Kp7ZGc/VOK4ynNIyWY8m9Cjre0TS4cLIQPUlqmJM3pIcekUKz7kYg==
4596+
dependencies:
4597+
"@capacitor-community/electron" "1.4.2"
4598+
axios "^1.4.0"
4599+
ethers "^6.11.1"
4600+
node-fetch "^2.6.1"
4601+
proxy-from-env "^1.1.0"
4602+
ua-parser-js "1.0.35"
4603+
45394604
"@valist/sdk@^2.9.5":
45404605
version "2.9.5"
45414606
resolved "https://registry.yarnpkg.com/@valist/sdk/-/sdk-2.9.5.tgz#183cade809ad15ca796f3992f5279022e376af73"
@@ -7852,6 +7917,13 @@ eth-rpc-errors@^4.0.2, eth-rpc-errors@^4.0.3:
78527917
dependencies:
78537918
fast-safe-stringify "^2.0.6"
78547919

7920+
ethereum-blockies-base64@^1.0.2:
7921+
version "1.0.2"
7922+
resolved "https://registry.yarnpkg.com/ethereum-blockies-base64/-/ethereum-blockies-base64-1.0.2.tgz#4aebca52142bf4d16a3144e6e2b59303e39ed2b3"
7923+
integrity sha512-Vg2HTm7slcWNKaRhCUl/L3b4KrB8ohQXdd5Pu3OI897EcR6tVRvUqdTwAyx+dnmoDzj8e2bwBLDQ50ByFmcz6w==
7924+
dependencies:
7925+
pnglib "0.0.1"
7926+
78557927
ethereum-cryptography@^2.0.0:
78567928
version "2.1.2"
78577929
resolved "https://registry.yarnpkg.com/ethereum-cryptography/-/ethereum-cryptography-2.1.2.tgz#18fa7108622e56481157a5cb7c01c0c6a672eb67"
@@ -7898,6 +7970,19 @@ ethers@^5.5.4:
78987970
"@ethersproject/web" "5.7.1"
78997971
"@ethersproject/wordlists" "5.7.0"
79007972

7973+
ethers@^6.11.1:
7974+
version "6.13.0"
7975+
resolved "https://registry.yarnpkg.com/ethers/-/ethers-6.13.0.tgz#f342958d0f622cf06559f59fbccdc1d30fa64f50"
7976+
integrity sha512-+yyQQQWEntY5UVbCv++guA14RRVFm1rSnO1GoLFdrK7/XRWMoktNgyG9UjwxrQqGBfGyFKknNZ81YpUS2emCgg==
7977+
dependencies:
7978+
"@adraffy/ens-normalize" "1.10.1"
7979+
"@noble/curves" "1.2.0"
7980+
"@noble/hashes" "1.3.2"
7981+
"@types/node" "18.15.13"
7982+
aes-js "4.0.0-beta.5"
7983+
tslib "2.4.0"
7984+
ws "8.5.0"
7985+
79017986
ethers@^6.12.1:
79027987
version "6.12.1"
79037988
resolved "https://registry.yarnpkg.com/ethers/-/ethers-6.12.1.tgz#517ff6d66d4fd5433e38e903051da3e57c87ff37"
@@ -11909,6 +11994,11 @@ pngjs@^5.0.0:
1190911994
resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-5.0.0.tgz#e79dd2b215767fd9c04561c01236df960bce7fbb"
1191011995
integrity sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==
1191111996

11997+
pnglib@0.0.1:
11998+
version "0.0.1"
11999+
resolved "https://registry.yarnpkg.com/pnglib/-/pnglib-0.0.1.tgz#f9ab6f9c688f4a9d579ad8be28878a716e30c096"
12000+
integrity sha512-95ChzOoYLOPIyVmL+Y6X+abKGXUJlvOVLkB1QQkyXl7Uczc6FElUy/x01NS7r2GX6GRezloO/ecCX9h4U9KadA==
12001+
1191212002
pony-cause@^2.1.10:
1191312003
version "2.1.11"
1191412004
resolved "https://registry.yarnpkg.com/pony-cause/-/pony-cause-2.1.11.tgz#d69a20aaccdb3bdb8f74dd59e5c68d8e6772e4bd"

0 commit comments

Comments
 (0)