From c3f0d791b9034f2882e2a576600d8342cda31b24 Mon Sep 17 00:00:00 2001
From: Josue <josue.quilon-barrios@senecacollege.ca>
Date: Tue, 9 Mar 2021 17:20:27 -0500
Subject: [PATCH] refactor: use new text component with all the sections in the
 page

---
 striker-ui/components/CPU.tsx        | 10 +++++-----
 striker-ui/components/InnerPanel.tsx |  7 ++++++-
 striker-ui/components/Memory.tsx     | 10 +++++-----
 3 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/striker-ui/components/CPU.tsx b/striker-ui/components/CPU.tsx
index e9f28971..cfb04936 100644
--- a/striker-ui/components/CPU.tsx
+++ b/striker-ui/components/CPU.tsx
@@ -1,7 +1,7 @@
 import { withStyles } from '@material-ui/core/styles';
-import { Grid, LinearProgress, Typography } from '@material-ui/core';
+import { Grid, LinearProgress } from '@material-ui/core';
 import Panel from './Panel';
-import Text from './Text/HeaderText';
+import { HeaderText, BodyText } from './Text';
 import { PURPLE_OFF, RED_ON } from '../lib/consts/DEFAULT_THEME';
 
 const BorderLinearProgress = withStyles({
@@ -23,13 +23,13 @@ const CPU = (): JSX.Element => {
     <Panel>
       <Grid container alignItems="center" justify="space-around">
         <Grid item xs={12}>
-          <Text text="CPU" />
+          <HeaderText text="CPU" />
         </Grid>
         <Grid item xs={3}>
-          <Typography variant="subtitle1">Allocated: 3</Typography>
+          <BodyText text="Allocated: 3" />
         </Grid>
         <Grid item xs={3}>
-          <Typography variant="subtitle1">Free: 6</Typography>
+          <BodyText text="Free: 6" />
         </Grid>
         <Grid item xs={10}>
           <BorderLinearProgress variant="determinate" value={50} />
diff --git a/striker-ui/components/InnerPanel.tsx b/striker-ui/components/InnerPanel.tsx
index 164fa5c0..cf2c8b8d 100644
--- a/striker-ui/components/InnerPanel.tsx
+++ b/striker-ui/components/InnerPanel.tsx
@@ -1,6 +1,7 @@
 import { Box } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import { TEXT } from '../lib/consts/DEFAULT_THEME';
+import { BodyText } from './Text';
 
 const useStyles = makeStyles(() => ({
   innerBody: {
@@ -24,7 +25,11 @@ const useStyles = makeStyles(() => ({
 const InnerPanel = (): JSX.Element => {
   const classes = useStyles();
 
-  return <Box className={classes.innerBody}>inner body</Box>;
+  return (
+    <Box className={classes.innerBody}>
+      <BodyText text="inner body" />
+    </Box>
+  );
 };
 
 export default InnerPanel;
diff --git a/striker-ui/components/Memory.tsx b/striker-ui/components/Memory.tsx
index 9f6bea01..b1c291b0 100644
--- a/striker-ui/components/Memory.tsx
+++ b/striker-ui/components/Memory.tsx
@@ -1,7 +1,7 @@
 import { withStyles } from '@material-ui/core/styles';
-import { Grid, LinearProgress, Typography } from '@material-ui/core';
+import { Grid, LinearProgress } from '@material-ui/core';
 import Panel from './Panel';
-import Text from './Text/HeaderText';
+import { HeaderText, BodyText } from './Text';
 import { PURPLE_OFF, RED_ON } from '../lib/consts/DEFAULT_THEME';
 
 const BorderLinearProgress = withStyles({
@@ -23,13 +23,13 @@ const Memory = (): JSX.Element => {
     <Panel>
       <Grid container alignItems="center" justify="space-around">
         <Grid item xs={12}>
-          <Text text="Memory" />
+          <HeaderText text="Memory" />
         </Grid>
         <Grid item xs={3}>
-          <Typography variant="subtitle1">Allocated: 14GB</Typography>
+          <BodyText text="Allocated: 14GB" />
         </Grid>
         <Grid item xs={3}>
-          <Typography variant="subtitle1">Free: 50GB</Typography>
+          <BodyText text="Free: 50GB" />
         </Grid>
         <Grid item xs={10}>
           <BorderLinearProgress variant="determinate" value={50} />