@messenger-box/tailwind-ui-inbox 10.0.3-alpha.69 → 10.0.3-alpha.70

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.
Files changed (21) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/lib/components/InboxMessage/Messages.d.ts.map +1 -1
  3. package/lib/components/InboxMessage/Messages.js +48 -13
  4. package/lib/components/InboxMessage/Messages.js.map +1 -1
  5. package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.d.ts +12 -0
  6. package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.d.ts.map +1 -0
  7. package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.js +134 -0
  8. package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.js.map +1 -0
  9. package/lib/components/InboxMessage/message-widgets/index.d.ts +1 -0
  10. package/lib/components/InboxMessage/message-widgets/index.d.ts.map +1 -1
  11. package/lib/components/slot-fill/chat-message-filler.js +1 -1
  12. package/lib/components/slot-fill/chat-message-filler.js.map +1 -1
  13. package/lib/container/Inbox.d.ts.map +1 -1
  14. package/lib/container/Inbox.js +140 -33
  15. package/lib/container/Inbox.js.map +1 -1
  16. package/lib/index.js +1 -1
  17. package/package.json +2 -2
  18. package/src/components/InboxMessage/Messages.tsx +48 -11
  19. package/src/components/InboxMessage/message-widgets/SlackLikeMessageGroup.tsx +208 -0
  20. package/src/components/InboxMessage/message-widgets/index.ts +1 -0
  21. package/src/container/Inbox.tsx +141 -31
package/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [10.0.3-alpha.70](https://github.com/CDEBase/messenger-box/compare/v10.0.3-alpha.69...v10.0.3-alpha.70) (2025-08-12)
7
+
8
+ **Note:** Version bump only for package @messenger-box/tailwind-ui-inbox
9
+
6
10
  ## [10.0.3-alpha.69](https://github.com/CDEBase/messenger-box/compare/v10.0.3-alpha.68...v10.0.3-alpha.69) (2025-08-11)
7
11
 
8
12
  **Note:** Version bump only for package @messenger-box/tailwind-ui-inbox
package/lib/components/InboxMessage/Messages.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Messages.d.ts","sourceRoot":"","sources":["../../../src/components/InboxMessage/Messages.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAKpE,UAAU,aAAa;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,GAAG,CAAC;IACjB,eAAe,EAAE,GAAG,EAAE,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,CAAC,EAAE,MAAM,GAAG,CAAC;IACnC,6BAA6B,CAAC,EAAE,MAAM,GAAG,CAAC;IAC1C,cAAc,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;CACjC;AAED,eAAO,MAAM,QAAQ,mJASlB,aAAa,sBAyEf,CAAC"}
1
+ {"version":3,"file":"Messages.d.ts","sourceRoot":"","sources":["../../../src/components/InboxMessage/Messages.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAMpE,UAAU,aAAa;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,GAAG,CAAC;IACjB,eAAe,EAAE,GAAG,EAAE,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,CAAC,EAAE,MAAM,GAAG,CAAC;IACnC,6BAA6B,CAAC,EAAE,MAAM,GAAG,CAAC;IAC1C,cAAc,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;CACjC;AAED,eAAO,MAAM,QAAQ,mJASlB,aAAa,sBA6Gf,CAAC"}
package/lib/components/InboxMessage/Messages.js CHANGED
@@ -1,4 +1,4 @@
1
- import {isToday,isYesterday,format}from'date-fns';import React__default,{useState,useEffect,useRef,useMemo}from'react';import {useTranslation}from'react-i18next';import {UserModalContent}from'./UserModalContent.js';import {MessageSliceRenderer}from'./message-widgets/MessageSliceRenderer.js';const Messages = ({
1
+ import {isToday,isYesterday,format}from'date-fns';import React__default,{useState,useEffect,useRef,useMemo}from'react';import {useTranslation}from'react-i18next';import {UserModalContent}from'./UserModalContent.js';import {SlackLikeMessageGroup}from'./message-widgets/SlackLikeMessageGroup.js';const Messages = ({
2
2
  currentUser,
3
3
  channelMessages,
4
4
  refetchMessages,
@@ -35,7 +35,7 @@ import {isToday,isYesterday,format}from'date-fns';import React__default,{useStat
35
35
  React__default.useEffect(() => {
36
36
  if (channelMessages?.length) ;
37
37
  }, [channelMessages]);
38
- const messageList = useMemo(() => {
38
+ const messageListWithDates = useMemo(() => {
39
39
  let currentDate = '';
40
40
  let res = [];
41
41
  channelMessages?.map(msg => {
@@ -43,26 +43,61 @@ import {isToday,isYesterday,format}from'date-fns';import React__default,{useStat
43
43
  let msgDate;
44
44
  if (isToday(date)) msgDate = t('tailwind_ui_inbox.today');else if (isYesterday(date)) msgDate = t('tailwind_ui_inbox.yesterday');else msgDate = format(new Date(msg.createdAt), 'eee, do MMMM');
45
45
  if (msgDate !== currentDate) {
46
- res.push(msgDate);
46
+ res.push({
47
+ type: 'date',
48
+ content: msgDate
49
+ });
47
50
  currentDate = msgDate;
48
51
  }
49
52
  res.push(msg);
50
53
  });
51
54
  return res;
52
55
  }, [channelMessages]);
56
+ // Group messages by date sections for Slack-like rendering
57
+ const messagesByDate = useMemo(() => {
58
+ const sections = [];
59
+ let currentSection = {
60
+ date: null,
61
+ messages: []
62
+ };
63
+ messageListWithDates.forEach(item => {
64
+ if (item?.type === 'date') {
65
+ if (currentSection.messages.length > 0) {
66
+ sections.push(currentSection);
67
+ }
68
+ currentSection = {
69
+ date: item.content,
70
+ messages: []
71
+ };
72
+ } else {
73
+ currentSection.messages.push(item);
74
+ }
75
+ });
76
+ if (currentSection.messages.length > 0) {
77
+ sections.push(currentSection);
78
+ }
79
+ return sections;
80
+ }, [messageListWithDates]);
53
81
  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
54
82
  className: "w-full",
55
83
  ref: innerRef
56
- }, messageList?.map((message, index) => {
57
- return React__default.createElement(MessageSliceRenderer, {
58
- key: index,
59
- message: message,
60
- index: index,
61
- onOpen: onOpen,
62
- currentUser: currentUser,
63
- onMessageClick: onMessageClick
64
- });
65
- })), React__default.createElement(ChatModal, {
84
+ }, messagesByDate?.map((section, sectionIndex) => React__default.createElement("div", {
85
+ key: `section-${sectionIndex}`,
86
+ className: sectionIndex === messagesByDate.length - 1 ? '' : 'mb-4'
87
+ }, section.date && React__default.createElement("div", {
88
+ className: "flex items-center justify-center my-4"
89
+ }, React__default.createElement("div", {
90
+ className: "flex-grow border-t border-gray-200"
91
+ }), React__default.createElement("div", {
92
+ className: "mx-4 px-3 py-1 bg-white border border-gray-200 rounded-full text-xs font-medium text-gray-600"
93
+ }, section.date), React__default.createElement("div", {
94
+ className: "flex-grow border-t border-gray-200"
95
+ })), React__default.createElement(SlackLikeMessageGroup, {
96
+ messages: section.messages,
97
+ currentUser: currentUser,
98
+ onOpen: onOpen,
99
+ onMessageClick: onMessageClick
100
+ })))), React__default.createElement(ChatModal, {
66
101
  element: selectedElement,
67
102
  isOpen: isOpen,
68
103
  onClose: onClose
package/lib/components/InboxMessage/Messages.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Messages.js","sources":["../../../src/components/InboxMessage/Messages.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"0SAkBa,QAAQ,GAAG,CAAC;aAUR;iBACS;iBACX;AAEX,EAAA,QAAM;WACgB;wBACF;AACpB,EAAA,6BAAE;;;QAIE,CAAkB,MAAA,EAAA,SAAA,CAAC,GAAI,QAAE,CAAA,KAAA,CAAA;AAC7B,EAAA,MAAE,CAAA,eAAA,EAAA,kBAAA,CAAA,GAAA,QAAA,CAAA,IAAA,CAAA;QAEO;;oBAEwB,CAAA,cAAA,CAAA;AACjC,EAAA,MAAI,MAAS,GAAA,OAAG,IAAA;AAEhB,IAAA,0BAAuB,CAAA;AACvB,IAAA;;eAEgB,GAAA;AACJ,IAAA,SAAA,CAAA,KAAA,CAAA;AACA,IAAA,kBAAM,KAAS,CAAA;AAClB,GAAA;AACT,EAAA,SAAY,CAAA,MAAE;AAEd,IAAA,sBAAqB,IAAA;AACjB,IAAA,6BAA2B,IAAE;eACL,CAAA,CAAA;EACvB,MAAA,CAAA,IAAA;AACL,EAAqBA,cAAC,CAAA,WAAA,CAAA,MAAA;AAEtB,IAAA,IAAA,QAAiB,CAAA,OAAG,EAAO,SAAI,OAAE,EAAA,aAAA,CAAA,sBAAA,CAAA,EAAA,cAAA,CAAA;cACzB,EAAA,QAAc;YACd,EAAA;AACJ,KAAA,CAAA;cACU,CAAA;AACN,EAAAA,cAAA,CAAA,gBAAY;uBACD,EAAC,MAAK,EAAA;AACW,GAAA,EAAA,CAAA,eAAA,CAAA,CAAO;;AAC9B,IAAA,IAAA,WAAA,GAAA,EAAU;AAEf,IAAA,IAAA,GAAA,GAAA,EAAI;AACA,IAAA,eAAG,EAAC,GAAI,CAAC,GAAA,IAAO;gBAChB,GAAW,IAAA,IAAA,CAAA,aAAW,CAAA;iBACzB;AACD,MAAA,IAAA,OAAI,CAAA,IAAK,CAAA,EAAI,OAAC,GAAA,CAAA,CAAA,yBAAA,CAAA,CAAA,KAAA,IAAA,WAAA,CAAA,IAAA,CAAA,EAAA,OAAA,GAAA,CAAA,CAAA,6BAAA,CAAA,CAAA,KAAA,OAAA,GAAA,MAAA,CAAA,IAAA,IAAA,CAAA,GAAA,CAAA,SAAA,CAAA,EAAA,cAAA,CAAA;AAClB,MAAA,IAAE,OAAC,KAAA,WAAA,EAAA;AACH,QAAA,GAAA,CAAA,YAAW,CAAA;AACf,QAAI,WAAe,GAAA,OAAG;AAEtB;AAEQ,MAAA,GAAA,CAAA,IAAA,CAAA,GAAA,CAAA;AAEQ,KAAA,CAAA;AAUJ,IAAA,OACE,GAAA;AACN,GAAA,EAAA,CAAA,eAAA,CAAA,CAAA;AAGZ,EAAE,OAAAA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,EAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAEF,IAAM,SAAA,EAAS,QAAM;AACjB,IAAA,GAAA,EAAK;AAAQ,GAAA,EAAA,gBAAY,CAAA,CAAA,OAAA,EAAA,KAAA,KAAA;AAEzB,IAAA,OAAOA,cACH,CAAA,aAAA,CAAA,oBAAA,EAAA;AAEI,MAAA,GAAA,EAAA,KAAA;aAGK,EAAA,OAAA;AACD,MAAA,KAAA,EAAA,KAAA;AAGQ,MAAA,MAAA,EAAA,MAAA;AACH,MAAA,WAAA,EAAA,WAAA;oBAGI,EAAA;AACD,KAAA,CAAA;AACI,GAAA,CAAA,CAAA,EAAAA,cAAA,CAAA,aAAA,CAAA,SAAA,EAAA;AACI,IAAA,OAAA,EAAA,eAAA;kBAWP;AACD,IAAA,OAAA,EAAA;AASxB,GAAE,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Messages.js","sources":["../../../src/components/InboxMessage/Messages.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { IAuthUser, IPost } from 'common';
3
+ interface SlackLikeMessageGroupProps {
4
+ messages: IPost[];
5
+ currentUser: IAuthUser;
6
+ onOpen: (element?: any) => void;
7
+ onMessageClick: (msg: IPost) => void;
8
+ }
9
+ export declare const groupMessagesByUserAndTime: (messages: IPost[], timeThresholdMinutes?: number) => IPost[][];
10
+ export declare const SlackLikeMessageGroup: React.FC<SlackLikeMessageGroupProps>;
11
+ export {};
12
+ //# sourceMappingURL=SlackLikeMessageGroup.d.ts.map
package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SlackLikeMessageGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/InboxMessage/message-widgets/SlackLikeMessageGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAG1C,UAAU,0BAA0B;IAChC,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,SAAS,CAAC;IACvB,MAAM,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAChC,cAAc,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;CACxC;AAWD,eAAO,MAAM,0BAA0B,aAAc,KAAK,EAAE,oCAA6B,KAAK,EAAE,EAgC/F,CAAC;AA6HF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CA6BtE,CAAC"}
package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.js ADDED
@@ -0,0 +1,134 @@
1
+ import React__default from'react';import {format,differenceInMinutes}from'date-fns';import {FilesList}from'../../inbox/FilesList.js';import'../../inbox/MessageItem.js';import'../../inbox/ThreadItem.js';// Utility function to group messages by user and time
2
+ const groupMessagesByUserAndTime = (messages, timeThresholdMinutes = 5) => {
3
+ if (!messages || messages.length === 0) return [];
4
+ const groups = [];
5
+ let currentGroup = [];
6
+ let lastMessage = null;
7
+ for (const message of messages) {
8
+ if (typeof message === 'string') continue; // Skip date separators
9
+ const shouldStartNewGroup = !lastMessage || lastMessage.author?.id !== message.author?.id || differenceInMinutes(new Date(message.createdAt), new Date(lastMessage.createdAt)) > timeThresholdMinutes;
10
+ if (shouldStartNewGroup) {
11
+ if (currentGroup.length > 0) {
12
+ groups.push(currentGroup);
13
+ }
14
+ currentGroup = [message];
15
+ } else {
16
+ currentGroup.push(message);
17
+ }
18
+ lastMessage = message;
19
+ }
20
+ if (currentGroup.length > 0) {
21
+ groups.push(currentGroup);
22
+ }
23
+ return groups;
24
+ };
25
+ const MessageGroup = ({
26
+ author,
27
+ messages,
28
+ currentUser,
29
+ onOpen,
30
+ onMessageClick
31
+ }) => {
32
+ const isOwnMessage = author?.id === currentUser?.id;
33
+ const authorName = author?.givenName && author?.familyName ? `${author.givenName} ${author.familyName}` : author?.username || 'Unknown User';
34
+ const firstMessage = messages[0];
35
+ const formatTime = timestamp => {
36
+ const date = new Date(timestamp);
37
+ return format(date, 'h:mm a');
38
+ };
39
+ return React__default.createElement("div", {
40
+ className: "mb-1 group hover:bg-white hover:bg-opacity-60 -mx-4 px-4 py-1 rounded transition-colors"
41
+ }, React__default.createElement("div", {
42
+ className: "flex items-start space-x-2"
43
+ }, React__default.createElement("div", {
44
+ className: "flex-shrink-0 mt-0.5"
45
+ }, React__default.createElement("img", {
46
+ className: "w-9 h-9 rounded-lg cursor-pointer hover:opacity-80 transition-opacity",
47
+ src: author?.picture || '/default-avatar.svg',
48
+ alt: authorName,
49
+ onClick: () => onOpen(firstMessage),
50
+ onError: e => {
51
+ e.currentTarget.src = '/default-avatar.svg';
52
+ }
53
+ })), React__default.createElement("div", {
54
+ className: "flex-1 min-w-0"
55
+ }, React__default.createElement("div", {
56
+ className: "flex items-center space-x-2 mb-1"
57
+ }, React__default.createElement("span", {
58
+ className: "text-sm font-bold text-gray-900"
59
+ }, authorName), React__default.createElement("span", {
60
+ className: "text-xs text-gray-500"
61
+ }, formatTime(firstMessage.createdAt)), isOwnMessage && React__default.createElement("span", {
62
+ className: "text-xs text-gray-400 italic"
63
+ }, "(you)")), React__default.createElement("div", {
64
+ className: "space-y-1"
65
+ }, messages.map((message, index) => React__default.createElement(MessageBubble, {
66
+ key: message.id,
67
+ message: message,
68
+ isOwnMessage: isOwnMessage,
69
+ isFirstInGroup: index === 0,
70
+ isLastInGroup: index === messages.length - 1,
71
+ showTimestamp: isOwnMessage && index === 0,
72
+ onMessageClick: onMessageClick,
73
+ totalInGroup: messages.length,
74
+ authorName: authorName,
75
+ formatTime: formatTime
76
+ }))))));
77
+ };
78
+ const MessageBubble = ({
79
+ message,
80
+ isOwnMessage,
81
+ isFirstInGroup,
82
+ isLastInGroup,
83
+ showTimestamp,
84
+ onMessageClick,
85
+ totalInGroup,
86
+ authorName,
87
+ formatTime
88
+ }) => {
89
+ const handleClick = () => {
90
+ onMessageClick?.(message);
91
+ };
92
+ // All messages use the same format (Slack style - left aligned)
93
+ return React__default.createElement("div", {
94
+ className: "py-0.5 hover:bg-gray-50 hover:bg-opacity-50 rounded px-1 -mx-1 group"
95
+ }, React__default.createElement("div", {
96
+ className: "text-sm text-gray-900 cursor-pointer hover:bg-gray-100 px-1 rounded",
97
+ onClick: handleClick
98
+ }, React__default.createElement("span", {
99
+ className: "text-xs text-gray-500 opacity-0 group-hover:opacity-100 transition-opacity float-right ml-2"
100
+ }, formatTime(message.createdAt)), message.message && React__default.createElement("span", {
101
+ className: "whitespace-pre-wrap break-words leading-relaxed"
102
+ }, message.message), message.files?.totalCount > 0 && React__default.createElement("div", {
103
+ className: "mt-1 clear-both"
104
+ }, React__default.createElement(FilesList, {
105
+ uploaded: true,
106
+ files: message.files.data
107
+ })), React__default.createElement("div", {
108
+ className: `${navigator.userAgent.includes('Firefox') ? 'mt-1' : ''} clear-both`
109
+ })));
110
+ };
111
+ const SlackLikeMessageGroup = ({
112
+ messages,
113
+ currentUser,
114
+ onOpen,
115
+ onMessageClick
116
+ }) => {
117
+ // Filter out non-message items (like date strings)
118
+ const actualMessages = messages.filter(msg => typeof msg !== 'string');
119
+ // Group messages by user and time
120
+ const messageGroups = groupMessagesByUserAndTime(actualMessages);
121
+ return React__default.createElement("div", {
122
+ className: "space-y-2"
123
+ }, messageGroups.map((group, groupIndex) => {
124
+ const author = group[0]?.author;
125
+ return React__default.createElement(MessageGroup, {
126
+ key: `group-${groupIndex}-${group[0]?.id}`,
127
+ author: author,
128
+ messages: group,
129
+ currentUser: currentUser,
130
+ onOpen: onOpen,
131
+ onMessageClick: onMessageClick
132
+ });
133
+ }));
134
+ };export{SlackLikeMessageGroup,groupMessagesByUserAndTime};//# sourceMappingURL=SlackLikeMessageGroup.js.map
package/lib/components/InboxMessage/message-widgets/SlackLikeMessageGroup.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SlackLikeMessageGroup.js","sources":["../../../../src/components/InboxMessage/message-widgets/SlackLikeMessageGroup.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
package/lib/components/InboxMessage/message-widgets/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { MessageSliceRenderer } from './MessageSliceRenderer';
2
+ export { SlackLikeMessageGroup } from './SlackLikeMessageGroup';
2
3
  //# sourceMappingURL=index.d.ts.map
package/lib/components/InboxMessage/message-widgets/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/InboxMessage/message-widgets/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/InboxMessage/message-widgets/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}
package/lib/components/slot-fill/chat-message-filler.js CHANGED
@@ -1,4 +1,4 @@
1
- import*as React from'react';import {ChatMessageFiller}from'./chat-message-slot.js';import {MessageSliceRenderer}from'../InboxMessage/message-widgets/MessageSliceRenderer.js';const ChatMessageFill = () => {
1
+ import*as React from'react';import {ChatMessageFiller}from'./chat-message-slot.js';import {MessageSliceRenderer}from'../InboxMessage/message-widgets/MessageSliceRenderer.js';import'date-fns';import'../inbox/FilesList.js';import'../inbox/MessageItem.js';import'../inbox/ThreadItem.js';const ChatMessageFill = () => {
2
2
  return React.createElement(ChatMessageFiller, null, props => React.createElement(MessageSliceRenderer, {
3
3
  ...props
4
4
  }));
package/lib/components/slot-fill/chat-message-filler.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"chat-message-filler.js","sources":["../../../src/components/slot-fill/chat-message-filler.tsx"],"sourcesContent":[null],"names":[],"mappings":"8KAIO,MAAM,eAAe,GAAG,MAAK;AAChC,EAAA,OAAA,KAAQ,CAAA,aAAA,CAAA,iBAAA,EAAiB,IAAE,EAAA,SAAQ,KAAG,CAAA,aAAA,CAAA,oBAAqB,EAAA;AAC/D,IAAE,GAAA;AAEF,GAAA,CAAA,CAAA;AACI"}
1
+ {"version":3,"file":"chat-message-filler.js","sources":["../../../src/components/slot-fill/chat-message-filler.tsx"],"sourcesContent":[null],"names":[],"mappings":"4RAIO,MAAM,eAAe,GAAG,MAAK;AAChC,EAAA,OAAA,KAAQ,CAAA,aAAA,CAAA,iBAAA,EAAiB,IAAE,EAAA,SAAQ,KAAG,CAAA,aAAA,CAAA,oBAAqB,EAAA;AAC/D,IAAE,GAAA;AAEF,GAAA,CAAA,CAAA;AACI"}
package/lib/container/Inbox.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Inbox.d.ts","sourceRoot":"","sources":["../../src/container/Inbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyE,MAAM,OAAO,CAAC;AAgC9F,MAAM,WAAW,UAAU;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;;YAkFqB,UAAU;;;AAssBhC,wBAAiC"}
1
+ {"version":3,"file":"Inbox.d.ts","sourceRoot":"","sources":["../../src/container/Inbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyE,MAAM,OAAO,CAAC;AAgC9F,MAAM,WAAW,UAAU;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;;YAkFqB,UAAU;;;AAozBhC,wBAAiC"}
package/lib/container/Inbox.js CHANGED
@@ -281,13 +281,15 @@ const Inbox = props => {
281
281
  setBottomDrawer: setBottomDrawer,
282
282
  channelName: channelName,
283
283
  loaderdata: data
284
- }) : React__default.createElement(EmptyState, null)), pathChannelId && data?.[1] && !isMobileView && React__default.createElement("div", {
285
- className: "w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0"
286
- }, React__default.createElement(RightSidebarWrapper, {
284
+ }) : React__default.createElement(EmptyState, null)), pathChannelId && data?.[1] && !isMobileView &&
285
+ // <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
286
+ React__default.createElement(RightSidebarWrapper, {
287
287
  MessagesLoaderQuery: data?.[1],
288
288
  selectedPost: null,
289
289
  detailSidebarOptions: detailSidebarOptions
290
- })));
290
+ })
291
+ // </div>
292
+ );
291
293
  };
292
294
  const ContentComponent = React__default.memo(props => {
293
295
  const {
@@ -401,14 +403,16 @@ const RightSidebarWrapper = React__default.memo(({
401
403
  return orderBy(uniqBy(messages, 'id'), ['createdAt'], ['asc']);
402
404
  }, [data?.messages?.data]);
403
405
  if (!sortedMessages.length) return null;
404
- return React__default.createElement("div", {
405
- className: "w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0"
406
- }, React__default.createElement(RightSidebar, {
407
- channelMessages: sortedMessages,
408
- visibility: "visible",
409
- selectedPost: selectedPost,
410
- ...detailSidebarOptions
411
- }));
406
+ return (
407
+ // <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
408
+ React__default.createElement(RightSidebar, {
409
+ channelMessages: sortedMessages,
410
+ visibility: "visible",
411
+ selectedPost: selectedPost,
412
+ ...detailSidebarOptions
413
+ })
414
+ // </div>
415
+ );
412
416
  });
413
417
  const MessagesComponent = React__default.memo(props => {
414
418
  const {
@@ -421,6 +425,9 @@ const MessagesComponent = React__default.memo(props => {
421
425
  const messageRootListRef = useRef(null);
422
426
  const messageListRef = useRef(null);
423
427
  useApolloClient();
428
+ const [isLoadingOlder, setIsLoadingOlder] = React__default.useState(false);
429
+ const isLoadingOlderRef = useRef(false);
430
+ const scrollTimeoutRef = useRef(null);
424
431
  const auth = useSelector(userSelector);
425
432
  const {
426
433
  startUpload
@@ -439,18 +446,24 @@ const MessagesComponent = React__default.memo(props => {
439
446
  }, [data?.messages?.data]);
440
447
  const totalCount = data?.messages?.totalCount || 0;
441
448
  const scrollToBottom = useCallback(() => {
442
- if (messageListRef?.current && messageRootListRef?.current) {
449
+ if (messageRootListRef?.current) {
443
450
  messageRootListRef.current.scrollTop = messageRootListRef.current.scrollHeight;
444
451
  }
445
452
  }, []);
446
- // Auto-scroll on new messages
453
+ // Auto-scroll on new messages (but not when loading older messages)
447
454
  useEffect(() => {
448
- const timer = setTimeout(() => scrollToBottom(), 100);
449
- return () => clearTimeout(timer);
455
+ if (!isLoadingOlderRef.current) {
456
+ const timer = setTimeout(() => scrollToBottom(), 100);
457
+ return () => clearTimeout(timer);
458
+ }
450
459
  }, [messages.length, scrollToBottom]);
451
460
  const onFetchOld = useCallback(async skip => {
452
- if (channelId && fetchMoreMessages) {
461
+ if (channelId && fetchMoreMessages && !isLoadingOlder) {
453
462
  try {
463
+ setIsLoadingOlder(true);
464
+ isLoadingOlderRef.current = true;
465
+ // Capture current scroll height before fetching
466
+ const oldScrollHeight = messageRootListRef?.current?.scrollHeight || 0;
454
467
  await fetchMoreMessages({
455
468
  variables: {
456
469
  channelId: channelId.toString(),
@@ -472,26 +485,112 @@ const MessagesComponent = React__default.memo(props => {
472
485
  };
473
486
  }
474
487
  });
475
- if (messageRootListRef?.current) {
476
- messageRootListRef.current.scrollTop += messageRootListRef.current.clientHeight;
477
- }
488
+ // Maintain scroll position after loading older messages
489
+ setTimeout(() => {
490
+ if (messageRootListRef?.current) {
491
+ const newScrollHeight = messageRootListRef.current.scrollHeight;
492
+ const scrollDiff = newScrollHeight - oldScrollHeight;
493
+ // For normal flex layout, maintain position by adjusting scroll offset
494
+ messageRootListRef.current.scrollTop = scrollDiff;
495
+ }
496
+ // Reset the loading flag after position is maintained
497
+ setTimeout(() => {
498
+ isLoadingOlderRef.current = false;
499
+ }, 50);
500
+ }, 100);
478
501
  } catch (error) {
479
502
  console.error('Error fetching older messages:', error);
503
+ isLoadingOlderRef.current = false;
504
+ } finally {
505
+ setIsLoadingOlder(false);
480
506
  }
481
507
  }
482
- }, [channelId, fetchMoreMessages]);
483
- const onMessagesScroll = useCallback(async e => {
484
- if (messageRootListRef.current) {
485
- const {
486
- clientHeight,
487
- scrollHeight,
488
- scrollTop
489
- } = messageRootListRef.current;
490
- if (clientHeight - scrollTop === scrollHeight && totalCount > messages.length) {
491
- await onFetchOld(messages.length);
508
+ }, [channelId, fetchMoreMessages, isLoadingOlder]);
509
+ // Scroll to bottom when channel changes
510
+ useEffect(() => {
511
+ if (channelId && messages.length > 0) {
512
+ isLoadingOlderRef.current = false; // Reset flag on channel change
513
+ const timer = setTimeout(() => scrollToBottom(), 200);
514
+ return () => clearTimeout(timer);
515
+ }
516
+ }, [channelId, scrollToBottom]);
517
+ // Alternative scroll detection for Firefox
518
+ useEffect(() => {
519
+ const element = messageRootListRef.current;
520
+ if (!element) return;
521
+ // Firefox-specific scroll detection using passive listeners
522
+ const handleScrollEnd = () => {
523
+ if (!isLoadingOlder && element) {
524
+ const {
525
+ scrollTop
526
+ } = element;
527
+ const isAtTop = Math.round(scrollTop) <= 30;
528
+ const hasMoreMessages = totalCount > messages.length;
529
+ if (isAtTop && hasMoreMessages) {
530
+ console.log('ScrollEnd triggered load more (Firefox):', {
531
+ scrollTop: Math.round(scrollTop),
532
+ totalCount,
533
+ messagesLength: messages.length
534
+ });
535
+ onFetchOld(messages.length);
536
+ }
492
537
  }
538
+ };
539
+ // Use scrollend event if available (modern Firefox/Chrome)
540
+ if ('onscrollend' in element) {
541
+ element.addEventListener('scrollend', handleScrollEnd, {
542
+ passive: true
543
+ });
544
+ return () => {
545
+ element.removeEventListener('scrollend', handleScrollEnd);
546
+ };
493
547
  }
494
- }, [totalCount, messages.length, onFetchOld]);
548
+ }, [totalCount, messages.length, onFetchOld, isLoadingOlder]);
549
+ // Cleanup scroll timeout on unmount
550
+ useEffect(() => {
551
+ return () => {
552
+ if (scrollTimeoutRef.current) {
553
+ clearTimeout(scrollTimeoutRef.current);
554
+ }
555
+ };
556
+ }, []);
557
+ const onMessagesScroll = useCallback(async e => {
558
+ // Throttle scroll events for better performance, especially in Firefox
559
+ if (scrollTimeoutRef.current) {
560
+ clearTimeout(scrollTimeoutRef.current);
561
+ }
562
+ scrollTimeoutRef.current = setTimeout(async () => {
563
+ if (messageRootListRef.current && !isLoadingOlder) {
564
+ const element = messageRootListRef.current;
565
+ const {
566
+ clientHeight,
567
+ scrollHeight,
568
+ scrollTop
569
+ } = element;
570
+ // Firefox-compatible scroll detection
571
+ // Use Math.ceil to handle Firefox's fractional scrollTop values
572
+ const isAtTop = Math.ceil(scrollTop) <= 25;
573
+ const hasMoreMessages = totalCount > messages.length;
574
+ // Additional Firefox-specific check
575
+ const isFirefox = navigator.userAgent.includes('Firefox');
576
+ const firefoxAdjustedTop = isFirefox ? Math.round(scrollTop) <= 30 : isAtTop;
577
+ if ((isAtTop || firefoxAdjustedTop) && hasMoreMessages) {
578
+ console.log('Triggering load more:', {
579
+ scrollTop: Math.ceil(scrollTop),
580
+ originalScrollTop: scrollTop,
581
+ totalCount,
582
+ messagesLength: messages.length,
583
+ scrollHeight,
584
+ clientHeight,
585
+ browser: isFirefox ? 'Firefox' : 'Other',
586
+ isAtTop,
587
+ firefoxAdjustedTop
588
+ });
589
+ await onFetchOld(messages.length);
590
+ }
591
+ }
592
+ }, 100);
593
+ }, [totalCount, messages.length, onFetchOld, isLoadingOlder]);
495
594
  // Optimistic message sending with Apollo cache updates
496
595
  const handleSend = useCallback(async (message, files = []) => {
497
596
  // Allow sending if there's either a message or files
@@ -668,9 +767,17 @@ const MessagesComponent = React__default.memo(props => {
668
767
  }
669
768
  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
670
769
  ref: messageRootListRef,
671
- className: "flex flex-col-reverse flex-grow flex-shrink overflow-y-auto p-4 px-[10px] md:px-[50px] lg:px-[80px]",
770
+ className: "flex flex-col flex-grow flex-shrink overflow-y-auto p-4 px-4 md:px-8 lg:px-12 bg-gray-50",
672
771
  onScroll: onMessagesScroll
673
- }, messages.length > 0 ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Messages, {
772
+ }, messages.length > 0 ? React__default.createElement(React__default.Fragment, null, isLoadingOlder && React__default.createElement("div", {
773
+ className: "flex justify-center py-4"
774
+ }, React__default.createElement("div", {
775
+ className: "flex items-center space-x-2 text-gray-500"
776
+ }, React__default.createElement(Spinner, {
777
+ className: "w-4 h-4"
778
+ }), React__default.createElement("span", {
779
+ className: "text-sm"
780
+ }, "Loading older messages..."))), React__default.createElement(Messages, {
674
781
  innerRef: messageListRef,
675
782
  channelId: channelId,
676
783
  currentUser: auth,
package/lib/container/Inbox.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Inbox.js","sources":["../../src/container/Inbox.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
1
+ {"version":3,"file":"Inbox.js","sources":["../../src/container/Inbox.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
package/lib/index.js CHANGED
@@ -1 +1 @@
1
- export{default}from'./module.js';export{default as Inbox}from'./container/Inbox.js';export{default as InboxWithLoader}from'./container/InboxWithLoader.js';export{default as Threads}from'./container/Threads.js';export{default as ThreadMessages}from'./container/ThreadMessages.js';export{default as ServiceInbox}from'./container/ServiceInbox.js';import'./container/ThreadsInbox.js';import'./container/ThreadMessagesInbox.js';export{FilesList}from'./components/inbox/FilesList.js';export{MessageItem}from'./components/inbox/MessageItem.js';import'./components/inbox/ThreadItem.js';export{CommonMessage}from'./components/InboxMessage/CommonMessage.js';export{ConversationItem}from'./components/InboxMessage/ConversationItem.js';import'./components/InboxMessage/ServiceConversationItem.js';export{LeftSidebar}from'./components/InboxMessage/LeftSidebar.js';export{MessageInput}from'./components/InboxMessage/MessageInput.js';export{Messages}from'./components/InboxMessage/Messages.js';export{Popover}from'./components/InboxMessage/Popover.js';export{UploadImageButton}from'./components/InboxMessage/UploadImageButton.js';export{UserModalContent}from'./components/InboxMessage/UserModalContent.js';export{MessageSliceRenderer}from'./components/InboxMessage/message-widgets/MessageSliceRenderer.js';import'react';import'@common-stack/components-pro';export{MessengerSlotFillNameEnum}from'./enums/messenger-slot-fill-name-enum.js';export{ServiceInboxItem}from'./components/InboxMessage/ServiceInboxItem.js';import'@messenger-box/core';export{ChatMessageFill}from'./components/slot-fill/chat-message-filler.js';//# sourceMappingURL=index.js.map
1
+ export{default}from'./module.js';export{default as Inbox}from'./container/Inbox.js';export{default as InboxWithLoader}from'./container/InboxWithLoader.js';export{default as Threads}from'./container/Threads.js';export{default as ThreadMessages}from'./container/ThreadMessages.js';export{default as ServiceInbox}from'./container/ServiceInbox.js';import'./container/ThreadsInbox.js';import'./container/ThreadMessagesInbox.js';export{FilesList}from'./components/inbox/FilesList.js';export{MessageItem}from'./components/inbox/MessageItem.js';import'./components/inbox/ThreadItem.js';export{CommonMessage}from'./components/InboxMessage/CommonMessage.js';export{ConversationItem}from'./components/InboxMessage/ConversationItem.js';import'./components/InboxMessage/ServiceConversationItem.js';export{LeftSidebar}from'./components/InboxMessage/LeftSidebar.js';export{MessageInput}from'./components/InboxMessage/MessageInput.js';export{Messages}from'./components/InboxMessage/Messages.js';export{Popover}from'./components/InboxMessage/Popover.js';export{UploadImageButton}from'./components/InboxMessage/UploadImageButton.js';export{UserModalContent}from'./components/InboxMessage/UserModalContent.js';export{MessageSliceRenderer}from'./components/InboxMessage/message-widgets/MessageSliceRenderer.js';import'react';import'date-fns';import'@common-stack/components-pro';export{MessengerSlotFillNameEnum}from'./enums/messenger-slot-fill-name-enum.js';export{ServiceInboxItem}from'./components/InboxMessage/ServiceInboxItem.js';import'@messenger-box/core';export{ChatMessageFill}from'./components/slot-fill/chat-message-filler.js';//# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@messenger-box/tailwind-ui-inbox",
3
- "version": "10.0.3-alpha.69",
3
+ "version": "10.0.3-alpha.70",
4
4
  "description": "Inbox UI components built with TailwindCSS",
5
5
  "license": "ISC",
6
6
  "author": "CDMBase LLC",
@@ -53,5 +53,5 @@
53
53
  "typescript": {
54
54
  "definition": "lib/index.d.ts"
55
55
  },
56
- "gitHead": "011fbbc8fbbc97043d73323c02c1ac22b2a01bfb"
56
+ "gitHead": "2e0dee183caed5aa9c8736b8a1953e147ff39aa4"
57
57
  }
package/src/components/InboxMessage/Messages.tsx CHANGED
@@ -3,6 +3,7 @@ import React, { useMemo, useRef, useEffect, useState } from 'react';
3
3
  import { useTranslation } from 'react-i18next';
4
4
  import { UserModalContent } from './UserModalContent';
5
5
  import { MessageSliceRenderer } from './message-widgets';
6
+ import { SlackLikeMessageGroup } from './message-widgets/SlackLikeMessageGroup';
6
7
 
7
8
  interface MessagesProps {
8
9
  channelId: number;
@@ -60,7 +61,7 @@ export const Messages = ({
60
61
  }
61
62
  }, [channelMessages]);
62
63
 
63
- const messageList = useMemo(() => {
64
+ const messageListWithDates = useMemo(() => {
64
65
  let currentDate = '';
65
66
  let res = [];
66
67
  channelMessages?.map((msg) => {
@@ -71,7 +72,7 @@ export const Messages = ({
71
72
  else msgDate = format(new Date(msg.createdAt), 'eee, do MMMM');
72
73
 
73
74
  if (msgDate !== currentDate) {
74
- res.push(msgDate);
75
+ res.push({ type: 'date', content: msgDate });
75
76
  currentDate = msgDate;
76
77
  }
77
78
  res.push(msg);
@@ -79,21 +80,57 @@ export const Messages = ({
79
80
  return res;
80
81
  }, [channelMessages]);
81
82
 
83
+ // Group messages by date sections for Slack-like rendering
84
+ const messagesByDate = useMemo(() => {
85
+ const sections = [];
86
+ let currentSection = { date: null, messages: [] };
87
+
88
+ messageListWithDates.forEach((item) => {
89
+ if (item?.type === 'date') {
90
+ if (currentSection.messages.length > 0) {
91
+ sections.push(currentSection);
92
+ }
93
+ currentSection = { date: item.content, messages: [] };
94
+ } else {
95
+ currentSection.messages.push(item);
96
+ }
97
+ });
98
+
99
+ if (currentSection.messages.length > 0) {
100
+ sections.push(currentSection);
101
+ }
102
+
103
+ return sections;
104
+ }, [messageListWithDates]);
105
+
82
106
  return (
83
107
  <>
84
108
  <div className="w-full" ref={innerRef}>
85
- {messageList?.map((message, index) => {
86
- return (
87
- <MessageSliceRenderer
88
- key={index}
89
- message={message}
90
- index={index}
91
- onOpen={onOpen}
109
+ {messagesByDate?.map((section, sectionIndex) => (
110
+ <div
111
+ key={`section-${sectionIndex}`}
112
+ className={sectionIndex === messagesByDate.length - 1 ? '' : 'mb-4'}
113
+ >
114
+ {/* Date separator */}
115
+ {section.date && (
116
+ <div className="flex items-center justify-center my-4">
117
+ <div className="flex-grow border-t border-gray-200"></div>
118
+ <div className="mx-4 px-3 py-1 bg-white border border-gray-200 rounded-full text-xs font-medium text-gray-600">
119
+ {section.date}
120
+ </div>
121
+ <div className="flex-grow border-t border-gray-200"></div>
122
+ </div>
123
+ )}
124
+
125
+ {/* Messages grouped by user and time */}
126
+ <SlackLikeMessageGroup
127
+ messages={section.messages}
92
128
  currentUser={currentUser}
129
+ onOpen={onOpen}
93
130
  onMessageClick={onMessageClick}
94
131
  />
95
- );
96
- })}
132
+ </div>
133
+ ))}
97
134
  </div>
98
135
  <ChatModal element={selectedElement} isOpen={isOpen} onClose={onClose} />
99
136
  </>
package/src/components/InboxMessage/message-widgets/SlackLikeMessageGroup.tsx ADDED
@@ -0,0 +1,208 @@
1
+ import React from 'react';
2
+ import { format, formatDistanceToNow, differenceInMinutes } from 'date-fns';
3
+ import { IAuthUser, IPost } from 'common';
4
+ import { FilesList } from '../../inbox';
5
+
6
+ interface SlackLikeMessageGroupProps {
7
+ messages: IPost[];
8
+ currentUser: IAuthUser;
9
+ onOpen: (element?: any) => void;
10
+ onMessageClick: (msg: IPost) => void;
11
+ }
12
+
13
+ interface MessageGroupProps {
14
+ author: any;
15
+ messages: IPost[];
16
+ currentUser: IAuthUser;
17
+ onOpen: (element?: any) => void;
18
+ onMessageClick: (msg: IPost) => void;
19
+ }
20
+
21
+ // Utility function to group messages by user and time
22
+ export const groupMessagesByUserAndTime = (messages: IPost[], timeThresholdMinutes = 5): IPost[][] => {
23
+ if (!messages || messages.length === 0) return [];
24
+
25
+ const groups: IPost[][] = [];
26
+ let currentGroup: IPost[] = [];
27
+ let lastMessage: IPost | null = null;
28
+
29
+ for (const message of messages) {
30
+ if (typeof message === 'string') continue; // Skip date separators
31
+
32
+ const shouldStartNewGroup =
33
+ !lastMessage ||
34
+ lastMessage.author?.id !== message.author?.id ||
35
+ differenceInMinutes(new Date(message.createdAt), new Date(lastMessage.createdAt)) > timeThresholdMinutes;
36
+
37
+ if (shouldStartNewGroup) {
38
+ if (currentGroup.length > 0) {
39
+ groups.push(currentGroup);
40
+ }
41
+ currentGroup = [message];
42
+ } else {
43
+ currentGroup.push(message);
44
+ }
45
+
46
+ lastMessage = message;
47
+ }
48
+
49
+ if (currentGroup.length > 0) {
50
+ groups.push(currentGroup);
51
+ }
52
+
53
+ return groups;
54
+ };
55
+
56
+ const MessageGroup: React.FC<MessageGroupProps> = ({ author, messages, currentUser, onOpen, onMessageClick }) => {
57
+ const isOwnMessage = author?.id === currentUser?.id;
58
+ const authorName =
59
+ author?.givenName && author?.familyName
60
+ ? `${author.givenName} ${author.familyName}`
61
+ : author?.username || 'Unknown User';
62
+
63
+ const firstMessage = messages[0];
64
+ const formatTime = (timestamp: string) => {
65
+ const date = new Date(timestamp);
66
+ return format(date, 'h:mm a');
67
+ };
68
+
69
+ return (
70
+ <div className="mb-1 group hover:bg-white hover:bg-opacity-60 -mx-4 px-4 py-1 rounded transition-colors">
71
+ <div className="flex items-start space-x-2">
72
+ {/* Avatar - show for all messages */}
73
+ <div className="flex-shrink-0 mt-0.5">
74
+ <img
75
+ className="w-9 h-9 rounded-lg cursor-pointer hover:opacity-80 transition-opacity"
76
+ src={author?.picture || '/default-avatar.svg'}
77
+ alt={authorName}
78
+ onClick={() => onOpen(firstMessage)}
79
+ onError={(e) => {
80
+ e.currentTarget.src = '/default-avatar.svg';
81
+ }}
82
+ />
83
+ </div>
84
+
85
+ <div className="flex-1 min-w-0">
86
+ {/* Author name and timestamp - show for all messages */}
87
+ <div className="flex items-center space-x-2 mb-1">
88
+ <span className="text-sm font-bold text-gray-900">{authorName}</span>
89
+ <span className="text-xs text-gray-500">{formatTime(firstMessage.createdAt)}</span>
90
+ {isOwnMessage && <span className="text-xs text-gray-400 italic">(you)</span>}
91
+ </div>
92
+
93
+ {/* Messages in the group - single line for each message */}
94
+ <div className="space-y-1">
95
+ {messages.map((message, index) => (
96
+ <MessageBubble
97
+ key={message.id}
98
+ message={message}
99
+ isOwnMessage={isOwnMessage}
100
+ isFirstInGroup={index === 0}
101
+ isLastInGroup={index === messages.length - 1}
102
+ showTimestamp={isOwnMessage && index === 0}
103
+ onMessageClick={onMessageClick}
104
+ totalInGroup={messages.length}
105
+ authorName={authorName}
106
+ formatTime={formatTime}
107
+ />
108
+ ))}
109
+ </div>
110
+ </div>
111
+ </div>
112
+ </div>
113
+ );
114
+ };
115
+
116
+ interface MessageBubbleProps {
117
+ message: IPost;
118
+ isOwnMessage: boolean;
119
+ isFirstInGroup: boolean;
120
+ isLastInGroup: boolean;
121
+ showTimestamp: boolean;
122
+ onMessageClick: (msg: IPost) => void;
123
+ totalInGroup: number;
124
+ authorName: string;
125
+ formatTime: (timestamp: string) => string;
126
+ }
127
+
128
+ const MessageBubble: React.FC<MessageBubbleProps> = ({
129
+ message,
130
+ isOwnMessage,
131
+ isFirstInGroup,
132
+ isLastInGroup,
133
+ showTimestamp,
134
+ onMessageClick,
135
+ totalInGroup,
136
+ authorName,
137
+ formatTime,
138
+ }) => {
139
+ const handleClick = () => {
140
+ onMessageClick?.(message);
141
+ };
142
+
143
+ // All messages use the same format (Slack style - left aligned)
144
+ return (
145
+ <div className="py-0.5 hover:bg-gray-50 hover:bg-opacity-50 rounded px-1 -mx-1 group">
146
+ <div className="text-sm text-gray-900 cursor-pointer hover:bg-gray-100 px-1 rounded" onClick={handleClick}>
147
+ {/* Show timestamp on hover */}
148
+ <span className="text-xs text-gray-500 opacity-0 group-hover:opacity-100 transition-opacity float-right ml-2">
149
+ {formatTime(message.createdAt)}
150
+ </span>
151
+
152
+ {message.message && (
153
+ <span className="whitespace-pre-wrap break-words leading-relaxed">{message.message}</span>
154
+ )}
155
+
156
+ {message.files?.totalCount > 0 && (
157
+ <div className="mt-1 clear-both">
158
+ <FilesList uploaded files={message.files.data} />
159
+ </div>
160
+ )}
161
+ <div className={`${navigator.userAgent.includes('Firefox') ? 'mt-1' : ''} clear-both`}></div>
162
+
163
+ {/* Show delivery status for own messages */}
164
+ {/* {isOwnMessage && message.isDelivered !== undefined && (
165
+ <div className="text-xs text-gray-400 mt-1 clear-both">
166
+ {message.isDelivered
167
+ ? message.isRead
168
+ ? '✓✓ Read'
169
+ : '✓✓ Delivered'
170
+ : '✓ Sent'
171
+ }
172
+ </div>
173
+ )} */}
174
+ </div>
175
+ </div>
176
+ );
177
+ };
178
+
179
+ export const SlackLikeMessageGroup: React.FC<SlackLikeMessageGroupProps> = ({
180
+ messages,
181
+ currentUser,
182
+ onOpen,
183
+ onMessageClick,
184
+ }) => {
185
+ // Filter out non-message items (like date strings)
186
+ const actualMessages = messages.filter((msg) => typeof msg !== 'string') as IPost[];
187
+
188
+ // Group messages by user and time
189
+ const messageGroups = groupMessagesByUserAndTime(actualMessages);
190
+
191
+ return (
192
+ <div className="space-y-2">
193
+ {messageGroups.map((group, groupIndex) => {
194
+ const author = group[0]?.author;
195
+ return (
196
+ <MessageGroup
197
+ key={`group-${groupIndex}-${group[0]?.id}`}
198
+ author={author}
199
+ messages={group}
200
+ currentUser={currentUser}
201
+ onOpen={onOpen}
202
+ onMessageClick={onMessageClick}
203
+ />
204
+ );
205
+ })}
206
+ </div>
207
+ );
208
+ };
package/src/components/InboxMessage/message-widgets/index.ts CHANGED
@@ -1 +1,2 @@
1
1
  export { MessageSliceRenderer } from './MessageSliceRenderer';
2
+ export { SlackLikeMessageGroup } from './SlackLikeMessageGroup';
package/src/container/Inbox.tsx CHANGED
@@ -329,13 +329,13 @@ const Inbox = (props: InboxProps) => {
329
329
 
330
330
  {/* Right Sidebar - Desktop Only */}
331
331
  {pathChannelId && data?.[1] && !isMobileView && (
332
- <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
333
- <RightSidebarWrapper
334
- MessagesLoaderQuery={data?.[1]}
335
- selectedPost={null}
336
- detailSidebarOptions={detailSidebarOptions}
337
- />
338
- </div>
332
+ // <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
333
+ <RightSidebarWrapper
334
+ MessagesLoaderQuery={data?.[1]}
335
+ selectedPost={null}
336
+ detailSidebarOptions={detailSidebarOptions}
337
+ />
338
+ // </div>
339
339
  )}
340
340
  </div>
341
341
  );
@@ -500,14 +500,14 @@ const RightSidebarWrapper = React.memo(({ MessagesLoaderQuery, selectedPost, det
500
500
  if (!sortedMessages.length) return null;
501
501
 
502
502
  return (
503
- <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
504
- <RightSidebar
505
- channelMessages={sortedMessages}
506
- visibility="visible"
507
- selectedPost={selectedPost}
508
- {...detailSidebarOptions}
509
- />
510
- </div>
503
+ // <div className="w-80 xl:w-96 border-l border-gray-200 bg-white flex-shrink-0">
504
+ <RightSidebar
505
+ channelMessages={sortedMessages}
506
+ visibility="visible"
507
+ selectedPost={selectedPost}
508
+ {...detailSidebarOptions}
509
+ />
510
+ // </div>
511
511
  );
512
512
  });
513
513
 
@@ -517,6 +517,9 @@ const MessagesComponent = React.memo((props: any) => {
517
517
  const messageRootListRef = useRef(null);
518
518
  const messageListRef = useRef(null);
519
519
  const apolloClient = useApolloClient();
520
+ const [isLoadingOlder, setIsLoadingOlder] = React.useState(false);
521
+ const isLoadingOlderRef = useRef(false);
522
+ const scrollTimeoutRef = useRef(null);
520
523
 
521
524
  const auth = useSelector(userSelector);
522
525
  const { startUpload } = useUploadFiles();
@@ -533,21 +536,28 @@ const MessagesComponent = React.memo((props: any) => {
533
536
  const totalCount = data?.messages?.totalCount || 0;
534
537
 
535
538
  const scrollToBottom = useCallback(() => {
536
- if (messageListRef?.current && messageRootListRef?.current) {
539
+ if (messageRootListRef?.current) {
537
540
  messageRootListRef.current.scrollTop = messageRootListRef.current.scrollHeight;
538
541
  }
539
542
  }, []);
540
543
 
541
- // Auto-scroll on new messages
544
+ // Auto-scroll on new messages (but not when loading older messages)
542
545
  useEffect(() => {
543
- const timer = setTimeout(() => scrollToBottom(), 100);
544
- return () => clearTimeout(timer);
546
+ if (!isLoadingOlderRef.current) {
547
+ const timer = setTimeout(() => scrollToBottom(), 100);
548
+ return () => clearTimeout(timer);
549
+ }
545
550
  }, [messages.length, scrollToBottom]);
546
551
 
547
552
  const onFetchOld = useCallback(
548
553
  async (skip: number) => {
549
- if (channelId && fetchMoreMessages) {
554
+ if (channelId && fetchMoreMessages && !isLoadingOlder) {
550
555
  try {
556
+ setIsLoadingOlder(true);
557
+ isLoadingOlderRef.current = true;
558
+ // Capture current scroll height before fetching
559
+ const oldScrollHeight = messageRootListRef?.current?.scrollHeight || 0;
560
+
551
561
  await fetchMoreMessages({
552
562
  variables: {
553
563
  channelId: channelId.toString(),
@@ -570,28 +580,119 @@ const MessagesComponent = React.memo((props: any) => {
570
580
  },
571
581
  });
572
582
 
573
- if (messageRootListRef?.current) {
574
- messageRootListRef.current.scrollTop += messageRootListRef.current.clientHeight;
575
- }
583
+ // Maintain scroll position after loading older messages
584
+ setTimeout(() => {
585
+ if (messageRootListRef?.current) {
586
+ const newScrollHeight = messageRootListRef.current.scrollHeight;
587
+ const scrollDiff = newScrollHeight - oldScrollHeight;
588
+ // For normal flex layout, maintain position by adjusting scroll offset
589
+ messageRootListRef.current.scrollTop = scrollDiff;
590
+ }
591
+ // Reset the loading flag after position is maintained
592
+ setTimeout(() => {
593
+ isLoadingOlderRef.current = false;
594
+ }, 50);
595
+ }, 100);
576
596
  } catch (error) {
577
597
  console.error('Error fetching older messages:', error);
598
+ isLoadingOlderRef.current = false;
599
+ } finally {
600
+ setIsLoadingOlder(false);
578
601
  }
579
602
  }
580
603
  },
581
- [channelId, fetchMoreMessages],
604
+ [channelId, fetchMoreMessages, isLoadingOlder],
582
605
  );
583
606
 
607
+ // Scroll to bottom when channel changes
608
+ useEffect(() => {
609
+ if (channelId && messages.length > 0) {
610
+ isLoadingOlderRef.current = false; // Reset flag on channel change
611
+ const timer = setTimeout(() => scrollToBottom(), 200);
612
+ return () => clearTimeout(timer);
613
+ }
614
+ }, [channelId, scrollToBottom]);
615
+
616
+ // Alternative scroll detection for Firefox
617
+ useEffect(() => {
618
+ const element = messageRootListRef.current;
619
+ if (!element) return;
620
+
621
+ // Firefox-specific scroll detection using passive listeners
622
+ const handleScrollEnd = () => {
623
+ if (!isLoadingOlder && element) {
624
+ const { scrollTop } = element;
625
+ const isAtTop = Math.round(scrollTop) <= 30;
626
+ const hasMoreMessages = totalCount > messages.length;
627
+
628
+ if (isAtTop && hasMoreMessages) {
629
+ console.log('ScrollEnd triggered load more (Firefox):', {
630
+ scrollTop: Math.round(scrollTop),
631
+ totalCount,
632
+ messagesLength: messages.length,
633
+ });
634
+ onFetchOld(messages.length);
635
+ }
636
+ }
637
+ };
638
+
639
+ // Use scrollend event if available (modern Firefox/Chrome)
640
+ if ('onscrollend' in element) {
641
+ element.addEventListener('scrollend', handleScrollEnd, { passive: true });
642
+ return () => {
643
+ element.removeEventListener('scrollend', handleScrollEnd);
644
+ };
645
+ }
646
+ }, [totalCount, messages.length, onFetchOld, isLoadingOlder]);
647
+
648
+ // Cleanup scroll timeout on unmount
649
+ useEffect(() => {
650
+ return () => {
651
+ if (scrollTimeoutRef.current) {
652
+ clearTimeout(scrollTimeoutRef.current);
653
+ }
654
+ };
655
+ }, []);
656
+
584
657
  const onMessagesScroll = useCallback(
585
658
  async (e: any) => {
586
- if (messageRootListRef.current) {
587
- const { clientHeight, scrollHeight, scrollTop } = messageRootListRef.current;
659
+ // Throttle scroll events for better performance, especially in Firefox
660
+ if (scrollTimeoutRef.current) {
661
+ clearTimeout(scrollTimeoutRef.current);
662
+ }
588
663
 
589
- if (clientHeight - scrollTop === scrollHeight && totalCount > messages.length) {
590
- await onFetchOld(messages.length);
664
+ scrollTimeoutRef.current = setTimeout(async () => {
665
+ if (messageRootListRef.current && !isLoadingOlder) {
666
+ const element = messageRootListRef.current;
667
+ const { clientHeight, scrollHeight, scrollTop } = element;
668
+
669
+ // Firefox-compatible scroll detection
670
+ // Use Math.ceil to handle Firefox's fractional scrollTop values
671
+ const isAtTop = Math.ceil(scrollTop) <= 25;
672
+ const hasMoreMessages = totalCount > messages.length;
673
+
674
+ // Additional Firefox-specific check
675
+ const isFirefox = navigator.userAgent.includes('Firefox');
676
+ const firefoxAdjustedTop = isFirefox ? Math.round(scrollTop) <= 30 : isAtTop;
677
+
678
+ if ((isAtTop || firefoxAdjustedTop) && hasMoreMessages) {
679
+ console.log('Triggering load more:', {
680
+ scrollTop: Math.ceil(scrollTop),
681
+ originalScrollTop: scrollTop,
682
+ totalCount,
683
+ messagesLength: messages.length,
684
+ scrollHeight,
685
+ clientHeight,
686
+ browser: isFirefox ? 'Firefox' : 'Other',
687
+ isAtTop,
688
+ firefoxAdjustedTop,
689
+ });
690
+ await onFetchOld(messages.length);
691
+ }
591
692
  }
592
- }
693
+ }, 100);
593
694
  },
594
- [totalCount, messages.length, onFetchOld],
695
+ [totalCount, messages.length, onFetchOld, isLoadingOlder],
595
696
  );
596
697
 
597
698
  // Optimistic message sending with Apollo cache updates
@@ -768,11 +869,20 @@ const MessagesComponent = React.memo((props: any) => {
768
869
  <>
769
870
  <div
770
871
  ref={messageRootListRef}
771
- className="flex flex-col-reverse flex-grow flex-shrink overflow-y-auto p-4 px-[10px] md:px-[50px] lg:px-[80px]"
872
+ className="flex flex-col flex-grow flex-shrink overflow-y-auto p-4 px-4 md:px-8 lg:px-12 bg-gray-50"
772
873
  onScroll={onMessagesScroll}
773
874
  >
774
875
  {messages.length > 0 ? (
775
876
  <>
877
+ {/* Loading indicator for older messages at the top */}
878
+ {isLoadingOlder && (
879
+ <div className="flex justify-center py-4">
880
+ <div className="flex items-center space-x-2 text-gray-500">
881
+ <Spinner className="w-4 h-4" />
882
+ <span className="text-sm">Loading older messages...</span>
883
+ </div>
884
+ </div>
885
+ )}
776
886
  <Messages
777
887
  innerRef={messageListRef}
778
888
  channelId={channelId}