add network icons

renegade-fi · Oct 18, 2024 · 6004a6f · 6004a6f
1 parent c1b4846
commit 6004a6f
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 21 deletions.
diff --git a/components/dialogs/transfer/default-form.tsx b/components/dialogs/transfer/default-form.tsx
@@ -549,9 +549,19 @@ export function DefaultForm({
             />
             <div className="space-y-1">
               <div className="flex justify-between">
-                <div className="text-sm text-muted-foreground">
+                <div className="flex items-center gap-1 text-sm text-muted-foreground">
                   Balance&nbsp;on&nbsp;
-                  {isDeposit ? "Arbitrum" : "Renegade"}
+                  {isDeposit ? (
+                    <>
+                      <TokenIcon
+                        ticker="ARB"
+                        size={16}
+                      />
+                      Arbitrum
+                    </>
+                  ) : (
+                    "Renegade"
+                  )}
                 </div>
                 <Button
                   className="h-5 p-0"
@@ -578,8 +588,13 @@ export function DefaultForm({
                 hidden: !userHasL1Balance || !isDeposit,
               })}
             >
-              <div className="text-sm text-muted-foreground">
-                Balance on Ethereum
+              <div className="flex items-center gap-1 text-sm text-muted-foreground">
+                Balance on&nbsp;
+                <TokenIcon
+                  ticker="WETH"
+                  size={16}
+                />
+                Ethereum
               </div>
               <Tooltip>
                 <TooltipTrigger
@@ -590,7 +605,7 @@ export function DefaultForm({
                 >
                   <Button
                     asChild
-                    className="h-5 p-0 font-mono text-sm"
+                    className="h-5 cursor-pointer p-0 font-mono text-sm"
                     type="button"
                     variant="link"
                   >

diff --git a/components/dialogs/transfer/usdc-form.tsx b/components/dialogs/transfer/usdc-form.tsx
@@ -29,6 +29,7 @@ import { useIsMaxBalances } from "@/components/dialogs/transfer/use-is-max-balan
 import { useSwapQuote } from "@/components/dialogs/transfer/use-swap-quote"
 import { useSwapState } from "@/components/dialogs/transfer/use-swap-state"
 import { NumberInput } from "@/components/number-input"
+import { TokenIcon } from "@/components/token-icon"
 import { Button } from "@/components/ui/button"
 import {
   DialogClose,
@@ -654,8 +655,13 @@ export function USDCForm({
             />
             <div className="space-y-1">
               <div className="flex items-center justify-between">
-                <div className="text-sm text-muted-foreground">
-                  Balance on Arbitrum
+                <div className="flex items-center gap-1 text-sm text-muted-foreground">
+                  Balance on&nbsp;
+                  <TokenIcon
+                    ticker="ARB"
+                    size={16}
+                  />
+                  Arbitrum
                 </div>
                 <div className="flex items-center">
                   <ResponsiveTooltip>
@@ -732,14 +738,19 @@ export function USDCForm({
                 hidden: !userHasL1Balance,
               })}
             >
-              <div className="text-sm text-muted-foreground">
-                Balance on Ethereum
+              <div className="flex items-center gap-1 text-sm text-muted-foreground">
+                Balance on&nbsp;
+                <TokenIcon
+                  ticker="WETH"
+                  size={16}
+                />
+                Ethereum
               </div>
               <Tooltip>
                 <TooltipTrigger asChild>
                   <Button
                     asChild
-                    className="h-5 p-0 font-mono text-sm"
+                    className="h-5 cursor-pointer p-0 font-mono text-sm"
                     type="button"
                     variant="link"
                   >

diff --git a/components/dialogs/transfer/weth-form.tsx b/components/dialogs/transfer/weth-form.tsx
@@ -29,6 +29,7 @@ import {
 } from "@/components/dialogs/transfer/transfer-details-page"
 import { useIsMaxBalances } from "@/components/dialogs/transfer/use-is-max-balances"
 import { NumberInput } from "@/components/number-input"
+import { TokenIcon } from "@/components/token-icon"
 import { Button } from "@/components/ui/button"
 import {
   DialogClose,
@@ -703,9 +704,19 @@ export function WETHForm({
             />
             <div className="space-y-1">
               <div className="flex items-center justify-between">
-                <div className="text-sm text-muted-foreground">
+                <div className="flex items-center gap-1 text-sm text-muted-foreground">
                   Balance&nbsp;on&nbsp;
-                  {isDeposit ? "Arbitrum" : "Renegade"}
+                  {isDeposit ? (
+                    <>
+                      <TokenIcon
+                        ticker="ARB"
+                        size={16}
+                      />
+                      Arbitrum
+                    </>
+                  ) : (
+                    "Renegade"
+                  )}
                 </div>
                 <div className="flex items-center">
                   <ResponsiveTooltip>
@@ -783,14 +794,20 @@ export function WETHForm({
             </div>
 
             <div
-              className={cn("flex justify-between", {
-                hidden: !userHasL1WETHBalance && !userHasL1ETHBalance,
+              className={cn("flex items-start justify-between", {
+                hidden:
+                  (!userHasL1WETHBalance && !userHasL1ETHBalance) || !isDeposit,
               })}
             >
-              <div className="text-sm text-muted-foreground">
-                Balance on Ethereum
+              <div className="flex items-center gap-1 text-sm text-muted-foreground">
+                Balance on&nbsp;
+                <TokenIcon
+                  ticker="WETH"
+                  size={16}
+                />
+                Ethereum
               </div>
-              <div className="flex flex-col items-end space-y-1">
+              <div className="flex flex-col items-end">
                 <Tooltip>
                   <TooltipTrigger
                     asChild
@@ -800,7 +817,7 @@ export function WETHForm({
                   >
                     <Button
                       asChild
-                      className="h-5 p-0 font-mono text-sm"
+                      className="mb-1 h-5 cursor-pointer p-0 font-mono text-sm"
                       type="button"
                       variant="link"
                     >
@@ -832,7 +849,7 @@ export function WETHForm({
                   >
                     <Button
                       asChild
-                      className="h-5 p-0 font-mono text-sm"
+                      className="h-5 cursor-pointer p-0 font-mono text-sm"
                       type="button"
                       variant="link"
                     >
@@ -858,7 +875,7 @@ export function WETHForm({
             <div
               className={cn({
                 hidden:
-                  !isDeposit && !userHasL1WETHBalance && !userHasL1ETHBalance,
+                  !isDeposit || (!userHasL1WETHBalance && !userHasL1ETHBalance),
               })}
             >
               <BridgePrompt

diff --git a/providers/wagmi-provider/wagmi-provider.tsx b/providers/wagmi-provider/wagmi-provider.tsx
@@ -51,7 +51,7 @@ export const config = createConfig(
 export const mainnetConfig = createConfig({
   chains: [mainnet],
   transports: {
-    [mainnet.id]: http("https://node1.web3api.com"),
+    [mainnet.id]: http(),
   },
 })