update validator details blocks component to display coming soon

apps/web-neutron/src/screens/validator_details/components/blocks/index.tsx

@@ -0,0 +1,19 @@
+import Typography from '@mui/material/Typography';
+import useAppTranslation from '@/hooks/useAppTranslation';
+import Box from '@/components/box';
+import useStyles from '@/screens/validator_details/components/blocks/styles';
+
+const Blocks = ({ className }) => {
+  const { t } = useAppTranslation('validators');
+  const { classes, cx } = useStyles();
+  return (
+    <Box className={cx(classes.root, className)}>
+      <Typography variant="h2">{t('lastBlocks')}</Typography>
+      <div className={classes.content}>
+        <Typography variant="h4">{t('comingSoon')}</Typography>
+      </div>
+    </Box>
+  );
+};
+
+export default Blocks;

apps/web-neutron/src/screens/validator_details/components/blocks/styles.ts

@@ -0,0 +1,21 @@
+import { makeStyles } from 'tss-react/mui';
+
+const useStyles = makeStyles()(theme => ({
+  root: {
+    '& .MuiTypography-h2': {
+      marginBottom: theme.spacing(2),
+    },
+  },
+  content: {
+    flex: 1,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-around',
+    color: theme.palette.custom.fonts.fontThree,
+    backgroundColor: theme.palette.custom.general.surfaceTwo,
+    borderRadius: '8px',
+    height: '22vh',
+  },
+}));
+
+export default useStyles;

packages/ui/public/locales/en/web_neutron.json

@@ -7,5 +7,6 @@
   "params.transferTimeoutPeriod": "Transfer Timeout Period",
   "params.consumerRedistributionFraction": "Consumer Redistribution Fraction",
   "params.blocksPerDistributionTransmission": "Blocks Per Distribution Transmission",
-  "validators.stakingDataIsSourcedFromCosmoshub": "The staking data is sourced from Cosmos Hub, as Neutron is a consumer chain."
+  "validators.stakingDataIsSourcedFromCosmoshub": "The staking data is sourced from Cosmos Hub, as Neutron is a consumer chain.",
+  "validators.comingSoon": "Coming soon"
 }