feat(panel-image): use in exit and migrate panels

src/pages/ManageValidator/RightManagePanels/ExitPanel.tsx

@@ -2,6 +2,7 @@ import { Button, Text } from '@status-im/components'
 import { XStack, YStack } from 'tamagui'
 
 import PanelWrapper from './PanelWrapper'
+import PanelImage from './PanelImage'
 
 const ExitPanel = () => {
   const exitQueue = 603
@@ -17,27 +18,12 @@ const ExitPanel = () => {
           {exitQueue}
         </Text>
       </YStack>
-      <YStack
-        space={'$3'}
-        style={{
-          alignItems: 'center',
-          textAlign: 'center',
-          marginBottom: '6px',
-        }}
-      >
-        <img
-          src="/images/exit-validator.png"
-          alt="exit validator"
-          style={{ width: '300px' }}
-        />
-        <div style={{ width: '73%' }}>
-          <Text size={15} color="#2A4AF5">
-            You are about to Exit your validator it is not possible for you to
+      <PanelImage
+        imagePath="exit-validator.png"
+        text=" You are about to Exit your validator it is not possible for you to
             revert this action! Please make sure you understand the
-            consequences.
-          </Text>
-        </div>
-      </YStack>
+            consequences."
+      />
       <XStack
         style={{ width: '100%', justifyContent: 'end', marginTop: '6px' }}
       >

src/pages/ManageValidator/RightManagePanels/MigratePanel.tsx

@@ -5,6 +5,7 @@ import { useState } from 'react'
 
 import KeystoreBackupsCard from '../../../components/General/KeystoreBackupsCard'
 import PanelWrapper from './PanelWrapper'
+import PanelImage from './PanelImage'
 
 const MigratePanel = () => {
   const [isVisibleWarning, setIsVisibleWarning] = useState(true)
@@ -18,27 +19,12 @@ const MigratePanel = () => {
 
   return (
     <PanelWrapper title={'Migrate Validator'}>
-      <YStack
-        space={'$3'}
-        style={{
-          alignItems: 'center',
-          textAlign: 'center',
-          marginBottom: '6px',
-        }}
-      >
-        <img
-          src="/images/migrate.png"
-          alt="migrate"
-          style={{ width: '300px' }}
-        />
-        <div style={{ width: '73%' }}>
-          <Text size={15}>
-            You are about to Migrate your validator it is not possible for you
+      <PanelImage
+        imagePath={'migrate.png'}
+        text="You are about to Migrate your validator it is not possible for you
             to revert this action! Please make sure you understand the
-            consequences.
-          </Text>
-        </div>
-      </YStack>
+            consequences."
+      />
       <KeystoreBackupsCard isSelected={true} />
       <YStack space={'$2'} width={'100%'}>
         <Text size={13} color={'#647084'} weight={'semibold'}>