diff --git a/libs/assets/src/lib/asset-option.tsx b/libs/assets/src/lib/asset-option.tsx
index 0df06a490..c993b938a 100644
--- a/libs/assets/src/lib/asset-option.tsx
+++ b/libs/assets/src/lib/asset-option.tsx
@@ -1,13 +1,54 @@
import { Option } from '@vegaprotocol/ui-toolkit';
import type { AssetFieldsFragment } from './__generated__/Asset';
+import classNames from 'classnames';
+import { t } from '@vegaprotocol/i18n';
+import type { ReactNode } from 'react';
-export const AssetOption = ({ asset }: { asset: AssetFieldsFragment }) => {
+type AssetOptionProps = {
+ asset: AssetFieldsFragment;
+ balance?: ReactNode;
+};
+
+export const FetchingBalance = () => (
+
{t('Fetching balanceā¦')}
+);
+
+export const Balance = ({
+ balance,
+ symbol,
+}: {
+ balance?: string;
+ symbol: string;
+}) =>
+ balance ? (
+
+ {balance} {symbol}
+
+ ) : (
+ {t('Fetching balanceā¦')}
+ );
+
+export const AssetOption = ({ asset, balance }: AssetOptionProps) => {
return (