From 25878fcfca0e5e9d6b4d5ce3df8375a3ea806599 Mon Sep 17 00:00:00 2001
From: Jaco <jacogr@gmail.com>
Date: Sat, 11 Jun 2022 11:04:30 +0200
Subject: [PATCH] isSome checks on pool roles (#7725)

* isSome checks on pool roles

* Lazy render
---
 packages/page-staking/src/Pools/Pool.tsx | 32 ++++++++++++++----------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/packages/page-staking/src/Pools/Pool.tsx b/packages/page-staking/src/Pools/Pool.tsx
index 2823703d33..ce533b84da 100644
--- a/packages/page-staking/src/Pools/Pool.tsx
+++ b/packages/page-staking/src/Pools/Pool.tsx
@@ -101,25 +101,31 @@ function Pool ({ className = '', members, ownAccounts, params, poolId }: Props):
           }
         </td>
       </tr>
-      {info && (
+      {info && isExpanded && (
         <tr className={`${className} ${isExpanded ? 'isExpanded' : 'isCollapsed'}`}>
           <td colSpan={4}>
-            <div className='label-column-right'>
-              <div className='label'>{t('root')}</div>
-              <div className='inline-balance'><AddressMini value={info.bonded.roles.root} /></div>
-            </div>
+            {info.bonded.roles.root.isSome && (
+              <div className='label-column-right'>
+                <div className='label'>{t('root')}</div>
+                <div className='inline-balance'><AddressMini value={info.bonded.roles.root} /></div>
+              </div>
+            )}
             <div className='label-column-right'>
               <div className='label'>{t('creator')}</div>
               <div className='inline-balance'><AddressMini value={info.bonded.roles.depositor} /></div>
             </div>
-            <div className='label-column-right'>
-              <div className='label'>{t('nominator')}</div>
-              <div className='inline-balance'><AddressMini value={info.bonded.roles.nominator} /></div>
-            </div>
-            <div className='label-column-right'>
-              <div className='label'>{t('toggler')}</div>
-              <div className='inline-balance'><AddressMini value={info.bonded.roles.stateToggler} /></div>
-            </div>
+            {info.bonded.roles.nominator.isSome && (
+              <div className='label-column-right'>
+                <div className='label'>{t('nominator')}</div>
+                <div className='inline-balance'><AddressMini value={info.bonded.roles.nominator} /></div>
+              </div>
+            )}
+            {info.bonded.roles.stateToggler.isSome && (
+              <div className='label-column-right'>
+                <div className='label'>{t('toggler')}</div>
+                <div className='inline-balance'><AddressMini value={info.bonded.roles.stateToggler} /></div>
+              </div>
+            )}
           </td>
           <td colSpan={4}>
             <div className='label-column-right'>