diff --git a/pages/sdai.page.tsx b/pages/sdai.page.tsx index 21b2cf182..a2804d79c 100644 --- a/pages/sdai.page.tsx +++ b/pages/sdai.page.tsx @@ -1,21 +1,27 @@ import { Trans } from '@lingui/macro'; -import { Box, Stack, Typography, useMediaQuery, useTheme } from '@mui/material'; +import { Box, Link, Stack, Typography, useMediaQuery, useTheme } from '@mui/material'; import { BigNumber } from 'bignumber.js'; import { useState } from 'react'; import { Disclaimers } from 'src/components/ConnectWalletPaper'; import { ContentContainer } from 'src/components/ContentContainer'; import { ListWrapper } from 'src/components/lists/ListWrapper'; +import { Warning } from 'src/components/primitives/Warning'; import StyledToggleButton from 'src/components/StyledToggleButton'; import StyledToggleButtonGroup from 'src/components/StyledToggleButtonGroup'; +import { PageTitle } from 'src/components/TopInfoPanel/PageTitle'; +import { TopInfoPanel } from 'src/components/TopInfoPanel/TopInfoPanel'; +import { TopInfoPanelItem } from 'src/components/TopInfoPanel/TopInfoPanelItem'; import { ModalWrapper } from 'src/components/transactions/FlowCommons/ModalWrapper'; import { PSMSwapModalContent } from 'src/components/transactions/PSMSwap/PSMSwapModalContent'; import { ConnectWalletButton } from 'src/components/WalletConnection/ConnectWalletButton'; import { useAppDataContext } from 'src/hooks/app-data-provider/useAppDataProvider'; +import { useProtocolDataContext } from 'src/hooks/useProtocolDataContext'; import { MainLayout } from 'src/layouts/MainLayout'; import { useWeb3Context } from 'src/libs/hooks/useWeb3Context'; import { AddTokenToWallet } from 'src/modules/sdai/AddTokenToWallet'; import { SDAIEtherscanLink } from 'src/modules/sdai/SDAIEtherscanLink'; import { SDAITopPanel } from 'src/modules/sdai/SDAITopPanel'; +import { CustomMarket } from 'src/ui-config/marketsConfig'; export default function SDAI() { const { loading: globalLoading, reserves, dsr } = useAppDataContext(); @@ -32,6 +38,41 @@ export default function SDAI() { const paperWidth = isDesktop ? 'calc(50% - 8px)' : '100%'; const { currentAccount } = useWeb3Context(); + const { currentMarket: market, setCurrentMarket } = useProtocolDataContext(); + + if (market !== CustomMarket.proto_spark_v3) { + return ( + <> + + sDAI} + withMarketSwitcher={true} + withMigrateButton={false} + /> + + } + > + + + + sDAI is not available in this market, please switch to{' '} + setCurrentMarket(CustomMarket.proto_spark_v3)} + > + mainnet + + . + + + + + + + ); + } return ( <> diff --git a/public/icons/bridge/gnosis.svg b/public/icons/bridge/gnosis.svg new file mode 100644 index 000000000..b14639633 --- /dev/null +++ b/public/icons/bridge/gnosis.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons/networks/gnosis.png b/public/icons/networks/gnosis.png new file mode 100644 index 000000000..604f6c39a Binary files /dev/null and b/public/icons/networks/gnosis.png differ diff --git a/public/icons/tokens/wxdai.svg b/public/icons/tokens/wxdai.svg new file mode 100644 index 000000000..f9d3533ea --- /dev/null +++ b/public/icons/tokens/wxdai.svg @@ -0,0 +1,121 @@ + + + + + + + + \ No newline at end of file diff --git a/public/icons/tokens/xdai.svg b/public/icons/tokens/xdai.svg new file mode 100644 index 000000000..6cd18d405 --- /dev/null +++ b/public/icons/tokens/xdai.svg @@ -0,0 +1,174 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/components/ContentContainer.tsx b/src/components/ContentContainer.tsx index 8f7e48c08..e4e7fa969 100644 --- a/src/components/ContentContainer.tsx +++ b/src/components/ContentContainer.tsx @@ -2,7 +2,7 @@ import { Box, Container } from '@mui/material'; import { ReactNode } from 'react'; interface ContentContainerProps { - children: ReactNode; + children?: ReactNode; } export const ContentContainer = ({ children }: ContentContainerProps) => { diff --git a/src/components/transactions/Borrow/BorrowModalContent.tsx b/src/components/transactions/Borrow/BorrowModalContent.tsx index 38f0aa5fa..f6af0a2cc 100644 --- a/src/components/transactions/Borrow/BorrowModalContent.tsx +++ b/src/components/transactions/Borrow/BorrowModalContent.tsx @@ -17,6 +17,7 @@ import { useAppDataContext } from 'src/hooks/app-data-provider/useAppDataProvide import { useAssetCaps } from 'src/hooks/useAssetCaps'; import { useModalContext } from 'src/hooks/useModal'; import { useProtocolDataContext } from 'src/hooks/useProtocolDataContext'; +import { useShowAirdropInfo } from 'src/hooks/useShouldShowAirdropInfo'; import { ERC20TokenType } from 'src/libs/web3-data-provider/Web3Provider'; import { getMaxAmountAvailableToBorrow } from 'src/utils/getMaxAmountAvailableToBorrow'; @@ -336,6 +337,9 @@ export const BorrowModalContent = ({ }; export function SpkAirdropNote() { + const showAirdropInfo = useShowAirdropInfo(); + if (!showAirdropInfo) return null; + return ( diff --git a/src/components/transactions/Repay/RepayModalContent.tsx b/src/components/transactions/Repay/RepayModalContent.tsx index 73a4b7485..48dc3471a 100644 --- a/src/components/transactions/Repay/RepayModalContent.tsx +++ b/src/components/transactions/Repay/RepayModalContent.tsx @@ -11,7 +11,7 @@ import { import { Trans } from '@lingui/macro'; import Typography from '@mui/material/Typography'; import BigNumber from 'bignumber.js'; -import React, { useEffect, useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { useAppDataContext } from 'src/hooks/app-data-provider/useAppDataProvider'; import { useModalContext } from 'src/hooks/useModal'; import { useProtocolDataContext } from 'src/hooks/useProtocolDataContext'; diff --git a/src/hooks/useShouldShowAirdropInfo.ts b/src/hooks/useShouldShowAirdropInfo.ts new file mode 100644 index 000000000..0d33c3891 --- /dev/null +++ b/src/hooks/useShouldShowAirdropInfo.ts @@ -0,0 +1,9 @@ +import { CustomMarket } from 'src/ui-config/marketsConfig'; + +import { useProtocolDataContext } from './useProtocolDataContext'; + +export const useShowAirdropInfo = () => { + const { currentMarket } = useProtocolDataContext(); + + return currentMarket === CustomMarket.proto_spark_v3; +}; diff --git a/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListItem.tsx b/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListItem.tsx index 927659d5d..0d999b26b 100644 --- a/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListItem.tsx +++ b/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListItem.tsx @@ -2,6 +2,7 @@ import { Trans } from '@lingui/macro'; import { Button } from '@mui/material'; import { useModalContext } from 'src/hooks/useModal'; import { useProtocolDataContext } from 'src/hooks/useProtocolDataContext'; +import { useShowAirdropInfo } from 'src/hooks/useShouldShowAirdropInfo'; import { DashboardReserve } from 'src/utils/dashboardSortUtils'; import { CapsHint } from '../../../../components/caps/CapsHint'; @@ -90,7 +91,27 @@ export const BorrowAssetsListItem = ({ ); }; -export function SpkAirdropNoteInline({ tokenAmount }: { tokenAmount: number }) { +export function SpkAirdropNoteInline({ + tokenAmount, + Wrapper, +}: { + tokenAmount: number; + Wrapper?: React.ComponentType | React.ReactElement | null; +}) { + const showAirdropInfo = useShowAirdropInfo(); + + if (!showAirdropInfo) return null; + + return typeof Wrapper === 'function' ? ( + + + + ) : ( + + ); +} + +const AirdropNote = ({ tokenAmount }: { tokenAmount: number }) => { return ( {tokenAmount}M SPKāš” Airdrop ); -} +}; diff --git a/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListMobileItem.tsx b/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListMobileItem.tsx index b6dd2d730..feb87c319 100644 --- a/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListMobileItem.tsx +++ b/src/modules/dashboard/lists/BorrowAssetsList/BorrowAssetsListMobileItem.tsx @@ -78,9 +78,10 @@ export const BorrowAssetsListMobileItem = ({ {symbol === 'DAI' && ( - - - + } + /> )} {reserve.symbol === 'DAI' && ( - - - + } + /> )} diff --git a/src/modules/dashboard/lists/SuppliedPositionsList/SuppliedPositionsListMobileItem.tsx b/src/modules/dashboard/lists/SuppliedPositionsList/SuppliedPositionsListMobileItem.tsx index 1018cbf18..e29e798fe 100644 --- a/src/modules/dashboard/lists/SuppliedPositionsList/SuppliedPositionsListMobileItem.tsx +++ b/src/modules/dashboard/lists/SuppliedPositionsList/SuppliedPositionsListMobileItem.tsx @@ -68,9 +68,10 @@ export const SuppliedPositionsListMobileItem = ({ /> {(reserve.symbol === 'ETH' || reserve.symbol === 'WETH') && ( - - - + } + /> )} {(symbol === 'ETH' || symbol === 'WETH') && ( - - - + } + /> )} {reserve.symbol === 'DAI' && ( - - - + } + tokenAmount={24} + /> )} {(reserve.symbol === 'ETH' || reserve.symbol === 'WETH') && ( - - - + } + tokenAmount={6} + /> )}