Adding new gauges

package.json

@@ -11,8 +11,8 @@
  "@chakra-ui/toast": "2.1.0",
  "@clover-network/clover-connector": "^1.0.0",
  "@datastructures-js/priority-queue": "6.1.1",
- "@emotion/react": "^11",
- "@emotion/styled": "^11",
+ "@emotion/react": "11.11.1",
+ "@emotion/styled": "11.11.0",
  "@gelatonetwork/limit-orders-lib": "4.3.0-alpha.6",
  "@jcoreio/async-throttle": "^1.4.3",
  "@lifi/sdk": "1.1.3",

src/app/assets/icons/index.tsx

@@ -88,6 +88,10 @@ import { ReactComponent as PeckShieldAudit } from 'app/assets/images/peckShieldA
 import { ReactComponent as ParaSwap } from 'app/assets/images/paraSwap.svg';
 import { ReactComponent as Algebra } from 'app/assets/images/algebra.svg';
 
+import { ReactComponent as V3Icon } from 'app/assets/images/V3Icon.svg';
+import { ReactComponent as V2Icon } from 'app/assets/images/V2Icon.svg';
+import { ReactComponent as X2Icon } from 'app/assets/images/X2Icon.svg';
+
 const { ci, grayDarker, danger, warning } = colors;
 const iconSize = {
  xs: '12px',
@@ -98,6 +102,17 @@ const iconSize = {
 
 const { md } = iconSize;
 
+export const V3IconBadge = ({ w = md, h = md, ...rest }) => {
+ return <Icon {...rest} as={V3Icon} w={w} h={h} />;
+};
+export const X2IconBadge = ({ w = md, h = md, ...rest }) => {
+ return <Icon {...rest} as={X2Icon} w={w} h={h} />;
+};
+
+export const V2IconBadge = ({ w = md, h = md, ...rest }) => {
+ return <Icon {...rest} as={V2Icon} w={w} h={h} />;
+};
+
 export const ZokyoAuditLogo = ({ w = md, h = md, color = ci, ...rest }) => {
  return <Icon {...rest} as={zokyoAudit} color={color} w={w} h={h} />;
 };

src/app/components/NewTokenAmountPanel/NewTokenAmountPanel.tsx

@@ -110,15 +110,16 @@ const NewTokenAmountPanel = ({
  token?.symbol !== 'FTM' ? [token?.address ?? ''] : [WFTM.address],
  token?.chainId ?? 1,
  );
- tokensPrices.forEach(price => {
- if (
- price.address.toLowerCase() === token?.address.toLowerCase() ||
- (token?.symbol === 'FTM' &&
- price.address.toLowerCase() === WFTM.address.toLowerCase())
- ) {
- setTokenPrice(price.rate);
- }
- });
+ tokensPrices &&
+ tokensPrices.forEach(price => {
+ if (
+ price.address.toLowerCase() === token?.address.toLowerCase() ||
+ (token?.symbol === 'FTM' &&
+ price.address.toLowerCase() === WFTM.address.toLowerCase())
+ ) {
+ setTokenPrice(price.rate);
+ }
+ });
  };
 
  fetchTokenPrice();

src/app/components/RangeSelector/RangeSelector.tsx

@@ -1,10 +1,7 @@
 import { Bound } from 'store/v3/mint/actions';
-
 import { RangeSelectorPart } from '../RangeSelectorPart';
-
 import type { Props } from './RangeSelector.d';
 import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
 import { Grid, GridItem, Skeleton } from '@chakra-ui/react';
 import { Heading } from '../Typography';
 import { StyledCurrentPrice, StyledCurrentPriceWrapper } from './styled';
@@ -26,8 +23,6 @@ export default function RangeSelector({
  isAfterPrice,
  mintInfo,
 }: Props) {
- const { t } = useTranslation();
-
  const tokenA = (currencyA ?? undefined)?.wrapped;
  const tokenB = (currencyB ?? undefined)?.wrapped;
 

src/app/components/Select/Select.tsx

@@ -1,8 +1,8 @@
-import React, { FC, useCallback } from 'react';
+import React, { useCallback } from 'react';
 import { Props } from './Select.d';
 import { StyledContainer, StyledHeading, StyledItem } from './styles';
 
-const Select: FC<Props> = ({
+const Select = ({
  labels = [],
  selected = 0,
  disabled = false,

src/app/components/TWAP/TWAPOrders.tsx

@@ -1,7 +1,6 @@
 import { Orders } from '@orbs-network/twap-ui-spiritswap';
 import useWallets from 'app/hooks/useWallets';
 import { useTokens } from 'app/hooks/useTokens';
-import { getProvider } from 'app/connectors/EthersConnector/login';
 import { LimitOrderContainer } from 'app/pages/Swap/components/LimitOrders/styles';
 import { getTokenImageUrl } from '../ImageLogo';
 
@@ -14,9 +13,7 @@ function TWAPOrders({ showChart }: { showChart: boolean }) {
  <Orders
  dappTokens={tokens || []}
  account={account}
- getProvider={async () => {
- return await getProvider();
- }}
+ getProvider={() => window.ethereum}
  getTokenImageUrl={getTokenImageUrl}
  />
  </LimitOrderContainer>

src/app/components/TWAP/TWAPPanel.tsx

@@ -1,5 +1,4 @@
 import { ModalToken } from 'app/components/ModalToken';
-import { getProvider } from 'app/connectors/EthersConnector/login';
 import { useTokens } from 'app/hooks/useTokens';
 import useWallets from 'app/hooks/useWallets';
 import { TWAP } from '@orbs-network/twap-ui-spiritswap';
@@ -29,7 +28,7 @@ function TWAPPanel({ gasPrice, panelProps }: TWAPPanelProps) {
  TokenSelectModal={ModalToken}
  dappTokens={tokens}
  account={account}
- getProvider={getProvider}
+ getProvider={() => window.ethereum}
  getTokenImageUrl={getTokenImageUrl}
  onSrcTokenSelected={(token: Token) =>
  handleChangeToken(token, () => {}, 0)

src/app/components/TransactionFlow/utils/helper.ts

@@ -69,7 +69,7 @@ export const buildAddLiquidity = (
  | AddLiquidityTradeV3
  | null,
  isV2?: boolean,
- type?: number, // classic: 0, stable: 1, concentrated: 2, weighted: 3
+ type?: number, // varible: 0, stable: 1, concentrated: 2, weighted: 3
  isStable?: boolean,
 ): StepProps | {} => {
  let action: Function = addLiquidity;
@@ -91,12 +91,12 @@ export const buildAddLiquidity = (
  }
  }
 
- if (type === 3) {
- action = addWeightedLiquidity;
- if (liquidityTrade) {
- params = Object.values(liquidityTrade);
- }
- }
+ // if (type === 3) {
+ //  action = addWeightedLiquidity;
+ //  if (liquidityTrade) {
+ //  params = Object.values(liquidityTrade);
+ //  }
+ // }
 
  return {
  number,

src/app/connectors/EthersConnector/index.tsx

@@ -19,6 +19,7 @@ import { WorkerCall } from 'types';
 import useWallets from 'app/hooks/useWallets';
 import getNotificationIcon from '../getNotificationIcon';
 import { selectAddress, selectPendingTransactions } from 'store/user/selectors';
+import { ethers } from 'ethers';
 
 const EthersConnector = ({ children }) => {
  const toast = useToast();
@@ -245,7 +246,11 @@ const EthersConnector = ({ children }) => {
  Object.keys(inQueue).forEach(hash => {
  if (!hash) return;
 
- const receiptPromise = provider!.getTransactionReceipt(hash);
+ const newProvider = provider
+ ? new ethers.providers.Web3Provider(provider, 'any')
+ : undefined;
+
+ const receiptPromise = newProvider!.getTransactionReceipt(hash);
 
  const match = pending.find(
  transaction => `${transaction.hash}` === `${hash}`,

src/app/connectors/EthersConnector/login.ts

@@ -69,7 +69,7 @@ const useLogin = () => {
  dispatch(resetUserStatistics());
  }
  } catch (error) {
- console.log(error);
+ console.error(error);
  }
  },
  [dispatch, setLoggedIn],

src/app/hooks/useGetTokensPrices.ts

@@ -27,6 +27,7 @@ const useGetTokensPrices = ({
  try {
  setLoadingPrices(true);
  const data = await getTokensDetails(tokenAddresses, chainId);
+ if (!data) return setTokensPrices({});
  let tokenObjectPrices = {};
  data?.forEach(token => {
  if (token.address === BASE_TOKEN_ADDRESS) {

src/app/hooks/usePieChartData.ts

@@ -87,7 +87,6 @@ const usePieChartData = ({ farmsList }: { farmsList: BoostedFarm[] }) => {
  datasets: [
  {
  data,
-
  borderColor: ['white'],
  borderWidth: 1,
  hoverBorderWidth: 2,

src/app/index.tsx

@@ -42,10 +42,8 @@ export function App() {
  <GlobalStyleProxy />
 
  <Layout>
- <>
- <Layers />
- <SiteRouting />
- </>
+ <Layers />
+ <SiteRouting />
  </Layout>
  </RootPathContext.Provider>
  );

src/app/interfaces/Farm.ts

@@ -207,10 +207,9 @@ export interface GaugeFarm {
 
 export enum FarmType {
  ALL,
- CLASSIC,
+ VARIABLE,
  STABLE,
  CONCENTRATED,
- ADMIN,
 }
 
 export enum EcosystemFarmType {

src/app/pages/Farms/Farm/Farm.tsx

@@ -6,7 +6,6 @@ import { YourApr } from '../components/YourApr';
 import { IconButton } from 'app/components/IconButton';
 import { StyledContainer } from './styles';
 import { ReactComponent as SparklesIcon } from 'app/assets/images/sparkles.svg';
-import { BoostFactor } from '../components/BoostFactor';
 import Web3Monitoring from 'app/connectors/EthersConnector/transactions';
 import { transactionResponse } from 'utils/web3/actions/utils';
 import { checkAddress, formatNumber, getRoundedSFs } from 'app/utils';
@@ -22,7 +21,6 @@ import {
  AccordionPanel,
  Spinner,
  Skeleton,
- Flex,
 } from '@chakra-ui/react';
 import { RetrieveTokens } from '../components/RetrieveTokens/RetrieveTokens';
 import {
@@ -41,7 +39,7 @@ import BigNumber from 'bignumber.js';
 import { formatUnits } from 'ethers/lib/utils';
 import { Props } from './Farm.d';
 import useGetTokensPrices from 'app/hooks/useGetTokensPrices';
-import { LIQUIDITY, resolveRoutePath } from 'app/router/routes';
+import { LIQUIDITY } from 'app/router/routes';
 import { RetrieveConcentratedPosition } from '../components/RetrieveConcentratedPosition/RetrieveConcentratedPosition';
 
 export const Farm = ({
@@ -306,6 +304,7 @@ export const Farm = ({
 
  return earnedRewards;
  }
+ // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [concentratedEarned, concentratedBonusEarned]);
 
  const hasConcenctratedRewards = concentratedEarned || concentratedBonusEarned;

src/app/pages/Farms/FarmController/index.tsx

@@ -44,7 +44,7 @@ const MemorizeTokenList = memo(({ farm }: IFarm) => (
  ecosystem={farm.ecosystem}
  apr={farm.apr}
  rewardToken={farm.rewardToken}
- farmType={farm.type}
+ farmType={farm.label}
  lpAddress={farm.lpAddress}
  type={farm.type}
  hideTypeIcons={Boolean(farm.concentrated)}