wip

2022-02-14 12:15:46 -05:00 · 2022-02-14 12:15:46 -05:00 · 55b7907bfd
parent 11f9ef806d
commit 55b7907bfd
6 changed files with 191 additions and 12 deletions
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@ -18,6 +18,9 @@ import ErrorBoundary from '../components/ErrorBoundary'
 import GlobalNotification from '../components/GlobalNotification'
 import { useOpenOrders } from '../hooks/useOpenOrders'
 import usePerpPositions from '../hooks/usePerpPositions'
+import { useEffect } from 'react'
+import { PublicKey } from '@solana/web3.js'
+import { mangoClientSelector, mangoGroupSelector } from '../stores/selectors'

 const MangoStoreUpdater = () => {
  useHydrateStore()
@ -39,6 +42,40 @@ const PerpPositionsStoreUpdater = () => {
  return null
 }

+const TrackReferrer = () => {
+  const setMangoStore = useMangoStore((s) => s.set)
+  const mangoClient = useMangoStore(mangoClientSelector)
+  const mangoGroup = useMangoStore(mangoGroupSelector)
+  const router = useRouter()
+  const { query } = router
+
+  useEffect(() => {
+    const storeReferrer = async () => {
+      if (query.ref && mangoGroup) {
+        let reffererPk
+        if (query.ref.length === 44) {
+          reffererPk = new PublicKey(query.ref)
+        } else {
+          const { referrerPda } = await mangoClient.getReferrerPda(
+            mangoGroup,
+            query.ref as string
+          )
+          reffererPk = referrerPda
+        }
+        console.log('reffererPk', reffererPk)
+
+        setMangoStore((state) => {
+          state.ref = reffererPk
+        })
+      }
+    }
+
+    storeReferrer()
+  }, [query, mangoGroup])
+
+  return null
+}
+
 const PageTitle = () => {
  const router = useRouter()
  const marketConfig = useMangoStore((s) => s.selectedMarket.config)
@ -109,6 +146,7 @@ function App({ Component, pageProps }) {
          <WalletStoreUpdater />
          <OpenOrdersStoreUpdater />
          <PerpPositionsStoreUpdater />
+          <TrackReferrer />
        </ErrorBoundary>

        <ThemeProvider defaultTheme="Mango">
--- a/pages/referral.tsx
+++ b/pages/referral.tsx
@ -1,9 +1,20 @@
-import { useEffect } from 'react'
+import { useState } from 'react'
 import PageBodyContainer from '../components/PageBodyContainer'
 import TopBar from '../components/TopBar'
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
 import useMangoStore from '../stores/useMangoStore'
-import { mangoGroupSelector } from '../stores/selectors'
+import {
+  mangoAccountSelector,
+  mangoClientSelector,
+  mangoGroupConfigSelector,
+  mangoGroupSelector,
+  walletSelector,
+} from '../stores/selectors'
+import Button from '../components/Button'
+import { copyToClipboard } from '../utils'
+import Input from '../components/Input'
+import { notify } from '../utils/notifications'
+import { getMarketIndexBySymbol } from '@blockworks-foundation/mango-client'

 export async function getStaticProps({ locale }) {
  return {
@ -14,22 +25,123 @@ export async function getStaticProps({ locale }) {
  }
 }

-export default function Borrow() {
+export default function Referral() {
  const mangoGroup = useMangoStore(mangoGroupSelector)
+  const mangoAccount = useMangoStore(mangoAccountSelector)
+  const groupConfig = useMangoStore(mangoGroupConfigSelector)
+  const client = useMangoStore(mangoClientSelector)
+  const wallet = useMangoStore(walletSelector)

-  useEffect(() => {
-    // @ts-ignore
-    if (window.solana) {
-      // @ts-ignore
-      window.solana.connect({ onlyIfTrusted: true })
+  const [customRefLink, setCustomRefLink] = useState('')
+
+  console.log('MangoAccount', mangoAccount)
+
+  // TODO: check if this is still needed on every top level page
+  // useEffect(() => {
+  //   // @ts-ignore
+  //   if (window.solana) {
+  //     // @ts-ignore
+  //     window.solana.connect({ onlyIfTrusted: true })
+  //   }
+  // }, [])
+
+  const submitRefLink = async () => {
+    try {
+      const txid = await client.registerReferrerId(
+        mangoGroup,
+        mangoAccount,
+        wallet,
+        customRefLink
+      )
+      notify({
+        txid,
+        title: 'Custom referal link created',
+      })
+    } catch (e) {
+      notify({
+        type: 'error',
+        title: 'Unable to create referral link',
+        description: e.message,
+        txid: e.txid,
+      })
    }
-  }, [])
+  }
+
+  const mngoIndex = getMarketIndexBySymbol(groupConfig, 'MNGO')
+  const hasRequiredMngo =
+    mangoGroup && mangoAccount
+      ? mangoAccount.deposits[mngoIndex].toNumber() > 10000
+      : false

  return (
    <div className={`bg-th-bkg-1 text-th-fgd-1 transition-all`}>
      <TopBar />
      <PageBodyContainer>
-        <div className="">{mangoGroup ? <div>Referrals</div> : null}</div>
+        <div className="bg-th-bkg-2 overflow-none p-4 sm:p-6 rounded-lg mt-10 md:mt-12">
+          {mangoGroup ? <div>Referrals</div> : null}
+          <div className="mt-4">
+            <ul>
+              <li>
+                Share your referral link with others. When your referee uses
+                your link to create an account, your referral code will be
+                automatically applied.
+              </li>
+              <li>
+                Whenever your referee trades, you will receive 20% of their perp
+                fees.
+              </li>
+              <li>
+                Anyone who uses your referral link, will receive a 5% discount
+                on their perp fees.
+              </li>
+              <li>
+                You will need 10,000 MNGO tokens in your Mango Account to
+                qualify
+              </li>
+              <li></li>
+            </ul>
+          </div>
+          <div className="mt-4"></div>
+          {hasRequiredMngo ? (
+            <div>
+              {mangoAccount ? (
+                <div>
+                  Your ref link:{' '}
+                  <a>
+                    https://trade.mango.markets?ref=
+                    {mangoAccount.publicKey.toString()}
+                  </a>
+                  <Button
+                    onClick={() =>
+                      copyToClipboard(
+                        `https://trade.mango.markets?ref=${mangoAccount.publicKey.toString()}`
+                      )
+                    }
+                  >
+                    Copy
+                  </Button>
+                </div>
+              ) : (
+                <div>Connect wallet to see your referral link</div>
+              )}
+              <div className="mt-4">
+                <div>Generate a custom referral link</div>
+                <div className="flex items-center">
+                  <div className="grow whitespace-nowrap">
+                    trade.mango.markets?ref=
+                  </div>
+                  <Input
+                    type="text"
+                    placeholder="ElonMusk"
+                    onChange={(e) => setCustomRefLink(e.target.value)}
+                    value={customRefLink}
+                  />
+                  <Button onClick={submitRefLink}>Submit</Button>
+                </div>
+              </div>
+            </div>
+          ) : null}
+        </div>
      </PageBodyContainer>
    </div>
  )
--- a/stores/selectors.ts
+++ b/stores/selectors.ts
@ -16,6 +16,9 @@ export const mangoGroupConfigSelector = (state: MangoStore) =>
 export const mangoCacheSelector = (state: MangoStore) =>
  state.selectedMangoGroup.cache

+export const mangoClientSelector = (state: MangoStore) =>
+  state.connection.client
+
 export const actionsSelector = (state: MangoStore) => state.actions

 export const marketsSelector = (state: MangoStore) =>
--- a/stores/useMangoStore.tsx
+++ b/stores/useMangoStore.tsx
@ -54,7 +54,7 @@ export const ENDPOINTS: EndpointInfo[] = [
 ]

 type ClusterType = 'mainnet' | 'devnet'
-const DEFAULT_MANGO_GROUP_NAME = process.env.NEXT_PUBLIC_GROUP || 'mainnet.1'
+const DEFAULT_MANGO_GROUP_NAME = process.env.NEXT_PUBLIC_GROUP || 'devnet.2'
 export const CLUSTER = DEFAULT_MANGO_GROUP_NAME.split('.')[0] as ClusterType
 const ENDPOINT = ENDPOINTS.find((e) => e.name === CLUSTER)

@ -159,6 +159,7 @@ export interface MangoStore extends State {
    cache: MangoCache | null
  }
  mangoAccounts: MangoAccount[]
+  ref: string
  selectedMangoAccount: {
    current: MangoAccount | null
    initialLoad: boolean
@ -271,6 +272,7 @@ const useMangoStore = create<MangoStore>((set, get) => {
    },
    mangoGroups: [],
    mangoAccounts: [],
+    ref: '',
    selectedMangoAccount: {
      current: null,
      initialLoad: true,
@ -461,6 +463,7 @@ const useMangoStore = create<MangoStore>((set, get) => {
                state.selectedMangoGroup.current = mangoGroup
              })
            })
+
            const allMarketConfigs = getAllMarkets(mangoGroupConfig)
            const allMarketPks = allMarketConfigs.map((m) => m.publicKey)
            const allBidsAndAsksPks = allMarketConfigs
--- a/utils/mango.tsx
+++ b/utils/mango.tsx
@ -17,6 +17,7 @@ export async function deposit({
  const wallet = useMangoStore.getState().wallet.current
  const tokenIndex = mangoGroup.getTokenIndex(fromTokenAcc.mint)
  const mangoClient = useMangoStore.getState().connection.client
+  const referrer = useMangoStore.getState().ref

  if (mangoAccount) {
    return await mangoClient.deposit(
@ -44,7 +45,8 @@ export async function deposit({
      fromTokenAcc.publicKey,
      Number(amount),
      existingAccounts.length,
-      accountName
+      accountName,
+      referrer
    )
  }
 }
--- a/yarn.lock
+++ b/yarn.lock
@ -1292,8 +1292,12 @@
 =======
 "@blockworks-foundation/mango-client@git+https://github.com/blockworks-foundation/mango-client-v3.git#dd/reflinks":
  version "3.3.13"
+<<<<<<< HEAD
  resolved "git+https://github.com/blockworks-foundation/mango-client-v3.git#33ceaf776f95c95d647d2624484b8fbc412f7898"
 >>>>>>> e0d3a1f... create referral page
+=======
+  resolved "git+https://github.com/blockworks-foundation/mango-client-v3.git#148835a26d004808e4a8bc5e7335957fa31becd5"
+>>>>>>> 33c4938... wip
  dependencies:
    "@project-serum/anchor" "^0.16.2"
    "@project-serum/serum" "0.13.55"
@ -2169,9 +2173,15 @@
    dotenv "10.0.0"

 "@solana/web3.js@^1.17.0", "@solana/web3.js@^1.21.0":
+<<<<<<< HEAD
  version "1.34.0"
  resolved "https://registry.yarnpkg.com/@solana/web3.js/-/web3.js-1.34.0.tgz#33becf2c7e87497d73406374185e54e0b7bc235d"
  integrity sha512-6QvqN2DqEELvuV+5yUQM8P9fRiSG+6SzQ58HjumJqODu14r7eu5HXVWEymvKAvMLGME+0TmAdJHjw9xD5NgUWA==
+=======
+  version "1.33.0"
+  resolved "https://registry.yarnpkg.com/@solana/web3.js/-/web3.js-1.33.0.tgz#3b8c0b4cd259ffe8764937f1001f79958c5d9533"
+  integrity sha512-R53wvQQsUKCCJ9UmOfDlxCwC94jzjmpjr6wT/Xf1uFavZblSLAtzLaF4vbGIS465lk3mW6oJMtASd8cqSnr8Mw==
+>>>>>>> 33c4938... wip
  dependencies:
    "@babel/runtime" "^7.12.5"
    "@ethersproject/sha2" "^5.5.0"
@ -2530,6 +2540,7 @@
  integrity sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==

 "@types/node@*":
+<<<<<<< HEAD
  version "17.0.17"
  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.17.tgz#a8ddf6e0c2341718d74ee3dc413a13a042c45a0c"
  integrity sha512-e8PUNQy1HgJGV3iU/Bp2+D/DXh3PYeyli8LgIwsQcs1Ar1LoaWHSIT6Rw+H2rNJmiq6SNWiDytfx8+gYj7wDHw==
@ -2538,6 +2549,16 @@
  version "12.20.45"
  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.45.tgz#f4980d177999299d99cd4b290f7f39366509a44f"
  integrity sha512-1Jg2Qv5tuxBqgQV04+wO5u+wmSHbHgpORCJdeCLM+E+YdPElpdHhgywU+M1V1InL8rfOtpqtOjswk+uXTKwx7w==
+=======
+  version "17.0.16"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.16.tgz#e3733f46797b9df9e853ca9f719c8a6f7b84cd26"
+  integrity sha512-ydLaGVfQOQ6hI1xK2A5nVh8bl0OGoIfYMxPWHqqYe9bTkWCfqiVvZoh2I/QF2sNSkZzZyROBoTefIEI+PB6iIA==
+
+"@types/node@^12.12.54":
+  version "12.20.43"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.43.tgz#6cf47894da4a4748c62fccf720ba269e1b1ff5a4"
+  integrity sha512-HCfJdaYqJX3BCzeihgZrD7b85Cu05OC/GVJ4kEYIflwUs4jbnUlLLWoq7hw1LBcdvUyehO+gr6P5JQ895/2ZfA==
+>>>>>>> 33c4938... wip

 "@types/node@^14.14.25":
  version "14.17.3"