status-im
/
nimbus-gui
mirror of https://github.com/status-im/nimbus-gui.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix error handling

This commit is contained in:
Hristo Nedelkov 2023-08-14 11:18:57 +03:00
parent 87171ca727
commit 10ba0cf385
2 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/DeviceStorageHealth.tsx
View File

@ -1,22 +1,21 @@
import IconText from './IconText' import IconText from './IconText'
import { Paragraph, Separator, XStack, YStack } from 'tamagui' import { Paragraph, Separator, XStack, YStack } from 'tamagui'
import StandardGauge from './StandardGauge' import StandardGauge from './StandardGauge'
import { Shadow } from '@status-im/components' import { Shadow, Text } from '@status-im/components'
interface DeviceStorageHealthProps { interface DeviceStorageHealthProps {
storage: number storage: number
maxStorage: number maxStorage: number
} }
const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxStorage }) => { const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxStorage }) => {
const message = storage < maxStorage ? 'Good' : 'Poor' const message = storage < maxStorage ? 'Good' : 'Poor'
const data = (storage: number, maxStorage: number) => { const free = maxStorage - storage
const used = storage
const free = maxStorage - storage
const data = (free: number) => {
return [ return [
{ {
id: 'storage', id: 'storage',
label: 'Used', label: 'Used',
value: used, value: storage,
color: '#E95460', color: '#E95460',
}, },
{ {
@ -34,7 +33,8 @@ const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxS
width: '284px', width: '284px',
height: '136px', height: '136px',
borderRadius: '16px', borderRadius: '16px',
border: '1px solid #D92344', border: message === 'Poor' ? '1px solid #D92344' : 'none',
backgroundColor: message === 'Poor' ? '#fefafa' : '#fff',
}} }}
> >
<YStack> <YStack>
@ -53,7 +53,7 @@ const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxS
height: '75px', height: '75px',
}} }}
> >
<StandardGauge data={data(storage, maxStorage)} /> <StandardGauge data={data(free)} />
</div> </div>
<YStack space={'$3'}> <YStack space={'$3'}>
<Paragraph color={'#09101C'} size={'$6'} fontWeight={'600'}> <Paragraph color={'#09101C'} size={'$6'} fontWeight={'600'}>
@ -72,7 +72,11 @@ const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxS
> >
{message} {message}
</IconText> </IconText>
{/* <Text color={'#E95460'}>This is additional text</Text> */} {message === 'Poor' && (
<Text size={13} color="#E95460">
{((storage / maxStorage) * 100).toFixed(0)}% Uttilization
</Text>
)}
</XStack> </XStack>
</YStack> </YStack>
</Shadow> </Shadow>

4
src/pages/DeviceHealthCheck/DeviceHealthCheck.tsx
View File

@ -40,11 +40,11 @@ const DeviceHeanlthCheckContent = () => {
isAdvancedSettings={true} isAdvancedSettings={true}
/> />
<XStack space={'$4'}> <XStack space={'$4'}>
<DeviceStorageHealth storage={1} maxStorage={2} /> <DeviceStorageHealth storage={55} maxStorage={50} />
<DeviceCPULoad load={[12, 123, 4]} /> <DeviceCPULoad load={[12, 123, 4]} />
</XStack> </XStack>
<XStack space={'$4'}> <XStack space={'$4'}>
<DeviceMemory currentMemory={[25, 31, 5, 14, 20]} maxMemory={64} /> <DeviceMemory currentMemory={[25, 31, 5, 14, 20,81]} maxMemory={78} />
<DeviceNetworkHealth uploadRate={[1, 4, 23, 11]} downloadRate={[20, 3, 40, 56]} /> <DeviceNetworkHealth uploadRate={[1, 4, 23, 11]} downloadRate={[20, 3, 40, 56]} />
</XStack> </XStack>
<HealthInfoSection <HealthInfoSection