Iamoskvin/rewards page (#277)

* rewards v2 phase 1 added * fee apr and total apr included to rewards * filtered unique pools based on APR * removed log * ui fixes * replace rewards api * default chain id * fix APR calc * fix disabled wallet issue * start with loading is true * parallel requests for allocation data * manually picking Vinay's 61b8e69 --------- Co-authored-by: Vinay Singh <[email protected]>
jediswaplabs · May 20, 2024 · 18df8c7 · 18df8c7
1 parent 4258be3
commit 18df8c7
Show file tree

Hide file tree

Showing 19 changed files with 1,205 additions and 65 deletions.
diff --git a/src/abis/strk-rewards.json b/src/abis/strk-rewards.json
@@ -0,0 +1,197 @@
+[
+  {
+    "name": "Distributor",
+    "type": "impl",
+    "interface_name": "distributor::contract::IDistributor"
+  },
+  {
+    "name": "core::array::Span::<core::felt252>",
+    "type": "struct",
+    "members": [
+      {
+        "name": "snapshot",
+        "type": "@core::array::Array::<core::felt252>"
+      }
+    ]
+  },
+  {
+    "name": "distributor::contract::IDistributor",
+    "type": "interface",
+    "items": [
+      {
+        "name": "claim",
+        "type": "function",
+        "inputs": [
+          {
+            "name": "amount",
+            "type": "core::integer::u128"
+          },
+          {
+            "name": "proof",
+            "type": "core::array::Span::<core::felt252>"
+          }
+        ],
+        "outputs": [],
+        "state_mutability": "external"
+      },
+      {
+        "name": "add_root",
+        "type": "function",
+        "inputs": [
+          {
+            "name": "new_root",
+            "type": "core::felt252"
+          }
+        ],
+        "outputs": [],
+        "state_mutability": "external"
+      },
+      {
+        "name": "get_root_for",
+        "type": "function",
+        "inputs": [
+          {
+            "name": "claimee",
+            "type": "core::starknet::contract_address::ContractAddress"
+          },
+          {
+            "name": "amount",
+            "type": "core::integer::u128"
+          },
+          {
+            "name": "proof",
+            "type": "core::array::Span::<core::felt252>"
+          }
+        ],
+        "outputs": [
+          {
+            "type": "core::felt252"
+          }
+        ],
+        "state_mutability": "view"
+      },
+      {
+        "name": "amount_already_claimed",
+        "type": "function",
+        "inputs": [
+          {
+            "name": "claimee",
+            "type": "core::starknet::contract_address::ContractAddress"
+          }
+        ],
+        "outputs": [
+          {
+            "type": "core::integer::u128"
+          }
+        ],
+        "state_mutability": "view"
+      },
+      {
+        "name": "roots",
+        "type": "function",
+        "inputs": [],
+        "outputs": [
+          {
+            "type": "core::array::Span::<core::felt252>"
+          }
+        ],
+        "state_mutability": "view"
+      }
+    ]
+  },
+  {
+    "name": "constructor",
+    "type": "constructor",
+    "inputs": [
+      {
+        "name": "owner",
+        "type": "core::starknet::contract_address::ContractAddress"
+      }
+    ]
+  },
+  {
+    "kind": "struct",
+    "name": "distributor::contract::Distributor::Claimed",
+    "type": "event",
+    "members": [
+      {
+        "kind": "data",
+        "name": "claimee",
+        "type": "core::starknet::contract_address::ContractAddress"
+      },
+      {
+        "kind": "data",
+        "name": "amount",
+        "type": "core::integer::u128"
+      }
+    ]
+  },
+  {
+    "kind": "struct",
+    "name": "openzeppelin::access::ownable::ownable::OwnableComponent::OwnershipTransferred",
+    "type": "event",
+    "members": [
+      {
+        "kind": "key",
+        "name": "previous_owner",
+        "type": "core::starknet::contract_address::ContractAddress"
+      },
+      {
+        "kind": "key",
+        "name": "new_owner",
+        "type": "core::starknet::contract_address::ContractAddress"
+      }
+    ]
+  },
+  {
+    "kind": "struct",
+    "name": "openzeppelin::access::ownable::ownable::OwnableComponent::OwnershipTransferStarted",
+    "type": "event",
+    "members": [
+      {
+        "kind": "key",
+        "name": "previous_owner",
+        "type": "core::starknet::contract_address::ContractAddress"
+      },
+      {
+        "kind": "key",
+        "name": "new_owner",
+        "type": "core::starknet::contract_address::ContractAddress"
+      }
+    ]
+  },
+  {
+    "kind": "enum",
+    "name": "openzeppelin::access::ownable::ownable::OwnableComponent::Event",
+    "type": "event",
+    "variants": [
+      {
+        "kind": "nested",
+        "name": "OwnershipTransferred",
+        "type": "openzeppelin::access::ownable::ownable::OwnableComponent::OwnershipTransferred"
+      },
+      {
+        "kind": "nested",
+        "name": "OwnershipTransferStarted",
+        "type": "openzeppelin::access::ownable::ownable::OwnableComponent::OwnershipTransferStarted"
+      }
+    ]
+  },
+  {
+    "kind": "enum",
+    "name": "distributor::contract::Distributor::Event",
+    "type": "event",
+    "variants": [
+      {
+        "kind": "nested",
+        "name": "Claimed",
+        "type": "distributor::contract::Distributor::Claimed"
+      },
+      {
+        "kind": "nested",
+        "name": "OwnableEvent",
+        "type": "openzeppelin::access::ownable::ownable::OwnableComponent::Event"
+      }
+    ]
+  }
+]
diff --git a/src/apollo/queries.js b/src/apollo/queries.js
@@ -43,7 +43,6 @@ const PoolFields = `
     fee
   }
 `
-
 export const TOKENS_DATA = ({ tokenIds = [] }) => {
   const tokenString = `[${tokenIds.map((token) => `"${token}"`).join(',')}]`
 
@@ -98,4 +97,4 @@ export const STRK_REWARDS_DATA = () => {
       strkGrantData
     }`
   return gql(queryString)
-}
+}
diff --git a/src/components/DoubleLogo/index.tsx b/src/components/DoubleLogo/index.tsx
@@ -22,7 +22,7 @@ const HigherLogoWrapper = styled.div`
 `
 const CoveredLogoWapper = styled.div<{ sizeraw: number }>`
   position: absolute;
-  left: ${({ sizeraw }) => '-' + (sizeraw / 2).toString() + 'px'} !important;
+  right: ${({ sizeraw }) => '-' + (sizeraw / 2).toString() + 'px'} !important;
 `
 
 export default function DoubleCurrencyLogo({

diff --git a/src/components/Logo/AssetLogo.tsx b/src/components/Logo/AssetLogo.tsx
@@ -65,7 +65,7 @@ const StyledEthereumLogo = styled.img<{ size: number }>`
 
 const CurrencyLogo = ({ currency, symbol, size }: { currency: any; symbol: any; size: any }) => {
   const currencyLogo: any = currency
-  if (currencyLogo && (currencyLogo.name === 'ETHER' || currencyLogo.name === 'ETH')) {
+  if (currencyLogo && (currencyLogo.name === 'ETHER' || currencyLogo.name === 'ETH' || symbol === 'ETH')) {
     return <StyledEthereumLogo src={EthereumLogo} alt={`${symbol ?? 'token'} logo`} size={size} loading="lazy" />
   } else if (currencyLogo && currencyLogo.logoURI) {
     return (

diff --git a/src/components/Logo/CurrencyLogo.tsx b/src/components/Logo/CurrencyLogo.tsx
@@ -5,14 +5,14 @@ import AssetLogo, { AssetLogoBaseProps } from './AssetLogo'
 
 export default function CurrencyLogo(
   props: AssetLogoBaseProps & {
-    currency?: Currency
+    currency?: any
   }
 ) {
   return (
     <AssetLogo
       isNative={props.currency?.isNative}
       chainId={props.currency?.chainId}
-      address={props.currency?.wrapped.address}
+      address={props.currency?.wrapped?.address ?? props.currency?.tokenAddress}
       symbol={props.symbol ?? props.currency?.symbol}
       // backupImg={(props.currency as Token)?.logoURI}
       {...props}

diff --git a/src/components/NavBar/index.tsx b/src/components/NavBar/index.tsx
@@ -55,6 +55,9 @@ export const PageTabs = () => {
       <ExternalMenuItemLink to="https://app.v1.jediswap.xyz/">
         <Trans>V1</Trans>
       </ExternalMenuItemLink>
+      <MenuItemLink to="/rewards" isActive={pathname.startsWith('/rewards')}>
+        <Trans>Rewards</Trans>
+      </MenuItemLink>
     </>
   )
 }

diff --git a/src/components/TransactionConfirmationModal/index.tsx b/src/components/TransactionConfirmationModal/index.tsx
@@ -2,7 +2,7 @@ import { t, Trans } from '@lingui/macro'
 import { ChainId, Currency } from '@vnaysn/jediswap-sdk-core'
 import { useAccountDetails } from 'hooks/starknet-react'
 import { ReactNode, useCallback, useState } from 'react'
-import { AlertCircle, ArrowUpCircle, CheckCircle } from 'react-feather'
+import { AlertCircle, AlertTriangle, ArrowUpCircle, CheckCircle } from 'react-feather'
 import styled, { useTheme } from 'styled-components'
 
 import Badge from 'components/Badge'
@@ -20,6 +20,7 @@ import { AutoColumn, ColumnCenter } from '../Column'
 import Modal from '../Modal'
 import Row, { RowBetween, RowFixed } from '../Row'
 import AnimatedConfirmation from './AnimatedConfirmation'
+import { colors } from 'theme/colors'
 
 const Wrapper = styled.div`
   background-color: ${({ theme }) => theme.surface1};
@@ -42,6 +43,26 @@ const ConfirmationModalContentWrapper = styled(AutoColumn)`
   padding-bottom: 12px;
 `
 
+export function TransactionErrorContent({ message, onDismiss }: { message: string; onDismiss: () => void }) {
+  return (
+    <Wrapper>
+      <AutoColumn gap="md">
+        <RowBetween>
+          <ThemedText.SubHeaderLarge textAlign="center"> Error</ThemedText.SubHeaderLarge>
+          <CloseIcon onClick={onDismiss} />
+        </RowBetween>
+        <AutoColumn style={{ marginTop: 20, padding: '2rem 0' }} gap="24px" justify="center">
+          <AlertTriangle color={colors.red100} style={{ strokeWidth: 1.5 }} size={64} />
+          <ThemedText.BodySecondary textAlign="center">{message}</ThemedText.BodySecondary>
+        </AutoColumn>
+      </AutoColumn>
+      <BottomSection gap="12px">
+        <ButtonPrimary onClick={onDismiss}>Dismiss</ButtonPrimary>
+      </BottomSection>
+    </Wrapper>
+  )
+}
+
 function ConfirmationPendingContent({
   onDismiss,
   pendingText,
@@ -92,29 +113,6 @@ function TransactionSubmittedContent({
   inline?: boolean // not in modal
 }) {
   const theme = useTheme()
-
-  const { connector } = useAccountDetails()
-
-  const token = currencyToAdd?.wrapped
-  const logoURL = useCurrencyLogoURIs(token)[0]
-
-  const [success, setSuccess] = useState<boolean | undefined>()
-
-  // const addToken = useCallback(() => {
-  //   if (!token?.symbol || !connector.watchAsset) {
-  //     return
-  //   }
-  //   connector
-  //     .watchAsset({
-  //       address: token.address,
-  //       symbol: token.symbol,
-  //       decimals: token.decimals,
-  //       image: logoURL,
-  //     })
-  //     .then(() => setSuccess(true))
-  //     .catch(() => setSuccess(false))
-  // }, [connector, logoURL, token])
-
   const explorerText = chainId === ChainId.MAINNET ? t`View on  Starkscan` : t`View on Block Explorer`
 
   return (

diff --git a/src/constants/tokens.ts b/src/constants/tokens.ts
@@ -26,6 +26,16 @@ export function nativeOnChain(chainId: ChainId): NativeCurrency | Token {
   return (cachedNativeCurrency[chainId] = WETH[chainId])
 }
 
+export const getStarkRewardAddress = (chainId: ChainId) => {
+  return chainId === ChainId.MAINNET
+    ? '0x027dee8c8c7f28d67bc771afe0c786bfb59d78f0e1ce303a86006b91b98dc3cf'
+    : '0x01ba23f54ae0f830068314e8d3e9d3623e83ced3832d20ac61f598a969425747'
+}
+
+export const STARKNET_REWARDS_API_URL =
+  'https://kx58j6x5me.execute-api.us-east-1.amazonaws.com//starknet/fetchFile?file=qa_strk_grant.json'
+export const STRK_PRICE_API_URL = 'https://api.binance.com/api/v3/ticker/price?symbol=STRKUSDT'
+
 export const POOL_CLASS_HASH = {
   [ChainId.MAINNET]: '0x2cd3c16a0112b22ded4903707f268125fcf46fd7733761e62c13fc0157afd8d',
   [ChainId.GOERLI]: '0x2cd3c16a0112b22ded4903707f268125fcf46fd7733761e62c13fc0157afd8d',

diff --git a/src/pages/AddLiquidity/index.tsx b/src/pages/AddLiquidity/index.tsx
@@ -75,7 +75,7 @@ import { useQuery } from 'react-query'
 import { getClient } from 'apollo/client'
 import { TOKENS_DATA } from 'apollo/queries'
 import { isAddressValidForStarknet } from 'utils/addresses'
-import findClosestPrice from 'utils/getClosestPrice'
+import { findClosestPrice } from 'utils/getClosest'
 
 const DEFAULT_ADD_IN_RANGE_SLIPPAGE_TOLERANCE = new Percent(50, 10_000)
 

diff --git a/src/pages/App.tsx b/src/pages/App.tsx
@@ -7,13 +7,7 @@ import styled from 'styled-components'
 import ErrorBoundary from 'components/ErrorBoundary'
 import Loader from 'components/Icons/LoadingSpinner'
 import NavBar, { PageTabs } from 'components/NavBar'
-import { FeatureFlag, useFeatureFlagsIsLoaded } from 'featureFlags'
-import { useUniswapXDefaultEnabled } from 'featureFlags/flags/uniswapXDefault'
-import { shouldDisableNFTRoutesAtom } from 'state/application/atoms'
-import { useAppSelector } from 'state/hooks'
-import { AppState } from 'state/reducer'
-import { RouterPreference } from 'state/routing/types'
-import { useRouterPreference, useUserOptedOutOfUniswapX } from 'state/user/hooks'
+import { useFeatureFlagsIsLoaded } from 'featureFlags'
 import { flexRowNoWrap } from 'theme/styles'
 import { Z_INDEX } from 'theme/zIndex'
 import { RouteDefinition, routes, useRouterConfig } from './RouteDefinitions'

diff --git a/src/pages/Pool/PositionPage.tsx b/src/pages/Pool/PositionPage.tsx
@@ -172,7 +172,7 @@ const NFTImage = styled.img`
 import { useQuery } from 'react-query'
 import { getClient, jediSwapClient } from 'apollo/client'
 import { TOKENS_DATA } from 'apollo/queries'
-import findClosestPrice from 'utils/getClosestPrice'
+import { findClosestPrice } from 'utils/getClosest'
 
 function CurrentPriceCard({
   inverted,
@@ -862,7 +862,7 @@ function PositionPageContent() {
                       padding="6px 8px"
                       width="fit-content"
                       $borderRadius="12px"
-                      style={{color: theme.jediWhite}}
+                      style={{ color: theme.jediWhite }}
                     >
                       <Trans>Remove liquidity</Trans>
                     </ButtonGray>