@zenify-omni/chat-ui-react-js 0.1.0

package/store/chat-store.js

@@ -0,0 +1,931 @@
+import { create } from "./index.js";
+import { devtools } from "./devtools.js";
+import { formatDay } from "@zenify-omni/chat-js/utils/date.js";
+import { differenceInMinutes } from "date-fns";
+import {
+  ActionMessageTypes,
+  ChatFilterAssignStatus,
+  ChatFilterSource,
+  DEFAULT_CHAT_SORT
+} from "@zenify-omni/chat-js/constants/chat-message.js";
+import { ChatRoomTagBatchAction } from "@zenify-omni/chat-js/constants/chat-room-tag.js";
+import { DEFAULT_FILTER_STATE } from "../components/chat-route/chat-list/util.js";
+import { CHATTER_TYPES } from "../components/chat-route/chat-box/constants.js";
+import { isNil, orderBy, uniqBy } from "lodash-es";
+import {
+  getTabKeyFromStatus,
+  getTabStatusFromChat,
+  shouldCountForTab
+} from "./chat-store-helpers.js";
+import { getUser } from "@zenify-omni/chat-js/utils/auth.js";
+const removePinFromTab = (pinChatIds, tab, id) => {
+  const ids = pinChatIds[tab] ?? [];
+  return ids.includes(id) ? { ...pinChatIds, [tab]: ids.filter((x) => x !== id) } : pinChatIds;
+};
+const normalizeOneAppended = (prevMessage, newMessage) => {
+  const msgDate = newMessage.created_at;
+  const prevMsgDate = prevMessage?.created_at ?? null;
+  const formattedSelfDate = formatDay(msgDate);
+  const formattedPrevDate = prevMsgDate ? formatDay(prevMsgDate) : null;
+  const dateLabel = formattedPrevDate && formattedSelfDate !== formattedPrevDate ? formattedSelfDate : "";
+  const prevChatterId = prevMessage?.chatter_id ?? null;
+  const prevChatterName = prevMessage?.chatter_name ?? null;
+  const prevMsgType = prevMessage?.content?.type ?? null;
+  let showUserName = !prevMessage || newMessage.chatter_id !== prevChatterId || newMessage.chatter_name !== prevChatterName || ActionMessageTypes.includes(prevMsgType);
+  if (!showUserName) {
+    showUserName = differenceInMinutes(new Date(msgDate), new Date(prevMsgDate)) > 60;
+  }
+  return { ...newMessage, dateLabel, showUserName, normalized: true };
+};
+const normalizeChatMessagesBulk = (chatMessages) => {
+  const mapIdToIndex = {};
+  const orderedMessages = orderBy(
+    chatMessages,
+    (message) => new Date(message.created_at),
+    "asc"
+  );
+  let uniqueChatMessages = {};
+  orderedMessages.forEach((message) => {
+    uniqueChatMessages[message._id] = message;
+  });
+  uniqueChatMessages = Object.values(uniqueChatMessages);
+  const clientMsgIdsWithRealMessage = /* @__PURE__ */ new Set();
+  uniqueChatMessages.forEach((message) => {
+    if (message.client_msg_id && message._id !== message.client_msg_id) {
+      clientMsgIdsWithRealMessage.add(message.client_msg_id);
+    }
+  });
+  if (clientMsgIdsWithRealMessage.size > 0) {
+    uniqueChatMessages = uniqueChatMessages.filter(
+      (message) => !(message.client_msg_id && message._id === message.client_msg_id && clientMsgIdsWithRealMessage.has(message.client_msg_id))
+    );
+  }
+  const data = uniqueChatMessages.reduce((prev, message, index) => {
+    if (message.normalized) {
+      prev.push(message);
+      return prev;
+    }
+    const msgDate = message.created_at;
+    const prevMsgDate = index === 0 ? null : uniqueChatMessages[index - 1].created_at;
+    let dateLabel = "";
+    const formattedSelfDate = formatDay(msgDate);
+    const formattedPrevMsgDate = formatDay(prevMsgDate);
+    if (formattedPrevMsgDate && formattedSelfDate !== formattedPrevMsgDate) {
+      dateLabel = formattedSelfDate;
+    }
+    const chatterId = message.chatter_id;
+    const chatterName = message.chatter_name;
+    const prevChatterId = index === 0 ? null : uniqueChatMessages[index - 1].chatter_id;
+    const prevChatterName = index === 0 ? null : uniqueChatMessages[index - 1].chatter_name;
+    const prevMsgType = index === 0 ? null : uniqueChatMessages[index - 1].content?.type;
+    let showUserName = false;
+    if (index === 0 || chatterId !== prevChatterId || ActionMessageTypes.includes(prevMsgType) || prevMsgType === "ads_content" || chatterName !== prevChatterName) {
+      showUserName = true;
+    } else {
+      const diffInMinute = differenceInMinutes(
+        new Date(msgDate),
+        new Date(prevMsgDate)
+      );
+      if (diffInMinute > 60) showUserName = true;
+    }
+    const dataToReturn = {
+      ...message,
+      dateLabel,
+      showUserName,
+      normalized: true
+    };
+    if (!mapIdToIndex[message._id]) {
+      mapIdToIndex[message._id] = index;
+      prev.push(dataToReturn);
+    } else {
+      const prevIndex = mapIdToIndex[message._id];
+      prev[prevIndex] = {
+        ...prev[prevIndex],
+        ...dataToReturn,
+        showUserName: prev[prevIndex].showUserName,
+        dateLabel: prev[prevIndex].dateLabel
+      };
+    }
+    return prev;
+  }, []);
+  return data;
+};
+const requiresChronologicalSort = (source) => source === ChatFilterSource.Shopee;
+const MAX_CACHED_MESSAGE_ROOMS = 20;
+const evictOldestMessageRooms = (state, ticketChatMessages) => {
+  const roomIds = Object.keys(ticketChatMessages);
+  const overflow = roomIds.length - MAX_CACHED_MESSAGE_ROOMS;
+  if (overflow <= 0) {
+    return { ticketChatMessages };
+  }
+  const newTicketChatMessages = { ...ticketChatMessages };
+  const newLoadedRooms = { ...state.loadedRooms };
+  const newTokenForGetMessageApi = { ...state.tokenForGetMessageApi };
+  const removable = roomIds.filter((id) => id !== state.currentChatId);
+  for (let i = 0; i < overflow && i < removable.length; i++) {
+    const id = removable[i];
+    delete newTicketChatMessages[id];
+    delete newLoadedRooms[id];
+    delete newTokenForGetMessageApi[id];
+  }
+  return {
+    ticketChatMessages: newTicketChatMessages,
+    loadedRooms: newLoadedRooms,
+    tokenForGetMessageApi: newTokenForGetMessageApi
+  };
+};
+const storedShowChatDetail = localStorage.getItem("show-chat-detail");
+const getDraftStorageKey = () => {
+  const user = getUser();
+  return user?.agent_id ? `chat_drafts_${user.agent_id}` : "chat_drafts";
+};
+const getStoredDrafts = () => {
+  try {
+    return JSON.parse(localStorage.getItem(getDraftStorageKey()) || "{}");
+  } catch {
+    return {};
+  }
+};
+const useChatStore = create(
+  devtools(
+    (set, get) => ({
+      isSocketConnected: false,
+      isSilentRefreshChatList: false,
+      isChatListLoading: false,
+      isReceivedTabLoading: false,
+      isNotReceivedTabLoading: false,
+      isClosedTabLoading: false,
+      isChatAllowed: true,
+      isZaloConnected: false,
+      draftMessages: getStoredDrafts(),
+      chatList: [],
+      currentChat: [],
+      pinChatIds: {
+        [ChatFilterAssignStatus.Received]: [],
+        [ChatFilterAssignStatus.NotReceived]: [],
+        [ChatFilterAssignStatus.Closed]: []
+      },
+      currentChatId: "",
+      currentChatTab: ChatFilterAssignStatus.Received,
+      currentChatSource: "all",
+      currentChatSearch: "",
+      currentChatFilter: "",
+      chatFilterFlags: [],
+      unread: 0,
+      subInfoExpanded: false,
+      lastRefreshTimeTicketPage: Date.now(),
+      refreshFriendRequestListAt: Date.now(),
+      chatContentRefreshAt: Date.now(),
+      toggleRightSide: isNil(storedShowChatDetail) ? true : storedShowChatDetail === "true",
+      ticketChatMessages: {},
+      roomReadUpdates: {},
+      loadedRooms: {},
+      typingUsers: {},
+      viewModeRightSide: null,
+      viewModeRightSideEditer: null,
+      dataDealEditer: null,
+      replySelected: null,
+      tokenForGetMessageApi: {},
+      findReplySelected: null,
+      findPinSelected: null,
+      highlightMessageId: null,
+      feedbackMessage: null,
+      insightMessage: null,
+      forwardMessage: null,
+      isSelectMode: false,
+      selectedMessages: [],
+      // isSelectMode ở trên là chọn nhiều tin nhắn trong khung chat; cờ dưới đây
+      // là chọn nhiều hội thoại ở danh sách bên trái, hai chế độ độc lập nhau.
+      isChatListSelectMode: false,
+      selectedChatIds: [],
+      // "Chọn tất cả" là phạm vi theo tab + bộ lọc hiện tại chứ không phải theo
+      // id, nên để riêng một cờ; chat-item đọc cờ này để tick sẵn mọi dòng.
+      // Bỏ tick lúc đó chỉ ghi id vào excludeChatIds (thường rất ít) thay vì
+      // trải toàn bộ id của tab ra selectedChatIds.
+      isChatListSelectAll: false,
+      excludeChatIds: [],
+      aliasMap: {},
+      setAliasMap: (aliases) => set({ aliasMap: aliases }),
+      setIsChatAllowed: (isAllowed) => set({ isChatAllowed: isAllowed }),
+      setIsZaloConnected: (v) => set({ isZaloConnected: v }),
+      setFeedbackMessage: (data) => set({ feedbackMessage: data }),
+      setInsightMessage: (data) => set({ insightMessage: data }),
+      setForwardMessage: (data) => set({ forwardMessage: data }),
+      setSelectMode: (bool) => set({ isSelectMode: bool, selectedMessages: [] }),
+      // Thoát/vào chế độ chọn đều dọn danh sách đã chọn để lần mở sau bắt đầu lại
+      // từ đầu.
+      setChatListSelectMode: (bool) => set({
+        isChatListSelectMode: bool,
+        selectedChatIds: [],
+        isChatListSelectAll: false,
+        excludeChatIds: []
+      }),
+      // Đang chọn tất cả thì tick/bỏ tick chỉ thêm/bớt id trong danh sách loại
+      // trừ, phạm vi vẫn là "tất cả trừ mấy dòng này"; ngoài chế độ đó mới ghi
+      // vào danh sách id đã chọn.
+      toggleSelectedChatId: (id) => set((state) => {
+        if (state.isChatListSelectAll) {
+          return {
+            excludeChatIds: state.excludeChatIds.includes(id) ? state.excludeChatIds.filter((x) => x !== id) : [...state.excludeChatIds, id]
+          };
+        }
+        return {
+          selectedChatIds: state.selectedChatIds.includes(id) ? state.selectedChatIds.filter((x) => x !== id) : [...state.selectedChatIds, id]
+        };
+      }),
+      setChatListSelectAll: (bool) => set({
+        isChatListSelectAll: bool,
+        selectedChatIds: [],
+        excludeChatIds: []
+      }),
+      toggleSelectedMessage: (msg) => set((state) => ({
+        selectedMessages: state.selectedMessages.some(
+          (m) => m._id === msg._id
+        ) ? state.selectedMessages.filter((m) => m._id !== msg._id) : [...state.selectedMessages, msg]
+      })),
+      setHighlightMessageId: (data) => set({ highlightMessageId: data }),
+      setFindReplySelected: (data) => set({ findReplySelected: data }),
+      setFindPinSelected: (data) => set({ findPinSelected: data }),
+      setReplySelected: (data) => set({ replySelected: data }),
+      setViewModeRightSideEditer: (data) => set({ viewModeRightSideEditer: data }),
+      setViewModeRightSide: (viewModeRightSide) => set({ viewModeRightSide }),
+      resetLastRefreshTimeTicketPage: () => set({ lastRefreshTimeTicketPage: Date.now() }),
+      setRefreshFriendRequestListAt: () => set({ refreshFriendRequestListAt: Date.now() }),
+      setIsSocketConnected: (isConnected) => set({ isSocketConnected: isConnected }),
+      setIsSilentRefreshChatList: (v) => set({ isSilentRefreshChatList: v }),
+      markRoomLoaded: (roomId) => set((state) => ({
+        loadedRooms: { ...state.loadedRooms, [roomId]: true }
+      })),
+      // Đánh dấu room chưa load (initial_load:false) -> lần vào lại sẽ fetch tin
+      // mới nhất. Dùng khi room không được làm mới (vd reconnect nhưng user đã
+      // chuyển sang room khác trong lúc fetch).
+      markRoomUnloaded: (roomId) => set((state) => {
+        if (!state.loadedRooms[roomId]) return state;
+        const newLoadedRooms = { ...state.loadedRooms };
+        delete newLoadedRooms[roomId];
+        return { loadedRooms: newLoadedRooms };
+      }),
+      // Reset cờ load tất cả room trừ room đang mở (dùng khi reconnect): lần vào
+      // lại các room khác sẽ fetch message mới nhất.
+      resetLoadedRooms: () => set((state) => ({
+        loadedRooms: state.currentChatId ? { [state.currentChatId]: true } : {}
+      })),
+      setIsChatListLoading: (isLoading) => set({ isChatListLoading: isLoading }),
+      setIsReceivedTabLoading: (v) => set({ isReceivedTabLoading: v }),
+      setIsNotReceivedTabLoading: (v) => set({ isNotReceivedTabLoading: v }),
+      setIsClosedTabLoading: (v) => set({ isClosedTabLoading: v }),
+      setChatList: (data) => set({ chatList: data }),
+      setPinChatIds: (data) => set({ pinChatIds: data }),
+      setUnread: (data) => set({ unread: data }),
+      setCurrentChat: (data) => set({ currentChat: data }),
+      setCurrentChatId: (id) => set({ currentChatId: id }),
+      setTokenForGetMessageApi: (room_id, token) => set((state) => ({
+        tokenForGetMessageApi: {
+          ...state.tokenForGetMessageApi,
+          [room_id]: token
+        }
+      })),
+      // Chọn nhiều chỉ dùng ở tab "Đang xử lý" và lựa chọn gắn theo tab, nên đổi
+      // tab là bỏ hết id đã tick, rời khỏi tab đó thì tắt luôn chế độ chọn.
+      setCurrentChatTab: (tab) => set({
+        currentChatTab: tab,
+        selectedChatIds: [],
+        isChatListSelectAll: false,
+        excludeChatIds: [],
+        ...tab === ChatFilterAssignStatus.Received ? {} : { isChatListSelectMode: false }
+      }),
+      setCurrentChatSource: (source) => set({ currentChatSource: source }),
+      setCurrentChatSearch: (search) => set({ currentChatSearch: search }),
+      setCurrentChatFilter: (filter) => set({ currentChatFilter: filter }),
+      setChatFilterFlags: (filter) => set({ chatFilterFlags: filter }),
+      setToggleRightSide: (status) => set({ toggleRightSide: status }),
+      setDataDealEditer: (dataDealEditer) => set({ dataDealEditer }),
+      setSubInfoExpanded: (status) => set({ subInfoExpanded: status }),
+      setDraftMessages: (key, message) => {
+        const drafts = getStoredDrafts();
+        drafts[key] = message;
+        const keys = Object.keys(drafts);
+        if (keys.length > 50) {
+          keys.slice(0, keys.length - 50).forEach((k) => delete drafts[k]);
+        }
+        localStorage.setItem(getDraftStorageKey(), JSON.stringify(drafts));
+        set((state) => ({
+          draftMessages: { ...state.draftMessages, [key]: message }
+        }));
+      },
+      clearDraftMessage: (key) => {
+        const drafts = getStoredDrafts();
+        delete drafts[key];
+        localStorage.setItem(getDraftStorageKey(), JSON.stringify(drafts));
+        set((state) => {
+          const newDraftMessages = { ...state.draftMessages };
+          delete newDraftMessages[key];
+          return { draftMessages: newDraftMessages };
+        });
+      },
+      setTypingUser: (roomId, agentId, agentName, agentAvatar) => set((state) => ({
+        typingUsers: {
+          ...state.typingUsers,
+          [roomId]: {
+            ...state.typingUsers[roomId],
+            [agentId]: { name: agentName, avatar: agentAvatar }
+          }
+        }
+      })),
+      clearTypingUser: (roomId, agentId) => set((state) => {
+        const room = { ...state.typingUsers[roomId] };
+        delete room[agentId];
+        return { typingUsers: { ...state.typingUsers, [roomId]: room } };
+      }),
+      setTicketChatMessages: (ticketId, chatMessages) => set((state) => {
+        const normalizedChatMessages = normalizeChatMessagesBulk(chatMessages);
+        const rest = { ...state.ticketChatMessages };
+        delete rest[ticketId];
+        const nextTicketChatMessages = {
+          ...rest,
+          [ticketId]: normalizedChatMessages
+        };
+        return evictOldestMessageRooms(state, nextTicketChatMessages);
+      }),
+      removeTicketChatMessage: (ticketId) => set((state) => {
+        const newTicketChatMessages = { ...state.ticketChatMessages };
+        delete newTicketChatMessages[ticketId];
+        const newTokenForGetMessageApi = { ...state.tokenForGetMessageApi };
+        delete newTokenForGetMessageApi[ticketId];
+        const newLoadedRooms = { ...state.loadedRooms };
+        delete newLoadedRooms[ticketId];
+        return {
+          ticketChatMessages: newTicketChatMessages,
+          tokenForGetMessageApi: newTokenForGetMessageApi,
+          loadedRooms: newLoadedRooms
+        };
+      }),
+      addNewMessage: (ticketId, message) => set((state) => {
+        const currentMessages = state.ticketChatMessages[ticketId] || [];
+        const existingIdx = currentMessages.findIndex(
+          (m) => m._id === message._id
+        );
+        if (existingIdx !== -1) {
+          const updated = [...currentMessages];
+          updated[existingIdx] = { ...updated[existingIdx], ...message };
+          return {
+            ticketChatMessages: {
+              ...state.ticketChatMessages,
+              [ticketId]: updated
+            }
+          };
+        }
+        const lastMessage = currentMessages[currentMessages.length - 1];
+        if (message.client_msg_id && lastMessage?.client_msg_id === message.client_msg_id)
+          return state;
+        const normalized = normalizeOneAppended(lastMessage, message);
+        const rest = { ...state.ticketChatMessages };
+        delete rest[ticketId];
+        const source = message?.source;
+        const appended = [...currentMessages, normalized];
+        const nextTicketChatMessages = {
+          ...rest,
+          [ticketId]: requiresChronologicalSort(source) ? orderBy(appended, (m) => m?.created_at ?? "", "asc") : appended
+        };
+        return evictOldestMessageRooms(state, nextTicketChatMessages);
+      }),
+      updateMessageByClientMsgId: (ticketId, clientMsgId, updates) => set((state) => {
+        const messages = state.ticketChatMessages[ticketId] || [];
+        const mapped = messages.map(
+          (msg) => msg.client_msg_id === clientMsgId ? { ...msg, ...updates } : msg
+        );
+        const seen = /* @__PURE__ */ new Set();
+        const deduped = mapped.filter((msg) => {
+          if (seen.has(msg._id)) return false;
+          seen.add(msg._id);
+          return true;
+        });
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [ticketId]: deduped
+          }
+        };
+      }),
+      updateMessageViewers: (roomId, messageId, viewers) => set((state) => {
+        const messages = state.ticketChatMessages[roomId] || [];
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [roomId]: messages.map(
+              (msg) => msg._id === messageId ? { ...msg, viewed_by: viewers } : msg
+            )
+          }
+        };
+      }),
+      applyOptimisticReaction: (roomId, messageId, reactions, opTs) => set((state) => {
+        const messages = state.ticketChatMessages[roomId] || [];
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [roomId]: messages.map(
+              (msg) => msg._id === messageId ? {
+                ...msg,
+                extra_data: { ...msg.extra_data, reactions },
+                _pendingReactionTs: opTs
+              } : msg
+            )
+          }
+        };
+      }),
+      confirmPendingReaction: (roomId, messageId) => set((state) => {
+        const messages = state.ticketChatMessages[roomId] || [];
+        if (!messages.some(
+          (msg) => msg._id === messageId && "_pendingReactionTs" in msg
+        ))
+          return state;
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [roomId]: messages.map((msg) => {
+              if (msg._id !== messageId) return msg;
+              const rest = { ...msg };
+              delete rest._pendingReactionTs;
+              return rest;
+            })
+          }
+        };
+      }),
+      rollbackPendingReaction: (roomId, messageId, opTs, previousReactions) => set((state) => {
+        const messages = state.ticketChatMessages[roomId] || [];
+        const target = messages.find((msg) => msg._id === messageId);
+        if (!target || target._pendingReactionTs !== opTs) return state;
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [roomId]: messages.map((msg) => {
+              if (msg._id !== messageId) return msg;
+              const rest = { ...msg };
+              delete rest._pendingReactionTs;
+              return {
+                ...rest,
+                extra_data: {
+                  ...msg.extra_data,
+                  reactions: previousReactions
+                }
+              };
+            })
+          }
+        };
+      }),
+      updateRoomReadUpdate: (roomId, userId, data) => set((state) => {
+        const prev = state.roomReadUpdates[roomId] ?? {};
+        return {
+          roomReadUpdates: {
+            ...state.roomReadUpdates,
+            [roomId]: { ...prev, [userId]: data }
+          }
+        };
+      }),
+      // Khách đọc tin -> backfill read_receipt cho các tin agent trước đó chưa có,
+      // để UI show "đã xem" cho cả các tin gửi liên tiếp trước tin đang chốt mốc đọc.
+      applyReadReceipt: (roomId, readReceipt) => set((state) => {
+        const messages = state.ticketChatMessages[roomId];
+        if (!messages?.length) return state;
+        const needsUpdate = messages.some(
+          (msg) => msg.chatter_type === CHATTER_TYPES.AGENT && !msg.read_receipt
+        );
+        if (!needsUpdate) return state;
+        return {
+          ticketChatMessages: {
+            ...state.ticketChatMessages,
+            [roomId]: messages.map(
+              (msg) => msg.chatter_type === CHATTER_TYPES.AGENT && !msg.read_receipt ? { ...msg, read_receipt: readReceipt } : msg
+            )
+          }
+        };
+      }),
+      filterState: DEFAULT_FILTER_STATE,
+      setFilterState: (filterState) => set((state) => {
+        return {
+          ...state,
+          filterState: {
+            ...state.filterState,
+            ...filterState
+          },
+          lastRefreshTime: Date.now()
+        };
+      }),
+      // Kiểu sắp xếp để riêng, không gộp vào filterState: nó không thuộc form
+      // bộ lọc, mà mọi đường reset đều đi qua DEFAULT_FILTER_STATE nên nằm
+      // chung là sớm muộn cũng bị xoá theo.
+      chatSort: DEFAULT_CHAT_SORT,
+      setChatSort: (chatSort) => set({ chatSort, lastRefreshTime: Date.now() }),
+      selectedFilterId: null,
+      setSelectedFilterId: (id) => set({ selectedFilterId: id }),
+      lastRefreshTime: Date.now(),
+      setLastRefreshTime: () => set({ lastRefreshTime: Date.now() }),
+      setChatContentRefreshAt: () => set({ chatContentRefreshAt: Date.now() }),
+      unreadReceivedTab: {
+        total: 0,
+        lastMsgId: null,
+        isLoadMore: false,
+        cursor: null
+      },
+      notReceivedTab: {
+        total: 0,
+        lastMsgId: null,
+        isLoadMore: false,
+        cursor: null
+      },
+      closedTab: {
+        total: 0,
+        lastMsgId: null,
+        isLoadMore: false,
+        cursor: null
+      },
+      setLoadMore: (tab, isLoadMore) => {
+        set((state) => {
+          const key = getTabKeyFromStatus(tab);
+          return {
+            ...state,
+            [key]: {
+              ...state[key],
+              isLoadMore
+            }
+          };
+        });
+      },
+      setLastChatId: (tab, chatId) => {
+        set((state) => {
+          const key = getTabKeyFromStatus(tab);
+          return {
+            ...state,
+            [key]: {
+              ...state[key],
+              lastMsgId: chatId
+            }
+          };
+        });
+      },
+      getFullFilterState: ({ tab, options }) => {
+        const store = get();
+        const key = getTabKeyFromStatus(tab);
+        const tabState = store[key];
+        let cursor;
+        if (options?.is_new) {
+          cursor = null;
+        } else {
+          cursor = tabState.cursor;
+        }
+        const filterState = {
+          ...store.filterState,
+          assign_status: tab,
+          cursor,
+          sort: store.chatSort
+        };
+        return filterState;
+      },
+      setTabInitialChats: ({ tab, chats, total, cursor }) => {
+        const key = getTabKeyFromStatus(tab);
+        set((state) => ({
+          ...state,
+          chatList: uniqBy([...state.chatList, ...chats], "_id"),
+          [key]: {
+            total,
+            lastChatId: null,
+            isLoadMore: false,
+            cursor
+          }
+        }));
+      },
+      appendChats: ({ tab, chats, total, next_cursor: nextCursor }) => {
+        const key = getTabKeyFromStatus(tab);
+        set((state) => {
+          const chatTabState = state[key];
+          const newChatList = uniqBy([...chats, ...state.chatList], "_id");
+          let newTotal = chatTabState.total;
+          if (total !== void 0) {
+            newTotal = total;
+          } else {
+            const newChats = chats.filter(
+              (chat) => !state.chatList.some((x) => x._id === chat._id)
+            );
+            let autoIncrement = 0;
+            for (const chat of newChats) {
+              if (shouldCountForTab(tab, chat)) {
+                autoIncrement += 1;
+              }
+            }
+            newTotal = chatTabState.total + autoIncrement;
+          }
+          return {
+            ...state,
+            chatList: newChatList,
+            [key]: {
+              ...chatTabState,
+              total: newTotal,
+              ...nextCursor !== void 0 ? { cursor: nextCursor } : {}
+            }
+          };
+        });
+      },
+      moveChat: ({ roomId, payload }) => {
+        set((state) => {
+          const chatToMove = state.chatList.find((x) => x._id === roomId);
+          if (!chatToMove) return state;
+          const newChatList = state.chatList.map((chat) => {
+            if (chat._id !== roomId) return chat;
+            return {
+              ...chat,
+              ...payload
+            };
+          });
+          return {
+            ...state,
+            chatList: newChatList
+          };
+        });
+      },
+      transitionChatTab: (oldTab, newTab, chat) => {
+        if (oldTab === newTab) return;
+        set((state) => {
+          const oldKey = getTabKeyFromStatus(oldTab);
+          const newKey = getTabKeyFromStatus(newTab);
+          return {
+            ...state,
+            pinChatIds: removePinFromTab(state.pinChatIds, oldTab, chat._id),
+            [oldKey]: {
+              ...state[oldKey],
+              total: shouldCountForTab(oldTab, chat) ? Math.max(state[oldKey].total - 1, 0) : state[oldKey].total
+            },
+            [newKey]: {
+              ...state[newKey],
+              total: shouldCountForTab(newTab, chat) ? state[newKey].total + 1 : state[newKey].total
+            }
+          };
+        });
+      },
+      removeChat: (chatId) => {
+        set((state) => {
+          const chatToRemove = state.chatList.find((x) => x._id === chatId);
+          if (!chatToRemove) return state;
+          let newChatList = state.chatList.filter((chat) => chat._id !== chatId);
+          const currentTabStatus = getTabStatusFromChat(chatToRemove);
+          const currentTabKey = getTabKeyFromStatus(currentTabStatus);
+          const currentTabState = state[currentTabKey];
+          currentTabState.total = Math.max(currentTabState.total - 1, 0);
+          const newTicketChatMessages = { ...state.ticketChatMessages };
+          delete newTicketChatMessages[chatId];
+          const newTokenForGetMessageApi = { ...state.tokenForGetMessageApi };
+          delete newTokenForGetMessageApi[chatId];
+          const newLoadedRooms = { ...state.loadedRooms };
+          delete newLoadedRooms[chatId];
+          const updatedState = {
+            ...state,
+            chatList: newChatList,
+            pinChatIds: removePinFromTab(
+              state.pinChatIds,
+              currentTabStatus,
+              chatId
+            ),
+            [currentTabKey]: {
+              ...currentTabState
+            },
+            ticketChatMessages: newTicketChatMessages,
+            tokenForGetMessageApi: newTokenForGetMessageApi,
+            loadedRooms: newLoadedRooms
+          };
+          return updatedState;
+        });
+      },
+      // Chỉ gỡ room khỏi LIST (và trừ total của tab), GIỮ NGUYÊN cache message,
+      // token phân trang & cờ loadedRooms. Dùng khi room không còn khớp filter
+      // đang áp (vd filter "chưa trả lời" mà agent vừa reply): room biến mất
+      // khỏi list nhưng nếu đang mở theo link thì agent vẫn xem & nhắn tiếp
+      // bình thường, và các tin tiếp theo vẫn được đẩy thẳng vào thread nhờ
+      // loadedRooms còn giữ (xem addContentfulMessage).
+      removeChatFromList: (chatId) => {
+        set((state) => {
+          const chatToRemove = state.chatList.find((x) => x._id === chatId);
+          if (!chatToRemove) return state;
+          const currentTabStatus = getTabStatusFromChat(chatToRemove);
+          const currentTabKey = getTabKeyFromStatus(currentTabStatus);
+          const currentTabState = state[currentTabKey];
+          return {
+            ...state,
+            chatList: state.chatList.filter((chat) => chat._id !== chatId),
+            [currentTabKey]: {
+              ...currentTabState,
+              total: Math.max(currentTabState.total - 1, 0)
+            }
+          };
+        });
+      },
+      updateChatUnread: (chatId, payload) => {
+        set((state) => {
+          const currentChat = state.chatList.find((x) => x._id === chatId);
+          if (!currentChat) return state;
+          const newChatList = state.chatList.map((chat) => {
+            if (chat._id !== chatId) return chat;
+            return {
+              ...chat,
+              ...payload
+            };
+          });
+          return {
+            ...state,
+            chatList: newChatList
+          };
+        });
+      },
+      reopenChat: (chatId, { is_received: isReceived, last_msg: lastMsg }) => {
+        set((state) => {
+          const chat = state.chatList.find((x) => x._id === chatId);
+          if (!chat) return state;
+          const newChatList = state.chatList.map((chat2) => {
+            if (chat2._id !== chatId) return chat2;
+            return {
+              ...chat2,
+              session: {
+                ...chat2.session,
+                status: void 0,
+                is_received: isReceived
+              },
+              last_msg: lastMsg || chat2.last_msg
+            };
+          });
+          const closedTab = { ...state.closedTab };
+          closedTab.total = Math.max(closedTab.total - 1, 0);
+          const unreadReceivedTab = { ...state.unreadReceivedTab };
+          const notReceivedTab = { ...state.notReceivedTab };
+          if (isReceived) {
+            unreadReceivedTab.total += 1;
+          } else {
+            notReceivedTab.total += 1;
+          }
+          return {
+            ...state,
+            chatList: newChatList,
+            pinChatIds: removePinFromTab(
+              state.pinChatIds,
+              ChatFilterAssignStatus.Closed,
+              chatId
+            ),
+            closedTab,
+            unreadReceivedTab,
+            notReceivedTab
+          };
+        });
+      },
+      // updateChatJoin: (chatId, payload) => {
+      //   set((state) => {
+      //     const newChatList = state.chatList.map((chat) => {
+      //       if (chat._id !== chatId) return chat
+      //       return { ...chat, ...payload }
+      //     })
+      //     return {
+      //       ...state,
+      //       chatList: newChatList,
+      //     }
+      //   })
+      // },
+      // acceptInvite: (chatId, payload) => {
+      //   set((state) => {
+      //     const chat = state.chatList.find((chat) => chat._id === chatId)
+      //     if (!chat) return state
+      //     const newChatList = state.chatList.map((chat) => {
+      //       if (chat._id !== chatId) return chat
+      //       return { ...chat, ...payload }
+      //     })
+      //     return {
+      //       ...state,
+      //       chatList: newChatList,
+      //     }
+      //   })
+      // },
+      updateRequester: (chatId, payload) => {
+        set((state) => {
+          const newChatList = state.chatList.map((chat) => {
+            if (chat._id !== chatId) return chat;
+            return {
+              ...chat,
+              requester: {
+                ...chat.requester,
+                ...payload
+              }
+            };
+          });
+          return {
+            ...state,
+            chatList: newChatList
+          };
+        });
+      },
+      updatePersonalTagInAllChats: (updatedTag) => {
+        set((state) => ({
+          ...state,
+          chatList: state.chatList.map((chat) => ({
+            ...chat,
+            personal_tags: (chat.personal_tags ?? []).map(
+              (t) => t._id === updatedTag._id ? { ...t, ...updatedTag } : t
+            )
+          }))
+        }));
+      },
+      // Gán/bỏ tag hàng loạt: mỗi hội thoại có sẵn bộ tag riêng nên gộp thêm (bỏ
+      // trùng theo _id) hoặc lọc bớt thay vì ghi đè như updateChatDetail ở màn
+      // chi tiết một phòng. Đi theo id vì API batch trả kết quả từng phòng —
+      // phòng lỗi phải giữ nguyên tag cũ.
+      updateTagsForChats: ({
+        chatIds,
+        tags = [],
+        personalTags = [],
+        action = ChatRoomTagBatchAction.Add
+      }) => {
+        if (!chatIds?.length) return;
+        if (!tags.length && !personalTags.length) return;
+        const mergeById = (current = [], incoming = []) => {
+          if (!incoming.length) return current;
+          const existed = new Set(current.map((tag) => String(tag._id)));
+          return [
+            ...current,
+            ...incoming.filter((tag) => !existed.has(String(tag._id)))
+          ];
+        };
+        const excludeById = (current = [], incoming = []) => {
+          if (!incoming.length) return current;
+          const removed = new Set(incoming.map((tag) => String(tag._id)));
+          return current.filter((tag) => !removed.has(String(tag._id)));
+        };
+        const applyTags = action === ChatRoomTagBatchAction.Remove ? excludeById : mergeById;
+        const targetIds = new Set(chatIds);
+        set((state) => ({
+          ...state,
+          chatList: state.chatList.map(
+            (chat) => targetIds.has(chat._id) ? {
+              ...chat,
+              tags: applyTags(chat.tags ?? [], tags),
+              personal_tags: applyTags(
+                chat.personal_tags ?? [],
+                personalTags
+              )
+            } : chat
+          )
+        }));
+      },
+      // Chuyển người phụ trách hàng loạt: vẽ lại ngay tên chuyên viên trong chat
+      // list. Không có tên (BE chỉ trả id) thì để trống, chat-item-tags sẽ tự
+      // gọi API lấy tên theo assigned._id. Đi theo id vì API batch trả kết quả
+      // từng phòng — phòng lỗi phải giữ nguyên người phụ trách cũ.
+      updateAssigneeForChats: ({ chatIds, assignedId, assignedName }) => {
+        if (!assignedId || !chatIds?.length) return;
+        const targetIds = new Set(chatIds);
+        set((state) => ({
+          ...state,
+          chatList: state.chatList.map(
+            (chat) => targetIds.has(chat._id) ? {
+              ...chat,
+              assigned: { _id: assignedId, name: assignedName },
+              ...chat.session ? {
+                session: { ...chat.session, assigned_id: assignedId }
+              } : {}
+            } : chat
+          )
+        }));
+      },
+      removePersonalTagFromAllChats: (tagId) => {
+        set((state) => ({
+          ...state,
+          chatList: state.chatList.map((chat) => ({
+            ...chat,
+            personal_tags: (chat.personal_tags ?? []).filter(
+              (t) => t._id !== tagId
+            )
+          }))
+        }));
+      },
+      updateChatDetail: (chatId, payload) => {
+        set((state) => {
+          const chat = state.chatList.find((x) => x._id === chatId);
+          if (!chat) return state;
+          const newChatList = state.chatList.map((chat2) => {
+            if (chat2._id !== chatId) return chat2;
+            return {
+              ...chat2,
+              ...payload
+            };
+          });
+          return {
+            ...state,
+            chatList: newChatList
+          };
+        });
+      }
+    }),
+    {
+      name: "chat-store"
+    }
+  )
+);
+var chat_store_default = useChatStore;
+export {
+  chat_store_default as default,
+  normalizeChatMessagesBulk,
+  normalizeOneAppended
+};