Merge pull request #1827 from FlowerC9/fix/username-flexibility-added

Fix/username flexibility added

src/Components/Sidebar/index.jsx

@@ -628,10 +628,19 @@ function Sidebar() {
 				) : (
 					<>
 						<Avatar small={true} />
-						<Box ml={theme.spacing(2)}>
+						<Box
+							ml={theme.spacing(2)}
+							sx={{ maxWidth: "50%", overflow: "hidden" }}
+						>
 							<Typography
 								component="span"
 								fontWeight={500}
+								sx={{
+									display: "block",
+									whiteSpace: "nowrap",
+									overflow: "hidden",
+									textOverflow: "ellipsis",
+								}}
 							>
 								{authState.user?.firstName} {authState.user?.lastName}
 							</Typography>
@@ -706,12 +715,21 @@ function Sidebar() {
 					}}
 				>
 					{collapsed && (
-						<MenuItem sx={{ cursor: "default", minWidth: "150px" }}>
-							<Box mb={theme.spacing(2)}>
+						<MenuItem sx={{ cursor: "default", minWidth: "50%" }}>
+							<Box
+								mb={theme.spacing(2)}
+								sx={{ maxWidth: "50%", overflow: "hidden" }}
+							>
 								<Typography
 									component="span"
 									fontWeight={500}
 									fontSize={13}
+									sx={{
+										display: "block",
+										whiteSpace: "nowrap",
+										overflow: "hidden",
+										textOverflow: "ellipsis",
+									}}
 								>
 									{authState.user?.firstName} {authState.user?.lastName}
 								</Typography>