added chat button in header buttons

src/app/Header.tsx

@@ -6,12 +6,14 @@ import { getDarkLogo, getLightLogo, getSignatureAccentColour, hasTransparentLogo
 // import { Link } from "react-router-dom";
 import { useThemeType } from "../hooks/useThemeType";
 import UserMenu from "../user/UserMenu";
+import { useMobile } from "hooks";
+import HeaderButtons from "./HeaderButtons";
+import { useGlobalState } from "providers";
 
 const useStyles = makeStyles((theme: Theme) => ({
     appBar: {
         zIndex: theme.zIndex.drawer + 1,
         backgroundImage: "none", // This prevents de-saturation of header in dark mode
-        // border: "1px solid purple"
     },
     toolbar: {
         marginLeft: theme.spacing(0.5),
@@ -87,21 +89,25 @@ export default function Header(props: Props) {
     const { openSide, toggleTheme } = props;
     const themeType = useThemeType();
     const classes = useStyles()
+    const isMobile = useMobile();
+    
+    const [{ user, team }] = useGlobalState();
+    const hasTeams = user.hasFeature ? user.hasFeature("teams") : false;
 
     return (
         <AppBar position="fixed" className={classes.appBar}>
             <Toolbar disableGutters className={classes.toolbar}>
                 <Box className={classes.buttonContainer}>
-                    {/* {!isMobile && ( */}
-                    <IconButton
-                        color="inherit"
-                        aria-label="Open side menu"
-                        onClick={openSide}
-                        style={{ color: getSignatureAccentColour() }}
-                        className={classes.button}>
-                            <Menu />
-                    </IconButton>
-                    {/* )} */}
+                    {!isMobile && (
+                        <IconButton
+                            color="inherit"
+                            aria-label="Open side menu"
+                            onClick={openSide}
+                            style={{ color: getSignatureAccentColour() }}
+                            className={classes.button}>
+                                <Menu />
+                        </IconButton>
+                    )}
                 </Box>
                 <Box flexGrow={1} marginLeft={0.5}>
                     {!hideLogo() && (
@@ -116,6 +122,7 @@ export default function Header(props: Props) {
                 </Box>
                 <Box className={classes.appBarRight}>
                     <UserMenu toggleTheme={toggleTheme} />
+                    <HeaderButtons hasTeams={hasTeams} team={team} user={user} />
                 </Box>
             </Toolbar>
         </AppBar>