feat(devices-health-check): make exact content

This commit is contained in:
RadoslavDimchev 2024-03-19 13:16:25 +02:00 committed by Radoslav Dimchev
parent 974d426e6e
commit f38238fc05
1 changed files with 15 additions and 21 deletions

View File

@ -1,19 +1,19 @@
import { useSelector } from 'react-redux' import { useSelector } from 'react-redux'
import { Stack, XStack, YStack } from 'tamagui' import { Stack, XStack, YStack } from 'tamagui'
import { CloseCircleIcon } from '@status-im/icons' import { CloseCircleIcon } from '@status-im/icons'
import { Button, InformationBox } from '@status-im/components' import { InformationBox } from '@status-im/components'
import type { Property } from 'csstype' import type { Property } from 'csstype'
import PageWrapperShadow from '../../components/PageWrappers/PageWrapperShadow'
import NimbusLogo from '../../components/Logos/NimbusLogo'
import Titles from '../../components/General/Titles'
import DeviceStorageHealth from '../../components/Charts/DeviceStorageHealth' import DeviceStorageHealth from '../../components/Charts/DeviceStorageHealth'
import DeviceCPULoad from '../../components/Charts/DeviceCPULoad' import DeviceCPULoad from '../../components/Charts/DeviceCPULoad'
import HealthInfoSection from '../../components/General/HealthInfoSection' import HealthInfoSection from '../../components/General/HealthInfoSection'
import DeviceMemory from '../../components/Charts/DeviceMemoryHealth' import DeviceMemory from '../../components/Charts/DeviceMemoryHealth'
import DeviceNetworkHealth from '../../components/Charts/DeviceNetworkHealth' import DeviceNetworkHealth from '../../components/Charts/DeviceNetworkHealth'
import { RootState } from '../../redux/store' import { RootState } from '../../redux/store'
import TitleLogo from '../../components/General/TitleLogo'
import { useWindowSize } from '../../hooks/useWindowSize' import { useWindowSize } from '../../hooks/useWindowSize'
import RightSidebar from '../../components/General/RightSideBar/RightSidebar'
import LeftSidebar from '../../components/General/LeftSidebar/LeftSidebar'
const DevicesHealthCheck = () => { const DevicesHealthCheck = () => {
const deviceHealthState = useSelector( const deviceHealthState = useSelector(
@ -34,24 +34,20 @@ const DevicesHealthCheck = () => {
} }
return ( return (
<PageWrapperShadow <XStack style={{ height: '100vh' }}>
rightImageSrc="./background-images/eye-background.png" <LeftSidebar />
imgHeight="100%"
>
<YStack <YStack
space={'$4'} space={'$4'}
alignItems="flex-start"
style={{ style={{
alignItems: 'start', flexGrow: '1',
marginBottom: '2rem', overflowY: 'auto',
maxWidth: '100%', padding: '0 24px 24px 24px',
maxWidth: '75%',
}} }}
className={'transparent-scrollbar'}
> >
<NimbusLogo /> <TitleLogo subtitle="Device Health Check" />
<Titles
title="Device Health Check"
subtitle="Configure your device to start Staking on Nimbus"
isAdvancedSettings={true}
/>
<Stack space={'$4'} style={responsiveStyle}> <Stack space={'$4'} style={responsiveStyle}>
<DeviceStorageHealth <DeviceStorageHealth
storage={deviceHealthState.storage} storage={deviceHealthState.storage}
@ -78,11 +74,9 @@ const DevicesHealthCheck = () => {
icon={<CloseCircleIcon size={20} />} icon={<CloseCircleIcon size={20} />}
message="The information provided in the Nodes Health Check is meant to utilized as a guide to guage the readiness of your device, however please do your own due diligence prior to commiting any funds. Read our Health Check Disclosure for more information." message="The information provided in the Nodes Health Check is meant to utilized as a guide to guage the readiness of your device, however please do your own due diligence prior to commiting any funds. Read our Health Check Disclosure for more information."
/> />
<Stack style={{ marginTop: '1rem' }}>
<Button>Continue</Button>
</Stack>
</YStack> </YStack>
</PageWrapperShadow> <RightSidebar />
</XStack>
) )
} }