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

@@ -75,7 +75,6 @@ describe('SwapBuyFiatButton.tsx', () => {
     mockuseAccountDrawer.mockImplementation(() => [false, toggleWalletDrawer])
     mockUseOpenModal.mockImplementation(() => useOpenModal)
     render(<SwapBuyFiatButton />)
-    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)

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() {
       >
         <StyledTextButton onClick={handleBuyCrypto} disabled={buyCryptoButtonDisabled} data-testid="buy-fiat-button">
           <Trans>Buy</Trans>
-          {!buyFiatFlowCompleted && <Dot data-testid="buy-fiat-flow-incomplete-indicator" />}
         </StyledTextButton>
       </TraceEvent>
     </MouseoverTooltip>

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
-        <div
-          class="c5"
-          data-testid="buy-fiat-flow-incomplete-indicator"
-        />
       </button>
     </div>
   </div>

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()
 

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,