From 05dce5b4a95807c42147f3817b7c43919bab9da6 Mon Sep 17 00:00:00 2001
From: ml729 <85370083+ml729@users.noreply.github.com>
Date: Sat, 21 Jan 2023 11:46:16 -0500
Subject: [PATCH] Use CardBody website/src/pages/admin/status/index.tsx

Co-authored-by: notmd <33456881+notmd@users.noreply.github.com>
---
 website/src/pages/admin/status/index.tsx | 101 ++++++++++++-----------
 1 file changed, 51 insertions(+), 50 deletions(-)

diff --git a/website/src/pages/admin/status/index.tsx b/website/src/pages/admin/status/index.tsx
index 0abe1404..30c55c9a 100644
--- a/website/src/pages/admin/status/index.tsx
+++ b/website/src/pages/admin/status/index.tsx
@@ -100,58 +100,59 @@ const StatusIndex = ({ user }) => {
         </Card>
       </SimpleGrid>
       <br />
-      <Card bg={backgroundColor} p="6" pt="4" pr="6">
-        <Text as="h1" fontSize="3xl" textAlign="center">
-          /api/v1/stats/tree_manager
-        </Text>
-
-        {treeManager ? (
-          <Box>
-            <Text as="h2" fontSize="2xl">
-              state_counts
-            </Text>
-            <Box bg={dataBackgroundColor} borderRadius="xl" p="6" pt="4" pr="12">
-              <pre id="json">{JSON.stringify(treeManager.state_counts, null, 2)}</pre>
-            </Box>
-            <TableContainer>
-              <br />
+      <Card>
+        <CardBody>
+          <Text as="h1" fontSize="3xl" textAlign="center">
+            /api/v1/stats/tree_manager
+          </Text>
+          {treeManager ? (
+            <Box>
               <Text as="h2" fontSize="2xl">
-                message_counts
+                state_counts
               </Text>
-              <Table variant="simple">
-                <TableCaption>Tree Manager</TableCaption>
-                <Thead>
-                  <Tr>
-                    <Th>Message Tree ID</Th>
-                    <Th>State</Th>
-                    <Th>Depth</Th>
-                    <Th>Oldest</Th>
-                    <Th>Youngest</Th>
-                    <Th>Count</Th>
-                    <Th>Goal Tree Size</Th>
-                  </Tr>
-                </Thead>
-                <Tbody>
-                  {treeManager.message_counts.map(
-                    ({ message_tree_id, state, depth, oldest, youngest, count, goal_tree_size }) => (
-                      <Tr key={message_tree_id}>
-                        <Td>{message_tree_id}</Td>
-                        <Td>{state}</Td>
-                        <Td>{depth}</Td>
-                        <Td>{oldest}</Td>
-                        <Td>{youngest}</Td>
-                        <Td>{count}</Td>
-                        <Td>{goal_tree_size}</Td>
-                      </Tr>
-                    )
-                  )}
-                </Tbody>
-              </Table>
-            </TableContainer>
-          </Box>
-        ) : (
-          <CircularProgress isIndeterminate />
-        )}
+              <Box bg={dataBackgroundColor} borderRadius="xl" p="6" pt="4" pr="12">
+                <pre id="json">{JSON.stringify(treeManager.state_counts, null, 2)}</pre>
+              </Box>
+              <TableContainer>
+                <br />
+                <Text as="h2" fontSize="2xl">
+                  message_counts
+                </Text>
+                <Table variant="simple">
+                  <TableCaption>Tree Manager</TableCaption>
+                  <Thead>
+                    <Tr>
+                      <Th>Message Tree ID</Th>
+                      <Th>State</Th>
+                      <Th>Depth</Th>
+                      <Th>Oldest</Th>
+                      <Th>Youngest</Th>
+                      <Th>Count</Th>
+                      <Th>Goal Tree Size</Th>
+                    </Tr>
+                  </Thead>
+                  <Tbody>
+                    {treeManager.message_counts.map(
+                      ({ message_tree_id, state, depth, oldest, youngest, count, goal_tree_size }) => (
+                        <Tr key={message_tree_id}>
+                          <Td>{message_tree_id}</Td>
+                          <Td>{state}</Td>
+                          <Td>{depth}</Td>
+                          <Td>{oldest}</Td>
+                          <Td>{youngest}</Td>
+                          <Td>{count}</Td>
+                          <Td>{goal_tree_size}</Td>
+                        </Tr>
+                      )
+                    )}
+                  </Tbody>
+                </Table>
+              </TableContainer>
+            </Box>
+          ) : (
+            <CircularProgress isIndeterminate />
+          )}
+        </CardBody>
       </Card>
     </>
   );