From 2f470a84c18c1d93bb6d4f45f544b6900ad5e1ab Mon Sep 17 00:00:00 2001
From: plam-ml <127577476+plam-ml@users.noreply.github.com>
Date: Thu, 2 Nov 2023 09:33:02 -0700
Subject: [PATCH] [Wallet]: add info to input section (#14619)

## Description

- Add info to input section

<img width="570" alt="Screenshot 2023-11-01 at 8 42 10 PM"
src="https://github.com/MystenLabs/sui/assets/127577476/7a317464-21d4-49e6-b820-e744ecd796bd">

<img width="581" alt="Screenshot 2023-11-01 at 9 21 49 PM"
src="https://github.com/MystenLabs/sui/assets/127577476/52662e94-cbe2-4692-a155-cb50da3d935a">


## Test Plan

How did you test the new or updated feature?

---
If your changes are not user-facing and not a breaking change, you can
skip the following section. Otherwise, please indicate what changed, and
then add to the Release Notes section as highlighted during the release
process.

### Type of Change (Check all that apply)

- [ ] protocol change
- [ ] user-visible impact
- [ ] breaking change for a client SDKs
- [ ] breaking change for FNs (FN binary must upgrade)
- [ ] breaking change for validators or node operators (must upgrade
binaries)
- [ ] breaking change for on-chain data layout
- [ ] necessitate either a data wipe or data migration

### Release notes
---
 .../src/ui/app/pages/home/tokens/TokensDetails.tsx   | 12 +++++++-----
 apps/wallet/src/ui/app/pages/swap/ToAssetSection.tsx |  9 ++++++++-
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/apps/wallet/src/ui/app/pages/home/tokens/TokensDetails.tsx b/apps/wallet/src/ui/app/pages/home/tokens/TokensDetails.tsx
index 2c2fd3cc12eb3..7bcc74603a01a 100644
--- a/apps/wallet/src/ui/app/pages/home/tokens/TokensDetails.tsx
+++ b/apps/wallet/src/ui/app/pages/home/tokens/TokensDetails.tsx
@@ -121,11 +121,13 @@ export function TokenRow({
 						{coinMeta?.name || symbol}
 					</Text>
 
-					<div className="group-hover:hidden">
-						<Text variant="subtitle" color="steel-dark" weight="medium">
-							{symbol}
-						</Text>
-					</div>
+					{renderActions && (
+						<div className="group-hover:hidden">
+							<Text variant="subtitle" color="steel-dark" weight="medium">
+								{symbol}
+							</Text>
+						</div>
+					)}
 
 					{renderActions ? (
 						<div className="group-hover:flex hidden gap-2.5 items-center">
diff --git a/apps/wallet/src/ui/app/pages/swap/ToAssetSection.tsx b/apps/wallet/src/ui/app/pages/swap/ToAssetSection.tsx
index 803d29fbfd0b8..0a0260c7adbce 100644
--- a/apps/wallet/src/ui/app/pages/swap/ToAssetSection.tsx
+++ b/apps/wallet/src/ui/app/pages/swap/ToAssetSection.tsx
@@ -13,7 +13,7 @@ import {
 } from '_pages/swap/constants';
 import { MaxSlippage, MaxSlippageModal } from '_pages/swap/MaxSlippage';
 import { ToAssets } from '_pages/swap/ToAssets';
-import { useSwapData } from '_pages/swap/utils';
+import { getUSDCurrency, useSwapData } from '_pages/swap/utils';
 import { useDeepBookContext } from '_shared/deepBook/context';
 import { type BalanceChange } from '@mysten/sui.js/client';
 import { SUI_TYPE_ARG } from '@mysten/sui.js/utils';
@@ -116,6 +116,13 @@ export function ToAssetSection({
 						</Text>
 					)
 				}
+				info={
+					isValid && (
+						<Text variant="subtitleSmall" color="steel-dark">
+							{getUSDCurrency(isAsk ? toAssetAmountAsNum : Number(amount))}
+						</Text>
+					)
+				}
 			/>
 
 			{isValid && toAssetAmountAsNum && amount ? (