white list api

apis/whitelist.ts

@@ -0,0 +1,14 @@
+import { WHITE_LIST_API } from 'utils/constants'
+
+export type WhiteListedResp = {
+  found: boolean
+}
+
+export const fetchIsWhiteListed = async (wallet: string) => {
+  const data = await fetch(`${WHITE_LIST_API}isWhiteListed?wallet=${wallet}`)
+  const body = await data.json()
+  if (body.error) {
+    throw { error: body.error, status: data.status }
+  }
+  return body.found
+}

components/rewards/RewardsPage.tsx

@@ -7,6 +7,7 @@ import Button, { LinkButton } from '@components/shared/Button'
 import Modal from '@components/shared/Modal'
 import { Disclosure } from '@headlessui/react'
 import {
+  CheckIcon,
   ChevronDownIcon,
   ChevronRightIcon,
   ClockIcon,
@@ -25,6 +26,8 @@ import SheenLoader from '@components/shared/SheenLoader'
 import { abbreviateAddress } from 'utils/formatting'
 import { PublicKey } from '@solana/web3.js'
 import { useTranslation } from 'next-i18next'
+import { useIsWhiteListed } from 'hooks/useIsWhiteListed'
+import { XMarkIcon } from '@heroicons/react/24/outline'
 
 export type RewardsLeaderboardItem = {
   points: number
@@ -147,7 +150,7 @@ const Season = ({
   const { t } = useTranslation(['common', 'rewards'])
   const { wallet } = useWallet()
   const [topAccountsTier, setTopAccountsTier] = useState('seed')
-
+  const { data: isWhiteListed } = useIsWhiteListed()
   const {
     data: walletRewardsData,
     isFetching: fetchingWalletRewardsData,
@@ -197,7 +200,15 @@ const Season = ({
         <ClockIcon className="mr-2 h-5 w-5 text-th-active" />
         <p className="text-base text-th-fgd-2">
           Season 1 starts in:{' '}
-          <span className="font-bold text-th-fgd-1">4 days</span>
+          <span className="mr-4 font-bold text-th-fgd-1">4 days</span>
+          <div className="flex">
+            User whitelisted -{' '}
+            {isWhiteListed ? (
+              <CheckIcon className="w-5"></CheckIcon>
+            ) : (
+              <XMarkIcon className="w-5"></XMarkIcon>
+            )}
+          </div>
         </p>
       </div>
       <div className="mx-auto grid max-w-[1140px] grid-cols-12 gap-4 p-8 lg:gap-6 lg:p-10">

hooks/useIsWhiteListed.ts

@@ -0,0 +1,22 @@
+import { useQuery } from '@tanstack/react-query'
+import { useWallet } from '@solana/wallet-adapter-react'
+import { fetchIsWhiteListed } from 'apis/whitelist'
+
+const refetchMs = 24 * 60 * 60 * 1000
+
+export function useIsWhiteListed() {
+  const { publicKey } = useWallet()
+  const walletPubKey = publicKey?.toBase58()
+  const criteria = walletPubKey
+
+  return useQuery(
+    ['isWhiteListed', criteria],
+    () => fetchIsWhiteListed(walletPubKey!),
+    {
+      enabled: !!walletPubKey,
+      staleTime: refetchMs,
+      retry: 1,
+      refetchInterval: refetchMs,
+    }
+  )
+}

utils/constants.ts

@@ -97,6 +97,7 @@ export const JUPITER_API_DEVNET = 'https://api.jup.ag/api/tokens/devnet'
 export const JUPITER_PRICE_API_MAINNET = 'https://price.jup.ag/v4/'
 
 export const NOTIFICATION_API = 'https://notifications-api.herokuapp.com/'
+
 export const NOTIFICATION_API_WEBSOCKET =
   'wss://notifications-api.herokuapp.com/ws'
 
@@ -122,3 +123,5 @@ export const CUSTOM_TOKEN_ICONS: { [key: string]: boolean } = {
   usdt: true,
   'wbtc (portal)': true,
 }
+
+export const WHITE_LIST_API = 'https://api.mngo.cloud/whitelist/v1/'