Drawer Width - Copy this React, Mui Component to your project

update: const settingsMenuItems = [ { text: "Manage Users", icon: <FiUsers size={20} /> }, { text: "General Settings", icon: <FiSettings size={20} /> }, { text: "Company Settings", icon: <FiDatabase size={20} /> }, { text: "Payroll Settings", icon: <FiDollarSign size={20} /> }, { text: "Account Settings", icon: <FiUser size={20} /> }, { text: "Modes and Types", icon: <FiGrid size={20} /> }, { text: "Template & Documents", icon: <FiFile size={20} /> }, { text: "My Subscription", icon: <FiBookmark size={20} /> } ]; const languages = [ { code: "en", name: "English" }, { code: "es", name: "Spanish" }, { code: "fr", name: "French" }, { code: "de", name: "German" } ]; <Box sx={{ display: "flex", alignItems: "center", gap: 2 }}> <SearchBox placeholder="Search..." darkMode={darkMode} startAdornment={<FiSearch style={{ marginRight: 8 }} />} onChange={(e) => setSearchTerm(e.target.value)} /> <Tooltip title="Learn"> <IconButton color="inherit"> <FiBook size={20} /> </IconButton> </Tooltip> <Tooltip title="Help"> <IconButton color="inherit" onClick={handleHelpClick}> <FiHelpCircle size={20} /> </IconButton> </Tooltip> <Tooltip title="Notifications"> <IconButton color="inherit"> <Badge badgeContent={notificationCount} color="error"> <FiBell size={20} /> </Badge> </IconButton> </Tooltip> <Tooltip title="Change Language"> <IconButton color="inherit" onClick={handleLanguageChange}> <FiGlobe size={20} /> </IconButton> </Tooltip>