seasharp
/
anvil
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: remove Grid in favour of Box component

Browse Source
main
Josue 4 years ago committed by Tsu-ba-me
parent d5b380ea1f
commit e6bdd6224a
2 changed files with 36 additions and 36 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 34
      striker-ui/components/CPU.tsx
  2. 38
      striker-ui/components/Memory.tsx

34
striker-ui/components/CPU.tsx
Unescape View File

@ -1,4 +1,4 @@
import { Grid } from '@material-ui/core'; import { Box } from '@material-ui/core';
import Panel from './Panel'; import Panel from './Panel';
import { AllocationBar } from './Bars'; import { AllocationBar } from './Bars';
import { HeaderText, BodyText } from './Text'; import { HeaderText, BodyText } from './Text';
@ -15,27 +15,27 @@ const CPU = ({ uuid }: { uuid: string }): JSX.Element => {
return ( return (
<Panel> <Panel>
<Grid container alignItems="center" justify="space-around"> <HeaderText text="CPU" />
<Grid item xs={12}> <Box display="flex" width="100%">
<HeaderText text="CPU" /> <Box flexGrow={1}>
</Grid>
<Grid item xs={3}>
<BodyText text={`Allocated: ${cpuData.allocated}`} /> <BodyText text={`Allocated: ${cpuData.allocated}`} />
</Grid> </Box>
<Grid item xs={3}> <Box>
<BodyText text={`Free: ${cpuData.cores - cpuData.allocated}`} /> <BodyText text={`Free: ${cpuData.cores - cpuData.allocated}`} />
</Grid> </Box>
<Grid item xs={10}> </Box>
<Box display="flex" width="100%">
<Box flexGrow={1}>
<AllocationBar <AllocationBar
allocated={(cpuData.allocated / cpuData.cores) * 100} allocated={(cpuData.allocated / cpuData.cores) * 100}
/> />
</Grid> </Box>
<Grid item xs={4}> </Box>
<BodyText <Box display="flex" justifyContent="center" width="100%">
text={`Total Cores: ${cpuData.cores}c | ${cpuData.threads}t`} <BodyText
/> text={`Total Cores: ${cpuData.cores}c | ${cpuData.threads}t`}
</Grid> />
</Grid> </Box>
</Panel> </Panel>
); );
}; };

38
striker-ui/components/Memory.tsx
Unescape View File

@ -1,4 +1,4 @@
import { Grid } from '@material-ui/core'; import { Box } from '@material-ui/core';
import * as prettyBytes from 'pretty-bytes'; import * as prettyBytes from 'pretty-bytes';
import Panel from './Panel'; import Panel from './Panel';
import { AllocationBar } from './Bars'; import { AllocationBar } from './Bars';
@ -15,11 +15,9 @@ const Memory = ({ uuid }: { uuid: string }): JSX.Element => {
return ( return (
<Panel> <Panel>
<Grid container alignItems="center" justify="space-around"> <HeaderText text="Memory" />
<Grid item xs={12}> <Box display="flex" width="100%">
<HeaderText text="Memory" /> <Box flexGrow={1}>
</Grid>
<Grid item xs={5}>
<BodyText <BodyText
text={`Allocated: ${prettyBytes.default( text={`Allocated: ${prettyBytes.default(
memoryData.total - memoryData.free, memoryData.total - memoryData.free,
@ -28,29 +26,31 @@ const Memory = ({ uuid }: { uuid: string }): JSX.Element => {
}, },
)}`} )}`}
/> />
</Grid> </Box>
<Grid item xs={4}> <Box>
<BodyText <BodyText
text={`Free: ${prettyBytes.default(memoryData.free, { text={`Free: ${prettyBytes.default(memoryData.free, {
binary: true, binary: true,
})}`} })}`}
/> />
</Grid> </Box>
<Grid item xs={10}> </Box>
<Box display="flex" width="100%">
<Box flexGrow={1}>
<AllocationBar <AllocationBar
allocated={ allocated={
((memoryData.total - memoryData.free) / memoryData.total) * 100 ((memoryData.total - memoryData.free) / memoryData.total) * 100
} }
/> />
</Grid> </Box>
<Grid item xs={5}> </Box>
<BodyText <Box display="flex" justifyContent="center" width="100%">
text={`Total Memory: ${prettyBytes.default(memoryData.total, { <BodyText
binary: true, text={`Total Memory: ${prettyBytes.default(memoryData.total, {
})}`} binary: true,
/> })}`}
</Grid> />
</Grid> </Box>
</Panel> </Panel>
); );
}; };

Write Preview
Loading…
Cancel
Save