diff --git a/src/Navigator.tsx b/src/Navigator.tsx index 86695529..601c1715 100644 --- a/src/Navigator.tsx +++ b/src/Navigator.tsx @@ -34,15 +34,15 @@ export const Navigator = () => { const [loading, setIsLoading] = useState(false) const [user, setUser] = useState(null) - const getUser = async () => { - const user = await handleFetchUser(address!) + const getUser = async (addressArg: `0x${string}`) => { + const user = await handleFetchUser(addressArg) setUser(user) } useEffect(() => { if (isConnected && address) { setIsLoading(true) - void getUser() + void getUser(address) .catch(e => { console.error(e) }) diff --git a/src/api/concero/quest/questType.ts b/src/api/concero/quest/questType.ts index e6bd8de2..da12ce75 100644 --- a/src/api/concero/quest/questType.ts +++ b/src/api/concero/quest/questType.ts @@ -76,9 +76,11 @@ export interface IQuest { endDate: number steps: IQuestStep[] rewards: { - points: number - multiplier: number - role?: boolean + points: number // Mandatory field, for automatic reward after completing the quest + pointsToShow?: string + multiplier: number // Temporary field, adds a multiplier to the user for a limited time + isCustomReward?: boolean + role: '${boolean}' } type: QuestType category: QuestCategory diff --git a/src/assets/icons/CersIcon.tsx b/src/assets/icons/CersIcon.tsx new file mode 100644 index 00000000..774a9d0d --- /dev/null +++ b/src/assets/icons/CersIcon.tsx @@ -0,0 +1,60 @@ +export const CersIcon = () => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + +) diff --git a/src/components/rewards/Quests/QuestCard/QuestCard.module.pcss b/src/components/rewards/Quests/QuestCard/QuestCard.module.pcss index b4bce96c..6558d1c4 100644 --- a/src/components/rewards/Quests/QuestCard/QuestCard.module.pcss +++ b/src/components/rewards/Quests/QuestCard/QuestCard.module.pcss @@ -65,6 +65,15 @@ .points { color: var(--color-primary-700); + font-size: 24px; +} +.rewards { + display: flex; + flex-direction: row; + gap: 8px; + align-items: center; + font-weight: 500; + line-height: 28px; } @media (max-width: 580px) { diff --git a/src/components/rewards/Quests/QuestCard/QuestCard.tsx b/src/components/rewards/Quests/QuestCard/QuestCard.tsx index 638f668d..bb434a7e 100644 --- a/src/components/rewards/Quests/QuestCard/QuestCard.tsx +++ b/src/components/rewards/Quests/QuestCard/QuestCard.tsx @@ -9,7 +9,7 @@ import { type IQuest, QuestCategory, QuestType } from '../../../../api/concero/q import { config } from '../../../../constants/config' import { getQuestDaysLeft } from './getQuestStatus' import { QuestStatus } from '../QuestStatus' - +import { CersIcon } from '../../../../assets/icons/CersIcon' interface QuestCardProps { variant?: 'big' | 'normal' | 'small' quest: IQuest @@ -104,6 +104,13 @@ export const QuestCard = ({ variant = 'big', quest, user, className }: QuestCard // don't display daily social quest if they don't have a link if (isDailyQuest && isSocialQuest && !quest.steps[0].options?.link) return null + let rewardsToShow: string = '0' + // Display either pointsToshow or points + if (quest.rewards.pointsToShow && quest.rewards.pointsToShow.length > 0) { + rewardsToShow = quest.rewards.pointsToShow + } else if (quest.rewards.points) { + rewardsToShow = String(quest.rewards.points) + } return ( <>
{name} )} {!!quest.rewards.points && ( -
+ {quest.rewards.points} CERs
+
+
+ {rewardsToShow}
+ +
)}
diff --git a/src/components/rewards/Quests/QuestModal/QuestModal.module.pcss b/src/components/rewards/Quests/QuestModal/QuestModal.module.pcss index 31c507b7..2b4af2e6 100644 --- a/src/components/rewards/Quests/QuestModal/QuestModal.module.pcss +++ b/src/components/rewards/Quests/QuestModal/QuestModal.module.pcss @@ -41,6 +41,15 @@ .points { color: var(--color-primary-700); + font-size: 24px; +} +.rewards { + display: flex; + flex-direction: row; + gap: 8px; + align-items: center; + font-weight: 500; + line-height: 28px; } .category { diff --git a/src/components/rewards/Quests/QuestModal/QuestModal.tsx b/src/components/rewards/Quests/QuestModal/QuestModal.tsx index eff2968b..132910a2 100644 --- a/src/components/rewards/Quests/QuestModal/QuestModal.tsx +++ b/src/components/rewards/Quests/QuestModal/QuestModal.tsx @@ -13,6 +13,7 @@ import { claimQuestReward } from '../../../../api/concero/quest/claimQuestReward import { useAppKit } from '@reown/appkit/react' import { Stepper } from '../../../layout/Stepper/Stepper' import { useAccount } from 'wagmi' +import { CersIcon } from '../../../../assets/icons/CersIcon' interface QuestModalProps { isOpen: boolean @@ -146,7 +147,13 @@ export const QuestModal = ({ /> ) } - + let rewardsToShow: string = '0' + // Display either pointsToshow or points + if (quest.rewards.pointsToShow && quest.rewards.pointsToShow.length > 0) { + rewardsToShow = quest.rewards.pointsToShow + } else if (quest.rewards.points) { + rewardsToShow = String(quest.rewards.points) + } return (
@@ -155,9 +162,11 @@ export const QuestModal = ({ {quest.subtitle && quest.name !== 'Lancardio' && (

{quest.subtitle}

)} -
- {rewards.points ? `${rewards.points} CERs` : ''} {rewards?.role ? '+ Role' : ''} -
+
+
+ {rewardsToShow}
+ + {rewards?.role ? '+ Role' : ''} +
{questImage}