diff --git a/src/features/Web3/components/Conversion/Conversion.tsx b/src/features/Web3/components/Conversion/Conversion.tsx
index 4d233070..b4306cf4 100644
--- a/src/features/Web3/components/Conversion/Conversion.tsx
+++ b/src/features/Web3/components/Conversion/Conversion.tsx
@@ -4,7 +4,7 @@ import { useStore } from '@nanostores/react'
import { $selectedToken } from '@features/Web3/stores/selectedToken'
import { $amount } from '@features/Web3/stores'
-export function Conversion(): ReactElement {
+export function Conversion(): ReactElement | null {
const selectedToken = useStore($selectedToken)
const amount = useStore($amount)
@@ -26,7 +26,7 @@ export function Conversion(): ReactElement {
setEuro(euro)
}, [selectedToken?.price, amount])
- return (
+ return selectedToken?.price?.usd ? (
{`= $ ${dollar}`}
{`= € ${euro}`}
- )
+ ) : null
}
diff --git a/src/features/Web3/components/TokenSelect/Token.css b/src/features/Web3/components/TokenSelect/Token.css
index 6aa1369b..7208b77f 100644
--- a/src/features/Web3/components/TokenSelect/Token.css
+++ b/src/features/Web3/components/TokenSelect/Token.css
@@ -42,6 +42,7 @@
.TokenName,
.TokenBalance {
margin: 0;
+ text-align: left;
}
.TokenName {
diff --git a/src/features/Web3/components/TokenSelect/Token.tsx b/src/features/Web3/components/TokenSelect/Token.tsx
index 356e3c24..03f56a79 100644
--- a/src/features/Web3/components/TokenSelect/Token.tsx
+++ b/src/features/Web3/components/TokenSelect/Token.tsx
@@ -26,7 +26,11 @@ export const Token = forwardRef(
: 0
const valueInUsdFormatted = formatCurrency(valueInUsd, 'USD', locale)
- return balance && parseInt(balance) !== 0 && valueInUsd >= 1 ? (
+ // const hasBalanceAndValue =
+ // balance && parseInt(balance) !== 0 && valueInUsd >= 1
+ const hasBalance = balance && parseInt(balance) !== 0
+
+ return hasBalance ? (
(
{token?.name}
{balance}
- {valueInUsdFormatted}
+ {valueInUsd ? (
+ {valueInUsdFormatted}
+ ) : null}
diff --git a/src/features/Web3/components/TokenSelect/TokenSelect.css b/src/features/Web3/components/TokenSelect/TokenSelect.css
index b1bb31fa..3c1363f9 100644
--- a/src/features/Web3/components/TokenSelect/TokenSelect.css
+++ b/src/features/Web3/components/TokenSelect/TokenSelect.css
@@ -30,6 +30,8 @@
background-color: var(--body-background-color);
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
+ z-index: 100;
+ position: relative;
}
.SelectViewport {
diff --git a/src/features/Web3/components/TokenSelect/TokenSelect.tsx b/src/features/Web3/components/TokenSelect/TokenSelect.tsx
index 986d7aef..f10bc6ae 100644
--- a/src/features/Web3/components/TokenSelect/TokenSelect.tsx
+++ b/src/features/Web3/components/TokenSelect/TokenSelect.tsx
@@ -41,6 +41,7 @@ export function TokenSelect() {
value={selectedToken?.address}
onValueChange={(value: `0x${string}`) => handleValueChange(value)}
disabled={isLoading}
+ name="selectedToken"
>
- {/* @ts-expect-error-next-line: style actually is passed through and is needed in our case */}
-
-
-
-
-
-
-
-
- In Your Wallet
-
- {items}
-
-
-
-
-
-
-
+
+
+
+
+
+
+ In Your Wallet
+ {items}
+
+
+
+
+
+
) : isLoading ? (