From ef9717d2f070e0c749b8e039fcc869dabb5b0dfb Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Fri, 22 Mar 2024 11:25:15 +0200
Subject: [PATCH] feat(manage-validator): add left sidebar

---
 .../ManageValidator/ManageValidator.tsx       | 57 ++++++++++---------
 1 file changed, 30 insertions(+), 27 deletions(-)

diff --git a/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx b/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx
index df3c537f..450cf751 100644
--- a/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx
+++ b/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx
@@ -1,7 +1,7 @@
 import { XStack, YStack } from 'tamagui'
-
 import { Stack } from 'tamagui'
 
+import LeftSidebar from '../../../components/General/LeftSidebar/LeftSidebar'
 import RightManageSettings from './RightManageSettings/RightManageSettings'
 import ValidatorInfo from './ValidatorInfo'
 import DepositStatus from './DepositStatus'
@@ -15,33 +15,36 @@ import ValidatorSettingsCards from './ValidatorSeettingsCards'
 
 const ManageValidator = () => {
   return (
-    <XStack
-      width={'min-content'}
-      alignItems="flex-start"
-      style={{
-        flexGrow: 1,
-      }}
-    >
-      <Stack
-        width={'50%'}
-        maxWidth="50%"
-        flexGrow={1}
-        space={'$2'}
-        style={{ borderRight: '1px solid #DCE0E5' }}
+    <XStack style={{ height: '100vh' }}>
+      <LeftSidebar />
+      <XStack
+        width={'min-content'}
+        alignItems="flex-start"
+        style={{
+          flexGrow: 1,
+        }}
       >
-        <Header />
-        <YStack backgroundColor="#F4F6FE" space={'$3'}>
-          <ValidatorInfo />
-          <DepositStatus />
-          <ValidatorBalance />
-        </YStack>
-        <ValidatorDataCards />
-        <ValidatorSettingsCards></ValidatorSettingsCards>
-        <ValidatorGraffiti />
-        <ValidatorDataTabs />
-        <Footer />
-      </Stack>
-      <RightManageSettings />
+        <Stack
+          width={'50%'}
+          maxWidth="50%"
+          flexGrow={1}
+          space={'$2'}
+          style={{ borderRight: '1px solid #DCE0E5' }}
+        >
+          <Header />
+          <YStack backgroundColor="#F4F6FE" space={'$3'}>
+            <ValidatorInfo />
+            <DepositStatus />
+            <ValidatorBalance />
+          </YStack>
+          <ValidatorDataCards />
+          <ValidatorSettingsCards />
+          <ValidatorGraffiti />
+          <ValidatorDataTabs />
+          <Footer />
+        </Stack>
+        <RightManageSettings />
+      </XStack>
     </XStack>
   )
 }