diff --git a/src/components/ClassicElasticTab.tsx b/src/components/ClassicElasticTab.tsx
index ad8bed9727..dde42e3db3 100644
--- a/src/components/ClassicElasticTab.tsx
+++ b/src/components/ClassicElasticTab.tsx
@@ -2,13 +2,15 @@ import { ChainId } from '@kyberswap/ks-sdk-core'
import { Trans } from '@lingui/macro'
import { rgba } from 'polished'
import { stringify } from 'querystring'
-import { useEffect } from 'react'
+import { useEffect, useState } from 'react'
import { isMobile } from 'react-device-detect'
import { useLocation, useNavigate } from 'react-router-dom'
import { useMedia } from 'react-use'
import { Flex, Text } from 'rebass'
import { ReactComponent as DropdownSVG } from 'assets/svg/down.svg'
+import ElasticHackedModal from 'components/ElasticHackedModal'
+import { APP_PATHS } from 'constants/index'
import { CLASSIC_NOT_SUPPORTED, ELASTIC_NOT_SUPPORTED } from 'constants/networks'
import { VERSION } from 'constants/v2'
import { useActiveWeb3React } from 'hooks'
@@ -28,12 +30,12 @@ function ClassicElasticTab() {
const shouldShowFarmTab = !!farmPositions.length || !!claimInfo
const shouldShowPositionTab = !!positions.length
- const { tab: tabQS = VERSION.ELASTIC, ...qs } = useParsedQueryString<{ tab: string }>()
+ const { tab: tabQS = VERSION.ELASTIC, skipAlert, ...qs } = useParsedQueryString<{ tab: string }>()
const tab = isInEnum(tabQS, VERSION) ? tabQS : VERSION.ELASTIC
const { chainId } = useActiveWeb3React()
- const notSupportedMsg = ELASTIC_NOT_SUPPORTED[chainId]
+ const notSupportedElasticMsg = ELASTIC_NOT_SUPPORTED[chainId]
const notSupportedClassicMsg = CLASSIC_NOT_SUPPORTED[chainId]
@@ -41,14 +43,28 @@ function ClassicElasticTab() {
const location = useLocation()
const navigate = useNavigate()
- const isFarmpage = location.pathname.includes('/farms')
+ const isFarmPage = location.pathname.startsWith(APP_PATHS.FARMS)
+ const isMyPoolPage = location.pathname.startsWith(APP_PATHS.MY_POOLS)
+ const [isOpenElasticHacked, setOpenElasticHacked] = useState(
+ tab === VERSION.ELASTIC && !notSupportedElasticMsg && !skipAlert,
+ )
+
+ useEffect(() => {
+ if (notSupportedClassicMsg) {
+ setOpenElasticHacked(!skipAlert)
+ }
+ if (tab === VERSION.ELASTIC && !notSupportedElasticMsg) {
+ setOpenElasticHacked(!skipAlert)
+ }
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [chainId])
const upToMedium = useMedia(`(max-width: ${MEDIA_WIDTHS.upToMedium}px)`)
const dontShowLegacy = [ChainId.ZKEVM, ChainId.BASE, ChainId.LINEA, ChainId.SCROLL].includes(chainId)
const showLegacyExplicit =
- upToMedium || dontShowLegacy ? false : isFarmpage ? shouldShowFarmTab : shouldShowPositionTab
+ upToMedium || dontShowLegacy ? false : isFarmPage ? shouldShowFarmTab : shouldShowPositionTab
useEffect(() => {
if (dontShowLegacy && tab === VERSION.ELASTIC_LEGACY) {
@@ -77,13 +93,13 @@ function ClassicElasticTab() {
const handleSwitchTab = (version: VERSION) => {
if (!!notSupportedClassicMsg && version === VERSION.CLASSIC) return
- if (!!notSupportedMsg && version !== VERSION.CLASSIC) return
+ if (!!notSupportedElasticMsg && version !== VERSION.CLASSIC) return
const newQs = { ...qs, tab: version }
navigate({ search: stringify(newQs) }, { replace: true })
}
const getColorOfElasticTab = () => {
- if (!!notSupportedMsg) {
+ if (!!notSupportedElasticMsg) {
return theme.disableText
}
@@ -114,7 +130,7 @@ function ClassicElasticTab() {
}
const getColorOfLegacyElasticTab = () => {
- if (!!notSupportedMsg) {
+ if (!!notSupportedElasticMsg) {
return theme.disableText
}
@@ -128,11 +144,11 @@ function ClassicElasticTab() {
if (!!notSupportedClassicMsg && tab === VERSION.CLASSIC) {
const newQs = { ...qs, tab: VERSION.ELASTIC }
navigate({ search: stringify(newQs) }, { replace: true })
- } else if (!!notSupportedMsg && tab !== VERSION.CLASSIC) {
+ } else if (!!notSupportedElasticMsg && tab !== VERSION.CLASSIC) {
const newQs = { ...qs, tab: VERSION.CLASSIC }
navigate({ search: stringify(newQs) }, { replace: true })
}
- }, [navigate, notSupportedMsg, notSupportedClassicMsg, qs, tab])
+ }, [navigate, notSupportedElasticMsg, notSupportedClassicMsg, qs, tab])
return (
@@ -144,7 +160,7 @@ function ClassicElasticTab() {
? ''
: tab === VERSION.CLASSIC && notSupportedClassicMsg
? notSupportedClassicMsg
- : notSupportedMsg ||
+ : notSupportedElasticMsg ||
(!showLegacyExplicit ? (
handleSwitchTab(VERSION.ELASTIC)}
>
- {isFarmpage ? Elastic Farms : Elastic Pools}
+ {isFarmPage ? Elastic Farms : Elastic Pools}
handleSwitchTab(VERSION.ELASTIC_LEGACY)}
>
- {isFarmpage ? Elastic Farms : Elastic Pools}
+ {isFarmPage ? Elastic Farms : Elastic Pools}
{legacyTag(true)}
@@ -192,10 +208,10 @@ function ClassicElasticTab() {
marginLeft="4px"
role="button"
style={{
- cursor: !!notSupportedMsg ? 'not-allowed' : 'pointer',
+ cursor: !!notSupportedElasticMsg ? 'not-allowed' : 'pointer',
}}
>
- {isFarmpage ? Elastic Farms : Elastic Pools}
+ {isFarmPage ? Elastic Farms : Elastic Pools}
{!showLegacyExplicit && tab === VERSION.ELASTIC_LEGACY && legacyTag()}
@@ -209,7 +225,7 @@ function ClassicElasticTab() {
{showLegacyExplicit && (
<>
-
+
- {isFarmpage ? Elastic Farms : Elastic Pools}
+ {isFarmPage ? Elastic Farms : Elastic Pools}
{legacyTag()}
@@ -257,10 +273,26 @@ function ClassicElasticTab() {
style={{ cursor: 'pointer' }}
role="button"
>
- {isFarmpage ? Classic Farms : Classic Pools}
+ {isFarmPage ? Classic Farms : Classic Pools}
+
+ {
+ setOpenElasticHacked(false)
+ if (!isMyPoolPage) {
+ handleSwitchTab(VERSION.CLASSIC)
+ }
+ }}
+ onConfirm={() => {
+ setOpenElasticHacked(false)
+ if (!isMyPoolPage) {
+ navigate({ pathname: APP_PATHS.MY_POOLS, search: 'skipAlert=1' })
+ }
+ }}
+ />
)
}
diff --git a/src/components/ElasticHackedModal.tsx b/src/components/ElasticHackedModal.tsx
new file mode 100644
index 0000000000..6cc1eb234b
--- /dev/null
+++ b/src/components/ElasticHackedModal.tsx
@@ -0,0 +1,63 @@
+import { Trans } from '@lingui/macro'
+import { Info, X } from 'react-feather'
+import { Flex, Text } from 'rebass'
+import styled from 'styled-components'
+
+import { ButtonConfirmed, ButtonOutlined } from 'components/Button'
+import Modal from 'components/Modal'
+import useTheme from 'hooks/useTheme'
+
+const StyledCloseIcon = styled(X)`
+ height: 20px;
+ width: 20px;
+ :hover {
+ cursor: pointer;
+ }
+
+ > * {
+ stroke: ${({ theme }) => theme.text};
+ }
+`
+
+type Props = {
+ isOpen: boolean
+ onClose?: () => void
+ onConfirm?: () => void
+}
+
+const ElasticHackedModal = ({ isOpen, onClose, onConfirm }: Props) => {
+ const theme = useTheme()
+
+ return (
+
+
+
+
+
+
+
+
+
+ Attention
+
+
+
+ Adding liquidity to Elastic Pools and staking in Elastic Farms is temporarily unavailable. Kindly visit
+ "My Pool" for prompt removal of your liquidity.
+
+
+
+
+
+ Close
+
+
+ Go to My Pool
+
+
+
+
+ )
+}
+
+export default ElasticHackedModal
diff --git a/src/components/SearchModal/CurrencyList.tsx b/src/components/SearchModal/CurrencyList.tsx
index ab01f45f91..160aad28da 100644
--- a/src/components/SearchModal/CurrencyList.tsx
+++ b/src/components/SearchModal/CurrencyList.tsx
@@ -266,7 +266,6 @@ function CurrencyList({
style={{ ...style, ...itemStyle }}
currency={currency}
currencyBalance={currencyBalance}
- customBalance={}
isSelected={isSelected}
showFavoriteIcon={showFavoriteIcon}
onSelect={onCurrencySelect}
diff --git a/src/pages/NotificationCenter/CreateAlert/CreateAlertForm.tsx b/src/pages/NotificationCenter/CreateAlert/CreateAlertForm.tsx
index 1656c06bd6..54f76caae6 100644
--- a/src/pages/NotificationCenter/CreateAlert/CreateAlertForm.tsx
+++ b/src/pages/NotificationCenter/CreateAlert/CreateAlertForm.tsx
@@ -211,6 +211,13 @@ export default function CreateAlert({
)}
+ optionRender={item => {
+ return (
+
+ {item?.label}
+
+ )
+ }}
/>