@esvndev/es-react-template-chat 0.0.87 → 0.0.89

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -19,9 +19,9 @@ var isNullOrUndefined$2 = require('@src/utility/hooks/isNullOrUndefined');
19
19
  var avatarDefault = require('@core/assets/images/avatars/avatar-blank.png');
20
20
  require('@draft-js-plugins/mention/lib/plugin.css');
21
21
  require('@draft-js-plugins/emoji/lib/plugin.css');
22
+ var reactRedux = require('react-redux');
22
23
  var configureStore$1 = require('@store/configureStore');
23
24
  var reactRouterDom = require('react-router-dom');
24
- var reactRedux = require('react-redux');
25
25
 
26
26
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
27
27
 
@@ -27397,6 +27397,16 @@ const encodeUUID = (uuid) => {
27397
27397
  return uuid;
27398
27398
  }
27399
27399
  };
27400
+ const isValidUrl = (string) => {
27401
+ try {
27402
+ // eslint-disable-next-line no-new
27403
+ new URL(string);
27404
+ return true;
27405
+ }
27406
+ catch (e) {
27407
+ return false;
27408
+ }
27409
+ };
27400
27410
  // ** Checks if the passed date is today
27401
27411
  const isToday = (value) => {
27402
27412
  const today = new Date();
@@ -72108,11 +72118,11 @@ const ChatLog = (props) => {
72108
72118
  React.useRef(null);
72109
72119
  const containerChatRef = React.useRef(null);
72110
72120
  const { connectHub, dataInfo, dataProfile, handleUser, handleUserSidebarRight, handleSidebar, handleSidebarRight, userSidebarLeft, dataHistory, chatGetType, approveUpdateStatus, handleModalAdministrative, setDataItem, handleModalAddUserGroup, handleModalGroup, typeOpenModalAdd, setTypeOpenModalAdd, unpinMessage, getPinnedMessages } = props;
72111
- dataHistory?.find((dt) => dt.id === active);
72121
+ const groupChatUsers = dataHistory?.find((dt) => dt.id === active);
72112
72122
  //const dataInfoAvatar = dataInfo && dataInfo.avatar ? dataInfo.avatar : DEFAULT_AVATAR
72113
72123
  React.useState([]);
72114
72124
  React.useState(false);
72115
- React.useState(false);
72125
+ const [openModalPreview, setOpenModalPreview] = React.useState(false);
72116
72126
  React.useState(false);
72117
72127
  React.useState(false);
72118
72128
  React.useState(false);
@@ -72123,7 +72133,7 @@ const ChatLog = (props) => {
72123
72133
  React.useState({ x: 0, y: 0 });
72124
72134
  React.useState(undefined);
72125
72135
  React.useState(undefined);
72126
- React.useState(null);
72136
+ const [selectedMessage, setSelectedMessage] = React.useState(null);
72127
72137
  React.useState(false);
72128
72138
  React.useState(true);
72129
72139
  React.useRef(0);
@@ -72134,184 +72144,41 @@ const ChatLog = (props) => {
72134
72144
  React.useState(false);
72135
72145
  React.useState(new Set());
72136
72146
  React.useState(true);
72137
- // // Load initial messages
72138
- // useEffect(() => {
72139
- // if (!checkScroll) {
72140
- // scrollToBottom()
72141
- // }
72142
- // }, [messageByGroup, checkScroll])
72143
- // const mentionItems = useMemo(() => {
72144
- // if (!groupChatUsers) { return [] }
72145
- // const users = Array.isArray(groupChatUsers.users) ? groupChatUsers.users : []
72146
- // const mappedUsers = users.map((user: any) => {
72147
- // const rawAvatar = user.avatar
72148
- // let avatar = DEFAULT_AVATAR
72149
- // if (rawAvatar) {
72150
- // avatar = isValidUrl(rawAvatar) ? rawAvatar : `${CDN_URL_VIEW}/${rawAvatar}`
72151
- // }
72152
- // return {
72153
- // ...user,
72154
- // avatar
72155
- // }
72156
- // })
72157
- // return [{ id: "all", name: "All" }, ...mappedUsers]
72158
- // }, [groupChatUsers])
72159
- // const toggleModalPreview = () => {
72160
- // setOpenModalPreview(!openModalPreview)
72161
- // }
72162
- // const handlePreview = useCallback((mes: any) => {
72163
- // setSelectedMessage(mes)
72164
- // setOpenModalPreview(true)
72165
- // }, [])
72166
- // const [isFetching, setIsFetching] = useState(false)
72167
- // const dispatch = useDispatch()
72168
- // const handleStartConversation = () => {
72169
- // if (
72170
- // !Object.keys({}).length &&
72171
- // !userSidebarLeft &&
72172
- // window.innerWidth < 992
72173
- // ) {
72174
- // handleSidebar()
72175
- // }
72176
- // }
72177
- // const uploadGroup = async (files: File[], type: 'image' | 'file') => {
72178
- // if (files.length === 0) { return }
72179
- // const batchId = newGuid()
72180
- // const errors: Array<{ file: File; error: any }> = []
72181
- // // Upload và gửi từng file một
72182
- // for (const file of files) {
72183
- // try {
72184
- // const result = await uploadWithRetry(file)
72185
- // if (result.success && chatRoomId) {
72186
- // const infoFiles = result.data?.infoFiles || []
72187
- // const items = type === 'image' ? infoFiles.map((x: any) => ({ ...x, batchId, createdDate: new Date().toISOString() })) : infoFiles
72188
- // // Gửi message ngay sau khi upload thành công
72189
- // connectHub(chatRoomId, {
72190
- // sendTo: dataInfo.id,
72191
- // content: '',
72192
- // type,
72193
- // path: JSON.stringify(items),
72194
- // typeChat
72195
- // })
72196
- // } else {
72197
- // errors.push({ file, error: result.error })
72198
- // }
72199
- // } catch (error) {
72200
- // errors.push({ file, error })
72201
- // }
72202
- // }
72203
- // // Thông báo lỗi nếu có
72204
- // if (errors.length > 0) {
72205
- // notificationError(`${errors.length}/${files.length} ${type === 'image' ? 'ảnh' : 'file'} upload thất bại`)
72206
- // }
72207
- // }
72208
- // const dataURLToFile = (dataUrl: string, fileName: string) => {
72209
- // const [header, data] = dataUrl.split(',')
72210
- // const mime = header.match(/data:(.*?);/)?.[1] || 'image/png'
72211
- // const binary = atob(data)
72212
- // const len = binary.length
72213
- // const u8 = new Uint8Array(len)
72214
- // for (let i = 0; i < len; i++) { u8[i] = binary.charCodeAt(i) }
72215
- // return new File([u8], fileName, { type: mime })
72216
- // }
72217
- // // ** Extract tagUserIds from editor mentions
72218
- // const extractTagUserIds = (): string[] => {
72219
- // const tagUserIds: string[] = []
72220
- // let hasAllMention = false
72221
- // editor.getEditorState().read(() => {
72222
- // const root = $getRoot()
72223
- // const nodes = root.getAllTextNodes()
72224
- // nodes.forEach((node) => {
72225
- // if ($isMentionNode(node)) {
72226
- // const userId = (node as any).__userId
72227
- // if (userId === 'all') {
72228
- // hasAllMention = true
72229
- // } else if (userId && !tagUserIds.includes(userId)) {
72230
- // tagUserIds.push(userId)
72231
- // }
72232
- // }
72233
- // })
72234
- // })
72235
- // // Nếu có @All, lấy tất cả userId trong nhóm
72236
- // if (hasAllMention && groupChatUsers?.users) {
72237
- // const allUserIds = groupChatUsers.users
72238
- // .map((user: any) => user.id)
72239
- // .filter((id: string) => id !== dataProfile?.id) // Loại bỏ chính mình
72240
- // return allUserIds
72241
- // }
72242
- // return tagUserIds
72243
- // }
72244
- // // ** Sends New Msg
72245
- // const handleSendMsg = (message: any) => {
72246
- // if (imgCopy.length > 0) {
72247
- // const imageFiles: File[] = []
72248
- // const otherFiles: File[] = []
72249
- // imgCopy.forEach((item: any, idx: number) => {
72250
- // const data = item?.data || item
72251
- // if (typeof data === 'string' && data.startsWith('data:image')) {
72252
- // imageFiles.push(dataURLToFile(data, item.name || `pasted_${Date.now()}_${idx}.png`))
72253
- // } else if (data instanceof File) {
72254
- // if (data.type?.startsWith('image')) {
72255
- // imageFiles.push(data)
72256
- // } else {
72257
- // otherFiles.push(data)
72258
- // }
72259
- // }
72260
- // })
72261
- // // Gửi ảnh trước rồi file
72262
- // uploadGroup(imageFiles, 'image')
72263
- // uploadGroup(otherFiles, 'file')
72264
- // }
72265
- // if (message.trim().length) {
72266
- // if (typingTimeoutRef.current) {
72267
- // clearTimeout(typingTimeoutRef.current)
72268
- // }
72269
- // isTypingRef.current = false
72270
- // if (connection && chatRoomId) {
72271
- // connection.invoke('StopTyping', chatRoomId).catch(console.error)
72272
- // }
72273
- // const tagUserIds = extractTagUserIds()
72274
- // const id = typeChat === 'CHAT' ? chatRoomId : contactId
72275
- // if (id) {
72276
- // connectHub(id, {
72277
- // sendTo: dataInfo.id,
72278
- // content: message.trim(),
72279
- // replyContent: replyMessage?.currentMessage ? JSON.stringify(replyMessage.currentMessage) : null,
72280
- // path: null,
72281
- // type: 'text',
72282
- // typeChat,
72283
- // tagUserIds
72284
- // })
72285
- // }
72286
- // }
72287
- // setImgCopy([])
72288
- // }
72289
- // const uploadWithRetry = async (file: File, maxRetries = 2) => {
72290
- // let lastError
72291
- // for (let attempt = 0; attempt <= maxRetries; attempt++) {
72292
- // try {
72293
- // const formDataFile = new FormData()
72294
- // formDataFile.append('files', file, file.name)
72295
- // const rs = await uploadMultiFileApi(formDataFile).unwrap()
72296
- // return { success: true, data: rs }
72297
- // } catch (error: any) {
72298
- // lastError = error
72299
- // // Không retry nếu là lỗi validation từ server
72300
- // if (error?.status === 400 || error?.status === 413) {
72301
- // break
72302
- // }
72303
- // if (attempt < maxRetries) {
72304
- // // Exponential backoff: 1s, 2s, 4s...
72305
- // await new Promise(resolve => setTimeout(resolve, 1000 * Math.pow(2, attempt))
72306
- // )
72307
- // }
72308
- // }
72309
- // }
72310
- // return {
72311
- // success: false,
72312
- // error: lastError?.message || 'Upload thất bại'
72313
- // }
72314
- // }
72147
+ const scrollToBottom = () => {
72148
+ const messagesEndEle = document.getElementById('messagesEnd');
72149
+ messagesEndEle?.scrollIntoView({ block: 'end', behavior: "instant" });
72150
+ };
72151
+ // Load initial messages
72152
+ React.useEffect(() => {
72153
+ if (!checkScroll) {
72154
+ scrollToBottom();
72155
+ }
72156
+ }, [messageByGroup, checkScroll]);
72157
+ React.useMemo(() => {
72158
+ if (!groupChatUsers) {
72159
+ return [];
72160
+ }
72161
+ const users = Array.isArray(groupChatUsers.users) ? groupChatUsers.users : [];
72162
+ const mappedUsers = users.map((user) => {
72163
+ const rawAvatar = user.avatar;
72164
+ let avatar = DEFAULT_AVATAR;
72165
+ if (rawAvatar) {
72166
+ avatar = isValidUrl(rawAvatar) ? rawAvatar : `${CDN_URL_VIEW}/${rawAvatar}`;
72167
+ }
72168
+ return {
72169
+ ...user,
72170
+ avatar
72171
+ };
72172
+ });
72173
+ return [{ id: "all", name: "All" }, ...mappedUsers];
72174
+ }, [groupChatUsers]);
72175
+ React.useCallback((mes) => {
72176
+ setSelectedMessage(mes);
72177
+ setOpenModalPreview(true);
72178
+ }, []);
72179
+ React.useState(false);
72180
+ reactRedux.useDispatch();
72181
+ //từ đây
72315
72182
  // const sendFile = async (event: any) => {
72316
72183
  // if (event.target.files && event.target.files[0]) {
72317
72184
  // const filesToUpload: File[] = Array.from(event.target.files)