From fb241d225de897943f443222e0938c1add9fd08e Mon Sep 17 00:00:00 2001
From: alter-eggo <anastas3993@gmail.com>
Date: Tue, 17 Oct 2023 16:24:48 +0400
Subject: [PATCH] feat: add connect btn

---
 .../components/asset-row-grid.tsx              | 18 ++++++++++++++++--
 .../crypto-currency-asset-item.layout.tsx      |  1 +
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/src/app/components/crypto-assets/components/asset-row-grid.tsx b/src/app/components/crypto-assets/components/asset-row-grid.tsx
index ad4f6f8349e..b6110d2184e 100644
--- a/src/app/components/crypto-assets/components/asset-row-grid.tsx
+++ b/src/app/components/crypto-assets/components/asset-row-grid.tsx
@@ -5,14 +5,28 @@ interface AssetRowGridProps {
   balance: React.ReactNode;
   caption: React.ReactNode;
   usdBalance?: React.ReactNode;
+  connectBtn?: React.ReactNode;
 }
-export function AssetRowGrid({ title, balance, caption, usdBalance }: AssetRowGridProps) {
+export function AssetRowGrid({
+  title,
+  balance,
+  caption,
+  usdBalance,
+  connectBtn,
+}: AssetRowGridProps) {
+  const balanceItem = connectBtn ? (
+    <GridItem rowSpan={2} display="flex" justifyContent="end">
+      {connectBtn}
+    </GridItem>
+  ) : (
+    <GridItem textAlign="right">{balance}</GridItem>
+  );
   return (
     <Grid columns={2} gridTemplateColumns="2fr 1fr" gridTemplateRows={2} gap={0}>
       <GridItem textAlign="left" whiteSpace="nowrap" overflow="hidden" textOverflow="ellipsis">
         {title}
       </GridItem>
-      <GridItem textAlign="right">{balance}</GridItem>
+      {balanceItem}
       <GridItem textAlign="left">{caption}</GridItem>
       {usdBalance && <GridItem>{usdBalance}</GridItem>}
     </Grid>
diff --git a/src/app/components/crypto-assets/crypto-currency-asset/crypto-currency-asset-item.layout.tsx b/src/app/components/crypto-assets/crypto-currency-asset/crypto-currency-asset-item.layout.tsx
index 9fb87ff9db9..81d57fcadeb 100644
--- a/src/app/components/crypto-assets/crypto-currency-asset/crypto-currency-asset-item.layout.tsx
+++ b/src/app/components/crypto-assets/crypto-currency-asset/crypto-currency-asset-item.layout.tsx
@@ -99,6 +99,7 @@ export const CryptoCurrencyAssetItemLayout = forwardRefWithAs(
                 {additionalUsdBalanceInfo}
               </Flex>
             }
+            connectBtn={connectBtn}
           />
         </Flag>
         {component}