@messenger-box/tailwind-ui-inbox 10.0.3-alpha.72 → 10.0.3-alpha.73
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/CHANGELOG.md +4 -0
- package/lib/container/InboxAiMessagesLoader.d.ts.map +1 -1
- package/lib/container/InboxAiMessagesLoader.js +1 -4
- package/lib/container/InboxAiMessagesLoader.js.map +1 -1
- package/lib/container/index.d.ts +4 -4
- package/lib/container/index.d.ts.map +1 -1
- package/lib/index.d.ts +3 -2
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +1 -1
- package/lib/templates/index.d.ts +2 -0
- package/lib/templates/index.d.ts.map +1 -0
- package/lib/templates/index.ts +1 -0
- package/package.json +2 -2
- package/src/container/InboxAiMessagesLoader.tsx +0 -10
- package/src/container/index.ts +12 -6
- package/src/index.ts +12 -1
- package/src/templates/index.ts +1 -0
- package/lib/components/InboxMessage/MessageInputComponent.js +0 -173
- package/lib/components/InboxMessage/MessageInputComponent.js.map +0 -1
- package/lib/components/InboxMessage/MessagesBuilderUi.js +0 -162
- package/lib/components/InboxMessage/MessagesBuilderUi.js.map +0 -1
- package/lib/container/AiInbox.js +0 -1520
- package/lib/container/AiInbox.js.map +0 -1
- package/lib/container/AiInboxWithLoader.js +0 -300
- package/lib/container/AiInboxWithLoader.js.map +0 -1
- package/lib/container/InboxTemplate1.js +0 -1375
- package/lib/container/InboxTemplate1.js.map +0 -1
- package/lib/container/InboxTemplate2.js +0 -1426
- package/lib/container/InboxTemplate2.js.map +0 -1
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.73](https://github.com/CDEBase/messenger-box/compare/v10.0.3-alpha.72...v10.0.3-alpha.73) (2025-08-28)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @messenger-box/tailwind-ui-inbox
|
|
9
|
+
|
|
6
10
|
## [10.0.3-alpha.72](https://github.com/CDEBase/messenger-box/compare/v10.0.3-alpha.71...v10.0.3-alpha.72) (2025-08-28)
|
|
7
11
|
|
|
8
12
|
**Note:** Version bump only for package @messenger-box/tailwind-ui-inbox
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InboxAiMessagesLoader.d.ts","sourceRoot":"","sources":["../../src/container/InboxAiMessagesLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"InboxAiMessagesLoader.d.ts","sourceRoot":"","sources":["../../src/container/InboxAiMessagesLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAQlC,eAAO,MAAM,oBAAoB,WAAY;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;;;;;;;;;;;;;;CAiBC,CAAC;AAEH,UAAU,4BAA4B;IAClC,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;;YAEuC,4BAA4B;;;AAcpE,wBAAmD"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
import React__default from'react';import {useParams,useLocation}from'@remix-run/react';import {RoomType}from'common';import {
|
|
2
|
-
MESSAGES_PER_PAGE
|
|
3
|
-
} = config;
|
|
4
|
-
// Enhanced query parameters generator with better typing and flexibility
|
|
1
|
+
import React__default from'react';import {useParams,useLocation}from'@remix-run/react';import {RoomType}from'common';import {AIAgent}from'../components/AIAgent/AIAgent.js';import {useSelector,shallowEqual}from'react-redux';import {userSelector}from'@adminide-stack/user-auth0-client';// Enhanced query parameters generator with better typing and flexibility
|
|
5
2
|
const queryParamsGenerator = params => ({
|
|
6
3
|
variable1: {
|
|
7
4
|
role: params.role,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InboxAiMessagesLoader.js","sources":["../../src/container/InboxAiMessagesLoader.tsx"],"sourcesContent":[null],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InboxAiMessagesLoader.js","sources":["../../src/container/InboxAiMessagesLoader.tsx"],"sourcesContent":[null],"names":[],"mappings":"4RASA;MACa,oBAAoB,GAAG,MAKnC,KAAI;AACD,EAAA,SAAA,EAAS;QACL,EAAI,MAAQ,CAAA,IAAC;AACb,IAAA,QAAA,EAAA;eACO,CAAA,QAAe;AAClB,MAAA,IAAA,MAAI,CAAA,OAAO,IAAA;AACd,QAAA,OAAA,EAAA,MAAA,CAAA;;;AAGG,IAAA,eAAE,EAAA,MAAA,CAAA,eAAA,GAAA,IAAA,GAAA,KAAA;0BACkB,EAAA,MAAQ,CAAA,eAAA,GAAA;AACzB,MAAA,IAAA,EAAA,QAAA,CAAA;AACH,KAAA,GAAA,SAAW;AACf,IAAA,OAAA,EAAA;AACI,MAAA,UAAA,EAAA;AACH;AACJ;AACJ,CAAA;AAWD,MAAM,uBAAuB,GAAG,KAAC,IAAuC;AACpE,EAAA,MAAA;IACA,cAAe,EAAA;AACf,IAAA,WAAc,EAAA,eAAc;AAC5B,IAAA,eAAe;IACf;MACM,KAAA;AAEN,EAAA,MAAA;AACJ,IAAE,OAAA;AAEF,IAA6B,WAAA,EAAA;AAC7B,GAAA,GAAA,SAAA,EAAA;AAEA,EAAA,MAAA,sBAA0B,EAAA;;;;;;;;;;;;;"}
|
package/lib/container/index.d.ts
CHANGED
|
@@ -5,8 +5,8 @@ import ThreadMessages from './ThreadMessages';
|
|
|
5
5
|
import ServiceInbox from './ServiceInbox';
|
|
6
6
|
import { ThreadsInbox } from './ThreadsInbox';
|
|
7
7
|
import { ThreadMessagesInbox } from './ThreadMessagesInbox';
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
export { Inbox, ThreadsInbox, ThreadMessagesInbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader,
|
|
8
|
+
import InboxWithAiLoader from './InboxWithAiLoader';
|
|
9
|
+
import InboxAiMessagesLoader from './InboxAiMessagesLoader';
|
|
10
|
+
import InboxContainer from './InboxContainer';
|
|
11
|
+
export { Inbox, ThreadsInbox, ThreadMessagesInbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader, InboxWithAiLoader, InboxAiMessagesLoader, InboxContainer, };
|
|
12
12
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/container/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,OAAO,MAAM,WAAW,CAAC;AAChC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/container/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,OAAO,MAAM,WAAW,CAAC;AAChC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AACpD,OAAO,qBAAqB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,OAAO,EACH,KAAK,EACL,YAAY,EACZ,mBAAmB,EACnB,OAAO,EACP,cAAc,EACd,YAAY,EACZ,eAAe,EAIf,iBAAiB,EACjB,qBAAqB,EACrB,cAAc,GACjB,CAAC"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
export { default } from './module';
|
|
2
2
|
export { ChatMessageFill } from './module';
|
|
3
|
-
export { Inbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader } from './container';
|
|
4
|
-
export { MessageSliceRenderer, Messages, Popover, MessageInput, CommonMessage, UploadImageButton, MessageItem, LeftSidebar, FilesList, ConversationItem, UserModalContent, ServiceInboxItem, } from './components';
|
|
3
|
+
export { Inbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader, InboxWithAiLoader, InboxAiMessagesLoader, InboxContainer, } from './container';
|
|
4
|
+
export { MessageSliceRenderer, Messages, Popover, MessageInput, CommonMessage, UploadImageButton, MessageItem, LeftSidebar, FilesList, ConversationItem, UserModalContent, ServiceInboxItem, AIAgent, } from './components';
|
|
5
|
+
export { InboxWithAi } from './templates';
|
|
5
6
|
export type { CardMessageAttachmentsInterface, AlertMessageAttachmentsInterface } from './interfaces';
|
|
6
7
|
export * from './enums';
|
|
7
8
|
//# sourceMappingURL=index.d.ts.map
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EACH,KAAK,EACL,OAAO,EACP,cAAc,EACd,YAAY,EACZ,eAAe,EACf,iBAAiB,EACjB,qBAAqB,EACrB,cAAc,GACjB,MAAM,aAAa,CAAC;AACrB,OAAO,EACH,oBAAoB,EACpB,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,aAAa,EACb,iBAAiB,EACjB,WAAW,EACX,WAAW,EACX,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,OAAO,GACV,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,YAAY,EAAE,+BAA+B,EAAE,gCAAgC,EAAE,MAAM,cAAc,CAAC;AACtG,cAAc,SAAS,CAAC"}
|
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';
|
|
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{default as InboxWithAiLoader}from'./container/InboxWithAiLoader.js';export{default as InboxAiMessagesLoader}from'./container/InboxAiMessagesLoader.js';export{default as InboxContainer}from'./container/InboxContainer.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'react-i18next';import'./config/env-config.js';import'@messenger-box/core';export{ChatMessageFill}from'./components/slot-fill/chat-message-filler.js';export{AIAgent}from'./components/AIAgent/AIAgent.js';export{default as InboxWithAi}from'./templates/InboxWithAi.js';//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/templates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as InboxWithAi } from './InboxWithAi';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@messenger-box/tailwind-ui-inbox",
|
|
3
|
-
"version": "10.0.3-alpha.
|
|
3
|
+
"version": "10.0.3-alpha.73",
|
|
4
4
|
"description": "Inbox UI components built with TailwindCSS",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"author": "CDMBase LLC",
|
|
@@ -55,5 +55,5 @@
|
|
|
55
55
|
"typescript": {
|
|
56
56
|
"definition": "lib/index.d.ts"
|
|
57
57
|
},
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "984014e52eb95de9e208b81f92c92c86b9f949e3"
|
|
59
59
|
}
|
|
@@ -1,22 +1,12 @@
|
|
|
1
1
|
import React, { useMemo, useCallback } from 'react';
|
|
2
2
|
import { useParams, useLocation } from '@remix-run/react';
|
|
3
|
-
import {
|
|
4
|
-
useGetChannelsByUserQuery,
|
|
5
|
-
useGetChannelsByUserWithLastMessageQuery,
|
|
6
|
-
useMessagesQuery,
|
|
7
|
-
useViewChannelDetailQuery,
|
|
8
|
-
} from 'common/graphql';
|
|
9
3
|
import { RoomType } from 'common';
|
|
10
4
|
import { config } from '../config';
|
|
11
|
-
import Inbox from '../templates/InboxWithAi';
|
|
12
|
-
import { InputComponent } from '../components/InboxMessage';
|
|
13
5
|
import { AIAgent } from '../components/AIAgent';
|
|
14
6
|
import { useSelector, shallowEqual } from 'react-redux';
|
|
15
7
|
import { Store, userSelector } from '@adminide-stack/user-auth0-client';
|
|
16
8
|
import { IUserState } from '@adminide-stack/core';
|
|
17
9
|
|
|
18
|
-
const { MESSAGES_PER_PAGE } = config;
|
|
19
|
-
|
|
20
10
|
// Enhanced query parameters generator with better typing and flexibility
|
|
21
11
|
export const queryParamsGenerator = (params: {
|
|
22
12
|
role?: string;
|
package/src/container/index.ts
CHANGED
|
@@ -5,9 +5,12 @@ import ThreadMessages from './ThreadMessages';
|
|
|
5
5
|
import ServiceInbox from './ServiceInbox';
|
|
6
6
|
import { ThreadsInbox } from './ThreadsInbox';
|
|
7
7
|
import { ThreadMessagesInbox } from './ThreadMessagesInbox';
|
|
8
|
-
import AiInboxWithLoader from './AiInboxWithLoader';
|
|
9
|
-
import AiInbox from './AiInbox';
|
|
10
|
-
import InboxTemplate1 from './InboxTemplate1';
|
|
8
|
+
////import AiInboxWithLoader from './AiInboxWithLoader';
|
|
9
|
+
//import AiInbox from './AiInbox';
|
|
10
|
+
//import InboxTemplate1 from './InboxTemplate1';
|
|
11
|
+
import InboxWithAiLoader from './InboxWithAiLoader';
|
|
12
|
+
import InboxAiMessagesLoader from './InboxAiMessagesLoader';
|
|
13
|
+
import InboxContainer from './InboxContainer';
|
|
11
14
|
|
|
12
15
|
export {
|
|
13
16
|
Inbox,
|
|
@@ -17,7 +20,10 @@ export {
|
|
|
17
20
|
ThreadMessages,
|
|
18
21
|
ServiceInbox,
|
|
19
22
|
InboxWithLoader,
|
|
20
|
-
AiInboxWithLoader,
|
|
21
|
-
AiInbox,
|
|
22
|
-
InboxTemplate1,
|
|
23
|
+
// AiInboxWithLoader,
|
|
24
|
+
// AiInbox,
|
|
25
|
+
// InboxTemplate1,
|
|
26
|
+
InboxWithAiLoader,
|
|
27
|
+
InboxAiMessagesLoader,
|
|
28
|
+
InboxContainer,
|
|
23
29
|
};
|
package/src/index.ts
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
export { default } from './module';
|
|
2
2
|
export { ChatMessageFill } from './module';
|
|
3
|
-
export {
|
|
3
|
+
export {
|
|
4
|
+
Inbox,
|
|
5
|
+
Threads,
|
|
6
|
+
ThreadMessages,
|
|
7
|
+
ServiceInbox,
|
|
8
|
+
InboxWithLoader,
|
|
9
|
+
InboxWithAiLoader,
|
|
10
|
+
InboxAiMessagesLoader,
|
|
11
|
+
InboxContainer,
|
|
12
|
+
} from './container';
|
|
4
13
|
export {
|
|
5
14
|
MessageSliceRenderer,
|
|
6
15
|
Messages,
|
|
@@ -14,6 +23,8 @@ export {
|
|
|
14
23
|
ConversationItem,
|
|
15
24
|
UserModalContent,
|
|
16
25
|
ServiceInboxItem,
|
|
26
|
+
AIAgent,
|
|
17
27
|
} from './components';
|
|
28
|
+
export { InboxWithAi } from './templates';
|
|
18
29
|
export type { CardMessageAttachmentsInterface, AlertMessageAttachmentsInterface } from './interfaces';
|
|
19
30
|
export * from './enums';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as InboxWithAi } from './InboxWithAi';
|
|
@@ -1,173 +0,0 @@
|
|
|
1
|
-
import React__default,{useState,useRef,useEffect,useCallback,useMemo}from'react';import {useTranslation}from'react-i18next';import {config}from'../../config/env-config.js';import {UploadImageButton}from'./UploadImageButton.js';import {FilesList}from'../inbox/FilesList.js';import'../inbox/MessageItem.js';import'../inbox/ThreadItem.js';const MessageInputComponent = ({
|
|
2
|
-
handleSend: handleSendProp,
|
|
3
|
-
placeholder
|
|
4
|
-
}) => {
|
|
5
|
-
const [message, setMessage] = useState('');
|
|
6
|
-
const [sending, setSending] = useState(false);
|
|
7
|
-
const [files, setFiles] = useState([]);
|
|
8
|
-
const [showToast, setShowToast] = useState(false);
|
|
9
|
-
const [toastMessage, setToastMessage] = useState('');
|
|
10
|
-
const [isFocused, setIsFocused] = useState(false);
|
|
11
|
-
const textareaRef = useRef(null);
|
|
12
|
-
const {
|
|
13
|
-
t
|
|
14
|
-
} = useTranslation('translations');
|
|
15
|
-
// Auto-focus the textarea when component mounts
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
if (textareaRef.current) {
|
|
18
|
-
textareaRef.current.focus();
|
|
19
|
-
}
|
|
20
|
-
}, []);
|
|
21
|
-
const showToastMessage = useCallback(message => {
|
|
22
|
-
setToastMessage(message);
|
|
23
|
-
setShowToast(true);
|
|
24
|
-
setTimeout(() => setShowToast(false), 3000);
|
|
25
|
-
}, []);
|
|
26
|
-
const handleSend = useCallback(() => {
|
|
27
|
-
if (!message.trim() && files.length === 0) return;
|
|
28
|
-
setSending(true);
|
|
29
|
-
handleSendProp(message, files).then(() => {
|
|
30
|
-
setMessage('');
|
|
31
|
-
setFiles([]);
|
|
32
|
-
// Auto-focus the textarea after sending a message
|
|
33
|
-
setTimeout(() => {
|
|
34
|
-
if (textareaRef.current) {
|
|
35
|
-
textareaRef.current.focus();
|
|
36
|
-
}
|
|
37
|
-
}, 100);
|
|
38
|
-
}).finally(() => setSending(false));
|
|
39
|
-
}, [files, handleSendProp, message]);
|
|
40
|
-
const handleKeyDown = useCallback(e => {
|
|
41
|
-
const keyCode = e.which || e.keyCode;
|
|
42
|
-
if (keyCode == 13 && !e.shiftKey) {
|
|
43
|
-
e.preventDefault();
|
|
44
|
-
handleSend();
|
|
45
|
-
}
|
|
46
|
-
}, [handleSend]);
|
|
47
|
-
const inputHeight = useMemo(() => {
|
|
48
|
-
const lines = message.split('\n').length;
|
|
49
|
-
return Math.max(48, Math.min(120, 48 + (lines - 1) * 20));
|
|
50
|
-
}, [message]);
|
|
51
|
-
const onUploadImageChange = useCallback(({
|
|
52
|
-
target
|
|
53
|
-
}) => {
|
|
54
|
-
let fileList = [];
|
|
55
|
-
let index = 0;
|
|
56
|
-
if (files.length + target.files.length > config.FILES_PER_MESSAGE) {
|
|
57
|
-
showToastMessage(t('tailwind_ui_inbox.you_can_not_upload_more_than_files', {
|
|
58
|
-
files_per_message: config.FILES_PER_MESSAGE
|
|
59
|
-
}));
|
|
60
|
-
return;
|
|
61
|
-
}
|
|
62
|
-
while (target.files[index]) {
|
|
63
|
-
fileList.push(target.files[index]);
|
|
64
|
-
index += 1;
|
|
65
|
-
}
|
|
66
|
-
setFiles(oldFiles => [...oldFiles, ...fileList]);
|
|
67
|
-
}, [setFiles, files, showToastMessage, t]);
|
|
68
|
-
const canSend = message.trim() || files.length > 0;
|
|
69
|
-
const hasContent = message.trim().length > 0;
|
|
70
|
-
return React__default.createElement("div", {
|
|
71
|
-
className: "bg-white"
|
|
72
|
-
}, showToast && React__default.createElement("div", {
|
|
73
|
-
className: "fixed top-4 right-4 z-50 bg-orange-50 border border-orange-200 text-orange-800 px-4 py-3 rounded-lg shadow-lg animate-bounce"
|
|
74
|
-
}, React__default.createElement("div", {
|
|
75
|
-
className: "flex items-center"
|
|
76
|
-
}, React__default.createElement("svg", {
|
|
77
|
-
className: "w-5 h-5 mr-2",
|
|
78
|
-
fill: "currentColor",
|
|
79
|
-
viewBox: "0 0 20 20"
|
|
80
|
-
}, React__default.createElement("path", {
|
|
81
|
-
fillRule: "evenodd",
|
|
82
|
-
d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
|
|
83
|
-
clipRule: "evenodd"
|
|
84
|
-
})), toastMessage)), files?.length > 0 && !sending && React__default.createElement("div", {
|
|
85
|
-
className: "px-4 py-3 border-b border-gray-100 animate-fade-in"
|
|
86
|
-
}, React__default.createElement(FilesList, {
|
|
87
|
-
files: files
|
|
88
|
-
})), React__default.createElement("div", {
|
|
89
|
-
className: "p-4"
|
|
90
|
-
}, React__default.createElement("div", {
|
|
91
|
-
className: `relative border-2 transition-all duration-200 ease-in-out ${hasContent || isFocused ? 'rounded-2xl border-gray-300 bg-white' : 'rounded-2xl border-gray-300 bg-white'} ${isFocused ? 'border-blue-500' : ''}`
|
|
92
|
-
}, React__default.createElement("div", {
|
|
93
|
-
className: "absolute left-4 top-1/2 transform -translate-y-1/2 z-10"
|
|
94
|
-
}, hasContent || isFocused ? React__default.createElement(UploadImageButton, {
|
|
95
|
-
onChange: onUploadImageChange
|
|
96
|
-
}) : React__default.createElement("svg", {
|
|
97
|
-
className: "w-5 h-5 text-gray-400",
|
|
98
|
-
fill: "none",
|
|
99
|
-
stroke: "currentColor",
|
|
100
|
-
viewBox: "0 0 24 24"
|
|
101
|
-
}, React__default.createElement("path", {
|
|
102
|
-
strokeLinecap: "round",
|
|
103
|
-
strokeLinejoin: "round",
|
|
104
|
-
strokeWidth: 2,
|
|
105
|
-
d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
|
|
106
|
-
}))), React__default.createElement("textarea", {
|
|
107
|
-
ref: textareaRef,
|
|
108
|
-
className: `w-full text-base bg-transparent border-none resize-none overflow-hidden text-gray-900 focus:outline-none focus:ring-0 scrollbar-thin scrollbar-thumb-gray-300 scrollbar-track-transparent ${hasContent || isFocused ? 'pl-14 pr-20 py-3 placeholder-gray-500' : 'pl-12 pr-12 py-3 placeholder-gray-600'}`,
|
|
109
|
-
style: {
|
|
110
|
-
height: hasContent || isFocused ? `${inputHeight}px` : '48px',
|
|
111
|
-
minHeight: '48px',
|
|
112
|
-
maxHeight: '120px'
|
|
113
|
-
},
|
|
114
|
-
placeholder: placeholder || 'Message',
|
|
115
|
-
value: sending ? '' : message,
|
|
116
|
-
onKeyDown: handleKeyDown,
|
|
117
|
-
onChange: e => setMessage(e.target.value),
|
|
118
|
-
onFocus: () => setIsFocused(true),
|
|
119
|
-
onBlur: () => setIsFocused(false),
|
|
120
|
-
disabled: sending,
|
|
121
|
-
rows: 1
|
|
122
|
-
}), React__default.createElement("div", {
|
|
123
|
-
className: "absolute right-3 top-1/2 transform -translate-y-1/2 flex items-center gap-2"
|
|
124
|
-
}, hasContent && React__default.createElement("span", {
|
|
125
|
-
className: "text-sm text-gray-500"
|
|
126
|
-
}, message.length, "/10000"), hasContent || isFocused ? (/* Send button when typing */
|
|
127
|
-
React__default.createElement("button", {
|
|
128
|
-
className: `w-10 h-10 rounded-xl flex items-center justify-center transition-all duration-200 ease-in-out ${canSend && !sending ? 'bg-gray-900 hover:bg-gray-800 text-white shadow-md hover:shadow-lg' : 'bg-gray-200 text-gray-400 cursor-not-allowed'}`,
|
|
129
|
-
onClick: handleSend,
|
|
130
|
-
disabled: !canSend || sending,
|
|
131
|
-
type: "button"
|
|
132
|
-
}, sending ? React__default.createElement("svg", {
|
|
133
|
-
className: "w-5 h-5 animate-spin",
|
|
134
|
-
fill: "none",
|
|
135
|
-
viewBox: "0 0 24 24"
|
|
136
|
-
}, React__default.createElement("circle", {
|
|
137
|
-
className: "opacity-25",
|
|
138
|
-
cx: "12",
|
|
139
|
-
cy: "12",
|
|
140
|
-
r: "10",
|
|
141
|
-
stroke: "currentColor",
|
|
142
|
-
strokeWidth: "4"
|
|
143
|
-
}), React__default.createElement("path", {
|
|
144
|
-
className: "opacity-75",
|
|
145
|
-
fill: "currentColor",
|
|
146
|
-
d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
|
147
|
-
})) : React__default.createElement("svg", {
|
|
148
|
-
className: "w-5 h-5",
|
|
149
|
-
fill: "none",
|
|
150
|
-
stroke: "currentColor",
|
|
151
|
-
viewBox: "0 0 24 24"
|
|
152
|
-
}, React__default.createElement("path", {
|
|
153
|
-
strokeLinecap: "round",
|
|
154
|
-
strokeLinejoin: "round",
|
|
155
|
-
strokeWidth: 2,
|
|
156
|
-
d: "M12 19l9 2-9-18-9 18 9-2zm0 0v-8"
|
|
157
|
-
})))) : (/* Warning/Info icon when empty */
|
|
158
|
-
React__default.createElement("svg", {
|
|
159
|
-
className: "w-5 h-5 text-gray-400",
|
|
160
|
-
fill: "none",
|
|
161
|
-
stroke: "currentColor",
|
|
162
|
-
viewBox: "0 0 24 24"
|
|
163
|
-
}, React__default.createElement("path", {
|
|
164
|
-
strokeLinecap: "round",
|
|
165
|
-
strokeLinejoin: "round",
|
|
166
|
-
strokeWidth: 2,
|
|
167
|
-
d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z"
|
|
168
|
-
}))))), React__default.createElement("div", {
|
|
169
|
-
className: "mt-2 px-1"
|
|
170
|
-
}, React__default.createElement("span", {
|
|
171
|
-
className: "text-xs text-gray-400"
|
|
172
|
-
}, "Press Enter to send, Shift+Enter for new line"))));
|
|
173
|
-
};export{MessageInputComponent};//# sourceMappingURL=MessageInputComponent.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MessageInputComponent.js","sources":["../../../src/components/InboxMessage/MessageInputComponent.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
|
|
@@ -1,162 +0,0 @@
|
|
|
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 {ModernMessageGroupComponent}from'./message-widgets/ModernMessageGroup.js';const MessagesBuilderUi = ({
|
|
2
|
-
currentUser,
|
|
3
|
-
channelMessages,
|
|
4
|
-
refetchMessages,
|
|
5
|
-
innerRef,
|
|
6
|
-
channelId,
|
|
7
|
-
subscribeToNewMessages,
|
|
8
|
-
subscribeToNewServiceMessages,
|
|
9
|
-
onMessageClick,
|
|
10
|
-
isDesktopView = false,
|
|
11
|
-
isSmallScreen = false
|
|
12
|
-
}) => {
|
|
13
|
-
const [isOpen, setIsOpen] = useState(false);
|
|
14
|
-
const [selectedElement, setSelectedElement] = useState(null);
|
|
15
|
-
const {
|
|
16
|
-
t
|
|
17
|
-
} = useTranslation('translations');
|
|
18
|
-
const onOpen = element => {
|
|
19
|
-
setSelectedElement(element);
|
|
20
|
-
setIsOpen(true);
|
|
21
|
-
};
|
|
22
|
-
const onClose = () => {
|
|
23
|
-
setIsOpen(false);
|
|
24
|
-
setSelectedElement(null);
|
|
25
|
-
};
|
|
26
|
-
useEffect(() => {
|
|
27
|
-
subscribeToNewMessages?.();
|
|
28
|
-
subscribeToNewServiceMessages?.();
|
|
29
|
-
}, [channelId]);
|
|
30
|
-
useRef(null);
|
|
31
|
-
React__default.useCallback(() => {
|
|
32
|
-
if (innerRef.current) innerRef.current?.querySelector(':scope > :last-child')?.scrollIntoView({
|
|
33
|
-
behavior: 'smooth',
|
|
34
|
-
inline: 'start'
|
|
35
|
-
});
|
|
36
|
-
}, [innerRef]);
|
|
37
|
-
React__default.useEffect(() => {
|
|
38
|
-
if (channelMessages?.length) ;
|
|
39
|
-
}, [channelMessages]);
|
|
40
|
-
const messageListWithDates = useMemo(() => {
|
|
41
|
-
let currentDate = '';
|
|
42
|
-
let res = [];
|
|
43
|
-
// Add original messages
|
|
44
|
-
channelMessages?.map(msg => {
|
|
45
|
-
const date = new Date(msg.createdAt);
|
|
46
|
-
let msgDate;
|
|
47
|
-
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');
|
|
48
|
-
if (msgDate !== currentDate) {
|
|
49
|
-
res.push({
|
|
50
|
-
type: 'date',
|
|
51
|
-
content: msgDate
|
|
52
|
-
});
|
|
53
|
-
currentDate = msgDate;
|
|
54
|
-
}
|
|
55
|
-
res.push(msg);
|
|
56
|
-
});
|
|
57
|
-
// Add dummy messages at the end if we have existing messages
|
|
58
|
-
if (channelMessages && channelMessages.length > 0) {
|
|
59
|
-
// Add today's date if not already added
|
|
60
|
-
const todayLabel = t('tailwind_ui_inbox.today');
|
|
61
|
-
if (currentDate !== todayLabel) {
|
|
62
|
-
res.push({
|
|
63
|
-
type: 'date',
|
|
64
|
-
content: todayLabel
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
// dummyMessages.forEach(msg => res.push(msg));
|
|
68
|
-
}
|
|
69
|
-
return res;
|
|
70
|
-
}, [channelMessages, t]);
|
|
71
|
-
// Group messages by date sections for Slack-like rendering
|
|
72
|
-
const messagesByDate = useMemo(() => {
|
|
73
|
-
const sections = [];
|
|
74
|
-
let currentSection = {
|
|
75
|
-
date: null,
|
|
76
|
-
messages: []
|
|
77
|
-
};
|
|
78
|
-
messageListWithDates.forEach(item => {
|
|
79
|
-
if (item?.type === 'date') {
|
|
80
|
-
if (currentSection.messages.length > 0) {
|
|
81
|
-
sections.push(currentSection);
|
|
82
|
-
}
|
|
83
|
-
currentSection = {
|
|
84
|
-
date: item.content,
|
|
85
|
-
messages: []
|
|
86
|
-
};
|
|
87
|
-
} else {
|
|
88
|
-
currentSection.messages.push(item);
|
|
89
|
-
}
|
|
90
|
-
});
|
|
91
|
-
if (currentSection.messages.length > 0) {
|
|
92
|
-
sections.push(currentSection);
|
|
93
|
-
}
|
|
94
|
-
return sections;
|
|
95
|
-
}, [messageListWithDates]);
|
|
96
|
-
return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
|
97
|
-
className: `w-full pb-4 pt-2 ${isDesktopView ? 'space-y-3 max-w-full mx-auto' : isSmallScreen ? 'space-y-2' : 'space-y-2'}`,
|
|
98
|
-
ref: innerRef
|
|
99
|
-
}, messagesByDate?.map((section, sectionIndex) => React__default.createElement("div", {
|
|
100
|
-
key: `section-${sectionIndex}`,
|
|
101
|
-
className: "w-full"
|
|
102
|
-
}, section.date && React__default.createElement("div", {
|
|
103
|
-
className: "flex items-center justify-center my-3"
|
|
104
|
-
}, React__default.createElement("div", {
|
|
105
|
-
className: "flex-grow border-t border-gray-200"
|
|
106
|
-
}), React__default.createElement("div", {
|
|
107
|
-
className: "mx-4 px-3 py-1 bg-white border border-gray-200 rounded-full text-xs font-medium text-gray-600"
|
|
108
|
-
}, section.date), React__default.createElement("div", {
|
|
109
|
-
className: "flex-grow border-t border-gray-200"
|
|
110
|
-
})), React__default.createElement("div", {
|
|
111
|
-
className: `${isDesktopView ? 'mb-2' : 'mb-1'}`
|
|
112
|
-
}, React__default.createElement(ModernMessageGroupComponent, {
|
|
113
|
-
messages: section.messages,
|
|
114
|
-
currentUser: currentUser,
|
|
115
|
-
onOpen: onOpen,
|
|
116
|
-
onMessageClick: onMessageClick,
|
|
117
|
-
isDesktopView: isDesktopView,
|
|
118
|
-
isSmallScreen: isSmallScreen
|
|
119
|
-
}))))), React__default.createElement(ChatModal, {
|
|
120
|
-
element: selectedElement,
|
|
121
|
-
isOpen: isOpen,
|
|
122
|
-
onClose: onClose
|
|
123
|
-
}));
|
|
124
|
-
};
|
|
125
|
-
const ChatModal = ({
|
|
126
|
-
element,
|
|
127
|
-
isOpen,
|
|
128
|
-
onClose
|
|
129
|
-
}) => {
|
|
130
|
-
if (!isOpen) return null;
|
|
131
|
-
return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
|
132
|
-
className: "fixed inset-0 bg-black bg-opacity-50 z-40",
|
|
133
|
-
onClick: onClose
|
|
134
|
-
}), React__default.createElement("div", {
|
|
135
|
-
className: "fixed z-50 left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2"
|
|
136
|
-
}, React__default.createElement("div", {
|
|
137
|
-
className: "bg-white w-[1036px] h-[700px] rounded-lg shadow-xl",
|
|
138
|
-
style: {
|
|
139
|
-
boxShadow: '0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)'
|
|
140
|
-
}
|
|
141
|
-
}, React__default.createElement("div", {
|
|
142
|
-
className: "flex justify-between border-b border-gray-300 pb-4 pt-4"
|
|
143
|
-
}, React__default.createElement("button", {
|
|
144
|
-
onClick: onClose,
|
|
145
|
-
className: "w-8 ml-3 text-black hover:text-black focus:outline-none"
|
|
146
|
-
}, React__default.createElement("svg", {
|
|
147
|
-
className: "w-6 h-6",
|
|
148
|
-
fill: "none",
|
|
149
|
-
stroke: "currentColor",
|
|
150
|
-
viewBox: "0 0 24 24"
|
|
151
|
-
}, React__default.createElement("path", {
|
|
152
|
-
strokeLinecap: "round",
|
|
153
|
-
strokeLinejoin: "round",
|
|
154
|
-
strokeWidth: 2,
|
|
155
|
-
d: "M6 18L18 6M6 6l12 12"
|
|
156
|
-
})))), React__default.createElement("div", {
|
|
157
|
-
className: "p-4"
|
|
158
|
-
}, React__default.createElement(UserModalContent, {
|
|
159
|
-
username: element?.author?.username,
|
|
160
|
-
image: element?.imageUrl ? element.imageUrl : ''
|
|
161
|
-
})))));
|
|
162
|
-
};export{MessagesBuilderUi};//# sourceMappingURL=MessagesBuilderUi.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MessagesBuilderUi.js","sources":["../../../src/components/InboxMessage/MessagesBuilderUi.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}
|