Removed some unused components and polished code

src/components/DashboardContainer/DashboardContainer.tsx

@@ -1,30 +0,0 @@
-import React from "react";
-
-export interface props {
-  children: React.ReactNode;
-}
-
-export default function DashboardContainer(props: props) {
-  return (
-    <div style={{ marginRight: 32, marginLeft: 32 }}>
-      <div
-        style={{
-          display: "flex",
-          flexDirection: "column",
-          alignSelf: "flex-start",
-          justifyContent: "left",
-          backgroundColor: "#1d3b33",
-          borderRadius: 16,
-          padding: 16,
-          width: "100%",
-          height: "100%",
-          lineHeight: 0.4,
-          marginLeft: 8,
-          marginRight: 8,
-        }}
-      >
-        {props.children}
-      </div>
-    </div>
-  );
-}

src/components/ProductListEntry/ProductListEntry.tsx

@@ -1,47 +0,0 @@
-import React, { useEffect, useState } from "react";
-
-export interface props {
-  children: React.ReactNode;
-}
-
-export default function ProductListEntry(props: props) {
-  const [size, setSize] = useState(64);
-
-  useEffect(() => {
-    function onEnter() {
-      setSize(256);
-    }
-    function onLeave() {
-      setSize(128);
-    }
-
-    document
-      .getElementById("container")
-      ?.addEventListener("mouseenter", onEnter);
-    document
-      .getElementById("container")
-      ?.addEventListener("mouseleave", onLeave);
-    return () => {
-      document
-        .getElementById("container")
-        ?.removeEventListener("mouseenter", onEnter);
-      document
-        .getElementById("container")
-        ?.removeEventListener("mouseleave", onLeave);
-    };
-  }, []);
-  return (
-    <div
-      id="container"
-      style={{
-        justifyContent: "center",
-        alignItems: "center",
-        backgroundColor: "#497f4d",
-        width: size,
-        height: size,
-      }}
-    >
-      {props.children}
-    </div>
-  );
-}

src/routes/Dashboard/Dashboard.tsx

@@ -1,6 +1,5 @@
 import React from "react";
 import TotalProductsIcon from "../../Components/Icons/TotalProductsIcon/TotalProductsIcon";
-import DashboardContainer from "../../Components/DashboardContainer/DashboardContainer";
 import LowStockIcon from "../../Components/Icons/LowStockIcon/LowStockIcon";
 import StatsIcon from "../../Components/Icons/StatsIcon/StatsIcon";
 import LogsIcon from "../../Components/Icons/LogsIcon/LogsIcon";
@@ -75,7 +74,7 @@ export default function Dashboard() {
               </div>
             </div>
             <div style={{ marginBottom: "2vh" }} />
-            <h1 style={styles.text}>Kopiko Blanca (Sack)</h1>
+            <h1 style={styles.text}>Kopiko Blanca</h1>
             <h1 style={styles.text_small}>Added: 96</h1>
             <h1 style={styles.text_small}>Removed: 105</h1>
             <h1 style={styles.text_tiny}>02/17/2023</h1>

src/routes/Products/Products.tsx

@@ -1,9 +1,6 @@
 import React from "react";
 import styles from "../../styles";
-import AppLogo from "../../Components/Icons/AppLogo/AppLogo";
 import ProductsIcon from "../../Components/Icons/ProductsIcon/ProductsIcon";
-import ProductListEntry from "../../Components/ProductListEntry/ProductListEntry";
-
 export default function Products() {
   return (
     <div style={{ margin: 32, height: "100%" }}>