From d7b941bf1289acbf987375f3748458dede40808c Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Thu, 19 Oct 2023 11:16:37 +0300
Subject: [PATCH] fix: format dashboard code

---
 .../SearchValidatorsInput.stories.tsx               |  1 +
 .../Dashboard/BalanceChartCard/BalanceChartCard.tsx |  2 +-
 .../ConsensusUptime/ConsensusUptimeCard.tsx         |  1 +
 src/pages/Dashboard/Dashboard.tsx                   |  2 +-
 src/pages/Dashboard/DashboardContent.tsx            | 13 +++++--------
 src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx   |  4 ++--
 .../SyncStatusCards/ExecutionClientCard.tsx         |  5 +----
 7 files changed, 12 insertions(+), 16 deletions(-)

diff --git a/src/components/General/RightSideBar/ValidatorsTabs/SearchValidatorsInput.stories.tsx b/src/components/General/RightSideBar/ValidatorsTabs/SearchValidatorsInput.stories.tsx
index 454a1884..6ccd0831 100644
--- a/src/components/General/RightSideBar/ValidatorsTabs/SearchValidatorsInput.stories.tsx
+++ b/src/components/General/RightSideBar/ValidatorsTabs/SearchValidatorsInput.stories.tsx
@@ -1,5 +1,6 @@
 import { useState } from 'react'
 import type { Meta, StoryObj } from '@storybook/react'
+
 import SearchValidatorsInput from './SearchValidatorsInput'
 
 const meta = {
diff --git a/src/pages/Dashboard/BalanceChartCard/BalanceChartCard.tsx b/src/pages/Dashboard/BalanceChartCard/BalanceChartCard.tsx
index 6bb491f6..4eba1b1a 100644
--- a/src/pages/Dashboard/BalanceChartCard/BalanceChartCard.tsx
+++ b/src/pages/Dashboard/BalanceChartCard/BalanceChartCard.tsx
@@ -8,8 +8,8 @@ import DashboardCardWrapper from '../DashboardCardWrapper'
 import LineChart from './LineChart'
 import Icon from '../../../components/General/Icon'
 import { years } from '../../../constants'
-import './calendar.css'
 import { getMonthIndicesFromRange } from '../../../utilities'
+import './calendar.css'
 
 const userGains = [
   10000, 15000, 17500, 20000, 19000, 23222, 25000, 20000, 20000, 21000, 22300, 21000,
diff --git a/src/pages/Dashboard/ConsensusUptime/ConsensusUptimeCard.tsx b/src/pages/Dashboard/ConsensusUptime/ConsensusUptimeCard.tsx
index d6607376..dc5b3342 100644
--- a/src/pages/Dashboard/ConsensusUptime/ConsensusUptimeCard.tsx
+++ b/src/pages/Dashboard/ConsensusUptime/ConsensusUptimeCard.tsx
@@ -6,6 +6,7 @@ import Icon from '../../../components/General/Icon'
 
 const ConsensusUptimeCard = () => {
   const monthlyActivity = [3, 0, 5, 4, 6, 7, 8, 9, 10, 1, 2, 3]
+
   return (
     <Shadow
       variant="$2"
diff --git a/src/pages/Dashboard/Dashboard.tsx b/src/pages/Dashboard/Dashboard.tsx
index 068610a2..3d6b5f39 100644
--- a/src/pages/Dashboard/Dashboard.tsx
+++ b/src/pages/Dashboard/Dashboard.tsx
@@ -1,8 +1,8 @@
 import { XStack } from 'tamagui'
 
 import LeftSidebar from '../../components/General/LeftSidebar/LeftSidebar'
-import DashboardContent from './DashboardContent'
 import RightSidebar from '../../components/General/RightSideBar/RightSidebar'
+import DashboardContent from './DashboardContent'
 
 const Dashboard = () => (
   <XStack style={{ height: '100vh' }}>
diff --git a/src/pages/Dashboard/DashboardContent.tsx b/src/pages/Dashboard/DashboardContent.tsx
index 43c277b6..b64842d4 100644
--- a/src/pages/Dashboard/DashboardContent.tsx
+++ b/src/pages/Dashboard/DashboardContent.tsx
@@ -1,4 +1,5 @@
 import { Stack, XStack, YStack } from 'tamagui'
+import { useEffect, useState } from 'react'
 
 import BasicInfoCards from './BasicInfoCards/BasicInfoCards'
 import AddCardsContainer from '../../components/General/AddCards/AddCardsContainer'
@@ -12,7 +13,7 @@ import StorageCard from './StorageCard/StorageCard'
 import NetworkCard from './NetworkCard/NetworkCard'
 import SyncStatusCard from './SyncStatusCards/SyncStatusCards'
 import MemoryCard from './MemoryCard/MemoryCard'
-import { useEffect, useState } from 'react'
+
 const DashboardContent = () => {
   const [windowWidth, setWindowWidth] = useState(window.innerWidth)
 
@@ -26,21 +27,21 @@ const DashboardContent = () => {
       window.removeEventListener('resize', handleResize)
     }
   }, [])
+
   return (
     <YStack
       space="$4"
       alignItems="start"
       px="24px"
+      minWidth="500px"
+      width="50vh"
       style={{
         flexGrow: '1',
         marginTop: '16px',
         overflowY: 'auto',
       }}
-      minWidth="500px"
-      width="50vh"
     >
       <TitleLogo />
-
       <Stack
         style={{
           display: 'grid',
@@ -50,12 +51,9 @@ const DashboardContent = () => {
       >
         <SyncStatusCard />
         <AddCardsContainer />
-
         <BalanceChartCard />
       </Stack>
-
       <BasicInfoCards />
-
       <XStack space="$3" flexWrap="wrap">
         <YStack space="$4">
           <XStack justifyContent="space-between">
@@ -64,7 +62,6 @@ const DashboardContent = () => {
           </XStack>
           <DeviceUptime />
         </YStack>
-
         <YStack space="$4" flexWrap="wrap">
           <XStack space="$4">
             <StorageCard maxStorage={100} storage={82} />
diff --git a/src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx b/src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx
index 51c339a0..ad967c15 100644
--- a/src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx
+++ b/src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx
@@ -3,10 +3,10 @@ import { Stack, XStack, YStack } from 'tamagui'
 import { DateRange } from 'react-day-picker'
 import { useState } from 'react'
 
-import UptimeChart from '../UptimeChart/UptimeChart'
 import Icon from '../../../components/General/Icon'
-import { getMonthIndicesFromRange } from '../../../utilities'
+import UptimeChart from '../UptimeChart/UptimeChart'
 import DashboardCardWrapper from '../DashboardCardWrapper'
+import { getMonthIndicesFromRange } from '../../../utilities'
 
 const DeviceUptime = () => {
   const [isCalendarVisible, setIsCalendarVisible] = useState(false)
diff --git a/src/pages/Dashboard/SyncStatusCards/ExecutionClientCard.tsx b/src/pages/Dashboard/SyncStatusCards/ExecutionClientCard.tsx
index 27442d10..eb1db77e 100644
--- a/src/pages/Dashboard/SyncStatusCards/ExecutionClientCard.tsx
+++ b/src/pages/Dashboard/SyncStatusCards/ExecutionClientCard.tsx
@@ -1,11 +1,9 @@
 import { Separator, Stack, XStack, YStack } from 'tamagui'
 import { Shadow, Text } from '@status-im/components'
 import { SwapIcon } from '@status-im/icons'
-import { CSSProperties } from 'react'
 
 import { formatNumbersWithComa } from '../../../utilities'
 import IconText from '../../../components/General/IconText'
-
 import StandardGauge from '../../../components/Charts/StandardGauge'
 
 type ExecutionClientCardProps = {
@@ -28,10 +26,9 @@ const ExecutionClientCard = ({ value, total }: ExecutionClientCardProps) => {
       color: '#E7EAEE',
     },
   ]
-  const style: CSSProperties = {}
 
   return (
-    <Shadow variant="$1" style={style}>
+    <Shadow variant="$1">
       <YStack>
         <Stack style={{ minHeight: '90px', padding: '12px 16px' }}>
           <Text size={15} weight={'semibold'} color="#647084">