LaconicNetwork/dydx-v4-web
6
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

show loading state instead of "Unavailable" for place order button (#104)

Browse Source 
* show loading instead of unavailable for place order button
This commit is contained in:
aleka 2023-10-27 17:39:12 -04:00 committed by GitHub
parent d92b49f4fa
commit e6858ca917
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/dialogs/TradeDialog.tsx
View File

@ -37,7 +37,7 @@ export const TradeDialog = ({ isOpen, setIsOpen, slotTrigger }: ElementProps) =>
const selectedTradeType = getSelectedTradeType(type);
const { typeOptions } = useSelector(getInputTradeOptions, shallowEqual) ?? {};
const allTradeTypeItems = typeOptions?.toArray()?.map(({ type, stringKey }) => ({
const allTradeTypeItems = (typeOptions?.toArray() ?? []).map(({ type, stringKey }) => ({
value: type,
label: stringGetter({
key: stringKey as StringKey,

1
src/views/forms/TradeForm.tsx
View File

@ -322,7 +322,6 @@ export const TradeForm = ({
summary={summary ?? undefined}
currentStep={currentStep}
showDeposit={inputAlert?.errorAction === TradeInputErrorAction.DEPOSIT}
showConnectWallet={inputAlert?.errorAction === TradeInputErrorAction.CONNECT_WALLET}
/>
</Styled.Footer>
</Styled.TradeForm>

20
src/views/forms/TradeForm/PlaceOrderButtonAndReceipt.tsx
View File

@ -7,9 +7,8 @@ import { DialogTypes } from '@/constants/dialogs';
import { STRING_KEYS } from '@/constants/localization';
import { TRADE_TYPE_STRINGS, MobilePlaceOrderSteps } from '@/constants/trade';
import { useStringGetter } from '@/hooks';
import { useStringGetter, useTokenConfigs } from '@/hooks';
import { AssetIcon } from '@/components/AssetIcon';
import { Button } from '@/components/Button';
import { Output, OutputType, ShowSign } from '@/components/Output';
import { WithDetailsReceipt } from '@/components/WithDetailsReceipt';
@ -47,6 +46,7 @@ export const PlaceOrderButtonAndReceipt = ({
}: ElementProps) => {
const stringGetter = useStringGetter();
const dispatch = useDispatch();
const { chainTokenLabel } = useTokenConfigs();
const canAccountTrade = useSelector(calculateCanAccountTrade);
const subaccountNumber = useSelector(getSubaccountId);
@ -88,7 +88,14 @@ export const PlaceOrderButtonAndReceipt = ({
{/* <AssetIcon symbol="DYDX" /> */}
</>
),
value: <Output type={OutputType.Asset} value={reward} useGrouping tag={reward ? "Dv4TNT" : ''} />,
value: (
<Output
type={OutputType.Asset}
value={reward}
useGrouping
tag={reward ? chainTokenLabel : ''}
/>
),
tooltip: 'max-reward',
},
{
@ -111,7 +118,7 @@ export const PlaceOrderButtonAndReceipt = ({
? actionStringKey
: STRING_KEYS.UNAVAILABLE,
buttonAction: ButtonAction.Primary,
buttonState: { isDisabled: !shouldEnableTrade },
buttonState: { isDisabled: !shouldEnableTrade, isLoading: hasMissingData },
},
[MobilePlaceOrderSteps.PreviewOrder]: {
@ -148,7 +155,10 @@ export const PlaceOrderButtonAndReceipt = ({
const buttonState = currentStep
? buttonStatesPerStep[currentStep].buttonState
: { isDisabled: !shouldEnableTrade || isLoading, isLoading };
: {
isDisabled: !shouldEnableTrade || isLoading,
isLoading: isLoading || hasMissingData,
};
return (
<WithDetailsReceipt detailItems={items}>