Compare commits

..
Author SHA1 Message Date
Aleka Cheung 59cc31b388 update to add a TR inside table instead 2024-01-23 12:05:07 -05:00
Aleka Cheung ef5b5013c5 add collapsible table 2024-01-23 12:05:07 -05:00
8 changed files with 34 additions and 83 deletions
+2 -3
View File
@@ -215,11 +215,10 @@
} }
], ],
"validators": [ "validators": [
"https://validator.v4dev4.dydx.exchange" "http://validator.v4dev4.dydx.exchange"
], ],
"0xsquid": "https://testnet.api.0xsquid.com", "0xsquid": "https://testnet.api.0xsquid.com",
"nobleValidator": "https://noble-testnet-rpc.polkachu.com/", "nobleValidator": "https://noble-testnet-rpc.polkachu.com/"
"faucet": "https://faucet.v4dev4.dydx.exchange"
}, },
"links": { "links": {
"tos": "https://dydx.exchange/v4-terms", "tos": "https://dydx.exchange/v4-terms",
+3 -20
View File
@@ -1,7 +1,6 @@
import { useCallback, useEffect, useState, useMemo } from 'react'; import { useCallback, useEffect, useState, useMemo } from 'react';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import { EvmDerivedAddresses } from '@/constants/account';
import { LocalStorageKey } from '@/constants/localStorage'; import { LocalStorageKey } from '@/constants/localStorage';
import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks'; import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
@@ -105,17 +104,11 @@ export const useWalletConnection = () => {
[walletConnectConfig, walletType, walletConnectionType] [walletConnectConfig, walletType, walletConnectionType]
); );
const { connectAsync: connectWagmi } = useConnectWagmi({ connector: wagmiConnector }); const { connectAsync: connectWagmi } = useConnectWagmi({ connector: wagmiConnector })
const { suggestAndConnect: connectGraz } = useConnectGraz(); const { suggestAndConnect: connectGraz } = useConnectGraz();
const [evmDerivedAddresses] = useLocalStorage({
key: LocalStorageKey.EvmDerivedAddresses,
defaultValue: {} as EvmDerivedAddresses,
});
const connectWallet = useCallback( const connectWallet = useCallback(
async ({ walletType, forceConnect }: { walletType?: WalletType; forceConnect?: boolean }) => { async ({ walletType }: { walletType: WalletType }) => {
if (!walletType) return { walletType, walletConnectionType };
const walletConnection = getWalletConnection({ walletType }); const walletConnection = getWalletConnection({ walletType });
try { try {
@@ -139,11 +132,7 @@ export const useWalletConnection = () => {
}); });
} }
} else { } else {
const isAccountConnected = Boolean( if (!isConnectedWagmi) {
evmAddress && evmDerivedAddresses[evmAddress]?.encryptedSignature
);
// if account connected (via remember me), do not show wagmi popup until forceConnect
if (!isConnectedWagmi && (forceConnect || !isAccountConnected)) {
await connectWagmi({ await connectWagmi({
connector: resolveWagmiConnector({ connector: resolveWagmiConnector({
walletType, walletType,
@@ -239,12 +228,6 @@ export const useWalletConnection = () => {
evmAddressWagmi, evmAddressWagmi,
signerWagmi, signerWagmi,
publicClientWagmi, publicClientWagmi,
isConnectedWagmi,
connectWallet: () =>
connectWallet({
walletType: selectedWalletType,
forceConnect: true,
}),
// Wallet connection (Cosmos) // Wallet connection (Cosmos)
dydxAddress, dydxAddress,
+5 -10
View File
@@ -171,15 +171,6 @@ class AbacusStateManager {
this.setTransferValue({ value: null, field: TransferInputField.usdcSize }); this.setTransferValue({ value: null, field: TransferInputField.usdcSize });
}; };
resetInputState = () => {
this.clearTransferInputValues();
this.setTransferValue({
field: TransferInputField.type,
value: null,
});
this.clearTradeInputValues();
};
// ------ Set Data ------ // // ------ Set Data ------ //
setStore = (store: RootStore) => { setStore = (store: RootStore) => {
this.store = store; this.store = store;
@@ -271,7 +262,11 @@ class AbacusStateManager {
) => this.stateManager.cancelOrder(orderId, callback); ) => this.stateManager.cancelOrder(orderId, callback);
cctpWithdraw = ( cctpWithdraw = (
callback: (success: boolean, parsingError: Nullable<ParsingError>, data: string) => void callback: (
success: boolean,
parsingError: Nullable<ParsingError>,
data: string,
) => void
): void => this.stateManager.commitCCTPWithdraw(callback); ): void => this.stateManager.commitCCTPWithdraw(callback);
// ------ Utils ------ // // ------ Utils ------ //
@@ -72,7 +72,6 @@ export const GenerateKeys = ({
if (message) { if (message) {
log('GenerateKeys/switchNetwork', error, { walletErrorType }); log('GenerateKeys/switchNetwork', error, { walletErrorType });
setError(message); setError(message);
throw error;
} }
} }
}; };
@@ -17,7 +17,6 @@ import type { EvmAddress } from '@/constants/wallets';
import { useAccounts, useDebounce, useStringGetter, useSelectedNetwork } from '@/hooks'; import { useAccounts, useDebounce, useStringGetter, useSelectedNetwork } from '@/hooks';
import { useAccountBalance, CHAIN_DEFAULT_TOKEN_ADDRESS } from '@/hooks/useAccountBalance'; import { useAccountBalance, CHAIN_DEFAULT_TOKEN_ADDRESS } from '@/hooks/useAccountBalance';
import { useLocalNotifications } from '@/hooks/useLocalNotifications'; import { useLocalNotifications } from '@/hooks/useLocalNotifications';
import { useWalletConnection } from '@/hooks/useWalletConnection';
import { layoutMixins } from '@/styles/layoutMixins'; import { layoutMixins } from '@/styles/layoutMixins';
import { formMixins } from '@/styles/formMixins'; import { formMixins } from '@/styles/formMixins';
@@ -121,7 +120,11 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
}); });
return () => { return () => {
abacusStateManager.resetInputState(); abacusStateManager.clearTransferInputValues();
abacusStateManager.setTransferValue({
field: TransferInputField.type,
value: null,
});
}; };
}, []); }, []);
@@ -365,8 +368,6 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
return <LoadingSpace id="DepositForm" />; return <LoadingSpace id="DepositForm" />;
} }
const [requireUserActionInWallet, setRequireUserActionInWallet] = useState(false);
return ( return (
<Styled.Form onSubmit={onSubmit}> <Styled.Form onSubmit={onSubmit}>
<ChainSelectMenu selectedChain={chainIdStr || undefined} onSelectChain={onSelectChain} /> <ChainSelectMenu selectedChain={chainIdStr || undefined} onSelectChain={onSelectChain} />
@@ -385,11 +386,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
/> />
</Styled.WithDetailsReceipt> </Styled.WithDetailsReceipt>
{errorMessage && <AlertMessage type={AlertType.Error}>{errorMessage}</AlertMessage>} {errorMessage && <AlertMessage type={AlertType.Error}>{errorMessage}</AlertMessage>}
{requireUserActionInWallet && (
<AlertMessage type={AlertType.Warning}>
{stringGetter({ key: STRING_KEYS.CHECK_WALLET_FOR_REQUEST })}
</AlertMessage>
)}
<Styled.Footer> <Styled.Footer>
<DepositButtonAndReceipt <DepositButtonAndReceipt
isDisabled={isDisabled} isDisabled={isDisabled}
@@ -398,8 +395,6 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
setSlippage={onSetSlippage} setSlippage={onSetSlippage}
slippage={slippage} slippage={slippage}
sourceToken={sourceToken || undefined} sourceToken={sourceToken || undefined}
setRequireUserActionInWallet={setRequireUserActionInWallet}
setError={setError}
/> />
</Styled.Footer> </Styled.Footer>
</Styled.Form> </Styled.Form>
@@ -1,7 +1,8 @@
import { type Dispatch, type SetStateAction, useState, type ReactNode, useEffect } from 'react'; import { type Dispatch, type ReactNode, type SetStateAction, useState, useMemo } from 'react';
import styled, { type AnyStyledComponent } from 'styled-components'; import styled, { type AnyStyledComponent } from 'styled-components';
import { shallowEqual, useSelector } from 'react-redux'; import { shallowEqual, useSelector } from 'react-redux';
import type { RouteData } from '@0xsquid/sdk'; import type { RouteData } from '@0xsquid/sdk';
import { formatUnits } from 'viem';
import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons'; import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons';
@@ -11,7 +12,6 @@ import { NumberSign, TOKEN_DECIMALS } from '@/constants/numbers';
import { useStringGetter, useTokenConfigs } from '@/hooks'; import { useStringGetter, useTokenConfigs } from '@/hooks';
import { useMatchingEvmNetwork } from '@/hooks/useMatchingEvmNetwork'; import { useMatchingEvmNetwork } from '@/hooks/useMatchingEvmNetwork';
import { useWalletConnection } from '@/hooks/useWalletConnection';
import { layoutMixins } from '@/styles/layoutMixins'; import { layoutMixins } from '@/styles/layoutMixins';
@@ -39,8 +39,7 @@ type ElementProps = {
isLoading?: boolean; isLoading?: boolean;
chainId?: string | number; chainId?: string | number;
setError?: Dispatch<SetStateAction<Error | null>>; setError?: Dispatch<SetStateAction<Error | undefined>>;
setRequireUserActionInWallet: (val: boolean) => void;
slippage: number; slippage: number;
slotError?: ReactNode; slotError?: ReactNode;
setSlippage: (slippage: number) => void; setSlippage: (slippage: number) => void;
@@ -58,7 +57,6 @@ export const DepositButtonAndReceipt = ({
isDisabled, isDisabled,
isLoading, isLoading,
slotError, slotError,
setRequireUserActionInWallet,
}: ElementProps) => { }: ElementProps) => {
const [showFeeBreakdown, setShowFeeBreakdown] = useState(false); const [showFeeBreakdown, setShowFeeBreakdown] = useState(false);
const [isEditingSlippage, setIsEditingSlipapge] = useState(false); const [isEditingSlippage, setIsEditingSlipapge] = useState(false);
@@ -66,24 +64,6 @@ export const DepositButtonAndReceipt = ({
const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual); const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual);
const { connectWallet, isConnectedWagmi } = useWalletConnection();
const connectWagmi = async () => {
try {
setRequireUserActionInWallet(false);
await connectWallet();
setRequireUserActionInWallet(false);
} catch (e) {
setRequireUserActionInWallet(true);
}
};
useEffect(() => {
if (!isConnectedWagmi && canAccountTrade) {
connectWagmi();
}
}, [isConnectedWagmi, canAccountTrade]);
const { const {
matchNetwork: switchNetwork, matchNetwork: switchNetwork,
isSwitchingNetwork, isSwitchingNetwork,
@@ -100,7 +80,7 @@ export const DepositButtonAndReceipt = ({
useSelector(getSubaccountBuyingPower, shallowEqual) || {}; useSelector(getSubaccountBuyingPower, shallowEqual) || {};
const { isCctp, summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {}; const { isCctp, summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {};
const { usdcLabel } = useTokenConfigs(); const { usdcDecimals, usdcLabel } = useTokenConfigs();
const feeSubitems: DetailsItem[] = []; const feeSubitems: DetailsItem[] = [];
@@ -136,9 +116,7 @@ export const DepositButtonAndReceipt = ({
{stringGetter({ key: STRING_KEYS.EXPECTED_DEPOSIT_AMOUNT })} <Tag>{usdcLabel}</Tag> {stringGetter({ key: STRING_KEYS.EXPECTED_DEPOSIT_AMOUNT })} <Tag>{usdcLabel}</Tag>
</span> </span>
), ),
value: ( value: <Output type={OutputType.Fiat} fractionDigits={TOKEN_DECIMALS} value={summary?.toAmount} />,
<Output type={OutputType.Fiat} fractionDigits={TOKEN_DECIMALS} value={summary?.toAmount} />
),
subitems: [ subitems: [
{ {
key: 'minimum-deposit-amount', key: 'minimum-deposit-amount',
@@ -148,11 +126,7 @@ export const DepositButtonAndReceipt = ({
</span> </span>
), ),
value: ( value: (
<Output <Output type={OutputType.Fiat} fractionDigits={TOKEN_DECIMALS} value={summary?.toAmountMin} />
type={OutputType.Fiat}
fractionDigits={TOKEN_DECIMALS}
value={summary?.toAmountMin}
/>
), ),
tooltip: 'minimum-deposit-amount', tooltip: 'minimum-deposit-amount',
}, },
@@ -279,8 +253,6 @@ export const DepositButtonAndReceipt = ({
> >
{!canAccountTrade ? ( {!canAccountTrade ? (
<OnboardingTriggerButton size={ButtonSize.Base} /> <OnboardingTriggerButton size={ButtonSize.Base} />
) : !isConnectedWagmi ? (
<Button action={ButtonAction.Primary} onClick={connectWallet} state={{ isLoading: true }} />
) : !isMatchingNetwork ? ( ) : !isMatchingNetwork ? (
<Button <Button
action={ButtonAction.Primary} action={ButtonAction.Primary}
@@ -101,7 +101,11 @@ export const WithdrawForm = () => {
}); });
return () => { return () => {
abacusStateManager.resetInputState(); abacusStateManager.clearTransferInputValues();
abacusStateManager.setTransferValue({
field: TransferInputField.type,
value: null,
});
}; };
}, []); }, []);
+5 -1
View File
@@ -118,7 +118,11 @@ export const TransferForm = ({
onChangeAsset(selectedAsset); onChangeAsset(selectedAsset);
return () => { return () => {
abacusStateManager.resetInputState(); abacusStateManager.clearTransferInputValues();
abacusStateManager.setTransferValue({
field: TransferInputField.type,
value: null,
});
}; };
}, []); }, []);