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

package/hooks/use-update-user-config.js

@@ -0,0 +1,150 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { settingUserConfig } from "@zenify-omni/chat-js/api/settings/common.js";
+import QUERY_KEY from "@zenify-omni/chat-js/constants/use-query-key.js";
+import { getUser } from "@zenify-omni/chat-js/utils/auth.js";
+const useUpdateUserConfig = () => {
+  const queryClient = useQueryClient();
+  const currentUser = getUser();
+  return useMutation({
+    mutationFn: async ({ user, ...params }) => {
+      const effectiveUser = user || currentUser;
+      const updateData = {
+        user_id: effectiveUser._id
+      };
+      if ("selectedSmartView" in params) {
+        updateData.smartview_id = params.selectedSmartView ? params.selectedSmartView._id : null;
+      }
+      if ("dealSelectedSmartView" in params) {
+        updateData.deal_smart_view_id = params.dealSelectedSmartView ? params.dealSelectedSmartView._id : null;
+      }
+      if ("taskSelectedSmartView" in params) {
+        updateData.task_smart_view_id = params.taskSelectedSmartView ? params.taskSelectedSmartView._id : null;
+      }
+      if ("leadSelectedSmartView" in params) {
+        updateData.lead_smart_view_id = params.leadSelectedSmartView ? params.leadSelectedSmartView._id : null;
+      }
+      if ("orderSelectedSmartView" in params) {
+        updateData.order_smart_view_id = params.orderSelectedSmartView ? params.orderSelectedSmartView._id : null;
+      }
+      if ("customerSelectedSmartView" in params) {
+        updateData.contact_smart_view_id = params.customerSelectedSmartView ? params.customerSelectedSmartView._id : null;
+      }
+      if ("organizationSelectedSmartView" in params) {
+        updateData.organization_smart_view_id = params.organizationSelectedSmartView ? params.organizationSelectedSmartView._id : null;
+      }
+      if ("dealKanban" in params) {
+        updateData.deal_kanban = typeof params.dealKanban === "string" ? params.dealKanban : JSON.stringify(params.dealKanban || {});
+      }
+      if ("leadKanban" in params) {
+        updateData.lead_kanban = typeof params.leadKanban === "string" ? params.leadKanban : JSON.stringify(params.leadKanban || {});
+      }
+      if ("pinnedTicketFilterItems" in params) {
+        updateData.pinned_ticket_filter_items = typeof params.pinnedTicketFilterItems === "string" ? params.pinnedTicketFilterItems : JSON.stringify(params.pinnedTicketFilterItems || []);
+      }
+      if ("ticketLeftSidebarSectionOrder" in params) {
+        updateData.ticket_left_sidebar_section_order = typeof params.ticketLeftSidebarSectionOrder === "string" ? params.ticketLeftSidebarSectionOrder : JSON.stringify(params.ticketLeftSidebarSectionOrder || []);
+      }
+      if ("leadLeftSidebarSectionOrder" in params) {
+        updateData.lead_left_sidebar_section_order = typeof params.leadLeftSidebarSectionOrder === "string" ? params.leadLeftSidebarSectionOrder : JSON.stringify(params.leadLeftSidebarSectionOrder || []);
+      }
+      if ("dealLeftSidebarSectionOrder" in params) {
+        updateData.deal_left_sidebar_section_order = typeof params.dealLeftSidebarSectionOrder === "string" ? params.dealLeftSidebarSectionOrder : JSON.stringify(params.dealLeftSidebarSectionOrder || []);
+      }
+      if ("customerLeftSidebarSectionOrder" in params) {
+        updateData.contact_left_sidebar_section_order = typeof params.customerLeftSidebarSectionOrder === "string" ? params.customerLeftSidebarSectionOrder : JSON.stringify(params.customerLeftSidebarSectionOrder || []);
+      }
+      if ("taskLeftSidebarSectionOrder" in params) {
+        updateData.task_left_sidebar_section_order = typeof params.taskLeftSidebarSectionOrder === "string" ? params.taskLeftSidebarSectionOrder : JSON.stringify(params.taskLeftSidebarSectionOrder || []);
+      }
+      if ("ticketLeftSidebarOpen" in params) {
+        updateData.ticket_left_sidebar_open = !!params.ticketLeftSidebarOpen;
+      }
+      if ("leadLeftSidebarOpen" in params) {
+        updateData.lead_left_sidebar_open = !!params.leadLeftSidebarOpen;
+      }
+      if ("dealLeftSidebarOpen" in params) {
+        updateData.deal_left_sidebar_open = !!params.dealLeftSidebarOpen;
+      }
+      if ("contactLeftSidebarOpen" in params) {
+        updateData.contact_left_sidebar_open = !!params.contactLeftSidebarOpen;
+      }
+      if ("taskLeftSidebarOpen" in params) {
+        updateData.task_left_sidebar_open = !!params.taskLeftSidebarOpen;
+      }
+      if ("ticketViewMode" in params) {
+        updateData.ticket_view_mode = params.ticketViewMode;
+      }
+      if ("chatSort" in params) {
+        updateData.chat_sort = params.chatSort;
+      }
+      if ("chatShowInfoContact" in params) {
+        updateData.chat_show_info_contact = typeof params.chatShowInfoContact === "string" ? params.chatShowInfoContact : JSON.stringify(params.chatShowInfoContact || []);
+      }
+      if ("ticketFrozenColumns" in params) {
+        updateData.ticket_frozen_columns = typeof params.ticketFrozenColumns === "string" ? params.ticketFrozenColumns : JSON.stringify(params.ticketFrozenColumns || []);
+      }
+      if ("leadFrozenColumns" in params) {
+        updateData.lead_frozen_columns = typeof params.leadFrozenColumns === "string" ? params.leadFrozenColumns : JSON.stringify(params.leadFrozenColumns || []);
+      }
+      if ("customerFrozenColumns" in params) {
+        updateData.contact_frozen_columns = typeof params.customerFrozenColumns === "string" ? params.customerFrozenColumns : JSON.stringify(params.customerFrozenColumns || []);
+      }
+      const tableDisplayOverrideKeys = {
+        ticketTableDisplayOverrides: "ticket_table_view_overrides",
+        leadTableDisplayOverrides: "lead_table_view_overrides",
+        customerTableDisplayOverrides: "contact_table_view_overrides",
+        taskTableDisplayOverrides: "task_table_view_overrides",
+        dealTableDisplayOverrides: "deal_table_view_overrides"
+      };
+      Object.entries(tableDisplayOverrideKeys).forEach(
+        ([paramKey, configKey]) => {
+          if (paramKey in params) {
+            updateData[configKey] = typeof params[paramKey] === "string" ? params[paramKey] : JSON.stringify(params[paramKey] || {});
+          }
+        }
+      );
+      const tableColumnsKeys = {
+        ticketTableColumns: "ticket_table_columns",
+        leadTableColumns: "lead_table_columns",
+        customerTableColumns: "user_table_columns",
+        taskTableColumns: "task_table_columns",
+        dealTableColumns: "deal_table_columns"
+      };
+      Object.entries(tableColumnsKeys).forEach(([paramKey, configKey]) => {
+        if (paramKey in params) {
+          updateData[configKey] = typeof params[paramKey] === "string" ? params[paramKey] : JSON.stringify(params[paramKey] || []);
+        }
+      });
+      if ("taskFrozenColumns" in params) {
+        updateData.task_frozen_columns = typeof params.taskFrozenColumns === "string" ? params.taskFrozenColumns : JSON.stringify(params.taskFrozenColumns || []);
+      }
+      if ("dealFrozenColumns" in params) {
+        updateData.deal_frozen_columns = typeof params.dealFrozenColumns === "string" ? params.dealFrozenColumns : JSON.stringify(params.dealFrozenColumns || []);
+      }
+      if ("ticketActivityTypeFilter" in params) {
+        updateData.ticket_activity_type_filter = typeof params.ticketActivityTypeFilter === "string" ? params.ticketActivityTypeFilter : JSON.stringify(params.ticketActivityTypeFilter || []);
+      }
+      if ("customerActivityTypeFilter" in params) {
+        updateData.contact_activity_type_filter = typeof params.customerActivityTypeFilter === "string" ? params.customerActivityTypeFilter : JSON.stringify(params.customerActivityTypeFilter || []);
+      }
+      const response = await settingUserConfig({
+        data: updateData
+      });
+      return { responseData: response?.data || updateData, effectiveUser };
+    },
+    onSuccess: (result) => {
+      if (!result) return;
+      const { responseData, effectiveUser } = result;
+      if (responseData) {
+        queryClient.setQueryData(
+          [QUERY_KEY.GET_USER_CONFIGURATION, { userId: effectiveUser._id }],
+          (old) => ({ ...old || {}, ...responseData })
+        );
+      }
+    }
+  });
+};
+var use_update_user_config_default = useUpdateUserConfig;
+export {
+  use_update_user_config_default as default
+};

package/hooks/use-zalo-connection.js

@@ -0,0 +1,57 @@
+import { useCallback, useEffect, useRef } from "react";
+import { checkAccessByPZaloConnection } from "@zenify-omni/chat-js/api/chat.js";
+import { getUser } from "@zenify-omni/chat-js/utils/auth.js";
+import useChatStore from "../store/chat-store.js";
+const PERSONAL_ZALO = "pzalo";
+const POLL_INTERVAL_MS = 6e4;
+function useZaloConnection(chatRoomId, chatRoomSource) {
+  const user = getUser();
+  const isZaloConnected = useChatStore((state) => state.isZaloConnected);
+  const setIsZaloConnected = useChatStore((state) => state.setIsZaloConnected);
+  const isSocketConnected = useChatStore((state) => state.isSocketConnected);
+  const checkZaloConnection = useCallback(async () => {
+    if (!chatRoomId || chatRoomSource !== PERSONAL_ZALO) return;
+    const setConnected = (value) => {
+      if (useChatStore.getState().isZaloConnected !== value)
+        setIsZaloConnected(value);
+    };
+    try {
+      const resp = await checkAccessByPZaloConnection({
+        ticketId: chatRoomId,
+        userId: user._id
+      });
+      setConnected(resp?.data?.success);
+    } catch (error) {
+      console.error("Error checking Zalo connection:", error);
+      setConnected(false);
+    }
+  }, [chatRoomId, chatRoomSource, user?._id, setIsZaloConnected]);
+  useEffect(() => {
+    if (!chatRoomId || !chatRoomSource) return;
+    if (chatRoomSource !== PERSONAL_ZALO) {
+      setIsZaloConnected(false);
+      return;
+    }
+    checkZaloConnection();
+    const interval = setInterval(checkZaloConnection, POLL_INTERVAL_MS);
+    return () => clearInterval(interval);
+  }, [chatRoomId, chatRoomSource, setIsZaloConnected, checkZaloConnection]);
+  const wasSocketConnectedRef = useRef(isSocketConnected);
+  useEffect(() => {
+    const reconnected = !wasSocketConnectedRef.current && isSocketConnected;
+    wasSocketConnectedRef.current = isSocketConnected;
+    if (!reconnected) return;
+    if (chatRoomSource !== PERSONAL_ZALO) return;
+    if (useChatStore.getState().isZaloConnected) return;
+    checkZaloConnection();
+  }, [isSocketConnected, chatRoomSource, checkZaloConnection]);
+  useEffect(() => {
+    return () => setIsZaloConnected(false);
+  }, [chatRoomId, setIsZaloConnected]);
+  return { isZaloConnected, recheck: checkZaloConnection };
+}
+var use_zalo_connection_default = useZaloConnection;
+export {
+  use_zalo_connection_default as default,
+  useZaloConnection
+};

package/hooks/use-zalo-mention-list.js

@@ -0,0 +1,31 @@
+import { useMemo } from "react";
+import { useGetZaloGroupInfo } from "./use-setting-common.js";
+import { isZaloGroup } from "../components/chat-route/util.js";
+import { getUser } from "@zenify-omni/chat-js/utils/auth.js";
+function useZaloMentionList(chatRoom, { enabled = false } = {}) {
+  const user = getUser();
+  const groupZaloId = chatRoom?.source_room_id;
+  const { data: groupInfo } = useGetZaloGroupInfo({
+    zaloId: chatRoom?.source_id,
+    groupId: groupZaloId,
+    enabled: isZaloGroup(chatRoom) && enabled
+  });
+  const mentionList = useMemo(() => {
+    if (groupInfo?.members?.length > 0) {
+      return [
+        { value: "All", label: "All" },
+        ...groupInfo.members.filter(
+          (a) => a.user_id !== user?.zalo_id && a.display_name && a.user_id
+        ).map((e) => ({
+          value: e.user_id,
+          label: e.display_name
+        }))
+      ];
+    }
+    return [];
+  }, [groupInfo, user?.zalo_id]);
+  return mentionList;
+}
+export {
+  useZaloMentionList
+};