timestamping chat viewed timestamp when closing the header team chat

src/app/HeaderButtons.tsx

@@ -8,6 +8,8 @@ import { pond } from "protobuf-ts/pond";
 import { useEffect, useState } from "react";
 import { getSignatureAccentColour } from "services/whiteLabel";
 import NotificationDrawer from "./NotificationDrawer";
+import { useTeamAPI } from "providers";
+import { cloneDeep } from "lodash";
 
 
 const useStyles = makeStyles((theme: Theme) => ({
@@ -55,7 +57,9 @@ export default function HeaderButtons(props: Props) {
   const [hasNewNotifications, setHasNewNotifications] = useState(false);
   const [chatDrawerOpen, setChatDrawerOpen] = useState(false);
   const [notificationDrawerOpen, setNotificationDrawerOpen] = useState<boolean>(false);
+  
   const classes = useStyles();
+  const teamAPI = useTeamAPI();
 
   useEffect(() => {
     if (!team) return;
@@ -66,6 +70,8 @@ export default function HeaderButtons(props: Props) {
       setHasNewChats(true);
       return;
     }
+    console.log(team.preferences.chatViewedTimestamp)
+    console.log(team.settings.lastChatTimestamp)
     let viewMoment = moment(team.preferences.chatViewedTimestamp);
     let chatMoment = moment(team.settings.lastChatTimestamp);
     if (viewMoment.diff(chatMoment) < 0) {
@@ -154,13 +160,29 @@ export default function HeaderButtons(props: Props) {
     )
   }
 
+  const onChatClose = () => {
+    setChatDrawerOpen(false)
+    let newTeamPrefs = cloneDeep(team.preferences)
+    newTeamPrefs.chatViewedTimestamp = new Date().toISOString();
+    teamAPI
+      .updatePreferences(
+        team.key(),
+        newTeamPrefs,
+        // getContextKeys(),
+        // getContextTypes()
+      )
+      .then(() => {
+        // setTeamPrefs(newTeamPrefs);
+      });
+  }
+
   return (
     <>
     {chatButton()}
     {team && team.settings && team.settings.key && (
       <ChatDrawer 
         open={chatDrawerOpen} 
-        onClose={() => setChatDrawerOpen(false)}
+        onClose={onChatClose}
         team={team}
       />
     )}

src/app/UserWrapper.tsx

@@ -72,6 +72,7 @@ export default function UserWrapper(props: Props) {
     if (hasFetched.current) return;
     setLoading(true)
     userAPI.getUserWithTeam(user_id).then(resp => {
+      console.log(resp.data.team)
       setGlobal({
         user: resp.data.user ? User.create(resp.data.user) : User.create(),
         team: resp.data.team ? Team.create(resp.data.team) : Team.create(),

src/chat/ChatMessage.tsx

@@ -75,7 +75,7 @@ export default function ChatMessage(props: Props) {
         return mappedPerm; // Return null for invalid keys
       }).filter(Boolean); // Optionally filter out any null values
     } else {
-      console.error("data.permissions is not an array or does not exist");
+      // console.error("data.permissions is not an array or does not exist");
       perms = [];
     }
     return perms