fix: eliminate phantom notifications across the entire read-state pipeline

Root cause: own messages echoed by the server marked channels unread when
the user had already navigated away. Seven related bugs compounded the
problem — stale read states, missing cleanup on space/DM removal, REST
broadcast ignoring VIEW_CHANNEL, and no validation on channel_ack writes.

Frontend:
- Skip markChannelUnread for the user's own messages (federation-aware)
- Walk backward past temp_ IDs in ackChannel instead of bailing
- Re-fire ack timer when temp message is replaced by server-confirmed ID
- Add removeChannelStates to clean up unread/read/message caches
- Clean up chatStore on removeSpace, removeDmChannel, removeInstanceSpaces

Server:
- Use sendToChannel instead of sendToSpace for REST message creation
- Clean up read_states on space deletion, member kick/leave, and ban
- Validate channel membership before accepting channel_ack writes
- Clean up read_states on DM leave and DM channel deletion

packages/web/src/components/chat/MessageList.tsx

@@ -69,6 +69,9 @@ export function MessageList({ channelId, jumpToMessageId, onJumpComplete }: Mess
     }
   }, [channelId, loadMessages, canReadHistory]);
 
+  // Track the last message ID so the ack re-fires when a temp message is replaced by its server-confirmed ID
+  const lastMessageId = messages.length > 0 ? messages[messages.length - 1]?.id ?? '' : '';
+
   // Ack channel when messages load or when new messages arrive while near bottom
   useEffect(() => {
     if (messages.length > 0 && isNearBottom) {
@@ -76,7 +79,7 @@ export function MessageList({ channelId, jumpToMessageId, onJumpComplete }: Mess
       ackTimerRef.current = setTimeout(() => ackChannel(channelId), 200);
     }
     return () => clearTimeout(ackTimerRef.current);
-  }, [channelId, messages.length, isNearBottom, ackChannel]);
+  }, [channelId, messages.length, lastMessageId, isNearBottom, ackChannel]);
 
   // Reset scroll tracking on channel switch so initial-load scroll fires
   useEffect(() => {

packages/web/src/hooks/useWebSocket.ts

@@ -284,7 +284,8 @@ function handleEvent(origin: string, event: ServerEvent): void {
       addRealtimeMessage(event.message.channelId, event.message);
       {
         const { currentChannelId, markChannelUnread } = useChatStore.getState();
-        if (event.message.channelId !== currentChannelId) {
+        const myId = isHome ? useAuthStore.getState().user?.id : getMyUserIdForOrigin(origin);
+        if (event.message.channelId !== currentChannelId && event.message.userId !== myId) {
           markChannelUnread(event.message.channelId);
         }
       }
@@ -440,7 +441,8 @@ function handleEvent(origin: string, event: ServerEvent): void {
       }
       {
         const { currentChannelId, markChannelUnread } = useChatStore.getState();
-        if (event.message.dmChannelId !== currentChannelId) {
+        const myId = isHome ? useAuthStore.getState().user?.id : getMyUserIdForOrigin(origin);
+        if (event.message.dmChannelId !== currentChannelId && event.message.userId !== myId) {
           markChannelUnread(event.message.dmChannelId);
         }
       }

packages/web/src/stores/chatStore.ts

@@ -57,6 +57,7 @@ interface ChatState {
   markChannelUnread: (channelId: string) => void;
   ackChannel: (channelId: string) => void;
   onChannelAck: (channelId: string, messageId: string) => void;
+  removeChannelStates: (channelIds: Set<string>) => void;
   updateUserInMessages: (user: { id: string; [key: string]: any }) => void;
 }
 
@@ -565,16 +566,22 @@ export const useChatStore = create<ChatState>((set, get) => ({
   ackChannel: (channelId: string) => {
     const msgs = get().messages.get(channelId);
     if (!msgs || msgs.length === 0) return;
-    const lastMsg = msgs[msgs.length - 1];
-    if (!lastMsg) return;
-    const messageId = lastMsg.id;
-    // Don't ack optimistic/temp messages — wait for the real server ID
-    if (messageId.startsWith('temp_')) return;
+
+    // Walk backward to find the last server-confirmed (non-temp) message
+    let messageId: string | null = null;
+    for (let i = msgs.length - 1; i >= 0; i--) {
+      const msg = msgs[i];
+      if (msg && !msg.id.startsWith('temp_')) {
+        messageId = msg.id;
+        break;
+      }
+    }
+    if (!messageId) return; // All messages are temp — nothing to ack yet
 
     // Update local state immediately
     set((state) => {
       const newReadStates = new Map(state.readStates);
-      newReadStates.set(channelId, messageId);
+      newReadStates.set(channelId, messageId!);
       const newUnread = new Set(state.unreadChannels);
       newUnread.delete(channelId);
       return { readStates: newReadStates, unreadChannels: newUnread };
@@ -595,6 +602,21 @@ export const useChatStore = create<ChatState>((set, get) => ({
     });
   },
 
+  removeChannelStates: (channelIds: Set<string>) => {
+    if (channelIds.size === 0) return;
+    set((state) => {
+      const newUnread = new Set(state.unreadChannels);
+      const newReadStates = new Map(state.readStates);
+      const newMessages = new Map(state.messages);
+      for (const channelId of channelIds) {
+        newUnread.delete(channelId);
+        newReadStates.delete(channelId);
+        newMessages.delete(channelId);
+      }
+      return { unreadChannels: newUnread, readStates: newReadStates, messages: newMessages };
+    });
+  },
+
   updateUserInMessages: (user: { id: string; homeUserId?: string | null; [key: string]: any }) => {
     set((state) => {
       const newMessages = new Map(state.messages);

packages/web/src/stores/spaceStore.ts

@@ -4,6 +4,7 @@ import { api, BackspaceApiClient } from '../api/client';
 import { resolveAssetUrl, normalizeUserAssets } from '../utils/assetUrls';
 import { isSelf } from '../utils/identity';
 import { useAuthStore } from './authStore';
+import { useChatStore } from './chatStore';
 
 // ─── Instance-aware types ─────────────────────────────────────────────────────
 
@@ -147,9 +148,13 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
     };
   }),
 
-  removeDmChannel: (id) => set((state) => ({
-    dmChannels: state.dmChannels.filter(c => c.id !== id)
-  })),
+  removeDmChannel: (id) => {
+    set((state) => ({
+      dmChannels: state.dmChannels.filter(c => c.id !== id)
+    }));
+    // Clean up unread/read state for the closed DM
+    useChatStore.getState().removeChannelStates(new Set([id]));
+  },
 
   addDmMember: (dmChannelId, user) => set((state) => ({
     dmChannels: state.dmChannels.map(dm =>
@@ -408,13 +413,14 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
   },
 
   removeSpace: (spaceId: string) => {
-    set((state) => {
-      // Collect channel IDs belonging to this space for map cleanup
-      const channelIdsToRemove = new Set<string>();
-      for (const [channelId, sid] of state.channelToSpaceMap) {
-        if (sid === spaceId) channelIdsToRemove.add(channelId);
-      }
+    // Collect channel IDs before set() so we can clean up chatStore after
+    const currentState = get();
+    const channelIdsToRemove = new Set<string>();
+    for (const [channelId, sid] of currentState.channelToSpaceMap) {
+      if (sid === spaceId) channelIdsToRemove.add(channelId);
+    }
 
+    set((state) => {
       const channelToSpaceMap = new Map(state.channelToSpaceMap);
       const channelPermissions = new Map(state.channelPermissions);
       const channelOriginMap = new Map(state.channelOriginMap);
@@ -439,6 +445,11 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
         spacePermissions,
       };
     });
+
+    // Clean up orphaned unread/read states and cached messages in chatStore
+    if (channelIdsToRemove.size > 0) {
+      useChatStore.getState().removeChannelStates(channelIdsToRemove);
+    }
   },
 
   updateMemberPresence: (userId: string, status: string) => {
@@ -739,6 +750,13 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
   },
 
   removeInstanceSpaces: (origin: string) => {
+    // Collect channel IDs before set() for chatStore cleanup
+    const currentState = get();
+    const channelIdsToRemove = new Set<string>();
+    for (const [channelId, chOrigin] of currentState.channelOriginMap) {
+      if (chOrigin === origin) channelIdsToRemove.add(channelId);
+    }
+
     set((state) => {
       const remainingSpaces = state.spaces.filter(s => s._instanceOrigin !== origin);
 
@@ -749,13 +767,11 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
       const channelOriginMap = new Map(state.channelOriginMap);
       const spacePermissions = new Map(state.spacePermissions);
 
-      for (const [channelId, chOrigin] of state.channelOriginMap) {
-        if (chOrigin === origin) {
-          channelToSpaceMap.delete(channelId);
-          channelLastMessageIds.delete(channelId);
-          channelPermissions.delete(channelId);
-          channelOriginMap.delete(channelId);
-        }
+      for (const channelId of channelIdsToRemove) {
+        channelToSpaceMap.delete(channelId);
+        channelLastMessageIds.delete(channelId);
+        channelPermissions.delete(channelId);
+        channelOriginMap.delete(channelId);
       }
       for (const s of state.spaces) {
         if (s._instanceOrigin === origin) {
@@ -775,6 +791,11 @@ export const useSpaceStore = create<SpaceState>((set, get) => ({
           : null,
       };
     });
+
+    // Clean up orphaned unread/read states and cached messages in chatStore
+    if (channelIdsToRemove.size > 0) {
+      useChatStore.getState().removeChannelStates(channelIdsToRemove);
+    }
   },
 }));