diff --git a/src/assets/graphics/friends/friends-animals.png b/src/assets/graphics/friends/friends-animals.png
new file mode 100644
index 000000000..bd4d00067
Binary files /dev/null and b/src/assets/graphics/friends/friends-animals.png differ
diff --git a/src/modules/telegram/FriendsPage.tsx b/src/modules/telegram/FriendsPage.tsx
deleted file mode 100644
index 189f0ae2e..000000000
--- a/src/modules/telegram/FriendsPage.tsx
+++ /dev/null
@@ -1,91 +0,0 @@
-import Button from '@/components/Button'
-import Card from '@/components/Card'
-import { Skeleton } from '@/components/SkeletonFallback'
-import LayoutWithBottomNavigation from '@/components/layouts/LayoutWithBottomNavigation'
-import { getReferralLink } from '@/components/referral/utils'
-import useIsMounted from '@/hooks/useIsMounted'
-import useTgNoScroll from '@/hooks/useTgNoScroll'
-import { getUserReferralsQuery } from '@/services/datahub/leaderboard/query'
-import { useSendEvent } from '@/stores/analytics'
-import { useMyMainAddress } from '@/stores/my-account'
-import { copyToClipboard, formatNumber } from '@/utils/strings'
-import { useState } from 'react'
-import PointsWidget from '../points/PointsWidget'
-
-export default function FriendsPage() {
- useTgNoScroll()
-
- const isMounted = useIsMounted()
- const myAddress = useMyMainAddress()
- const [isCopied, setIsCopied] = useState(false)
- const { data: referralData } = getUserReferralsQuery.useQuery(myAddress || '')
- const referralLink = getReferralLink(myAddress)
- const sendEvent = useSendEvent()
-
- const onCopyClick = (text: string) => {
- sendEvent('ref_copied')
- copyToClipboard(text)
-
- setIsCopied(true)
- setTimeout(() => {
- setIsCopied(false)
- }, 1000)
- }
-
- return (
-
-
-
-
-
- Earn 10% of Friends Rewards
-
-
- You receive 10% of the points your first-line friends earn, and 1%
- from their friends’ earnings.
-
-
-
- {isMounted && myAddress ? (
-
- {referralLink}
-
- ) : (
-
- )}
-
-
-
-
- {referralData ? (
- {formatNumber(referralData?.refCount)}
- ) : (
-
- )}
-
-
- Friends Joined
-
-
-
-
- {referralData ? (
- {formatNumber(referralData?.pointsEarned)}
- ) : (
-
- )}
-
-
- Points Earned
-
-
-
+
+
+
+
+
+ INVITE TO GET BONUS
+
+
+ You receive 10% of
+ the points your first-line friends earn, and{' '}
+ 1% from their
+ friends’ earnings.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {formatNumber(refCount)}
+
+
+ Points Earned from friends activity
+
+
+
+
+
+ {formatNumber(pointsEarned)}
+
+
+
+ Points Earned from 3 invited friends
+
+
+
+ )
+}
+
+const EarnInfoSection = () => {
+ return (
+
+
+
+ 💎 +200,000{' '}
+ when your friend joined
+
+
+ You’ll get 200,000 points for every invite. Complete tasks to earn
+ even more.
+
+
+
+
+ )
+}
+
+type ReferralTableProps = {
+ referrals?: {
+ timestamp: string
+ socialProfileId: string
+ }[]
+ isLoading?: boolean
+ refCount: number
+}
+
+const ReferralTable = ({
+ isLoading,
+ refCount,
+ referrals,
+}: ReferralTableProps) => {
+ return (
+
+
+
+
+ {refCount}
+ {' '}
+ referrals
+
+ Here will be the table
+
+
+ )
+}
diff --git a/src/services/datahub/leaderboard/index.ts b/src/services/datahub/leaderboard/index.ts
index c14108698..844a737ee 100644
--- a/src/services/datahub/leaderboard/index.ts
+++ b/src/services/datahub/leaderboard/index.ts
@@ -147,6 +147,74 @@ export async function getUserReferrals(
}
}
+const GET_USER_REFERRAL_STATS = gql`
+ query getUserReferralsStats($address: String!) {
+ userReferralsStats(
+ args: {
+ where: { referrerId: $address }
+ responseParams: {
+ withReferralsList: true
+ withDistributedRewards: true
+ }
+ referralsListParams: { pageSize: 100 }
+ }
+ ) {
+ referrerId
+ distributedRewards {
+ totalPoints
+ }
+ referrals {
+ total
+ pageSize
+ offset
+ data {
+ timestamp
+ socialProfile {
+ id
+ }
+ }
+ }
+ }
+ }
+`
+
+export async function getUserReferralStats(address: string) {
+ const res = await datahubQueryRequest<
+ {
+ userReferralsStats: {
+ referrerId: string
+ distributedRewards: {
+ totalPoints: string
+ }
+ referrals: {
+ total: number
+ data: {
+ timestamp: string
+ socialProfile: {
+ id: string
+ }
+ }[]
+ }
+ }
+ },
+ GetUserReferralsQueryVariables
+ >({
+ document: GET_USER_REFERRAL_STATS,
+ variables: { address },
+ })
+
+ const data = res.userReferralsStats
+
+ return {
+ refCount: data.referrals.total ?? 0,
+ pointsEarned: data.distributedRewards.totalPoints.toString() ?? '0',
+ referrals: data.referrals.data.map((referral) => ({
+ timestamp: referral.timestamp,
+ socialProfileId: referral.socialProfile.id,
+ })),
+ }
+}
+
const GET_ACTIVE_STAKING_TOKENOMIC_METADATA = gql`
query GetTokenomicMetadata {
activeStakingTokenomicMetadata {
diff --git a/src/services/datahub/leaderboard/query.ts b/src/services/datahub/leaderboard/query.ts
index 37b039196..53fe1481a 100644
--- a/src/services/datahub/leaderboard/query.ts
+++ b/src/services/datahub/leaderboard/query.ts
@@ -4,6 +4,7 @@ import {
getLeaderboardData,
getUserData,
getUserReferrals,
+ getUserReferralStats,
} from '.'
export const getUserReferralsQuery = createQuery({
@@ -14,6 +15,14 @@ export const getUserReferralsQuery = createQuery({
}),
})
+export const getUserReferralStatsQuery = createQuery({
+ key: 'getUserReferralStats',
+ fetcher: getUserReferralStats,
+ defaultConfigGenerator: (data) => ({
+ enabled: !!data,
+ }),
+})
+
export const getUserDataByAllTimeQuery = createQuery({
key: 'userDataByAllTime',
fetcher: (address: string) => getUserData(address, 'allTime'),