@satek-team-intern/chatbot-widget 0.10.6 → 0.10.8

package/dist/src/hooks/useTranslation.d.ts

@@ -1,4 +1,5 @@
 export declare const useTranslation: () => {
-    t: (path: "addChat" | "common" | "chatWindow" | "chatHeader" | "chatInput" | "chatMessage" | "chatList" | "chatSearchBar" | "addMember" | "fileViewer" | "themeModal" | "updateGroup" | "addChat.title" | "addChat.groupNamePlaceholder" | "addChat.memberSearchPlaceholder" | "addChat.membersSection" | "addChat.createGroup" | "addChat.selectMoreMembers" | "addChat.selectMembers" | "addChat.title." | "addChat.groupNamePlaceholder." | "addChat.memberSearchPlaceholder." | "addChat.membersSection." | "addChat.createGroup." | "addChat.selectMoreMembers." | "addChat.selectMembers." | "common.buttons" | "common.errors" | "common.buttons.save" | "common.buttons.cancel" | "common.buttons.confirm" | "common.buttons.close" | "common.buttons.save." | "common.buttons.cancel." | "common.buttons.confirm." | "common.buttons.close." | "common.errors.updateGroup" | "common.errors.createChat" | "common.errors.updateGroup." | "common.errors.createChat." | "chatWindow.memberSystem" | "chatWindow.dragFile" | "chatWindow.selectChat" | "chatWindow.startConversation" | "chatWindow.searchPlaceholder" | "chatWindow.filterAll" | "chatWindow.filterGroup" | "chatWindow.filterSingle" | "chatWindow.memberSystem." | "chatWindow.dragFile." | "chatWindow.selectChat." | "chatWindow.startConversation." | "chatWindow.searchPlaceholder." | "chatWindow.filterAll." | "chatWindow.filterGroup." | "chatWindow.filterSingle." | "chatHeader.addMember" | "chatHeader.close" | "chatHeader.close." | "chatHeader.defaultTitle" | "chatHeader.darkMode" | "chatHeader.lightMode" | "chatHeader.settings" | "chatHeader.minimize" | "chatHeader.maximize" | "chatHeader.language" | "chatHeader.addMember." | "chatHeader.defaultTitle." | "chatHeader.darkMode." | "chatHeader.lightMode." | "chatHeader.settings." | "chatHeader.minimize." | "chatHeader.maximize." | "chatHeader.language." | "chatInput.placeholder" | "chatInput.selectFiles" | "chatInput.recordVoice" | "chatInput.selectFilesOrOptions" | "chatInput.removeFile" | "chatInput.recording" | "chatInput.cancelRecording" | "chatInput.stopRecording" | "chatInput.playRecording" | "chatInput.discardRecording" | "chatInput.addToMessage" | "chatInput.voiceMessage" | "chatInput.replyingTo" | "chatInput.attachmentIndicator" | "chatInput.placeholder." | "chatInput.selectFiles." | "chatInput.recordVoice." | "chatInput.selectFilesOrOptions." | "chatInput.removeFile." | "chatInput.recording." | "chatInput.cancelRecording." | "chatInput.stopRecording." | "chatInput.playRecording." | "chatInput.discardRecording." | "chatInput.addToMessage." | "chatInput.voiceMessage." | "chatInput.replyingTo." | "chatInput.attachmentIndicator." | "chatMessage.status" | "chatMessage.actions" | "chatMessage.states" | "chatMessage.status.seen" | "chatMessage.status.sent" | "chatMessage.status.seen." | "chatMessage.status.sent." | "chatMessage.actions.reply" | "chatMessage.actions.like" | "chatMessage.actions.love" | "chatMessage.actions.revoke" | "chatMessage.actions.delete" | "chatMessage.actions.seeMore" | "chatMessage.actions.seeLess" | "chatMessage.actions.reply." | "chatMessage.actions.like." | "chatMessage.actions.love." | "chatMessage.actions.revoke." | "chatMessage.actions.delete." | "chatMessage.actions.seeMore." | "chatMessage.actions.seeLess." | "chatMessage.states.revoked" | "chatMessage.states.attachment" | "chatMessage.states.revoked." | "chatMessage.states.attachment." | "chatList.delete" | "chatList.addMember" | "chatList.addMember." | "chatList.delete." | "chatList.options" | "chatList.editGroup" | "chatList.deleteGroup" | "chatList.yourMessage" | "chatList.options." | "chatList.editGroup." | "chatList.deleteGroup." | "chatList.yourMessage." | "chatSearchBar.createGroup" | "chatSearchBar.createGroup." | "chatSearchBar.searchPlaceholder" | "chatSearchBar.searchPlaceholder." | "addMember.title" | "addMember.memberSearchPlaceholder" | "addMember.membersSection" | "addMember.title." | "addMember.memberSearchPlaceholder." | "addMember.membersSection." | "addMember.noMembersFound" | "addMember.addButton" | "addMember.noMembersFound." | "addMember.addButton." | "fileViewer.closeButtonTitle" | "fileViewer.previousButtonTitle" | "fileViewer.nextButtonTitle" | "fileViewer.scrollLeftTitle" | "fileViewer.scrollRightTitle" | "fileViewer.openDownloadButton" | "fileViewer.closeAriaLabel" | "fileViewer.previousAriaLabel" | "fileViewer.nextAriaLabel" | "fileViewer.scrollLeftAriaLabel" | "fileViewer.scrollRightAriaLabel" | "fileViewer.closeButtonTitle." | "fileViewer.previousButtonTitle." | "fileViewer.nextButtonTitle." | "fileViewer.scrollLeftTitle." | "fileViewer.scrollRightTitle." | "fileViewer.openDownloadButton." | "fileViewer.closeAriaLabel." | "fileViewer.previousAriaLabel." | "fileViewer.nextAriaLabel." | "fileViewer.scrollLeftAriaLabel." | "fileViewer.scrollRightAriaLabel." | "themeModal.title" | "themeModal.title." | "themeModal.themeSectionTitle" | "themeModal.themeSectionDesc" | "themeModal.customColorTitle" | "themeModal.doneButton" | "themeModal.resetButton" | "themeModal.themeSectionTitle." | "themeModal.themeSectionDesc." | "themeModal.customColorTitle." | "themeModal.doneButton." | "themeModal.resetButton." | "updateGroup.title" | "updateGroup.groupNamePlaceholder" | "updateGroup.membersSection" | "updateGroup.title." | "updateGroup.groupNamePlaceholder." | "updateGroup.membersSection." | "updateGroup.groupNameLabel" | "updateGroup.avatarUrlLabel" | "updateGroup.avatarUrlPlaceholder" | "updateGroup.uploadAvatarButton" | "updateGroup.removeMemberButtonTitle" | "updateGroup.removeConfirmationStart" | "updateGroup.removeConfirmationEnd" | "updateGroup.cancelButton" | "updateGroup.updateButton" | "updateGroup.updatingButton" | "updateGroup.groupNameLabel." | "updateGroup.avatarUrlLabel." | "updateGroup.avatarUrlPlaceholder." | "updateGroup.uploadAvatarButton." | "updateGroup.removeMemberButtonTitle." | "updateGroup.removeConfirmationStart." | "updateGroup.removeConfirmationEnd." | "updateGroup.cancelButton." | "updateGroup.updateButton." | "updateGroup.updatingButton.", params?: Record<string, string>) => string;
+    t: (path: import('../../services').NestedKeys<import('../../services').TranslationSchema>, params?: Record<string, string>) => string;
+    currentLanguage: import('../types').LanguageOption;
     toggleChangeLanguage: () => void;
 };

package/dist/src/services/language.service.d.ts

@@ -1,7 +1,7 @@
 import { en } from '../../locales';
 import { LanguageOption } from '../../types';
 export type TranslationSchema = typeof en;
-type NestedKeys<T> = T extends object ? {
+export type NestedKeys<T> = T extends object ? {
     [K in keyof T]: `${Exclude<K, symbol>}${'' | `.${NestedKeys<T[K]>}`}`;
 }[keyof T] : '';
 declare class TranslationManager {

package/dist/src/store/selectors/setting.d.ts

@@ -16,14 +16,14 @@ export declare const selectWidgetFeatures: ((state: {
     resultsCount: () => number;
     resetResultsCount: () => void;
 } & {
-    resultFunc: (resultFuncArgs_0: WidgetFeature) => WidgetSettings;
-    memoizedResultFunc: ((resultFuncArgs_0: WidgetFeature) => WidgetSettings) & {
+    resultFunc: (resultFuncArgs_0: WidgetFeature, resultFuncArgs_1: boolean) => WidgetSettings;
+    memoizedResultFunc: ((resultFuncArgs_0: WidgetFeature, resultFuncArgs_1: boolean) => WidgetSettings) & {
         clearCache: () => void;
         resultsCount: () => number;
         resetResultsCount: () => void;
     };
     lastResult: () => WidgetSettings;
-    dependencies: [(state: RootState) => WidgetFeature];
+    dependencies: [(state: RootState) => WidgetFeature, (state: RootState) => boolean];
     recomputations: () => number;
     resetRecomputations: () => void;
     dependencyRecomputations: () => number;

package/dist/src/store/slices/chatSlice.d.ts

@@ -10,6 +10,9 @@ export interface ChatState {
     totalMessagesUnread: number;
     messagesPagination: PaginationInfo | null;
     replyingMessage: ChatMessage | null;
+    memberSocketMap: Record<number, string[]>;
+    disconnectedSockets: Record<string, boolean>;
+    isChatLoading: boolean;
 }
 export declare const clearAll: import('@reduxjs/toolkit').ActionCreatorWithoutPayload<"widget-chatslice/clearAll">, setCurrentUser: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setCurrentUser">, setChats: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setChats">, setCurrentChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setCurrentChat">, setCurrentChatMessages: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setCurrentChatMessages">, setCurrentChatMembers: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setCurrentChatMembers">, setMembers: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setMembers">, setMember: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setMember">, setMemberDisconnect: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setMemberDisconnect">, setMessagesPagination: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setMessagesPagination">, prependMessages: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/prependMessages">, addNewMessage: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/addNewMessage">, removeChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/removeChat">, addChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/addChat">, updateChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/updateChat">, updateChatAvatar: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/updateChatAvatar">, removeMessage: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/removeMessage">, updateMessage: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/updateMessage">, setReplyingMessage: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setReplyingMessage">, setTotalMessagesUnread: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setTotalMessagesUnread">, updateMemberReadStatus: import('@reduxjs/toolkit').ActionCreatorWithPayload<{
     chatId: number;
@@ -18,5 +21,5 @@ export declare const clearAll: import('@reduxjs/toolkit').ActionCreatorWithoutPa
 }, "widget-chatslice/updateMemberReadStatus">, toggleChatSetting: import('@reduxjs/toolkit').ActionCreatorWithPayload<{
     chatId: number;
     setting: "is_muted" | "is_pined";
-}, "widget-chatslice/toggleChatSetting">;
+}, "widget-chatslice/toggleChatSetting">, renewMemberActivity: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/renewMemberActivity">, memberJoinChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/memberJoinChat">, memberLeaveChat: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/memberLeaveChat">, setIsChatLoading: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-chatslice/setIsChatLoading">;
 export declare const chatReducer: import('redux').Reducer<ChatState>;

package/dist/src/store/slices/settingSlice.d.ts

@@ -4,6 +4,10 @@ export interface SettingState {
     primaryColor: string;
     features: WidgetFeature;
     currentLanguage: LanguageOption;
+    hasMultipleLanguages: boolean;
 }
-export declare const setConfig: import('@reduxjs/toolkit').ActionCreatorWithPayload<WidgetFeature, "widget-settingslice/setConfig">, toggleTheme: import('@reduxjs/toolkit').ActionCreatorWithoutPayload<"widget-settingslice/toggleTheme">, setFeatures: import('@reduxjs/toolkit').ActionCreatorWithPayload<WidgetFeature, "widget-settingslice/setFeatures">, setPrimaryColor: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-settingslice/setPrimaryColor">, setLanguage: import('@reduxjs/toolkit').ActionCreatorWithPayload<LanguageOption, "widget-settingslice/setLanguage">;
+export declare const setConfig: import('@reduxjs/toolkit').ActionCreatorWithPayload<{
+    features?: WidgetFeature;
+    language?: LanguageOption;
+}, "widget-settingslice/setConfig">, toggleTheme: import('@reduxjs/toolkit').ActionCreatorWithoutPayload<"widget-settingslice/toggleTheme">, setFeatures: import('@reduxjs/toolkit').ActionCreatorWithPayload<WidgetFeature, "widget-settingslice/setFeatures">, setPrimaryColor: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, "widget-settingslice/setPrimaryColor">, setLanguage: import('@reduxjs/toolkit').ActionCreatorWithPayload<LanguageOption, "widget-settingslice/setLanguage">;
 export declare const settingReducer: import('redux').Reducer<SettingState>;

package/dist/src/types/chat.type.d.ts

@@ -5,12 +5,9 @@ export interface ChatUser {
     name: string;
     avatar?: string;
     phone?: string;
-    email?: string;
+    email: string;
     socket_at?: string;
     socket_id?: string;
-    socket_ids?: string[];
-    last_active?: number;
-    status?: string;
     last_read_id?: number;
 }
 export interface ChatResponse<T = unknown> {
@@ -104,6 +101,7 @@ export interface ChatEventPayloads {
     };
     'chats.member': {
         type: 'join' | 'leave';
+        chat?: ChatConversation;
         chat_id?: number;
         member?: ChatUser;
         member_id?: number;
@@ -120,7 +118,7 @@ export interface ChatEventPayloads {
     'chats.message': {
         chat: ChatConversation;
         message: ChatMessage;
-        type: 'add' | 'remove';
+        type: 'add' | 'remove' | 'revoke' | 'like' | 'love';
         chat_id: number;
         message_id: number;
     };

package/dist/src/types/types.d.ts

@@ -6,6 +6,14 @@ export interface AuthInfo {
     phone?: string;
     email: string;
 }
+/** Vị trí tính theo tọa độ
+ * - x: Khoảng cách từ mép phải của cửa sổ trình duyệt đến điểm đặt widget.
+ * - y: Khoảng cách từ mép dưới của cửa sổ trình duyệt đến điểm đặt widget.
+ */
+export interface PositionType {
+    x: number;
+    y: number;
+}
 /** Các loại định dạng tập tin được phép đính kèm từ thiết bị */
 export type AttachmentType = 'image' | 'video' | 'audio' | 'file' | 'multiple';
 /** Các tùy chọn ngôn ngữ hiển thị trên giao diện */
@@ -26,7 +34,7 @@ export type WidgetChatMode = 'single' | 'group';
  * - 'change-color': Người dùng cuối có thể tự chọn màu chủ đạo (Primary Color).
  * - 'change-theme': Người dùng cuối có thể chuyển đổi giữa các chủ đề (ví dụ: Sáng/Tối).
  */
-export type WidgetCustomizationOptions = 'change-color' | 'change-theme' | 'multi-language';
+export type WidgetCustomizationOptions = 'change-color' | 'change-theme';
 export interface WidgetFeature {
     /** Danh sách các loại tập tin cho phép tải lên. Nếu có 'multiple', cho phép chọn nhiều file. */
     attachments?: AttachmentType[];
@@ -48,4 +56,6 @@ export interface ChatWidgetProps {
     auth: AuthInfo;
     chatKey: string;
     features?: WidgetFeature;
+    language?: LanguageOption;
+    initPosition?: PositionType;
 }

package/dist/src/utils/chat.utils.d.ts

@@ -1,4 +1,4 @@
-import { AttachmentType, ChatConversation, CommunicationFeature, WidgetChatMode, WidgetCustomizationOptions, WidgetFeature } from '../../types';
+import { AttachmentType, ChatConversation, ChatUser, CommunicationFeature, WidgetChatMode, WidgetCustomizationOptions, WidgetFeature } from '../../types';
 export declare const getChatName: (chat?: ChatConversation | null, currentUserId?: number, fallback?: string) => string;
 export interface FeatureSet {
     attachments: Set<AttachmentType>;
@@ -16,7 +16,20 @@ export interface FeatureAnalysis {
     hasChangeColor: boolean;
     hasMultipleLanguages: boolean;
 }
-export declare const analyzeFeatures: (features: WidgetFeature) => FeatureAnalysis;
+export declare const analyzeFeatures: (features: WidgetFeature, hasMultipleLanguages?: boolean) => FeatureAnalysis;
 export declare const getAcceptFilter: (featureSet: FeatureSet) => string;
 export declare const createFileTypeChecker: (featureSet: FeatureSet) => (file: File) => boolean;
 export declare const isConnected: (socketAt: string | undefined) => boolean;
+export declare const addSocketToMap: (memberSocketMap: Record<string, string[]>, memberId: string | number, // Chấp nhận cả string và number cho key
+socketId: string | undefined) => void;
+export declare const transformMember: (member: ChatUser, memberSocketMap: Record<string, string[]>, disconnectedSockets: Record<string, boolean>) => {
+    socket_id: string | undefined;
+    socket_at: string | undefined;
+    id: number;
+    code: string;
+    name: string;
+    avatar?: string;
+    phone?: string;
+    email: string;
+    last_read_id?: number;
+};

package/dist/src/utils/file.utils.d.ts

@@ -1,8 +1,9 @@
+import { CSSProperties, JSX } from 'react';
 /**
  * Lấy icon dựa trên tên file hoặc extension
  * @param fileNameOrExt Có thể là "image.png" hoặc chỉ "png"
  */
-export declare const getFileIcon: (fileNameOrExt: string) => string;
+export declare const getFileIcon: (fileNameOrExt: string) => JSX.Element;
 export declare const getFileKey: (file: File) => string | undefined;
 export declare const formatFileSize: (bytes: number) => string;
 export declare const getFileType: (fileName: string) => "image" | "video" | "audio" | "pdf" | "other";
@@ -10,7 +11,10 @@ export declare const getImagePreview: (file: File) => string;
 export declare const isImageFile: (file: File) => boolean;
 export declare const sortFilesByType: (files: File[]) => File[];
 export declare const sanitizeImage: (file: File) => Promise<File>;
-export declare const getFilesValidationError: (files: File[], hasMultipleAttachments: boolean, isFileTypeAllowed: (file: File) => boolean) => {
+export declare const getFilesValidationError: (files: File[], hasMultipleAttachments: boolean, isFileTypeAllowed: (file: File) => boolean) => Promise<{
     message: string;
-    type: 'warning' | 'error';
-} | null;
+    type: "warning" | "error";
+} | null>;
+export declare const validateFileContent: (file: File) => Promise<boolean>;
+export declare const validateFileUrlContent: (url: string, type: string) => Promise<boolean>;
+export declare function getImageRatioStyleFromLink(imgUrl: string): Promise<CSSProperties>;

package/dist/src/utils/format.utils.d.ts

@@ -1,2 +1,7 @@
-export declare const formatDateLabel: (dateStr: string | Date) => string;
+import { LanguageOption } from '../../types';
+export declare const formatDateLabel: (dateStr: string | Date, currentLanguage: LanguageOption) => string;
 export declare const formatDuration: (ms: number) => string;
+export declare const removeVietnameseTones: (str: string) => string;
+export declare const formatToDateTimeString: (dateInput: string | number | Date) => string;
+export declare const getCleanTitle: (url: string) => string | null;
+export declare const formatMessageTime: (dateInput: Date, language: LanguageOption) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@satek-team-intern/chatbot-widget",
-  "version": "0.10.6",
+  "version": "0.10.8",
   "description": "A widget chatbot can be integrated into any website, providing a seamless and interactive user experience. It is designed to be easily embedded and customizable, allowing businesses to engage with their customers effectively.",
   "author": "Satek Team",
   "license": "MIT",
@@ -42,6 +42,7 @@
   "dependencies": {
     "@reduxjs/toolkit": "^2.11.2",
     "react-redux": "^9.2.0",
+    "tldts": "^7.0.30",
     "wasm-media-encoders": "^0.7.0"
   },
   "peerDependencies": {