groupchat 0.0.9 → 0.0.10

package/dist/index.js

@@ -349,15 +349,7 @@ function Header({
       width: "100%",
       flexShrink: 0,
       children: [
-        /* @__PURE__ */ jsx3(Box3, { children: title || /* @__PURE__ */ jsxs3(Fragment2, { children: [
-          /* @__PURE__ */ jsxs3(Text3, { color: "cyan", bold: true, children: [
-            "$",
-            " "
-          ] }),
-          /* @__PURE__ */ jsx3(Text3, { color: "blue", bold: true, children: "groupchat" }),
-          /* @__PURE__ */ jsx3(Text3, { color: "gray", children: " --session " }),
-          /* @__PURE__ */ jsx3(Text3, { color: "yellow", children: username || "..." })
-        ] }) }),
+        /* @__PURE__ */ jsx3(Box3, { children: title }),
         /* @__PURE__ */ jsxs3(Box3, { children: [
           showStatus && /* @__PURE__ */ jsxs3(Fragment2, { children: [
             /* @__PURE__ */ jsxs3(Text3, { color: statusColor, children: [
@@ -599,7 +591,9 @@ function Menu({
   publicChannels,
   privateChannels,
   unreadCounts,
-  aggregatedPresence
+  aggregatedPresence,
+  isLoadingChannels = false,
+  totalUnreadCount = 0
 }) {
   const { stdout } = useStdout2();
   const { navigate } = useNavigation();
@@ -632,8 +626,9 @@ function Menu({
   }, [menuItems, currentChannel]);
   useEffect2(() => {
     if (!stdout) return;
-    stdout.write(`\x1B]0;Menu\x07`);
-  }, [stdout]);
+    const unreadSuffix = totalUnreadCount > 0 ? ` (${totalUnreadCount})` : "";
+    stdout.write(`\x1B]0;Menu${unreadSuffix}\x07`);
+  }, [stdout, totalUnreadCount]);
   useInput3((input, key) => {
     if (key.escape) {
       navigate("chat");
@@ -721,7 +716,7 @@ function Menu({
               }
             )
           ] }),
-          allChannels.length === 0 && /* @__PURE__ */ jsx7(Box6, { children: /* @__PURE__ */ jsx7(Text5, { color: "gray", children: "No channels available" }) })
+          allChannels.length === 0 && /* @__PURE__ */ jsx7(Box6, { children: isLoadingChannels ? /* @__PURE__ */ jsx7(Text5, { color: "cyan", children: "Loading channels..." }) : /* @__PURE__ */ jsx7(Text5, { color: "gray", children: "No channels available" }) })
         ] }),
         /* @__PURE__ */ jsx7(Box6, { paddingRight: 2, paddingTop: 2, children: /* @__PURE__ */ jsx7(AtAGlance, { presenceState: aggregatedPresence }) })
       ] }),
@@ -1747,7 +1742,8 @@ function ChatView({
   onTypingStop,
   onCommandSend,
   error,
-  token
+  token,
+  totalUnreadCount = 0
 }) {
   const { stdout } = useStdout3();
   const { tooltip, isInputDisabled, handleInputChange, handleSubmit } = useCommandInput({
@@ -1766,8 +1762,9 @@ function ChatView({
   useEffect5(() => {
     if (!stdout) return;
     const prefix = connectionStatus === "connected" ? "\u2022 " : "";
-    stdout.write(`\x1B]0;${prefix}#${displayName}\x07`);
-  }, [stdout, connectionStatus, displayName]);
+    const unreadSuffix = totalUnreadCount > 0 ? ` (${totalUnreadCount})` : "";
+    stdout.write(`\x1B]0;${prefix}#${displayName}${unreadSuffix}\x07`);
+  }, [stdout, connectionStatus, displayName, totalUnreadCount]);
   return /* @__PURE__ */ jsxs13(Layout, { width: terminalSize.columns, height: terminalSize.rows, topPadding, children: [
     /* @__PURE__ */ jsx14(Layout.Header, { children: /* @__PURE__ */ jsx14(
       Header,
@@ -1866,7 +1863,8 @@ function CreateChannelScreen({
   connectionStatus,
   onLogout,
   onCreateChannel,
-  topPadding = 0
+  topPadding = 0,
+  totalUnreadCount = 0
 }) {
   const { stdout } = useStdout4();
   const { navigate } = useNavigation();
@@ -1877,8 +1875,9 @@ function CreateChannelScreen({
   const [error, setError] = useState7(null);
   useEffect6(() => {
     if (!stdout) return;
-    stdout.write(`\x1B]0;Create Channel\x07`);
-  }, [stdout]);
+    const unreadSuffix = totalUnreadCount > 0 ? ` (${totalUnreadCount})` : "";
+    stdout.write(`\x1B]0;Create Channel${unreadSuffix}\x07`);
+  }, [stdout, totalUnreadCount]);
   useInput5((input, key) => {
     if (key.escape) {
       navigate("menu");
@@ -2189,6 +2188,7 @@ var init_channel_manager = __esm({
                 state.realtimeMessages.shift();
               }
             }
+            this.callbacks.onNonActiveChannelMessage?.(channelSlug, message);
           }
         });
         channel.on("presence_state", (payload) => {
@@ -2611,18 +2611,20 @@ var init_channel_manager = __esm({
 
 // src/hooks/use-multi-channel-chat.ts
 import { useState as useState8, useCallback as useCallback3, useRef as useRef3, useEffect as useEffect7 } from "react";
-function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
-  const [messages, setMessages] = useState8([]);
+function useMultiChannelChat(token, currentChannel, onChannelListChanged, incrementUnreadCount) {
+  const [messageCache, setMessageCache] = useState8({});
+  const [subscriberCache, setSubscriberCache] = useState8({});
   const [connectionStatus, setConnectionStatus] = useState8("disconnected");
   const [username, setUsername] = useState8(null);
   const [error, setError] = useState8(null);
   const [typingUsers, setTypingUsers] = useState8([]);
   const [presenceState, setPresenceState] = useState8({});
-  const [subscribers, setSubscribers] = useState8([]);
   const [channelsReady, setChannelsReady] = useState8(false);
   const managerRef = useRef3(null);
   const prevChannelRef = useRef3(null);
   const isLoadingHistory = useRef3(false);
+  const messages = messageCache[currentChannel] || [];
+  const subscribers = subscriberCache[currentChannel] || [];
   useEffect7(() => {
     if (!token) {
       if (managerRef.current) {
@@ -2641,7 +2643,13 @@ function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
       token,
       {
         onMessage: (channelSlug, message) => {
-          setMessages((prev) => [...prev, message]);
+          setMessageCache((prev) => ({
+            ...prev,
+            [channelSlug]: [...prev[channelSlug] || [], message]
+          }));
+        },
+        onNonActiveChannelMessage: (channelSlug, _message) => {
+          incrementUnreadCount?.(channelSlug);
         },
         onPresenceState: (channelSlug, state) => {
           setPresenceState(state);
@@ -2705,10 +2713,14 @@ function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
           }
         },
         onUserInvitedToChannel: (channelSlug, invitedUsername, invitedUserId, invitedBy) => {
-          setSubscribers((prev) => {
-            const exists = prev.some((s) => s.user_id === invitedUserId);
+          setSubscriberCache((prev) => {
+            const currentSubs = prev[channelSlug] || [];
+            const exists = currentSubs.some((s) => s.user_id === invitedUserId);
             if (!exists) {
-              return [...prev, { username: invitedUsername, user_id: invitedUserId, role: "member" }];
+              return {
+                ...prev,
+                [channelSlug]: [...currentSubs, { username: invitedUsername, user_id: invitedUserId, role: "member" }]
+              };
             }
             return prev;
           });
@@ -2717,7 +2729,13 @@ function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
           setError(`You were removed from ${channelSlug} by ${removedBy}`);
         },
         onUserRemovedFromChannel: (channelSlug, removedUsername, removedBy) => {
-          setSubscribers((prev) => prev.filter((s) => s.username !== removedUsername));
+          setSubscriberCache((prev) => {
+            const currentSubs = prev[channelSlug] || [];
+            return {
+              ...prev,
+              [channelSlug]: currentSubs.filter((s) => s.username !== removedUsername)
+            };
+          });
         }
       }
     );
@@ -2768,9 +2786,15 @@ function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
         const history = await manager.fetchHistory(currentChannel);
         if (currentChannel.startsWith("private_room:")) {
           const subs = await manager.fetchSubscribers(currentChannel);
-          setSubscribers(subs);
+          setSubscriberCache((prev) => ({
+            ...prev,
+            [currentChannel]: subs
+          }));
         } else {
-          setSubscribers([]);
+          setSubscriberCache((prev) => ({
+            ...prev,
+            [currentChannel]: []
+          }));
         }
         const realtimeMessages = manager.getRealtimeMessages(currentChannel);
         const merged = [...history, ...realtimeMessages];
@@ -2781,7 +2805,10 @@ function useMultiChannelChat(token, currentChannel, onChannelListChanged) {
           return true;
         });
         deduplicated.sort((a, b) => a.timestamp.localeCompare(b.timestamp));
-        setMessages(deduplicated);
+        setMessageCache((prev) => ({
+          ...prev,
+          [currentChannel]: deduplicated
+        }));
         manager.clearRealtimeMessages(currentChannel);
         const presence = manager.getPresence(currentChannel);
         setPresenceState(presence);
@@ -2947,7 +2974,7 @@ var init_use_agent_detection = __esm({
 });
 
 // src/hooks/use-channels.ts
-import { useState as useState9, useCallback as useCallback5, useEffect as useEffect9 } from "react";
+import { useState as useState9, useCallback as useCallback5, useEffect as useEffect9, useMemo as useMemo6 } from "react";
 function useChannels(token) {
   const [publicChannels, setPublicChannels] = useState9([]);
   const [privateChannels, setPrivateChannels] = useState9([]);
@@ -2983,6 +3010,21 @@ function useChannels(token) {
       console.error("Failed to refetch unread counts:", err);
     }
   }, [token]);
+  const incrementUnreadCount = useCallback5((channelSlug) => {
+    setUnreadCounts((prev) => ({
+      ...prev,
+      [channelSlug]: (prev[channelSlug] || 0) + 1
+    }));
+  }, []);
+  const clearUnreadCount = useCallback5((channelSlug) => {
+    setUnreadCounts((prev) => ({
+      ...prev,
+      [channelSlug]: 0
+    }));
+  }, []);
+  const totalUnreadCount = useMemo6(() => {
+    return Object.values(unreadCounts).reduce((sum, count) => sum + count, 0);
+  }, [unreadCounts]);
   useEffect9(() => {
     if (token) {
       fetchData();
@@ -2995,7 +3037,10 @@ function useChannels(token) {
     loading,
     error,
     refetch: fetchData,
-    refetchUnreadCounts
+    refetchUnreadCounts,
+    incrementUnreadCount,
+    clearUnreadCount,
+    totalUnreadCount
   };
 }
 var init_use_channels = __esm({
@@ -3068,7 +3113,7 @@ function AppContent() {
     }
     checkAuth();
   }, []);
-  const { publicChannels, privateChannels, unreadCounts, refetchUnreadCounts, refetch: refetchChannels } = useChannels(token);
+  const { publicChannels, privateChannels, unreadCounts, loading: isLoadingChannels, refetchUnreadCounts, refetch: refetchChannels, incrementUnreadCount, clearUnreadCount, totalUnreadCount } = useChannels(token);
   const {
     messages,
     connectionStatus,
@@ -3083,7 +3128,7 @@ function AppContent() {
     connect,
     disconnect,
     channelManager
-  } = useMultiChannelChat(token, currentChannel, refetchChannels);
+  } = useMultiChannelChat(token, currentChannel, refetchChannels, incrementUnreadCount);
   const { users } = usePresence(presenceState, subscribers, currentChannel);
   useAgentDetection(channelManager, connectionStatus === "connected");
   const sendCommand = useCallback6(
@@ -3127,10 +3172,11 @@ function AppContent() {
       }
       if (currentChannel) {
         markChannelAsRead(currentChannel, true);
+        clearUnreadCount(currentChannel);
       }
       prevChannelForMarkAsReadRef.current = currentChannel;
     }
-  }, [currentChannel, channelManager, refetchUnreadCounts]);
+  }, [currentChannel, channelManager, refetchUnreadCounts, clearUnreadCount]);
   useEffect10(() => {
     return () => {
       if (currentChannel && channelManager) {
@@ -3143,6 +3189,10 @@ function AppContent() {
       refetchUnreadCounts();
     }
   }, [route, refetchUnreadCounts]);
+  useEffect10(() => {
+    setScrollOffset(0);
+    setIsScrollDetached(false);
+  }, [currentChannel]);
   const handleLogin = useCallback6(async () => {
     setAuthState("authenticating");
     setAuthStatus("Starting login...");
@@ -3271,7 +3321,9 @@ function AppContent() {
             publicChannels,
             privateChannels,
             unreadCounts,
-            aggregatedPresence
+            aggregatedPresence,
+            isLoadingChannels,
+            totalUnreadCount
           }
         )
       }
@@ -3294,7 +3346,8 @@ function AppContent() {
             connectionStatus,
             onLogout: handleLogout,
             onCreateChannel: handleCreateChannel,
-            topPadding
+            topPadding,
+            totalUnreadCount
           }
         )
       }
@@ -3325,7 +3378,8 @@ function AppContent() {
       onTypingStop: stopTyping,
       onCommandSend: sendCommand,
       error,
-      token
+      token,
+      totalUnreadCount
     }
   );
 }
@@ -3517,7 +3571,7 @@ function UpdatePrompt({ updateInfo, onComplete }) {
 // package.json
 var package_default = {
   name: "groupchat",
-  version: "0.0.9",
+  version: "0.0.10",
   description: "CLI chat client for Groupchat",
   type: "module",
   main: "./dist/index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "groupchat",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "description": "CLI chat client for Groupchat",
   "type": "module",
   "main": "./dist/index.js",