diff --git a/configs/envs/.env.eth_sepolia b/configs/envs/.env.eth_sepolia index 06c2094b85..601bd0a99e 100644 --- a/configs/envs/.env.eth_sepolia +++ b/configs/envs/.env.eth_sepolia @@ -62,10 +62,10 @@ NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation NEXT_PUBLIC_OG_ENHANCED_DATA_ENABLED=true NEXT_PUBLIC_OG_IMAGE_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/og-images/sepolia-testnet.png NEXT_PUBLIC_OTHER_LINKS=[{'url':'https://sepolia.drpc.org?ref=559183','text':'Public RPC'}] -NEXT_PUBLIC_REWARDS_SERVICE_API_HOST=https://merits.blockscout.com +NEXT_PUBLIC_REWARDS_SERVICE_API_HOST=https://points.k8s-dev.blockscout.com NEXT_PUBLIC_SAFE_TX_SERVICE_URL=https://safe-transaction-sepolia.safe.global NEXT_PUBLIC_STATS_API_HOST=https://stats-sepolia.k8s.blockscout.com NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER=noves NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED=true NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com -NEXT_PUBLIC_XSTAR_SCORE_URL=https://docs.xname.app/the-solution-adaptive-proof-of-humanity-on-blockchain/xhs-scoring-algorithm?utm_source=blockscout&utm_medium=address \ No newline at end of file +NEXT_PUBLIC_XSTAR_SCORE_URL=https://docs.xname.app/the-solution-adaptive-proof-of-humanity-on-blockchain/xhs-scoring-algorithm?utm_source=blockscout&utm_medium=address diff --git a/mocks/rewards/dailyReward.ts b/mocks/rewards/dailyReward.ts index c60377e43e..558c22aca4 100644 --- a/mocks/rewards/dailyReward.ts +++ b/mocks/rewards/dailyReward.ts @@ -3,7 +3,10 @@ import type { RewardsUserDailyCheckResponse } from 'types/api/rewards'; export const base: RewardsUserDailyCheckResponse = { available: true, daily_reward: '10', + streak_reward: '10', pending_referral_rewards: '0', + total_reward: '20', date: '', reset_at: '', + streak: '6', }; diff --git a/public/static/badges.svg b/public/static/badges.svg new file mode 100644 index 0000000000..741e81b6e5 --- /dev/null +++ b/public/static/badges.svg @@ -0,0 +1,581 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/static/badges/badge_1.svg b/public/static/badges/badge_1.svg deleted file mode 100644 index 967cdc5b2a..0000000000 --- a/public/static/badges/badge_1.svg +++ /dev/null @@ -1,46 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/public/static/badges/badge_2.svg b/public/static/badges/badge_2.svg deleted file mode 100644 index 7ac747f389..0000000000 --- a/public/static/badges/badge_2.svg +++ /dev/null @@ -1,41 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/public/static/badges/badge_3.svg b/public/static/badges/badge_3.svg deleted file mode 100644 index 9d1a1e7899..0000000000 --- a/public/static/badges/badge_3.svg +++ /dev/null @@ -1,51 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/public/static/badges/badge_4.svg b/public/static/badges/badge_4.svg deleted file mode 100644 index 18d5c72260..0000000000 --- a/public/static/badges/badge_4.svg +++ /dev/null @@ -1,56 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/public/static/badges/badge_5.svg b/public/static/badges/badge_5.svg deleted file mode 100644 index 2c5f4f560c..0000000000 --- a/public/static/badges/badge_5.svg +++ /dev/null @@ -1,46 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/types/api/rewards.ts b/types/api/rewards.ts index 8d2d12b437..b406f08c30 100644 --- a/types/api/rewards.ts +++ b/types/api/rewards.ts @@ -36,14 +36,20 @@ export type RewardsUserBalancesResponse = { export type RewardsUserDailyCheckResponse = { available: boolean; daily_reward: string; + streak_reward: string; pending_referral_rewards: string; + total_reward: string; date: string; reset_at: string; + streak: string; }; export type RewardsUserDailyClaimResponse = { daily_reward: string; + streak_reward: string; pending_referral_rewards: string; + total_reward: string; + streak: string; }; export type RewardsUserReferralsResponse = { diff --git a/ui/pages/RewardsDashboard.tsx b/ui/pages/RewardsDashboard.tsx index 2c84952ea3..f68103280f 100644 --- a/ui/pages/RewardsDashboard.tsx +++ b/ui/pages/RewardsDashboard.tsx @@ -14,6 +14,7 @@ import useRedirectForInvalidAuthToken from 'ui/snippets/auth/useRedirectForInval const RewardsDashboard = () => { const { balancesQuery, apiToken, referralsQuery, rewardsConfigQuery, dailyRewardQuery, isInitialized } = useRewardsContext(); + const [ isError, setIsError ] = useState(false); useRedirectForInvalidAuthToken(); @@ -32,6 +33,13 @@ const RewardsDashboard = () => { return null; } + let shareText = `Claim your free @blockscoutcom #Merits and start building your daily streak today! #Blockscout #Merits #IYKYK\n\nBoost your rewards instantly by using my referral code: ${ referralsQuery.data?.link }`; // eslint-disable-line max-len + + if (dailyRewardQuery.data?.streak && Number(dailyRewardQuery.data.streak) > 0) { + const days = `day${ Number(dailyRewardQuery.data.streak) === 1 ? '' : 's' }`; + shareText = `I${ apos }ve claimed Merits ${ dailyRewardQuery.data.streak } ${ days } in a row!\n\n` + shareText; + } + return ( <> { /> { isError && Failed to load some data. Please try again later. } - + } @@ -81,56 +90,122 @@ const RewardsDashboard = () => { 'N/A' } isLoading={ referralsQuery.isPending } - hint="The number of referrals who registered with your code/link." /> + Current number of consecutive days you{ apos }ve claimed your daily Merits.{ ' ' } + The longer your streak, the more daily Merits you can earn.{ ' ' } + + Share on X + + + ) } direction="column-reverse" - availableSoon - blurFilter > - + + See the{ ' ' } + + docs + { ' ' } + to learn how your streak number affects daily rewards + + ) } + /> - - Refer friends and boost your Merits! You receive a{ ' ' } - - { rewardsConfigQuery.data?.rewards.referral_share ? - `${ Number(rewardsConfigQuery.data?.rewards.referral_share) * 100 }%` : - 'N/A' - } - - { ' ' }bonus on all Merits earned by your referrals. - - ) } - direction="row" - > - + + Refer friends and boost your Merits! You receive a{ ' ' } + + { rewardsConfigQuery.data?.rewards.referral_share ? + `${ Number(rewardsConfigQuery.data?.rewards.referral_share) * 100 }%` : + 'N/A' + } + + { ' ' }bonus on all Merits earned by your referrals. + + ) } > - - - - + gap={{ base: 2, lg: 6 }} + px={{ base: 4, lg: 6 }} + py={{ base: 4, lg: 0 }} + flexDirection={{ base: 'column', lg: 'row' }} + > + + + + + + + Collect limited and legendary badges by completing different Blockscout related tasks. + Go to the badges website to see what{ apos }s available and start your collection today. + + + ) } + > + + Badges } + /> + + View badges + + + + { - - - Collect limited and legendary badges by completing different Blockscout related tasks. - Go to the badges website to see what{ apos }s available and start your collection today. - - - Go to website - - - ) } - direction="row" - availableSoon - > - - { Array(5).fill(null).map((_, index) => ( - 2 ? 'none' : 'block', sm: 'block' }} - src={ `/static/badges/badge_${ index + 1 }.svg` } - alt={ `Badge ${ index + 1 }` } - w={{ base: 'calc((100% - 16px) / 3)', sm: 'calc((100% - 32px) / 5)' }} - maxW={{ base: '80px', md: '100px' }} - maxH={{ base: '80px', md: '100px' }} - fallback={ ( - 2 ? 'none' : 'block', sm: 'block' }} - w={{ base: 'calc((100% - 16px) / 3)', sm: 'calc((100% - 32px) / 5)' }} - maxW={{ base: '80px', md: '100px' }} - maxH={{ base: '80px', md: '100px' }} - aspectRatio={ 1 } - /> - ) } - /> - )) } - - ); diff --git a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png index 2d67407732..afc97dc5f7 100644 Binary files a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png and b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png differ diff --git a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_base-view-dark-mode-mobile-1.png index 065c585d55..b784ffaf2b 100644 Binary files a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_base-view-dark-mode-mobile-1.png and b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_base-view-dark-mode-mobile-1.png differ diff --git a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_with-error-1.png b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_with-error-1.png index fb5affae60..67d98877d3 100644 Binary files a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_with-error-1.png and b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_default_with-error-1.png differ diff --git a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_mobile_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_mobile_base-view-dark-mode-mobile-1.png index 5f7fa66018..a80e084ce7 100644 Binary files a/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_mobile_base-view-dark-mode-mobile-1.png and b/ui/pages/__screenshots__/RewardsDashboard.pw.tsx_mobile_base-view-dark-mode-mobile-1.png differ diff --git a/ui/rewards/dashboard/DailyRewardClaimButton.tsx b/ui/rewards/dashboard/DailyRewardClaimButton.tsx index 02c4dfec0e..67e2daceee 100644 --- a/ui/rewards/dashboard/DailyRewardClaimButton.tsx +++ b/ui/rewards/dashboard/DailyRewardClaimButton.tsx @@ -12,7 +12,7 @@ const DailyRewardClaimButton = () => { const dailyRewardValue = useMemo(() => dailyRewardQuery.data ? - Number((Number(dailyRewardQuery.data.daily_reward) + Number(dailyRewardQuery.data.pending_referral_rewards)).toFixed(2)) : + Number(Number(dailyRewardQuery.data.total_reward).toFixed(2)) : 0, [ dailyRewardQuery.data ]); diff --git a/ui/rewards/dashboard/RewardsDashboardCard.tsx b/ui/rewards/dashboard/RewardsDashboardCard.tsx index 5847a9359c..54a34b5eba 100644 --- a/ui/rewards/dashboard/RewardsDashboardCard.tsx +++ b/ui/rewards/dashboard/RewardsDashboardCard.tsx @@ -50,7 +50,7 @@ const RewardsDashboardCard = ({ justifyContent="space-around" borderRadius={{ base: 'lg', md: '8px' }} backgroundColor={ useColorModeValue('gray.50', 'whiteAlpha.50') } - h={{ base: '80px', md: direction === 'row' ? 'auto' : '128px' }} + minH={{ base: '80px', md: '128px' }} filter="auto" blur={ blurFilter ? '4px' : '0' } flex={ direction === 'row' ? 1 : '0 1 auto' } diff --git a/ui/rewards/login/steps/LoginStepContent.tsx b/ui/rewards/login/steps/LoginStepContent.tsx index f701c1ca55..3b13dd57c4 100644 --- a/ui/rewards/login/steps/LoginStepContent.tsx +++ b/ui/rewards/login/steps/LoginStepContent.tsx @@ -86,10 +86,10 @@ const LoginStepContent = ({ goNext, closeModal, openAuthModal }: Props) => { return 'Connect wallet'; } if (isLoggedIntoAccountWithWallet) { - return 'Get started'; + return isSignUp ? 'Get started' : 'Continue'; } return profileQuery.data?.email ? 'Add wallet to account' : 'Log in to account'; - }, [ isConnected, isLoggedIntoAccountWithWallet, profileQuery.data ]); + }, [ isConnected, isLoggedIntoAccountWithWallet, profileQuery.data, isSignUp ]); return ( <>