Hide the Era Points from the validator page (#48)

* Hide the Era Points from the validator page

* A0-3205: Simplify hide era points chart

---------

Co-authored-by: Wojciech Basiura <[email protected]>

Author: piotrMocz

packages/page-staking/src/Query/Validator.tsx

@@ -6,34 +6,40 @@ import type { Props } from './types.js';
 import React from 'react';
 
 import { Columar, styled } from '@polkadot/react-components';
+import { useApi } from '@polkadot/react-hooks';
 
 import ChartPoints from './ChartPoints.js';
 import ChartPrefs from './ChartPrefs.js';
 import ChartRewards from './ChartRewards.js';
 import ChartStake from './ChartStake.js';
 
 function Validator ({ className = '', labels, validatorId }: Props): React.ReactElement<Props> | null {
+  const { systemChain } = useApi();
+  const isAlephChain = systemChain.includes('Aleph Zero');
+
   return (
     <StyledColumar className={className}>
       <Columar.Column>
-        <ChartPoints
+        <ChartStake
           labels={labels}
           validatorId={validatorId}
         />
-        <ChartRewards
+        <ChartPrefs
           labels={labels}
           validatorId={validatorId}
         />
       </Columar.Column>
       <Columar.Column>
-        <ChartStake
-          labels={labels}
-          validatorId={validatorId}
-        />
-        <ChartPrefs
+        <ChartRewards
           labels={labels}
           validatorId={validatorId}
         />
+        {!isAlephChain && (
+          <ChartPoints
+            labels={labels}
+            validatorId={validatorId}
+          />
+        )}
       </Columar.Column>
     </StyledColumar>
   );