feat: 军团长改为推荐

src/App.tsx

@@ -49,7 +49,6 @@ const PoolFinder = lazy(() => import('./views/PoolFinder'))
 const RemoveLiquidity = lazy(() => import('./views/RemoveLiquidity'))
 const Referral = lazy(() => import('./views/Referral'))
 const Nft = lazy(() => import('./views/Nft'))
-const Recommend = lazy(() => import('./views/Recommend'))
 
 // This config is required for number formatting
 BigNumber.config({
@@ -94,9 +93,6 @@ const App: React.FC = () => {
             <Route path="/nft">
               <Nft />
             </Route>
-            <Route path="/recommend">
-              <Recommend />
-            </Route>
             {/* <Route path="/lottery">
               <Lottery />
             </Route>
@@ -147,7 +143,6 @@ const App: React.FC = () => {
             <Route exact strict path="/remove/:tokens" component={RedirectOldRemoveLiquidityPathStructure} />
             <Route exact strict path="/remove/:currencyIdA/:currencyIdB" component={RemoveLiquidity} />
             <Route exact strict path="/nft" component={Nft} />
-            <Route exact strict path="/recommend" component={Recommend} />
 
             {/* Redirect */}
             {/* <Route path="/staking">

src/components/Menu/config.ts

@@ -40,16 +40,11 @@ const config: (t: ContextApi['t']) => MenuEntry[] = (t) => [
     icon: 'PoolIcon',
     href: '/referral',
   },
-	{
+  {
-	  label: 'NFT',
+    label: 'NFT',
-	  icon: 'TicketIcon',
+    icon: 'TicketIcon',
-	  href: '/nft'
+    href: '/nft',
-	},
+  },
-	{
-	  label: t('recommend'),
-	  icon: 'TicketIcon',
-	  href: '/recommend'
-	},
   // {
   //   label: t('Prediction (BETA)'),
   //   icon: 'PredictionsIcon',

src/utils/formatBalance.ts

@@ -19,7 +19,7 @@ export const getBalanceAmount = (amount: BigNumber, decimals = 18) => {
  */
 export const getBalanceNumber = (balance: BigNumber, decimals = 18, decimalPlaces?: number) => {
   const displayBalance = getBalanceAmount(balance, decimals)
-  return  decimalPlaces ?displayBalance.decimalPlaces(decimalPlaces).toNumber():displayBalance.toNumber()
+  return decimalPlaces ? displayBalance.decimalPlaces(decimalPlaces).toNumber() : displayBalance.toNumber()
 }
 
 export const getFullDisplayBalance = (balance: BigNumber, decimals = 18, displayDecimals?: number) => {

src/views/Recommend/index.tsx

@@ -1,47 +0,0 @@
-import React, { useState } from 'react'
-import styled from 'styled-components'
-import UnunitedCom from './components/UnunitedCom'
-import ConnectedCom from './components/Connected'
-import RegimentalCom from './components/Regimental'
-
-const MainDiv = styled.div`
-  min-height: calc(100vh - 64px);
-  background-image: url('/images/recommend/bg.svg');
-  background-size: cover;
-  background-repeat: no-repeat;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`
-
-const ContentDiv = styled.div`
-  width: 60%;
-  background: rgba(255, 255, 255, 0.39);
-  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16);
-  border-radius: 40px;
-
-  ${({ theme }) => theme.mediaQueries.sm} {
-    width: 60%;
-  }
-
-  ${({ theme }) => theme.mediaQueries.lg} {
-    width: 60%;
-  }
-  ${({ theme }) => theme.mediaQueries.xs} {
-    width: 90%;
-  }
-`
-
-const Nft: React.FC = () => {
-  //  邀请false普通邀请 true军团长邀请
-  const [type, setType] = useState(false)
-  //  是否连接钱包
-  const [status, setStatus] = useState(true)
-
-  return (
-    <MainDiv>
-      {type ? <RegimentalCom /> : <ContentDiv>{status ? <ConnectedCom /> : <UnunitedCom />}</ContentDiv>}
-    </MainDiv>
-  )
-}
-export default Nft

src/views/Referral/index.tsx

@@ -1,180 +1,47 @@
-/* eslint-disable react-hooks/exhaustive-deps */
+import React, { useState } from 'react'
-/* eslint-disable no-unneeded-ternary */
-import React, { useEffect, useCallback, useState, useRef, useMemo } from 'react'
-import { Button, Heading, CopyToClipboard, Text, Flex } from '@pancakeswap/uikit'
 import styled from 'styled-components'
-import { State } from 'state/types'
+import UnunitedCom from './components/UnunitedCom'
-import { useDispatch, useSelector } from 'react-redux'
+import ConnectedCom from './components/Connected'
-import { useWeb3React } from '@web3-react/core'
+import RegimentalCom from './components/Regimental'
-import { useTranslation } from 'contexts/Localization'
-import PageHeader from 'components/PageHeader'
-import Page from 'components/Layout/Page'
-import { getAddressInviteList } from 'services/referral'
-// import { useInviteHarvest } from 'hooks/useHarvest'
-import { fetchReferralInfoAsync } from 'state/actions'
 
-const Header = styled.div`
+const MainDiv = styled.div`
-  padding: 32px 0px;
+  min-height: calc(100vh - 64px);
-  padding-left: 16px;
+  background-image: url('/images/recommend/bg.svg');
-  padding-right: 16px;
+  background-size: cover;
-  text-align: center;
+  background-repeat: no-repeat;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`
+
+const ContentDiv = styled.div`
+  width: 60%;
+  background: rgba(255, 255, 255, 0.39);
+  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16);
+  border-radius: 40px;
 
   ${({ theme }) => theme.mediaQueries.sm} {
-    padding-left: 24px;
+    width: 60%;
-    padding-right: 24px;
   }
-`
-const PageContainer = styled(Page)`
-  max-width: 600px;
-  margin: 0 auto;
-`
-const LinkContainer = styled.div`
-  border: 1px solid rgb(216, 222, 227);
-  padding: 10px 0px;
-  line-height: 46px;
-  display: flex;
-  text-align: center;
-  flex-direction: column;
-  align-items: center;
-  border-radius: 2px;
-`
-const AddressContainer = styled.div`
-  border: 1px solid rgb(216, 222, 227);
-  margin-top: 20px;
-  text-align: center;
-`
-const AddressTitle = styled.div`
-  border-bottom: 1px solid rgb(216, 222, 227);
-  color: ${({ theme }) => theme.colors.primary};
-  font-size: 18px;
-  padding: 10px 20px;s
-  line-height: 28px;
-  background: rgb(244, 247, 250);
-  font-weight: 600;
-`
-const AddressList = styled.div`
-  font-size: 14px;
-  padding: 10px;
-  line-height: 24px;
-`
-const NoData = styled.div`
-  color: rgb(153, 153, 153);
-`
-const RewardContainer = styled.div`
-  text-align: center;
-  margin-bottom: 20px;
-`
-const SecondText = styled(Text)`
-  white-space: break-spaces;
-`
-const Farms: React.FC = () => {
-  const { t } = useTranslation()
 
-  const dispatch = useDispatch()
+  ${({ theme }) => theme.mediaQueries.lg} {
-  const { account } = useWeb3React()
+    width: 60%;
-  const [inviteList, setInviteList] = useState([])
-  const [loading, setLoading] = useState(false)
-  const inviteInfo = useSelector((state: State) => state.referral.data)
-  const inviteAddress = useMemo(() => {
-    return inviteInfo.InviteCode
-      ? `${window.location.origin}/#/farms?code=${inviteInfo.InviteCode}`
-      : window.location.origin
-  }, [inviteInfo])
-  useEffect(() => {
-    if (account) {
-      getInviteList()
-    } else {
-      setInviteList([])
-    }
-  }, [account])
-  // const { onReward } = useInviteHarvest()
-  const handleWithdraw = async () => {
-    // setLoading(true)
-    // try {
-    //   await onReward()
-    //   dispatch(fetchReferralInfoAsync(account))
-    //   setLoading(false)
-    // } catch (e) {
-    //   setLoading(false)
-    // }
   }
-  const getInviteList = async () => {
+  ${({ theme }) => theme.mediaQueries.xs} {
-    const data: any = await getAddressInviteList({ address: account })
+    width: 90%;
-    setInviteList(data)
   }
+`
+
+const Nft: React.FC = () => {
+  //  邀请false普通邀请 true军团长邀请
+  const [type, setType] = useState(false)
+  //  是否连接钱包
+  const [status, setStatus] = useState(true)
+
   return (
-    <>
+    <MainDiv>
-      <PageHeader>
+      {type ? <RegimentalCom /> : <ContentDiv>{status ? <ConnectedCom /> : <UnunitedCom />}</ContentDiv>}
-        <Flex justifyContent="space-between" flexDirection={['column', null, null, 'row']}>
+    </MainDiv>
-          <Flex flex="1" flexDirection="column" mr={['8px', 0]}>
-            <Heading as="h1" scale="xxl" color="secondary" mb="24px">
-              {t('Referral')}
-            </Heading>
-            <Heading scale="md" color="text">
-              {t('Share referral link and get rewards daily.')}
-            </Heading>
-            <Heading scale="md" color="text">
-              {t('Invite more friends, earn more rewards.')}
-            </Heading>
-          </Flex>
-          <Flex flex="1" height="fit-content" justifyContent="center" alignItems="center" mt={['24px', null, '0']}>
-            {/* <BountyCard /> */}
-          </Flex>
-        </Flex>
-      </PageHeader>
-      {/* <Header>
-        <Heading as="h1" size="xl" color="text" mb="10px" mt="10px">
-          {t('Referral')}
-        </Heading>
-        <Text fontSize="28px" color="text">
-          {t('Share referral link and get rewards daily.')}
-          <br />
-          {t('Invite more friends, earn more rewards.')}
-        </Text>
-      </Header> */}
-      <PageContainer>
-        <RewardContainer>
-          <Text> {t('Total Rewards')}</Text>
-          <Text color="primary" bold fontSize="30px">
-            {inviteInfo.totalReward ? Number(inviteInfo.totalReward).toFixed(5) : '0.00000'}
-          </Text>
-        </RewardContainer>
-        <RewardContainer>
-          <Text> {t('Unclaimed Rewards')}</Text>
-          <Text color="primary" bold fontSize="30px">
-            {inviteInfo.canWithdrawReward ? Number(inviteInfo.canWithdrawReward).toFixed(5) : '0.00000'}
-          </Text>
-          <Button
-            scale="md"
-            disabled={loading || !inviteInfo.canWithdrawReward ? true : false}
-            onClick={handleWithdraw}
-          >
-            {t('Harvest')}
-          </Button>
-        </RewardContainer>
-        <LinkContainer>
-          <Text marginBottom={1} fontSize="20px">
-            {inviteAddress}
-          </Text>
-          <CopyToClipboard toCopy={inviteAddress}> {t('Copy Link')}</CopyToClipboard>
-        </LinkContainer>
-        <AddressContainer>
-          <AddressTitle>{t('Address')}</AddressTitle>
-          <AddressList>
-            {inviteList.length === 0 ? (
-              <NoData>{t('No Data')}</NoData>
-            ) : (
-              inviteList.map((item, index) => (
-                <Text key={item.ID} color="text">
-                  {item.Address}
-                </Text>
-              ))
-            )}
-          </AddressList>
-        </AddressContainer>
-      </PageContainer>
-    </>
   )
 }
-
+export default Nft
-export default Farms