This commit is contained in:
Hristo Nedelkov 2023-10-17 14:47:19 +03:00
parent 7f4aaed759
commit aeca7ecfec
9 changed files with 65 additions and 69 deletions

View File

@ -95,9 +95,7 @@ const BalanceChartCard = () => {
</XStack>
</XStack>
<LineChart years={filteredYears} userGains={filteredUserGains} />
</YStack>
</DashboardCardWrapper>
)

View File

@ -32,17 +32,15 @@ const LineChart = ({ years, userGains }: LineChartProps) => {
],
}
const options = {
responsive: true,
maintainAspectRatio: false,
}
return (
<Stack >
<Stack>
<Line data={data} options={options} />
</Stack>
)
}
export default LineChart

View File

@ -14,7 +14,7 @@ const ConsensusUptimeCard = () => {
width: '48%',
}}
>
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>
Consensus Uptime

View File

@ -10,6 +10,6 @@ const Dashboard = () => (
<DashboardContent />
<RightSidebar />
</XStack>
);
)
export default Dashboard

View File

@ -35,4 +35,4 @@ const DashboardCardWrapper = ({
</Shadow>
)
}
export default DashboardCardWrapper
export default DashboardCardWrapper

View File

@ -1,63 +1,63 @@
import { XStack, YStack } from 'tamagui';
import { XStack, YStack } from 'tamagui'
import BasicInfoCards from './BasicInfoCards/BasicInfoCards';
import AddCardsContainer from '../../components/General/AddCards/AddCardsContainer';
import BalanceChartCard from './BalanceChartCard/BalanceChartCard';
import CPUCard from './CPULoad/CPUCard';
import ConsensusUptimeCard from './ConsensusUptime/ConsensusUptimeCard';
import ExecutionUptime from './ExecutionUptime/ExecutionUptime';
import DeviceUptime from './DeviceUptime/DeviceUptime';
import TitleLogo from './TitleLogo';
import StorageCard from './StorageCard/StorageCard';
import NetworkCard from './NetworkCard/NetworkCard';
import SyncStatusCard from './SyncStatusCards/SyncStatusCards';
import MemoryCard from './MemoryCard/MemoryCard';
import BasicInfoCards from './BasicInfoCards/BasicInfoCards'
import AddCardsContainer from '../../components/General/AddCards/AddCardsContainer'
import BalanceChartCard from './BalanceChartCard/BalanceChartCard'
import CPUCard from './CPULoad/CPUCard'
import ConsensusUptimeCard from './ConsensusUptime/ConsensusUptimeCard'
import ExecutionUptime from './ExecutionUptime/ExecutionUptime'
import DeviceUptime from './DeviceUptime/DeviceUptime'
import TitleLogo from './TitleLogo'
import StorageCard from './StorageCard/StorageCard'
import NetworkCard from './NetworkCard/NetworkCard'
import SyncStatusCard from './SyncStatusCards/SyncStatusCards'
import MemoryCard from './MemoryCard/MemoryCard'
const DashboardContent = () => (
<YStack
space="$4"
alignItems="start"
px="24px"
style={{
flexGrow: '1',
marginTop: '16px',
width: '50%',
overflowY: 'auto',
maxHeight: '100vh'
}}
minWidth="500px"
>
<TitleLogo />
<XStack space="$4" flexWrap="wrap">
<XStack space="$4" flexWrap="wrap">
<SyncStatusCard />
<AddCardsContainer />
</XStack>
<BalanceChartCard />
<YStack
space="$4"
alignItems="start"
px="24px"
style={{
flexGrow: '1',
marginTop: '16px',
width: '50%',
overflowY: 'auto',
maxHeight: '100vh',
}}
minWidth="500px"
>
<TitleLogo />
<XStack space="$4" flexWrap="wrap">
<XStack space="$4" flexWrap="wrap">
<SyncStatusCard />
<AddCardsContainer />
</XStack>
<BalanceChartCard />
</XStack>
<BasicInfoCards />
<XStack space="$3" flexWrap="wrap">
<YStack space={'$4'} flexWrap="wrap">
<XStack justifyContent="space-between" flexWrap="wrap">
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<BasicInfoCards />
<XStack space="$3" flexWrap="wrap" >
<YStack space={'$4'} flexWrap="wrap">
<XStack justifyContent="space-between" flexWrap="wrap">
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<DeviceUptime />
</YStack>
<YStack space={'$4'} flexWrap="wrap">
<XStack space="$4">
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
</XStack>
<XStack space="$4" >
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
<NetworkCard
downloadRate={[12, 31, 22, 12, 23, 23, 90]}
uploadRate={[31, 22, 32, 132, 32, 45, 65]}
/>
</XStack>
</YStack>
<DeviceUptime />
</YStack>
<YStack space={'$4'} flexWrap="wrap">
<XStack space="$4">
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
</XStack>
</YStack>
);
export default DashboardContent
<XStack space="$4">
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
<NetworkCard
downloadRate={[12, 31, 22, 12, 23, 23, 90]}
uploadRate={[31, 22, 32, 132, 32, 45, 65]}
/>
</XStack>
</YStack>
</XStack>
</YStack>
)
export default DashboardContent

View File

@ -15,7 +15,7 @@ const ExecutionUptime = () => {
}}
>
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
<YStack >
<YStack>
<Text size={15} weight={'semibold'}>
Execution Uptime
</Text>

View File

@ -19,7 +19,7 @@ const RightSidebar = () => {
padding: '8px',
border: '1px solid #F0F2F5',
height: '100vh',
overflowY: 'auto'
overflowY: 'auto',
}}
>
<XStack alignItems="center">

View File

@ -7,7 +7,7 @@ import ConsensusCard from './ConsensusClientCard'
const SyncStatusCard = () => {
return (
<DashboardCardWrapper padding="0" >
<DashboardCardWrapper padding="0">
<YStack space={'$2'}>
<Stack style={{ paddingTop: '12px', paddingLeft: '16px' }}>
<Text size={15} weight={'semibold'}>