From d38d449b58dd789ae438e9fb9163b26e0b892561 Mon Sep 17 00:00:00 2001 From: Bill He Date: Thu, 24 Aug 2023 14:39:17 -0700 Subject: [PATCH] address comments --- .../AccountManagementForms/ChainSelectMenu.tsx | 3 +-- .../AccountManagementForms/DepositForm.tsx | 7 +++---- .../DepositForm/DepositButtonAndReceipt.tsx | 9 +++------ .../AccountManagementForms/TokenSelectMenu.tsx | 1 - .../AccountManagementForms/WithdrawForm.tsx | 3 +-- .../WithdrawForm/WithdrawButtonAndReceipt.tsx | 18 ++++++------------ 6 files changed, 14 insertions(+), 27 deletions(-) diff --git a/src/views/forms/AccountManagementForms/ChainSelectMenu.tsx b/src/views/forms/AccountManagementForms/ChainSelectMenu.tsx index 6714105..9badaea 100644 --- a/src/views/forms/AccountManagementForms/ChainSelectMenu.tsx +++ b/src/views/forms/AccountManagementForms/ChainSelectMenu.tsx @@ -1,8 +1,7 @@ -import type { ChainData } from '@0xsquid/sdk'; import styled, { type AnyStyledComponent } from 'styled-components'; import { shallowEqual, useSelector } from 'react-redux'; -import { SelectionOption, TransferType } from '@/constants/abacus'; +import { TransferType } from '@/constants/abacus'; import { STRING_KEYS } from '@/constants/localization'; import { useStringGetter } from '@/hooks'; diff --git a/src/views/forms/AccountManagementForms/DepositForm.tsx b/src/views/forms/AccountManagementForms/DepositForm.tsx index d49f3a4..44d8ea1 100644 --- a/src/views/forms/AccountManagementForms/DepositForm.tsx +++ b/src/views/forms/AccountManagementForms/DepositForm.tsx @@ -32,6 +32,8 @@ import { OutputType } from '@/components/Output'; import { Tag } from '@/components/Tag'; import { WithDetailsReceipt } from '@/components/WithDetailsReceipt'; +import { getTransferInputs } from '@/state/inputsSelectors'; + import abacusStateManager from '@/lib/abacus'; import { MustBigNumber } from '@/lib/numbers'; @@ -40,9 +42,6 @@ import { TokenSelectMenu } from './TokenSelectMenu'; import { DepositButtonAndReceipt } from './DepositForm/DepositButtonAndReceipt'; -import { getTransferInputs } from '@/state/inputsSelectors'; -import { set } from 'lodash'; - type DepositFormProps = { onDeposit?: () => void; onError?: () => void; @@ -55,7 +54,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => { const { signerWagmi } = useAccounts(); - const { requestPayload, token, chain: chainIdStr, resources } = useSelector(getTransferInputs) || {}; + const { requestPayload, token, chain: chainIdStr, resources } = useSelector(getTransferInputs, shallowEqual) || {}; const chainId = chainIdStr ? parseInt(chainIdStr) : undefined // User inputs diff --git a/src/views/forms/AccountManagementForms/DepositForm/DepositButtonAndReceipt.tsx b/src/views/forms/AccountManagementForms/DepositForm/DepositButtonAndReceipt.tsx index 7246b2d..f63e649 100644 --- a/src/views/forms/AccountManagementForms/DepositForm/DepositButtonAndReceipt.tsx +++ b/src/views/forms/AccountManagementForms/DepositForm/DepositButtonAndReceipt.tsx @@ -1,8 +1,7 @@ -import { type Dispatch, useMemo, type SetStateAction, useState, type ReactNode } from 'react'; -import styled, { type AnyStyledComponent, css } from 'styled-components'; +import { type Dispatch, type SetStateAction, useState, type ReactNode } from 'react'; +import styled, { type AnyStyledComponent, } from 'styled-components'; import { shallowEqual, useSelector } from 'react-redux'; -import type { RouteData, TokenData } from '@0xsquid/sdk'; -import BigNumber from 'bignumber.js'; +import type { RouteData } from '@0xsquid/sdk'; import { ButtonAction, @@ -33,8 +32,6 @@ import { WithReceipt } from '@/components/WithReceipt'; import { getSubaccountBuyingPower, getSubaccountEquity } from '@/state/accountSelectors'; import { getTransferInputs } from '@/state/inputsSelectors'; -import { BIG_NUMBERS, MustBigNumber } from '@/lib/numbers'; - import { SlippageEditor } from '../SlippageEditor'; type ElementProps = { diff --git a/src/views/forms/AccountManagementForms/TokenSelectMenu.tsx b/src/views/forms/AccountManagementForms/TokenSelectMenu.tsx index d8b73e7..dea8099 100644 --- a/src/views/forms/AccountManagementForms/TokenSelectMenu.tsx +++ b/src/views/forms/AccountManagementForms/TokenSelectMenu.tsx @@ -1,4 +1,3 @@ -import type { ChainData, TokenData } from '@0xsquid/sdk'; import styled, { type AnyStyledComponent } from 'styled-components'; import { shallowEqual, useSelector } from 'react-redux'; diff --git a/src/views/forms/AccountManagementForms/WithdrawForm.tsx b/src/views/forms/AccountManagementForms/WithdrawForm.tsx index 0a4d4f1..8785742 100644 --- a/src/views/forms/AccountManagementForms/WithdrawForm.tsx +++ b/src/views/forms/AccountManagementForms/WithdrawForm.tsx @@ -7,7 +7,6 @@ import { TESTNET_CHAIN_ID } from '@dydxprotocol/v4-client'; import { TransferInputField, - TransferInputChainResource, TransferInputTokenResource, TransferType, } from '@/constants/abacus'; @@ -60,7 +59,7 @@ export const WithdrawForm = () => { chain: chainIdStr, address: toAddress, resources, - } = useSelector(getTransferInputs) || {}; + } = useSelector(getTransferInputs, shallowEqual) || {}; const toToken = useMemo( () => (token ? resources?.tokenResources?.get(token) : undefined), diff --git a/src/views/forms/AccountManagementForms/WithdrawForm/WithdrawButtonAndReceipt.tsx b/src/views/forms/AccountManagementForms/WithdrawForm/WithdrawButtonAndReceipt.tsx index 4ceb962..678cfb6 100644 --- a/src/views/forms/AccountManagementForms/WithdrawForm/WithdrawButtonAndReceipt.tsx +++ b/src/views/forms/AccountManagementForms/WithdrawForm/WithdrawButtonAndReceipt.tsx @@ -1,12 +1,8 @@ -import { type Dispatch, type SetStateAction, useState } from 'react'; +import { useState } from 'react'; import { shallowEqual, useSelector } from 'react-redux'; import styled, { type AnyStyledComponent } from 'styled-components'; -import { ChainType } from '@0xsquid/sdk'; -import type { ChainData, CosmosChain, RouteData, TokenData } from '@0xsquid/sdk'; -import BigNumber from 'bignumber.js'; -import { parseUnits } from 'viem'; -import { TransferInputChainResource, TransferInputTokenResource } from '@/constants/abacus'; +import { TransferInputTokenResource } from '@/constants/abacus'; import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons'; import { STRING_KEYS } from '@/constants/localization'; import { NumberSign } from '@/constants/numbers'; @@ -20,17 +16,13 @@ import { Details, DetailsItem } from '@/components/Details'; import { DiffOutput } from '@/components/DiffOutput'; import { Icon, IconName } from '@/components/Icon'; import { Output, OutputType } from '@/components/Output'; -import { Tag } from '@/components/Tag'; import { ToggleButton } from '@/components/ToggleButton'; import { WithReceipt } from '@/components/WithReceipt'; -import { BIG_NUMBERS, MustBigNumber } from '@/lib/numbers'; - import { SlippageEditor } from '../SlippageEditor'; import { getSubaccount } from '@/state/accountSelectors'; import { getTransferInputs } from '@/state/inputsSelectors'; -import { w } from 'vitest/dist/types-2b1c412e'; type ElementProps = { setSlippage: (slippage: number) => void; @@ -65,12 +57,13 @@ export const WithdrawButtonAndReceipt = ({ isCosmosChain: false, }); - const balanceBN = MustBigNumber(balance); + // TODO: uncomment when we have a way to get token amount estimate from abacus + // const balanceBN = MustBigNumber(balance); // const newBalance = // // toAmountMin && withdrawToken && parseUnits(toAmountMin, withdrawToken.decimals).toString(); const { leverage } = useSelector(getSubaccount, shallowEqual) || {}; - const { summary, requestPayload } = useSelector(getTransferInputs) || {}; + const { summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {}; const feeSubitems: DetailsItem[] = []; @@ -144,6 +137,7 @@ export const WithdrawButtonAndReceipt = ({ /> ), }, + // TODO: uncomment when we have a way to get token amount estimate from abacus // { // key: 'wallet', // label: (