clicking help opens chat assistant

src/navigation/SideNavigator.tsx

@@ -32,6 +32,7 @@ import PlaneIcon from "products/AviationIcons/PlaneIcon";
 import AirportMapIcon from "products/AviationIcons/AirportMapIcon";
 import JobsiteIcon from "products/Construction/JobSiteIcon";
 import { getThemeType } from "theme";
+import { openCrispChat } from "chat/CrispChat";
 import ObjectHeaterIcon from "products/Construction/ObjectHeaterIcon";
 import TasksIcon from "products/Construction/TasksIcon";
 import CableIcon from "products/Bindapt/CableIcon";
@@ -96,6 +97,7 @@ const useStyles = makeStyles((theme: Theme) => ({
   listItem: {
     paddingLeft: theme.spacing(2),
     paddingRight: theme.spacing(2),
+    maxHeight: 40,
     [theme.breakpoints.up("md")]: {
       paddingLeft: theme.spacing(3),
       paddingRight: theme.spacing(3)
@@ -549,10 +551,10 @@ export default function SideNavigator(props: Props) {
         <Box sx={{ flex: 1, overflowY: "auto", scrollbarWidth: "none", "&::-webkit-scrollbar": { display: "none" } }}>
           {isAuthenticated && authenticatedSideMenu()}
         </Box>
-        <Divider />
-        <List>
+        <Divider sx={{ my: 1 }} />
+        <List className={classes.list} component="nav">
           <Tooltip title="Help" placement="right">
-            <ListItemButton classes={{ root: classes.listItem }}>
+            <ListItemButton classes={{ root: classes.listItem }} onClick={() => openCrispChat()}>
               <ListItemIcon>
                 <HelpOutline style={{ color: getThemeType() === "light" ? "black" : undefined }} />
               </ListItemIcon>