status-im/nimbus-gui
2
0
Fork 0
mirror of https://github.com/status-im/nimbus-gui.git synced 2025-02-22 08:08:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: remove use state and effect

Browse Source 
just calculate them without state
This commit is contained in:
RadoslavDimchev 2023-08-09 12:37:58 +03:00
parent 9a81ce2367
commit f8e6cf8369
1 changed files with 6 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/HealthInfoSection.tsx
View File

@ -1,5 +1,4 @@
import { YStack } from 'tamagui' import { YStack } from 'tamagui'
import { useEffect, useState } from 'react'
import StatusIconText from './StatusIconText' import StatusIconText from './StatusIconText'
import { import {
BAD_CPU_CLOCK_RATE_TEXT, BAD_CPU_CLOCK_RATE_TEXT,
@ -25,16 +24,10 @@ const HealthInfoSection = (props: HealthInfoSectionProps) => {
const { usedStorage, maxStorage, usedRamMemory, maxRamMemory, cpuClockRate, networkLatency } = const { usedStorage, maxStorage, usedRamMemory, maxRamMemory, cpuClockRate, networkLatency } =
props props
const [usedStoragePercentage, setUsedStoragePercentage] = useState(0) const usedStoragePercentage = (usedStorage / maxStorage) * 100
const [usedRamMemoryPercentage, setUsedRamMemoryPercentage] = useState(0) const usedRamMemoryPercentage = (usedRamMemory / maxRamMemory) * 100
const cpuClockRatePercentage = cpuClockRate > 2.4 ? 100 : 0
useEffect(() => { const networkLatencyPercentage = networkLatency > 100 ? 100 : 0
setUsedStoragePercentage((usedStorage / maxStorage) * 100)
}, [usedStorage, maxStorage])
useEffect(() => {
setUsedRamMemoryPercentage((usedRamMemory / maxRamMemory) * 100)
}, [usedRamMemory, maxRamMemory])
return ( return (
<YStack space={'$2'}> <YStack space={'$2'}>
@ -45,7 +38,7 @@ const HealthInfoSection = (props: HealthInfoSectionProps) => {
badText={BAD_STORAGE_TEXT} badText={BAD_STORAGE_TEXT}
/> />
<StatusIconText <StatusIconText
percentage={cpuClockRate > 2.4 ? 100 : 0} percentage={cpuClockRatePercentage}
threshold={50} threshold={50}
goodText={GOOD_CPU_CLOCK_RATE_TEXT} goodText={GOOD_CPU_CLOCK_RATE_TEXT}
badText={BAD_CPU_CLOCK_RATE_TEXT} badText={BAD_CPU_CLOCK_RATE_TEXT}
@ -57,7 +50,7 @@ const HealthInfoSection = (props: HealthInfoSectionProps) => {
badText={BAD_RAM_MEMORY_TEXT} badText={BAD_RAM_MEMORY_TEXT}
/> />
<StatusIconText <StatusIconText
percentage={networkLatency > 100 ? 100 : 0} percentage={networkLatencyPercentage}
threshold={50} threshold={50}
goodText={GOOD_NETWORK_TEXT} goodText={GOOD_NETWORK_TEXT}
badText={BAD_NETWORK_TEXT} badText={BAD_NETWORK_TEXT}