feat(trading): update copy for reset dialog and jest

Co-authored-by: Matthew Russell <mattrussell36@gmail.com>

.gitignore

@@ -52,3 +52,4 @@ cypress.env.json
 /apps/**/cypress/reports/
 /apps/**/cypress/downloads/
 /apps/**/fixtures/wallet/node**
+.nx/

apps/governance/.env

@@ -35,6 +35,5 @@ NX_SUCCESSOR_MARKETS=true
 NX_METAMASK_SNAPS=true
 NX_PRODUCT_PERPETUALS=false
 NX_UPDATE_MARKET_STATE=false
-NX_REFERRALS=false
+NX_REFERRALS=true
 NX_GOVERNANCE_TRANSFERS=false
-NX_VOLUME_DISCOUNTS=false

apps/governance/.env.capsule

@@ -31,9 +31,8 @@ NX_TENDERMINT_WEBSOCKET_URL=wss://localhost:26617/websocket
 CYPRESS_FAIRGROUND=false
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=true
 NX_METAMASK_SNAPS=false
 NX_PRODUCT_PERPETUALS=true
 NX_UPDATE_MARKET_STATE=true
 NX_REFERRALS=true
-NX_VOLUME_DISCOUNTS=true

apps/governance/.env.devnet

@@ -28,4 +28,3 @@ NX_METAMASK_SNAPS=true
 NX_PRODUCT_PERPETUALS=true
 NX_UPDATE_MARKET_STATE=true
 NX_REFERRALS=true
-NX_VOLUME_DISCOUNTS=true

apps/governance/.env.mainnet

@@ -22,9 +22,8 @@ NX_TENDERMINT_URL=https://be.vega.community
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.vega.community/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=true
 NX_METAMASK_SNAPS=false
-NX_PRODUCT_PERPETUALS=false
-NX_UPDATE_MARKET_STATE=false
-NX_REFERRALS=false
-NX_VOLUME_DISCOUNTS=false
+NX_PRODUCT_PERPETUALS=true
+NX_UPDATE_MARKET_STATE=true
+NX_REFERRALS=true

apps/governance/.env.mainnet-mirror

@@ -21,9 +21,8 @@ NX_TENDERMINT_URL=https://be.mainnet-mirror.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.mainnet-mirror.vega.rocks/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=true
 NX_METAMASK_SNAPS=false
-NX_PRODUCT_PERPETUALS=false
-NX_UPDATE_MARKET_STATE=false
-NX_REFERRALS=false
-NX_VOLUME_DISCOUNTS=false
+NX_PRODUCT_PERPETUALS=true
+NX_UPDATE_MARKET_STATE=true
+NX_REFERRALS=true

apps/governance/.env.stagnet1

@@ -25,4 +25,3 @@ NX_PRODUCT_PERPETUALS=true
 NX_UPDATE_MARKET_STATE=true
 NX_REFERRALS=true
 NX_GOVERNANCE_TRANSFERS=true
-NX_VOLUME_DISCOUNTS=true

apps/governance/.env.testnet

@@ -29,4 +29,3 @@ NX_METAMASK_SNAPS=true
 NX_PRODUCT_PERPETUALS=true
 NX_UPDATE_MARKET_STATE=true
 NX_REFERRALS=true
-NX_VOLUME_DISCOUNTS=true

apps/governance/.env.validators-testnet

@@ -20,9 +20,8 @@ NX_TENDERMINT_URL=https://tm.be.validators-testnet.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.validators-testnet.vega.
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=true
 NX_METAMASK_SNAPS=false
-NX_PRODUCT_PERPETUALS=false
-NX_UPDATE_MARKET_STATE=false
-NX_REFERRALS=false
-NX_VOLUME_DISCOUNTS=false
+NX_PRODUCT_PERPETUALS=true
+NX_UPDATE_MARKET_STATE=true
+NX_REFERRALS=true

apps/governance/src/routes/home/index.tsx

@@ -189,7 +189,6 @@ const GovernanceHome = ({ name }: RouteChildProps) => {
       includeNewMarketProductFields: !!FLAGS.PRODUCT_PERPETUALS,
       includeUpdateMarketStates: !!FLAGS.UPDATE_MARKET_STATE,
       includeUpdateReferralPrograms: !!FLAGS.REFERRALS,
-      includeUpdateVolumeDiscountPrograms: !!FLAGS.VOLUME_DISCOUNTS,
     },
   });
 

apps/governance/src/routes/proposals/components/proposal-volume-discount-program-details/proposal-volume-discount-program-details.tsx

@@ -78,7 +78,7 @@ export const ProposalVolumeDiscountProgramDetails = ({
               {t('BenefitTiers')}
             </h3>
             <KeyValueTable>
-              {benefitTiers
+              {[...benefitTiers]
                 .sort(
                   (a, b) =>
                     Number(a.minimumRunningNotionalTakerVolume) -

apps/governance/src/routes/proposals/proposal/Proposal.graphql

@@ -84,7 +84,6 @@ query Proposal(
   $includeNewMarketProductField: Boolean!
   $includeUpdateMarketState: Boolean!
   $includeUpdateReferralProgram: Boolean!
-  $includeUpdateVolumeDiscountProgram: Boolean!
 ) {
   proposal(id: $proposalId) {
     id
@@ -104,7 +103,6 @@ query Proposal(
     ...UpdateMarketState @include(if: $includeUpdateMarketState)
     ...UpdateReferralProgram @include(if: $includeUpdateReferralProgram)
     ...UpdateVolumeDiscountProgram
-      @include(if: $includeUpdateVolumeDiscountProgram)
     terms {
       closingDatetime
       enactmentDatetime

apps/governance/src/routes/proposals/proposal/__generated__/Proposal.ts

@@ -16,7 +16,6 @@ export type ProposalQueryVariables = Types.Exact<{
   includeNewMarketProductField: Types.Scalars['Boolean'];
   includeUpdateMarketState: Types.Scalars['Boolean'];
   includeUpdateReferralProgram: Types.Scalars['Boolean'];
-  includeUpdateVolumeDiscountProgram: Types.Scalars['Boolean'];
 }>;
 
 
@@ -108,7 +107,7 @@ export const UpdateVolumeDiscountProgramFragmentDoc = gql`
 }
     `;
 export const ProposalDocument = gql`
-    query Proposal($proposalId: ID!, $includeNewMarketProductField: Boolean!, $includeUpdateMarketState: Boolean!, $includeUpdateReferralProgram: Boolean!, $includeUpdateVolumeDiscountProgram: Boolean!) {
+    query Proposal($proposalId: ID!, $includeNewMarketProductField: Boolean!, $includeUpdateMarketState: Boolean!, $includeUpdateReferralProgram: Boolean!) {
   proposal(id: $proposalId) {
     id
     rationale {
@@ -126,7 +125,7 @@ export const ProposalDocument = gql`
     ...NewMarketProductField @include(if: $includeNewMarketProductField)
     ...UpdateMarketState @include(if: $includeUpdateMarketState)
     ...UpdateReferralProgram @include(if: $includeUpdateReferralProgram)
-    ...UpdateVolumeDiscountProgram @include(if: $includeUpdateVolumeDiscountProgram)
+    ...UpdateVolumeDiscountProgram
     terms {
       closingDatetime
       enactmentDatetime
@@ -446,7 +445,6 @@ ${UpdateVolumeDiscountProgramFragmentDoc}`;
  *      includeNewMarketProductField: // value for 'includeNewMarketProductField'
  *      includeUpdateMarketState: // value for 'includeUpdateMarketState'
  *      includeUpdateReferralProgram: // value for 'includeUpdateReferralProgram'
- *      includeUpdateVolumeDiscountProgram: // value for 'includeUpdateVolumeDiscountProgram'
  *   },
  * });
  */

apps/governance/src/routes/proposals/proposal/proposal-container.tsx

@@ -62,7 +62,6 @@ export const ProposalContainer = () => {
       includeNewMarketProductField: !!FLAGS.PRODUCT_PERPETUALS,
       includeUpdateMarketState: !!FLAGS.UPDATE_MARKET_STATE,
       includeUpdateReferralProgram: !!FLAGS.REFERRALS,
-      includeUpdateVolumeDiscountProgram: !!FLAGS.VOLUME_DISCOUNTS,
     },
     skip: !params.proposalId,
   });

apps/governance/src/routes/proposals/proposals/Proposals.graphql

@@ -171,7 +171,6 @@ query Proposals(
   $includeNewMarketProductFields: Boolean!
   $includeUpdateMarketStates: Boolean!
   $includeUpdateReferralPrograms: Boolean!
-  $includeUpdateVolumeDiscountPrograms: Boolean!
 ) {
   proposalsConnection {
     edges {
@@ -181,7 +180,6 @@ query Proposals(
         ...UpdateMarketStates @include(if: $includeUpdateMarketStates)
         ...UpdateReferralPrograms @include(if: $includeUpdateReferralPrograms)
         ...UpdateVolumeDiscountPrograms
-          @include(if: $includeUpdateVolumeDiscountPrograms)
       }
     }
   }

apps/governance/src/routes/proposals/proposals/__generated__/Proposals.ts

@@ -17,7 +17,6 @@ export type ProposalsQueryVariables = Types.Exact<{
   includeNewMarketProductFields: Types.Scalars['Boolean'];
   includeUpdateMarketStates: Types.Scalars['Boolean'];
   includeUpdateReferralPrograms: Types.Scalars['Boolean'];
-  includeUpdateVolumeDiscountPrograms: Types.Scalars['Boolean'];
 }>;
 
 
@@ -198,7 +197,7 @@ export const ProposalFieldsFragmentDoc = gql`
 }
     `;
 export const ProposalsDocument = gql`
-    query Proposals($includeNewMarketProductFields: Boolean!, $includeUpdateMarketStates: Boolean!, $includeUpdateReferralPrograms: Boolean!, $includeUpdateVolumeDiscountPrograms: Boolean!) {
+    query Proposals($includeNewMarketProductFields: Boolean!, $includeUpdateMarketStates: Boolean!, $includeUpdateReferralPrograms: Boolean!) {
   proposalsConnection {
     edges {
       node {
@@ -206,7 +205,7 @@ export const ProposalsDocument = gql`
         ...NewMarketProductFields @include(if: $includeNewMarketProductFields)
         ...UpdateMarketStates @include(if: $includeUpdateMarketStates)
         ...UpdateReferralPrograms @include(if: $includeUpdateReferralPrograms)
-        ...UpdateVolumeDiscountPrograms @include(if: $includeUpdateVolumeDiscountPrograms)
+        ...UpdateVolumeDiscountPrograms
       }
     }
   }
@@ -232,7 +231,6 @@ ${UpdateVolumeDiscountProgramsFragmentDoc}`;
  *      includeNewMarketProductFields: // value for 'includeNewMarketProductFields'
  *      includeUpdateMarketStates: // value for 'includeUpdateMarketStates'
  *      includeUpdateReferralPrograms: // value for 'includeUpdateReferralPrograms'
- *      includeUpdateVolumeDiscountPrograms: // value for 'includeUpdateVolumeDiscountPrograms'
  *   },
  * });
  */

apps/governance/src/routes/proposals/proposals/proposals-container.tsx

@@ -50,7 +50,6 @@ export const ProposalsContainer = () => {
       includeNewMarketProductFields: !!FLAGS.PRODUCT_PERPETUALS,
       includeUpdateMarketStates: !!FLAGS.UPDATE_MARKET_STATE,
       includeUpdateReferralPrograms: !!FLAGS.REFERRALS,
-      includeUpdateVolumeDiscountPrograms: !!FLAGS.VOLUME_DISCOUNTS,
     },
   });
 

apps/governance/src/routes/proposals/rejected/rejected-proposals-container.tsx

@@ -42,7 +42,6 @@ export const RejectedProposalsContainer = () => {
       includeNewMarketProductFields: !!FLAGS.PRODUCT_PERPETUALS,
       includeUpdateMarketStates: !!FLAGS.UPDATE_MARKET_STATE,
       includeUpdateReferralPrograms: !!FLAGS.REFERRALS,
-      includeUpdateVolumeDiscountPrograms: !!FLAGS.VOLUME_DISCOUNTS,
     },
   });
 

apps/trading/components/settings/settings.spec.tsx

@@ -0,0 +1,12 @@
+import { Settings } from './settings';
+import { render, screen } from '@testing-library/react';
+
+describe('Settings', () => {
+  it('should the settings component with all the options', () => {
+    render(<Settings />);
+    expect(screen.getByText('Dark mode')).toBeInTheDocument();
+    expect(screen.getByText('Share usage data')).toBeInTheDocument();
+    expect(screen.getByText('Toast location')).toBeInTheDocument();
+    expect(screen.getByText('Reset to default')).toBeInTheDocument();
+  });
+});

apps/trading/components/settings/settings.tsx

@@ -1,12 +1,19 @@
 import { t } from '@vegaprotocol/i18n';
-import { Switch, ToastPositionSetter } from '@vegaprotocol/ui-toolkit';
+import {
+  Dialog,
+  Intent,
+  Switch,
+  ToastPositionSetter,
+  TradingButton,
+} from '@vegaprotocol/ui-toolkit';
 import { useThemeSwitcher } from '@vegaprotocol/react-helpers';
 import { useTelemetryApproval } from '../../lib/hooks/use-telemetry-approval';
-import type { ReactNode } from 'react';
+import { useState, type ReactNode } from 'react';
 
 export const Settings = () => {
   const { theme, setTheme } = useThemeSwitcher();
   const [isApproved, setIsApproved] = useTelemetryApproval();
+  const [open, setOpen] = useState(false);
   return (
     <div>
       <SettingsGroup label={t('Dark mode')}>
@@ -31,6 +38,52 @@ export const Settings = () => {
       <SettingsGroup label={t('Toast location')}>
         <ToastPositionSetter />
       </SettingsGroup>
+      <SettingsGroup label={t('Reset to default')}>
+        <TradingButton
+          name="reset-to-defaults"
+          size="small"
+          intent={Intent.None}
+          onClick={() => {
+            setOpen(true);
+          }}
+        >
+          {t('Reset')}
+        </TradingButton>
+        <Dialog open={open} title={t('Reset')}>
+          <div className="mb-4">
+            <p>
+              {t(
+                'You will lose all persisted settings and you will be logged out.'
+              )}
+            </p>
+            <p>
+              {t('Are you sure you want to reset all settings to default?')}
+            </p>
+          </div>
+
+          <div className="flex flex-col gap-4">
+            <TradingButton
+              name="reset-to-defaults-cancel"
+              intent={Intent.Primary}
+              onClick={() => {
+                localStorage.clear();
+                window.location.reload();
+              }}
+            >
+              {t('Yes, clear cache and refresh')}
+            </TradingButton>
+            <TradingButton
+              name="reset-to-defaults-cancel"
+              intent={Intent.None}
+              onClick={() => {
+                setOpen(false);
+              }}
+            >
+              {t('No, keep settings')}
+            </TradingButton>
+          </div>
+        </Dialog>
+      </SettingsGroup>
     </div>
   );
 };

libs/accounts/src/lib/accounts-table.spec.tsx

@@ -1,10 +1,23 @@
-import { act, render, screen } from '@testing-library/react';
+import { act, render, screen, within } from '@testing-library/react';
 import * as Types from '@vegaprotocol/types';
 import type { AccountFields } from './accounts-data-provider';
 import { getAccountData } from './accounts-data-provider';
 import { AccountTable } from './accounts-table';
 import userEvent from '@testing-library/user-event';
-
+const asset1 = {
+  __typename: 'Asset',
+  id: 'asset-1',
+  symbol: 'tBTC',
+  decimals: 5,
+  name: 'T BTC',
+};
+const asset2 = {
+  __typename: 'Asset',
+  id: 'asset-2',
+  symbol: 'aBTC',
+  decimals: 5,
+  name: 'A BTC',
+};
 const singleRow = {
   __typename: 'AccountBalance',
   type: Types.AccountType.ACCOUNT_TYPE_MARGIN,
@@ -13,12 +26,7 @@ const singleRow = {
     __typename: 'Market',
     id: '10cd0a793ad2887b340940337fa6d97a212e0e517fe8e9eab2b5ef3a38633f35',
   },
-  asset: {
-    __typename: 'Asset',
-    id: '5cfa87844724df6069b94e4c8a6f03af21907d7bc251593d08e4251043ee9f7c',
-    symbol: 'tBTC',
-    decimals: 5,
-  },
+  asset: asset1,
   available: '125600000',
   used: '125600000',
   total: '251200000',
@@ -33,12 +41,7 @@ const secondRow = {
     __typename: 'Market',
     id: '10cd0a793ad2887b340940337fa6d97a212e0e517fe8e9eab2b5ef3a38633f35',
   },
-  asset: {
-    __typename: 'Asset',
-    id: '5cfa87844724df6069b94e4c8a6f03af21907d7bc251593d08e4251043ee9f7c',
-    symbol: 'aBTC',
-    decimals: 5,
-  },
+  asset: asset2,
   available: '125600001',
   used: '125600001',
   total: '251200002',
@@ -134,7 +137,7 @@ describe('AccountsTable', () => {
 
   it('should sort assets', async () => {
     // 7001-COLL-010
-    const { container } = render(
+    render(
       <AccountTable
         rowData={multiRowData}
         onClickAsset={() => null}
@@ -142,13 +145,13 @@ describe('AccountsTable', () => {
       />
     );
 
-    const headerCell = screen.getByText('Asset');
-    await userEvent.click(headerCell);
-    const rows = container.querySelectorAll(
-      '.ag-center-cols-container .ag-row'
-    );
-    expect(rows[0].textContent).toContain('aBTC');
-    expect(rows[1].textContent).toContain('tBTC');
+    const headerCell = screen
+      .getAllByRole('columnheader')
+      .find((h) => h?.getAttribute('col-id') === 'asset.symbol') as HTMLElement;
+
+    await userEvent.click(within(headerCell).getByText(/asset/i));
+
+    expect(headerCell).toHaveAttribute('aria-sort', 'ascending');
   });
 
   it('should apply correct formatting in view as user mode', async () => {
@@ -176,12 +179,7 @@ describe('AccountsTable', () => {
         rowData={singleRowData}
         onClickAsset={() => null}
         isReadOnly={false}
-        pinnedAsset={{
-          decimals: 5,
-          id: '5cfa87844724df6069b94e4c8a6f03af21907d7bc251593d08e4251043ee9f7c',
-          symbol: 'tBTC',
-          name: 'tBTC',
-        }}
+        pinnedAsset={asset1}
       />
     );
     await screen.findAllByRole('rowgroup');
@@ -213,23 +211,13 @@ describe('AccountsTable', () => {
     const result = getAccountData([singleRow]);
     const expected = [
       {
-        asset: {
-          __typename: 'Asset',
-          decimals: 5,
-          id: '5cfa87844724df6069b94e4c8a6f03af21907d7bc251593d08e4251043ee9f7c',
-          symbol: 'tBTC',
-        },
+        asset: asset1,
         available: '0',
         balance: '0',
         breakdown: [
           {
             __typename: 'AccountBalance',
-            asset: {
-              __typename: 'Asset',
-              decimals: 5,
-              id: '5cfa87844724df6069b94e4c8a6f03af21907d7bc251593d08e4251043ee9f7c',
-              symbol: 'tBTC',
-            },
+            asset: asset1,
             available: '0',
             balance: '125600000',
             total: '125600000',

libs/accounts/src/lib/transfer-form.spec.tsx

@@ -1,4 +1,10 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import {
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+  within,
+} from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import BigNumber from 'bignumber.js';
 import {
@@ -7,7 +13,7 @@ import {
   TransferForm,
   type TransferFormProps,
 } from './transfer-form';
-import { AccountType } from '@vegaprotocol/types';
+import { AccountType, AccountTypeMapping } from '@vegaprotocol/types';
 import { removeDecimal } from '@vegaprotocol/utils';
 
 describe('TransferForm', () => {
@@ -39,8 +45,7 @@ describe('TransferForm', () => {
   };
 
   const amount = '100';
-  const pubKey =
-    '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680';
+  const pubKey = '1'.repeat(64);
   const asset = {
     id: 'eur',
     symbol: '€',
@@ -50,10 +55,7 @@ describe('TransferForm', () => {
   };
   const props = {
     pubKey,
-    pubKeys: [
-      pubKey,
-      'a4b6e3de5d7ef4e31ae1b090be49d1a2ef7bcefff60cccf7658a0d4922651cce',
-    ],
+    pubKeys: [pubKey, '2'.repeat(64)],
     feeFactor: '0.001',
     submitTransfer: jest.fn(),
     accounts: [
@@ -182,7 +184,7 @@ describe('TransferForm', () => {
 
     // Test use max button
     await userEvent.click(screen.getByRole('button', { name: 'Use max' }));
-    expect(amountInput).toHaveValue('1000');
+    expect(amountInput).toHaveValue('1000.00');
 
     // Test amount validation
     await userEvent.clear(amountInput);
@@ -267,7 +269,7 @@ describe('TransferForm', () => {
 
     // Test use max button
     await userEvent.click(screen.getByRole('button', { name: 'Use max' }));
-    expect(amountInput).toHaveValue('100');
+    expect(amountInput).toHaveValue('100.00');
 
     // If transfering from a vested account 'include fees' checkbox should
     // be disabled and fees should be 0
@@ -296,6 +298,88 @@ describe('TransferForm', () => {
     });
   });
 
+  it('handles lots of decimal places', async () => {
+    const balance = '904195168829277777';
+    const expectedBalance = '0.904195168829277777';
+
+    const longDecimalAsset = {
+      id: 'assetId',
+      symbol: 'VEGA',
+      name: 'VEGA',
+      decimals: 18,
+      quantum: '1',
+    };
+
+    const account = {
+      type: AccountType.ACCOUNT_TYPE_VESTED_REWARDS,
+      asset: longDecimalAsset,
+      balance,
+    };
+
+    const mockSubmit = jest.fn();
+
+    renderComponent({
+      ...props,
+      accounts: [account],
+      submitTransfer: mockSubmit,
+      minQuantumMultiple: '100000',
+    });
+
+    // Select a pubkey
+    await userEvent.selectOptions(
+      screen.getByLabelText('To Vega key'),
+      props.pubKeys[1] // Use not current pubkey so we can check it switches to current pubkey later
+    );
+
+    // Select asset
+    await selectAsset(longDecimalAsset);
+
+    const accountSelect = screen.getByLabelText('From account');
+    const option = within(accountSelect)
+      .getAllByRole('option')
+      .find(
+        (o) => o.getAttribute('value') === `${account.type}-${account.asset.id}`
+      );
+    // plus one for disabled 'please select' option
+
+    expect(option).toHaveTextContent(
+      `${AccountTypeMapping[account.type]} (${expectedBalance} ${
+        account.asset.symbol
+      })`
+    );
+
+    await userEvent.selectOptions(
+      accountSelect,
+      `${AccountType.ACCOUNT_TYPE_VESTED_REWARDS}-${longDecimalAsset.id}`
+    );
+
+    expect(accountSelect).toHaveValue(
+      `${AccountType.ACCOUNT_TYPE_VESTED_REWARDS}-${longDecimalAsset.id}`
+    );
+
+    // Check switch back to connected key
+    const amountInput = screen.getByLabelText('Amount');
+
+    // Test use max button
+    await userEvent.click(screen.getByRole('button', { name: 'Use max' }));
+    expect(amountInput).toHaveValue(expectedBalance);
+
+    await submit();
+
+    await waitFor(() => {
+      // 1003-TRAN-023
+      expect(mockSubmit).toHaveBeenCalledTimes(1);
+      expect(mockSubmit).toHaveBeenCalledWith({
+        fromAccountType: AccountType.ACCOUNT_TYPE_VESTED_REWARDS,
+        toAccountType: AccountType.ACCOUNT_TYPE_GENERAL,
+        to: props.pubKey,
+        asset: longDecimalAsset.id,
+        amount: balance,
+        oneOff: {},
+      });
+    });
+  });
+
   describe('IncludeFeesCheckbox', () => {
     it('validates fields and submits when checkbox is checked', async () => {
       const mockSubmit = jest.fn();

libs/accounts/src/lib/transfer-form.tsx

@@ -5,7 +5,6 @@ import {
   vegaPublicKey,
   addDecimal,
   formatNumber,
-  addDecimalsFormatNumber,
   toBigNum,
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
@@ -214,12 +213,7 @@ export const TransferForm = ({
                 <AssetOption
                   key={a.key}
                   asset={a}
-                  balance={
-                    <Balance
-                      balance={formatNumber(a.balance, a.decimals)}
-                      symbol={a.symbol}
-                    />
-                  }
+                  balance={<Balance balance={a.balance} symbol={a.symbol} />}
                 />
               ))}
             </TradingRichSelect>
@@ -286,8 +280,8 @@ export const TransferForm = ({
                   return (
                     <option value={id} key={id}>
                       {AccountTypeMapping[a.type]} (
-                      {addDecimalsFormatNumber(a.balance, a.asset.decimals)}{' '}
-                      {a.asset.symbol})
+                      {addDecimal(a.balance, a.asset.decimals)} {a.asset.symbol}
+                      )
                     </option>
                   );
                 })}
@@ -413,7 +407,7 @@ export const TransferForm = ({
             type="button"
             className="absolute top-0 right-0 ml-auto text-xs underline"
             onClick={() =>
-              setValue('amount', parseFloat(accountBalance).toString(), {
+              setValue('amount', accountBalance, {
                 shouldValidate: true,
               })
             }

libs/deal-ticket/src/components/deal-ticket/deal-ticket-fee-details.tsx

@@ -151,6 +151,7 @@ export const DealTicketMarginDetails = ({
   const { decimals: assetDecimals, quantum } = asset;
   let marginRequiredBestCase: string | undefined = undefined;
   let marginRequiredWorstCase: string | undefined = undefined;
+
   if (marginEstimate) {
     if (currentMargins) {
       marginRequiredBestCase = (
@@ -288,7 +289,7 @@ export const DealTicketMarginDetails = ({
   const quoteName = getQuoteName(market);
 
   return (
-    <div className="flex flex-col w-full gap-2">
+    <div className="flex flex-col w-full gap-2 pt-2">
       <Accordion>
         <AccordionPanel
           itemId="margin"
@@ -296,7 +297,7 @@ export const DealTicketMarginDetails = ({
             <AccordionPrimitive.Trigger
               data-testid="accordion-toggle"
               className={classNames(
-                'w-full pt-2',
+                'w-full',
                 'flex items-center gap-2 text-xs',
                 'group'
               )}

libs/markets/src/lib/market-utils.ts

@@ -28,6 +28,22 @@ export const getAsset = (market: Partial<Market>) => {
   throw new Error('Failed to retrieve asset. Invalid product type');
 };
 
+export const getProductType = (market: Partial<Market>) => {
+  if (!market.tradableInstrument?.instrument.product) {
+    throw new Error(
+      'Failed to retrieve product type. Invalid tradable instrument'
+    );
+  }
+
+  const type = market.tradableInstrument.instrument.product.__typename;
+
+  if (!type) {
+    throw new Error('Failed to retrieve asset. Invalid product type');
+  }
+
+  return type;
+};
+
 export const getQuoteName = (market: Partial<Market>) => {
   if (!market.tradableInstrument?.instrument.product) {
     throw new Error(