fix: Coin logos not loading in the Balance Widget (#1752)

immutable · May 10, 2024 · bd76492 · bd76492
1 parent 9142ba1
commit bd76492
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/packages/checkout/widgets-lib/src/widgets/wallet/components/BalanceItem/BalanceItem.tsx b/packages/checkout/widgets-lib/src/widgets/wallet/components/BalanceItem/BalanceItem.tsx
@@ -5,6 +5,8 @@ import {
 import {
   IMTBLWidgetEvents, TokenFilterTypes, TokenInfo, WidgetTheme,
 } from '@imtbl/checkout-sdk';
+import { IMAGE_RESIZER_URL } from 'lib';
+import { Environment } from '@imtbl/config';
 import { ShowMenuItem } from './BalanceItemStyles';
 import { BalanceInfo } from '../../functions/tokenBalances';
 import { WalletContext } from '../../context/WalletContext';
@@ -44,6 +46,7 @@ export function BalanceItem({
   );
 
   const isPassport = isPassportProvider(provider);
+  const environment = checkout?.config.environment ?? Environment.PRODUCTION;
 
   useEffect(() => {
     const getOnRampAllowedTokens = async () => {
@@ -89,8 +92,9 @@ export function BalanceItem({
   return (
     <MenuItem testId={`balance-item-${balanceInfo.symbol}`} emphasized>
       <MenuItem.FramedImage
+        imageResizeServiceUrl={IMAGE_RESIZER_URL[environment]}
         imageUrl={balanceInfo.icon}
-        defaultImageUrl={getDefaultTokenImage(checkout?.config.environment, theme)}
+        defaultImageUrl={getDefaultTokenImage(environment, theme)}
         circularFrame
       />
       <MenuItem.Label>{balanceInfo.symbol}</MenuItem.Label>