refactor: use fetched daat in SharedStorage, CPU and Memory components

striker-ui/components/CPU.tsx

@@ -5,7 +5,7 @@ import { HeaderText, BodyText } from './Text';
 import PeriodicFetch from '../lib/fetchers/periodicFetch';
 
 const CPU = ({ uuid }: { uuid: string }): JSX.Element => {
-  const { data, isLoading } = PeriodicFetch(
+  const { data, isLoading } = PeriodicFetch<AnvilCPU>(
     `${process.env.NEXT_PUBLIC_API_URL}/anvils/get_cpu?anvil_uuid=`,
     uuid,
   );
@@ -30,7 +30,7 @@ const CPU = ({ uuid }: { uuid: string }): JSX.Element => {
             allocated={(cpuData.allocated / cpuData.cores) * 100}
           />
         </Grid>
-        <Grid item xs={10}>
+        <Grid item xs={5}>
           <BodyText text={`Total Cores: ${cpuData.cores}`} />
         </Grid>
         <Grid item xs={12}>

striker-ui/components/Memory.tsx

@@ -6,7 +6,7 @@ import { HeaderText, BodyText } from './Text';
 import PeriodicFetch from '../lib/fetchers/periodicFetch';
 
 const Memory = ({ uuid }: { uuid: string }): JSX.Element => {
-  const { data, isLoading } = PeriodicFetch(
+  const { data, isLoading } = PeriodicFetch<AnvilMemory>(
     `${process.env.NEXT_PUBLIC_API_URL}/anvils/get_memory?anvil_uuid=`,
     uuid,
   );
@@ -29,7 +29,7 @@ const Memory = ({ uuid }: { uuid: string }): JSX.Element => {
             )}`}
           />
         </Grid>
-        <Grid item xs={3}>
+        <Grid item xs={4}>
           <BodyText
             text={`Free: ${prettyBytes.default(memoryData.free, {
               binary: true,
@@ -43,7 +43,7 @@ const Memory = ({ uuid }: { uuid: string }): JSX.Element => {
             }
           />
         </Grid>
-        <Grid item xs={10}>
+        <Grid item xs={6}>
           <BodyText
             text={`Total Memory: ${prettyBytes.default(memoryData.total, {
               binary: true,

striker-ui/pages/index.tsx

@@ -53,9 +53,19 @@ const Home = (): JSX.Element => {
           direction="column"
           className={classes.grid}
         >
-          <SharedStorage />
+          <SharedStorage
-          <CPU />
+            anvil={data?.anvils?.length > 0 ? data.anvils[0] : 'no uuid'}
-          <Memory />
+          />
+          <CPU
+            uuid={
+              data?.anvils?.length > 0 ? data.anvils[0].anvil_uuid : 'no uuid'
+            }
+          />
+          <Memory
+            uuid={
+              data?.anvils?.length > 0 ? data.anvils[0].anvil_uuid : 'no uuid'
+            }
+          />
         </Grid>
       </Grid>
     </Grid>