diff --git a/src/components/NavBar/WarningBanner.tsx b/src/components/NavBar/WarningBanner.tsx
new file mode 100644
index 00000000..c16e9c35
--- /dev/null
+++ b/src/components/NavBar/WarningBanner.tsx
@@ -0,0 +1,64 @@
+import { t, Trans } from '@lingui/macro'
+import { useOpenModal } from 'state/application/hooks'
+import { ApplicationModal } from 'state/application/reducer'
+import styled from 'styled-components'
+import { ButtonText, ThemedText } from 'theme/components'
+import { Z_INDEX } from 'theme/zIndex'
+
+export const UK_BANNER_HEIGHT = 65
+export const UK_BANNER_HEIGHT_MD = 113
+export const UK_BANNER_HEIGHT_SM = 137
+
+const BannerWrapper = styled.div`
+ position: relative;
+ display: flex;
+ background-color: #ff3257;
+ padding: 20px;
+ border-bottom: 1px solid ${({ theme }) => theme.surface3};
+ z-index: ${Z_INDEX.fixed};
+ box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+
+ @media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.md}px`}) {
+ flex-direction: column;
+ }
+`
+
+const BannerTextWrapper = styled(ThemedText.BodySecondary)`
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ color: white;
+ width: 100%;
+ text-align: center;
+
+ @media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.md}px`}) {
+ @supports (-webkit-line-clamp: 2) {
+ white-space: initial;
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ }
+ }
+
+ @media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.sm}px`}) {
+ @supports (-webkit-line-clamp: 3) {
+ white-space: initial;
+ display: -webkit-box;
+ -webkit-line-clamp: 3;
+ -webkit-box-orient: vertical;
+ }
+ }
+`
+
+export const bannerText =
+ 'Warning: Deposit liquidity is currently paused in v2. No swap will route through v2 pools. We recommend you remove the liquidity from Jediswap v2.'
+
+export function WarningBanner() {
+ return (
+
+ {bannerText}
+
+ )
+}
diff --git a/src/pages/AddLiquidity/index.tsx b/src/pages/AddLiquidity/index.tsx
index 6eb28578..35e045e9 100644
--- a/src/pages/AddLiquidity/index.tsx
+++ b/src/pages/AddLiquidity/index.tsx
@@ -101,12 +101,10 @@ function AddLiquidity() {
}>()
const { address: account, chainId } = useAccountDetails()
const theme = useTheme()
- const trace = useTrace()
-
const toggleWalletDrawer = useToggleAccountDrawer() // toggle wallet when disconnected
- const addTransaction = useTransactionAdder()
const positionManager = useV3NFTPositionManagerContract()
const parsedTokenId = tokenId ? parseInt(tokenId) : undefined
+
// check for existing position if tokenId in url
const { position: existingPositionDetails, loading: positionLoading } = useV3PosFromTokenId(parsedTokenId)
const hasExistingPosition = !!existingPositionDetails && !positionLoading
@@ -124,6 +122,9 @@ function AddLiquidity() {
// mint state
const { independentField, typedValue, startPriceTypedValue } = useV3MintState()
+ const [showWarning, setShowWarning] = useState(true)
+ const [mintCallData, setMintCallData] = useState([])
+
const {
pool,
ticks,
@@ -157,8 +158,6 @@ function AddLiquidity() {
const { onFieldAInput, onFieldBInput, onLeftRangeInput, onRightRangeInput, onStartPriceInput } =
useV3MintActionHandlers(noLiquidity)
- const [mintCallData, setMintCallData] = useState([])
-
const { writeAsync, data: txData } = useContractWrite({
calls: mintCallData,
})
@@ -504,10 +503,12 @@ function AddLiquidity() {
onClick={() => {
setShowConfirm(true)
}}
- disabled={!isValid}
+ disabled={!isValid || showWarning}
error={!isValid && !!parsedAmounts[Field.CURRENCY_A] && !!parsedAmounts[Field.CURRENCY_B]}
>
- {errorMessage ? errorMessage : Preview}
+
+ {showWarning ? 'Add liquidity is paused' : errorMessage ? errorMessage : Preview}
+
)
diff --git a/src/pages/App.tsx b/src/pages/App.tsx
index 142b32ee..fbe42fc1 100644
--- a/src/pages/App.tsx
+++ b/src/pages/App.tsx
@@ -18,6 +18,12 @@ import { flexRowNoWrap } from 'theme/styles'
import { Z_INDEX } from 'theme/zIndex'
import { RouteDefinition, routes, useRouterConfig } from './RouteDefinitions'
import useFetchAllPairsCallback from 'hooks/useFetchAllPairs'
+import {
+ UK_BANNER_HEIGHT,
+ UK_BANNER_HEIGHT_MD,
+ UK_BANNER_HEIGHT_SM,
+ WarningBanner,
+} from 'components/NavBar/WarningBanner'
// import Footer from 'components/Footer'
const BodyWrapper = styled.div<{ bannerIsVisible?: boolean }>`
@@ -61,7 +67,11 @@ const MobileBottomBar = styled.div`
}
`
-const HeaderWrapper = styled.div<{ transparent?: boolean; bannerIsVisible?: boolean; scrollY: number }>`
+const HeaderWrapper = styled.div<{
+ transparent?: boolean
+ bannerIsVisible?: boolean
+ scrollY: number
+}>`
${flexRowNoWrap};
background-color: transparent;
border-bottom: ${({ theme }) => `1px solid ${theme.surface3}`};
@@ -69,7 +79,7 @@ const HeaderWrapper = styled.div<{ transparent?: boolean; bannerIsVisible?: bool
width: 100%;
justify-content: space-between;
position: fixed;
- top: 0;
+ top: ${({ bannerIsVisible }) => (bannerIsVisible ? Math.max(UK_BANNER_HEIGHT - scrollY, 0) : 0)}px;
z-index: ${Z_INDEX.dropdown};
transition-property: background-color;
transition-duration: ${({ theme }) => theme.transition.duration.fast};
@@ -77,11 +87,11 @@ const HeaderWrapper = styled.div<{ transparent?: boolean; bannerIsVisible?: bool
font-family: 'Avenir LT Std';
@media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.md}px`}) {
- top: 0;
+ top: ${({ bannerIsVisible }) => (bannerIsVisible ? Math.max(UK_BANNER_HEIGHT_MD - scrollY, 0) : 0)}px;
}
@media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.sm}px`}) {
- top: 0;
+ top: ${({ bannerIsVisible }) => (bannerIsVisible ? Math.max(UK_BANNER_HEIGHT_SM - scrollY, 0) : 0)}px;
}
`
@@ -93,6 +103,7 @@ export default function App() {
const { pathname } = location
const [scrollY, setScrollY] = useState(0)
+ const [showWarning, setShowWarning] = useState(true)
const scrolledState = scrollY > 0
const routerConfig = useRouterConfig()
@@ -117,7 +128,8 @@ export default function App() {
return (
-
+ {showWarning && }
+
diff --git a/src/pages/RemoveLiquidity/V3.tsx b/src/pages/RemoveLiquidity/V3.tsx
index e5a93ebd..3b1d6c00 100644
--- a/src/pages/RemoveLiquidity/V3.tsx
+++ b/src/pages/RemoveLiquidity/V3.tsx
@@ -77,6 +77,7 @@ function Remove({ tokenId }: { tokenId: number }) {
// flag for receiving WETH
const [receiveWETH, setReceiveWETH] = useState(false)
+ const [showWarning, setShowWarning] = useState(false)
const nativeCurrency = useNativeCurrency(chainId)
const nativeWrappedSymbol = nativeCurrency.wrapped.symbol
@@ -420,10 +421,16 @@ function Remove({ tokenId }: { tokenId: number }) {
setShowConfirm(true)}
>
- {removed ? Closed : error ?? Remove}
+ {showWarning ? (
+ 'Remove liquidity is paused'
+ ) : removed ? (
+ Closed
+ ) : (
+ error ?? Remove
+ )}