From f777542dc12fbfd95f6cc3c86d63b994f61141e7 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Thu, 18 Jan 2024 11:42:39 +0200
Subject: [PATCH] feat: use new validator name address component to validator
 list item

---
 .../ValidatorsTabs/ValidatorListItem.tsx      | 23 ++++++++-----------
 1 file changed, 9 insertions(+), 14 deletions(-)

diff --git a/src/components/General/RightSideBar/ValidatorsTabs/ValidatorListItem.tsx b/src/components/General/RightSideBar/ValidatorsTabs/ValidatorListItem.tsx
index e73c63ae..e83a2666 100644
--- a/src/components/General/RightSideBar/ValidatorsTabs/ValidatorListItem.tsx
+++ b/src/components/General/RightSideBar/ValidatorsTabs/ValidatorListItem.tsx
@@ -1,9 +1,8 @@
 import { useState } from 'react'
-import { XStack, YStack } from 'tamagui'
-import { Avatar, Checkbox, Text } from '@status-im/components'
-import { VerifiedIcon, ContactIcon } from '@status-im/icons'
+import { XStack } from 'tamagui'
+import { Avatar, Checkbox } from '@status-im/components'
 
-import { getFormattedValidatorAddress } from '../../../../utilities'
+import ValidatorNameAddress from '../../ValidatorNameAddress'
 
 type ValidatorListItemProps = {
   name: string
@@ -54,16 +53,12 @@ const ValidatorListItem = ({
             [11, 20],
           ]}
         />
-        <YStack pl="8px">
-          <XStack space={'$1'} alignItems="center">
-            <Text size={13} weight={'semibold'}>
-              Validator {name}
-            </Text>
-            {isVerified && <VerifiedIcon size={20} />}
-            {isAvatarChipIncluded && <ContactIcon size={20} />}
-          </XStack>
-          <Text size={13}>{getFormattedValidatorAddress(validatorAddress)}</Text>
-        </YStack>
+        <ValidatorNameAddress
+          name={name}
+          address={validatorAddress}
+          isVerified={isVerified}
+          isAvatarChipIncluded={isAvatarChipIncluded}
+        />
       </XStack>
       {isSelected && <Checkbox id={name} variant="outline" size={20} selected={isSelected} />}
     </XStack>