feat: create components for connected wallet

src/pages/ValidatorOnboarding/Deposit/ConnectedWallet.tsx

@@ -1,7 +1,35 @@
-import { XStack } from 'tamagui'
+import { Avatar, Text } from '@status-im/components'
+import { XStack, YStack } from 'tamagui'
 
 const ConnectedWallet = () => {
-  return <XStack></XStack>
+  return (
+    <XStack style={{ width: '100%', justifyContent: 'space-between' }}>
+      <XStack space={'$2'}>
+        <Avatar
+          type="icon"
+          size={32}
+          icon={<img src={'/icons/eth-logo.svg'} alt="eth-logo" style={{ width: '100%' }} />}
+        />
+        <YStack space={'$1'}>
+          <Text size={13} weight={'semibold'}>
+            Ethereum Mainnet
+          </Text>
+          <Text size={13}>0xb9d...c35</Text>
+          <Text size={13} color="#2A4CF4">
+            Connected
+          </Text>
+        </YStack>
+      </XStack>
+      <YStack>
+        <Text size={15} weight={'semibold'}>
+          Balance
+        </Text>
+        <Text size={27} weight={'semibold'}>
+          68.21 ETH
+        </Text>
+      </YStack>
+    </XStack>
+  )
 }
 
 export default ConnectedWallet

src/pages/ValidatorOnboarding/Deposit/Deposit.tsx

@@ -2,6 +2,7 @@ import { DividerLine, InformationBox, Text } from '@status-im/components'
 import { PlaceholderIcon } from '@status-im/icons'
 import { YStack } from 'tamagui'
 import { useState } from 'react'
+import { useSelector } from 'react-redux'
 
 import ValidatorRequest from './ValidatorRequest'
 import Validators from './Validators'
@@ -9,7 +10,6 @@ import ConnectWallet from './ConnectWallet'
 import ConnectedWallet from './ConnectedWallet'
 import DepositTitle from './DepositTitle'
 import DepositSubtitle from './DepositSubtitle'
-import { useSelector } from 'react-redux'
 import { RootState } from '../../../redux/store'
 
 const Deposit = () => {