From 8e36361866764bb2b4def5a2bc45b3a5a2a50968 Mon Sep 17 00:00:00 2001 From: Brendan Wong <35351983+LunrEclipse@users.noreply.github.com> Date: Mon, 3 Jul 2023 15:55:49 -0400 Subject: [PATCH] fix: remove blue dot next to buy (#6808) * remove button * remove dependencies * fix: remove useBuyFiatFlowCompleted * fix: update lint and unit tests * fix: update user state * fix: remove migration * Revert "fix: remove migration" This reverts commit eef313f9ce2ea6b494ce2c9bc4a2fa6dbd1991ee. * test * fix: add ts ignore --- src/components/swap/SwapBuyFiatButton.test.tsx | 1 - src/components/swap/SwapBuyFiatButton.tsx | 13 ------------- .../__snapshots__/SwapBuyFiatButton.test.tsx.snap | 11 ----------- src/state/user/hooks.tsx | 13 ------------- src/state/user/reducer.ts | 14 +++++++------- 5 files changed, 7 insertions(+), 45 deletions(-) diff --git a/src/components/swap/SwapBuyFiatButton.test.tsx b/src/components/swap/SwapBuyFiatButton.test.tsx index f79bf75f23..4075b0c7d1 100644 --- a/src/components/swap/SwapBuyFiatButton.test.tsx +++ b/src/components/swap/SwapBuyFiatButton.test.tsx @@ -75,7 +75,6 @@ describe('SwapBuyFiatButton.tsx', () => { mockuseAccountDrawer.mockImplementation(() => [false, toggleWalletDrawer]) mockUseOpenModal.mockImplementation(() => useOpenModal) render() - expect(screen.getByTestId('buy-fiat-flow-incomplete-indicator')).toBeInTheDocument() await act(() => userEvent.click(screen.getByTestId('buy-fiat-button'))) expect(toggleWalletDrawer).toHaveBeenCalledTimes(0) expect(useOpenModal).toHaveBeenCalledTimes(1) diff --git a/src/components/swap/SwapBuyFiatButton.tsx b/src/components/swap/SwapBuyFiatButton.tsx index cd4b6818cd..59274f534a 100644 --- a/src/components/swap/SwapBuyFiatButton.tsx +++ b/src/components/swap/SwapBuyFiatButton.tsx @@ -6,20 +6,12 @@ import { useAccountDrawer } from 'components/AccountDrawer' import { ButtonText } from 'components/Button' import { MouseoverTooltip } from 'components/Tooltip' import { useCallback, useEffect, useState } from 'react' -import { useBuyFiatFlowCompleted } from 'state/user/hooks' import styled from 'styled-components/macro' import { ExternalLink } from 'theme' import { useFiatOnrampAvailability, useOpenModal } from '../../state/application/hooks' import { ApplicationModal } from '../../state/application/reducer' -const Dot = styled.div` - height: 8px; - width: 8px; - background-color: ${({ theme }) => theme.accentActive}; - border-radius: 50%; -` - export const MOONPAY_REGION_AVAILABILITY_ARTICLE = 'https://support.uniswap.org/hc/en-us/articles/11306664890381-Why-isn-t-MoonPay-available-in-my-region-' @@ -46,7 +38,6 @@ const StyledTextButton = styled(ButtonText)` export default function SwapBuyFiatButton() { const { account } = useWeb3React() const openFiatOnRampModal = useOpenModal(ApplicationModal.FIAT_ONRAMP) - const [buyFiatFlowCompleted, setBuyFiatFlowCompleted] = useBuyFiatFlowCompleted() const [checkFiatRegionAvailability, setCheckFiatRegionAvailability] = useState(false) const { available: fiatOnrampAvailable, @@ -73,10 +64,8 @@ export default function SwapBuyFiatButton() { setBuyFiatFlowState(BuyFiatFlowState.ACTIVE_NEEDS_ACCOUNT) } else if (fiatOnrampAvailable && account) { openFiatOnRampModal() - setBuyFiatFlowCompleted(true) setBuyFiatFlowState(BuyFiatFlowState.INACTIVE) } else if (!fiatOnrampAvailable) { - setBuyFiatFlowCompleted(true) setBuyFiatFlowState(BuyFiatFlowState.INACTIVE) } }, [ @@ -86,7 +75,6 @@ export default function SwapBuyFiatButton() { walletDrawerOpen, toggleWalletDrawer, openFiatOnRampModal, - setBuyFiatFlowCompleted, ]) // Continue buy fiat flow automatically when requisite state changes have occured. @@ -135,7 +123,6 @@ export default function SwapBuyFiatButton() { > Buy - {!buyFiatFlowCompleted && } diff --git a/src/components/swap/__snapshots__/SwapBuyFiatButton.test.tsx.snap b/src/components/swap/__snapshots__/SwapBuyFiatButton.test.tsx.snap index 216760ecfb..1a4c4e0f71 100644 --- a/src/components/swap/__snapshots__/SwapBuyFiatButton.test.tsx.snap +++ b/src/components/swap/__snapshots__/SwapBuyFiatButton.test.tsx.snap @@ -115,13 +115,6 @@ exports[`SwapBuyFiatButton.tsx matches base snapshot 1`] = ` height: inherit; } -.c5 { - height: 8px; - width: 8px; - background-color: #4C82FB; - border-radius: 50%; -} - .c4 { color: #7780A0; gap: 4px; @@ -146,10 +139,6 @@ exports[`SwapBuyFiatButton.tsx matches base snapshot 1`] = ` data-testid="buy-fiat-button" > Buy -
diff --git a/src/state/user/hooks.tsx b/src/state/user/hooks.tsx index 9ffd3b7558..de1ed24653 100644 --- a/src/state/user/hooks.tsx +++ b/src/state/user/hooks.tsx @@ -19,7 +19,6 @@ import { addSerializedToken, updateHideClosedPositions, updateHideUniswapWalletBanner, - updateUserBuyFiatFlowCompleted, updateUserDeadline, updateUserLocale, updateUserRouterPreference, @@ -65,18 +64,6 @@ export function useUserLocaleManager(): [SupportedLocale | null, (newLocale: Sup return [locale, setLocale] } -export function useBuyFiatFlowCompleted(): [boolean | undefined, (buyFiatFlowCompleted: boolean) => void] { - const dispatch = useAppDispatch() - const buyFiatFlowCompleted = useAppSelector((state) => state.user.buyFiatFlowCompleted) - const setBuyFiatFlowCompleted = useCallback( - (buyFiatFlowCompleted: boolean) => { - dispatch(updateUserBuyFiatFlowCompleted(buyFiatFlowCompleted)) - }, - [dispatch] - ) - return [buyFiatFlowCompleted, setBuyFiatFlowCompleted] -} - export function useRouterPreference(): [RouterPreference, (routerPreference: RouterPreference) => void] { const dispatch = useAppDispatch() diff --git a/src/state/user/reducer.ts b/src/state/user/reducer.ts index fc9a090c36..b7c369fd71 100644 --- a/src/state/user/reducer.ts +++ b/src/state/user/reducer.ts @@ -10,8 +10,6 @@ import { SerializedPair, SerializedToken, SlippageTolerance } from './types' const currentTimestamp = () => new Date().getTime() export interface UserState { - buyFiatFlowCompleted?: boolean - selectedWallet?: ConnectionType // the timestamp of the last updateVersion action @@ -59,7 +57,6 @@ function pairKey(token0Address: string, token1Address: string) { } export const initialState: UserState = { - buyFiatFlowCompleted: undefined, selectedWallet: undefined, userLocale: null, userRouterPreference: RouterPreference.AUTO, @@ -79,9 +76,6 @@ const userSlice = createSlice({ name: 'user', initialState, reducers: { - updateUserBuyFiatFlowCompleted(state, action) { - state.buyFiatFlowCompleted = action.payload - }, updateSelectedWallet(state, { payload: { wallet } }) { state.selectedWallet = wallet }, @@ -169,6 +163,13 @@ const userSlice = createSlice({ state.userRouterPreference = RouterPreference.AUTO } + //If `buyFiatFlowCompleted` is present, delete it using filtering + if ('buyFiatFlowCompleted' in state) { + //ignoring due to type errors occuring since we now remove this state + //@ts-ignore + delete state.buyFiatFlowCompleted + } + state.lastUpdateVersionTimestamp = currentTimestamp() }) }, @@ -177,7 +178,6 @@ const userSlice = createSlice({ export const { addSerializedPair, addSerializedToken, - updateUserBuyFiatFlowCompleted, updateSelectedWallet, updateHideClosedPositions, updateUserRouterPreference,