From 035edd92f42eab2c0619b3e8e6970b3efa93d91d Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Fri, 1 Aug 2025 15:45:43 -0700
Subject: [PATCH] add proptypes, fix logo text animation

---
 client/src/Components/Sidebar/components/logo.jsx    |  9 +++++++--
 client/src/Components/Sidebar/components/navItem.jsx | 10 +++++++---
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/client/src/Components/Sidebar/components/logo.jsx b/client/src/Components/Sidebar/components/logo.jsx
index e6aa660fb..7a59f406d 100644
--- a/client/src/Components/Sidebar/components/logo.jsx
+++ b/client/src/Components/Sidebar/components/logo.jsx
@@ -4,6 +4,7 @@ import Typography from "@mui/material/Typography";
 import { useTheme } from "@mui/material/styles";
 import { useNavigate } from "react-router";
 import { useTranslation } from "react-i18next";
+import PropTypes from "prop-types";
 
 const Logo = ({ collapsed }) => {
 	const { t } = useTranslation();
@@ -38,10 +39,10 @@ const Logo = ({ collapsed }) => {
 			<Box
 				overflow={"hidden"}
 				sx={{
-					transition: "opacity 900ms ease",
+					transition: "opacity 900ms ease, width 900ms ease",
 					opacity: collapsed ? 0 : 1,
 					whiteSpace: "nowrap",
-					width: collapsed ? 0 : "auto",
+					width: collapsed ? 0 : "100%",
 				}}
 			>
 				{" "}
@@ -59,4 +60,8 @@ const Logo = ({ collapsed }) => {
 	);
 };
 
+Logo.propTypes = {
+	collapsed: PropTypes.bool,
+};
+
 export default Logo;
diff --git a/client/src/Components/Sidebar/components/navItem.jsx b/client/src/Components/Sidebar/components/navItem.jsx
index f43b1bf1e..409a84fde 100644
--- a/client/src/Components/Sidebar/components/navItem.jsx
+++ b/client/src/Components/Sidebar/components/navItem.jsx
@@ -3,13 +3,11 @@ import ListItemButton from "@mui/material/ListItemButton";
 import ListItemIcon from "@mui/material/ListItemIcon";
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
-
 import { useTheme } from "@emotion/react";
-import { useNavigate } from "react-router";
+import PropTypes from "prop-types";
 
 const NavItem = ({ item, collapsed, selected, onClick }) => {
 	const theme = useTheme();
-	const navigate = useNavigate();
 
 	return (
 		<Tooltip
@@ -86,4 +84,10 @@ const NavItem = ({ item, collapsed, selected, onClick }) => {
 	);
 };
 
+NavItem.propTypes = {
+	item: PropTypes.object,
+	collapsed: PropTypes.bool,
+	selected: PropTypes.bool,
+	onClick: PropTypes.func,
+};
 export default NavItem;