Skip to content

Commit

Permalink
Add count of referred users
Browse files Browse the repository at this point in the history
  • Loading branch information
@behrang
behrang committed Apr 20, 2024
1 parent beb3e37 commit acd24f8
Show file tree
Hide file tree
Showing 2 changed files with 52 additions and 13 deletions.
33 changes: 33 additions & 0 deletions src/Model.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@ type UnstakeOption = 'unstake' | 'swap'

type WaitForTransaction = 'no' | 'wait' | 'timeout' | 'done'

interface ReferralStats {
wallets: Address[]
}

interface FragmentState {
network?: Network
referrer?: Address
Expand Down Expand Up @@ -78,6 +82,7 @@ export class Model {
waitForTransaction: WaitForTransaction = 'no'
ongoingRequests = 0
errorMessage = ''
referralStats?: ReferralStats

// unobserved state
dark = false
Expand All @@ -90,6 +95,7 @@ export class Model {
timeoutReadLastBlock?: ReturnType<typeof setTimeout>
timeoutSwitchNetwork?: ReturnType<typeof setTimeout>
timeoutErrorMessage?: ReturnType<typeof setTimeout>
timeoutReferralStats?: ReturnType<typeof setTimeout>

readonly dedustSwapUrl = 'https://dedust.io/swap/hTON/TON'
readonly dedustPoolUrl = 'https://dedust.io/pools/EQBWsAdyAg-8fs3G-m-eUBCXZuVaOldF5-tCMJBJzxQG7nLX'
Expand Down Expand Up @@ -120,6 +126,7 @@ export class Model {
waitForTransaction: observable,
ongoingRequests: observable,
errorMessage: observable,
referralStats: observable,

isWalletConnected: computed,
isMainnet: computed,
Expand Down Expand Up @@ -1092,6 +1099,32 @@ export class Model {
copyReferralUrl = () => {
void navigator.clipboard.writeText(this.referralUrl)
}

loadReferralStats = () => {
clearTimeout(this.timeoutReferralStats)
if (this.referralStats != null || !this.isWalletConnected) {
return
}
fetch(
'http://65.109.199.42:4476/api/referral?referrer=' +
this.address?.toString({ bounceable: false, testOnly: !this.isMainnet }),
)
.then((res) => res.json())
.then((res: { ok: boolean; result: { wallets: { wallet: string }[] } }) => {
if (res.ok && res.result.wallets.length >= 0) {
runInAction(() => {
this.referralStats = {
wallets: res.result.wallets.map((w) => Address.parseFriendly(w.wallet).address),
}
})
}
throw new Error('invalid response')
})
.catch(() => {
clearTimeout(this.timeoutReferralStats)
this.timeoutReferralStats = setTimeout(this.loadReferralStats, 60000)
})
}
}

function formatNano(amount: bigint | number): string {
Expand Down
32 changes: 19 additions & 13 deletions src/Referral.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ interface Props {
}

const Referral = observer(({ model }: Props) => {
model.loadReferralStats()
let copiedTimeout: ReturnType<typeof setTimeout>
return (
<div className='mx-auto w-full max-w-screen-lg p-4 pb-32 font-body text-brown dark:text-dark-50'>
Expand Down Expand Up @@ -106,26 +107,31 @@ const Referral = observer(({ model }: Props) => {
<div className='mt-20 px-8'>
<h3 className='my-8 text-center text-2xl font-bold'>Track Your Progress</h3>
<div className='flex flex-col items-center justify-center gap-8 sm:flex-row sm:items-start'>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md blur-[2px] dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={invites} className='h-10 dark:hidden' />
<img src={invitesDark} className='hidden h-10 dark:block' />
<p className='my-2'>Number of Invites</p>
<h4 className='text-lg font-bold'>0 Users</h4>
<h4 className='text-lg font-bold'>
{model.referralStats == null
? 'Loading'
: model.referralStats.wallets.length + ' Users'}
</h4>
</div>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md blur-[2px] dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={staked} className='h-10 dark:hidden' />
<img src={stakedDark} className='hidden h-10 dark:block' />
<p className='my-2'>Total Staked Amount</p>
<h4 className='text-lg font-bold'>0 TON</h4>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={staked} className='h-10 blur-[2px] dark:hidden' />
<img src={stakedDark} className='hidden h-10 blur-[2px] dark:block' />
<p className='my-2 blur-[2px]'>Total Staked Amount</p>
{/* <h4 className='text-lg font-bold'>0 TON</h4> */}
<h4 className='text-lg'>Coming Soon</h4>
</div>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md blur-[2px] dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={earned} className='h-10 dark:hidden' />
<img src={earnedDark} className='hidden h-10 dark:block' />
<p className='my-2'>Earned Revenue</p>
<h4 className='text-lg font-bold'>0 TON</h4>
<div className='flex w-52 flex-1 flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={earned} className='h-10 blur-[2px] dark:hidden' />
<img src={earnedDark} className='hidden h-10 blur-[2px] dark:block' />
<p className='my-2 blur-[2px]'>Earned Revenue</p>
{/* <h4 className='text-lg font-bold'>0 TON</h4> */}
<h4 className='text-lg'>Coming Soon</h4>
</div>
</div>
<p className='m-8 text-center'>Coming Soon</p>
</div>
</>
)}
Expand Down

0 comments on commit acd24f8

Please sign in to comment.