@servicetitan/titan-chat-ui-anvil2 7.1.2 → 8.0.0
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 +13 -0
- package/dist/components/chat/__tests-cy__/chat-error.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-error.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-input-file.test.js +5 -2
- package/dist/components/chat/__tests-cy__/chat-input-file.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-input.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-input.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-log.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-log.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-messages.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-messages.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-notifications.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-notifications.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat-timer.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat-timer.test.js.map +1 -1
- package/dist/components/chat/__tests-cy__/chat.test.js +2 -1
- package/dist/components/chat/__tests-cy__/chat.test.js.map +1 -1
- package/dist/components/chat/chat-connecting.js +21 -2
- package/dist/components/chat/chat-connecting.js.map +1 -1
- package/dist/components/chat/chat-error.js +30 -4
- package/dist/components/chat/chat-error.js.map +1 -1
- package/dist/components/chat/chat-input-file.js +94 -10
- package/dist/components/chat/chat-input-file.js.map +1 -1
- package/dist/components/chat/chat-input.js +104 -41
- package/dist/components/chat/chat-input.js.map +1 -1
- package/dist/components/chat/chat-input.module.less +1 -3
- package/dist/components/chat/chat-input.module.less.d.ts +4 -0
- package/dist/components/chat/chat-log.js +16 -4
- package/dist/components/chat/chat-log.js.map +1 -1
- package/dist/components/chat/chat-message-template-agent.js +15 -4
- package/dist/components/chat/chat-message-template-agent.js.map +1 -1
- package/dist/components/chat/chat-message-template-user.js +35 -4
- package/dist/components/chat/chat-message-template-user.js.map +1 -1
- package/dist/components/chat/chat-message-typing.js +9 -5
- package/dist/components/chat/chat-message-typing.js.map +1 -1
- package/dist/components/chat/chat-message.js +34 -22
- package/dist/components/chat/chat-message.js.map +1 -1
- package/dist/components/chat/chat-messages.js +46 -25
- package/dist/components/chat/chat-messages.js.map +1 -1
- package/dist/components/chat/chat-notifications.js +12 -2
- package/dist/components/chat/chat-notifications.js.map +1 -1
- package/dist/components/chat/chat-timer.js +35 -6
- package/dist/components/chat/chat-timer.js.map +1 -1
- package/dist/components/chat/chat.js +51 -9
- package/dist/components/chat/chat.js.map +1 -1
- package/dist/components/chat/chat.module.less.d.ts +4 -0
- package/dist/components/common/markdown-text.js +94 -31
- package/dist/components/common/markdown-text.js.map +1 -1
- package/dist/components/common/markdown-text.module.less +2 -4
- package/dist/components/common/markdown-text.module.less.d.ts +3 -0
- package/dist/components/common/multiline-text.js +17 -5
- package/dist/components/common/multiline-text.js.map +1 -1
- package/dist/components/common/multiline-text.module.less +2 -4
- package/dist/components/common/multiline-text.module.less.d.ts +3 -0
- package/dist/components/message-content/__tests-cy__/message-content-file.test.js +5 -2
- package/dist/components/message-content/__tests-cy__/message-content-file.test.js.map +1 -1
- package/dist/components/message-content/__tests-cy__/message-content-text.test.js +2 -1
- package/dist/components/message-content/__tests-cy__/message-content-text.test.js.map +1 -1
- package/dist/components/message-content/message-content-file.js +36 -3
- package/dist/components/message-content/message-content-file.js.map +1 -1
- package/dist/components/message-content/message-content-text.js +15 -4
- package/dist/components/message-content/message-content-text.js.map +1 -1
- package/dist/components/messages/__tests-cy__/message-agent.test.js +6 -3
- package/dist/components/messages/__tests-cy__/message-agent.test.js.map +1 -1
- package/dist/components/messages/__tests-cy__/message-system.test.js +6 -3
- package/dist/components/messages/__tests-cy__/message-system.test.js.map +1 -1
- package/dist/components/messages/__tests-cy__/message-timeout.test.js +2 -1
- package/dist/components/messages/__tests-cy__/message-timeout.test.js.map +1 -1
- package/dist/components/messages/__tests-cy__/message-typing.test.js +2 -1
- package/dist/components/messages/__tests-cy__/message-typing.test.js.map +1 -1
- package/dist/components/messages/__tests-cy__/message-user.test.js +2 -1
- package/dist/components/messages/__tests-cy__/message-user.test.js.map +1 -1
- package/dist/components/messages/message-agent.js +38 -8
- package/dist/components/messages/message-agent.js.map +1 -1
- package/dist/components/messages/message-agent.module.less +11 -12
- package/dist/components/messages/message-agent.module.less.d.ts +8 -0
- package/dist/components/messages/message-avatar.js +17 -5
- package/dist/components/messages/message-avatar.js.map +1 -1
- package/dist/components/messages/message-avatar.module.less +10 -12
- package/dist/components/messages/message-avatar.module.less.d.ts +6 -0
- package/dist/components/messages/message-footer.js +10 -2
- package/dist/components/messages/message-footer.js.map +1 -1
- package/dist/components/messages/message-system.js +17 -6
- package/dist/components/messages/message-system.js.map +1 -1
- package/dist/components/messages/message-system.module.less +6 -5
- package/dist/components/messages/message-system.module.less.d.ts +5 -0
- package/dist/components/messages/message-timeout.js +47 -6
- package/dist/components/messages/message-timeout.js.map +1 -1
- package/dist/components/messages/message-timeout.module.less.d.ts +3 -0
- package/dist/components/messages/message-typing.js +25 -1
- package/dist/components/messages/message-typing.js.map +1 -1
- package/dist/components/messages/message-typing.module.less +3 -5
- package/dist/components/messages/message-typing.module.less.d.ts +6 -0
- package/dist/components/messages/message-user.js +27 -4
- package/dist/components/messages/message-user.js.map +1 -1
- package/dist/components/messages/message-user.module.less +9 -10
- package/dist/components/messages/message-user.module.less.d.ts +7 -0
- package/dist/components/messages/use-avatar-props.js +8 -6
- package/dist/components/messages/use-avatar-props.js.map +1 -1
- package/dist/index.d.ts +16 -8
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/stores/__tests__/chat-input.store.test.js +5 -4
- package/dist/stores/__tests__/chat-input.store.test.js.map +1 -1
- package/dist/stores/chat-input.store.js +33 -27
- package/dist/stores/chat-input.store.js.map +1 -1
- package/package.json +6 -6
- package/src/components/chat/chat-input.module.less +1 -3
- package/src/components/common/markdown-text.module.less +2 -4
- package/src/components/common/multiline-text.module.less +2 -4
- package/src/components/messages/message-agent.module.less +11 -12
- package/src/components/messages/message-avatar.module.less +10 -12
- package/src/components/messages/message-system.module.less +6 -5
- package/src/components/messages/message-typing.module.less +3 -5
- package/src/components/messages/message-user.module.less +9 -10
- package/src/index.ts +16 -8
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
# v8.0.0 (Wed Jun 03 2026)
|
|
2
|
+
|
|
3
|
+
#### 💥 Breaking Change
|
|
4
|
+
|
|
5
|
+
- SPA-8584: Upgrade Platform Packages in Titan Chatbot UI [#90](https://github.com/servicetitan/titan-chatbot-client/pull/90) ([@AlexYarmolchuk](https://github.com/AlexYarmolchuk) [@Copilot](https://github.com/Copilot))
|
|
6
|
+
|
|
7
|
+
#### Authors: 2
|
|
8
|
+
|
|
9
|
+
- [@Copilot](https://github.com/Copilot)
|
|
10
|
+
- Alexandr Yarmolchuk ([@AlexYarmolchuk](https://github.com/AlexYarmolchuk))
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
1
14
|
# v6.1.1 (Wed May 06 2026)
|
|
2
15
|
|
|
3
16
|
#### ⚠️ Pushed to `master`
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { runChatErrorSharedTests } from '@servicetitan/cypress-shared';
|
|
2
2
|
import { ChatError } from '../chat-error';
|
|
3
|
-
describe('ChatError', ()
|
|
3
|
+
describe('ChatError', ()=>{
|
|
4
4
|
runChatErrorSharedTests(ChatError);
|
|
5
5
|
});
|
|
6
|
+
|
|
6
7
|
//# sourceMappingURL=chat-error.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-error.test.tsx"],"sourcesContent":["import { runChatErrorSharedTests } from '@servicetitan/cypress-shared';\nimport { ChatError } from '../chat-error';\n\ndescribe('ChatError', () => {\n runChatErrorSharedTests(ChatError);\n});\n"],"names":["runChatErrorSharedTests","ChatError","describe"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,+BAA+B;AACvE,SAASC,SAAS,QAAQ,gBAAgB;AAE1CC,SAAS,aAAa;IAClBF,wBAAwBC;AAC5B"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { runChatInputFileSharedTests } from '@servicetitan/cypress-shared';
|
|
2
2
|
import { ChatInputFile } from '../chat-input-file';
|
|
3
|
-
describe('ChatInputFile', ()
|
|
4
|
-
runChatInputFileSharedTests(ChatInputFile, {
|
|
3
|
+
describe('ChatInputFile', ()=>{
|
|
4
|
+
runChatInputFileSharedTests(ChatInputFile, {
|
|
5
|
+
isAnvil2: true
|
|
6
|
+
});
|
|
5
7
|
});
|
|
8
|
+
|
|
6
9
|
//# sourceMappingURL=chat-input-file.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-input-file.test.tsx"],"sourcesContent":["import { runChatInputFileSharedTests } from '@servicetitan/cypress-shared';\nimport { ChatInputFile } from '../chat-input-file';\n\ndescribe('ChatInputFile', () => {\n runChatInputFileSharedTests(ChatInputFile, { isAnvil2: true });\n});\n"],"names":["runChatInputFileSharedTests","ChatInputFile","describe","isAnvil2"],"mappings":"AAAA,SAASA,2BAA2B,QAAQ,+BAA+B;AAC3E,SAASC,aAAa,QAAQ,qBAAqB;AAEnDC,SAAS,iBAAiB;IACtBF,4BAA4BC,eAAe;QAAEE,UAAU;IAAK;AAChE"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { runChatInputSharedTests } from '@servicetitan/cypress-shared';
|
|
2
2
|
import { ChatInput } from '../chat-input';
|
|
3
|
-
describe('ChatInput', ()
|
|
3
|
+
describe('ChatInput', ()=>{
|
|
4
4
|
runChatInputSharedTests(ChatInput);
|
|
5
5
|
});
|
|
6
|
+
|
|
6
7
|
//# sourceMappingURL=chat-input.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-input.test.tsx"],"sourcesContent":["import { runChatInputSharedTests } from '@servicetitan/cypress-shared';\nimport { ChatInput } from '../chat-input';\n\ndescribe('ChatInput', () => {\n runChatInputSharedTests(ChatInput);\n});\n"],"names":["runChatInputSharedTests","ChatInput","describe"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,+BAA+B;AACvE,SAASC,SAAS,QAAQ,gBAAgB;AAE1CC,SAAS,aAAa;IAClBF,wBAAwBC;AAC5B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-log.test.tsx"],"sourcesContent":["import { runChatLogSharedTests } from '@servicetitan/cypress-shared';\nimport { ChatLog } from '../chat-log';\n\ndescribe('[ChatLog]', () => {\n runChatLogSharedTests(ChatLog);\n});\n"],"names":["runChatLogSharedTests","ChatLog","describe"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,+BAA+B;AACrE,SAASC,OAAO,QAAQ,cAAc;AAEtCC,SAAS,aAAa;IAClBF,sBAAsBC;AAC1B"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { runChatMessagesSharedTests } from '@servicetitan/cypress-shared';
|
|
2
2
|
import { ChatMessages } from '../chat-messages';
|
|
3
|
-
describe('[ChatMessages]', ()
|
|
3
|
+
describe('[ChatMessages]', ()=>{
|
|
4
4
|
runChatMessagesSharedTests(ChatMessages);
|
|
5
5
|
});
|
|
6
|
+
|
|
6
7
|
//# sourceMappingURL=chat-messages.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-messages.test.tsx"],"sourcesContent":["import { runChatMessagesSharedTests } from '@servicetitan/cypress-shared';\nimport { ChatMessages } from '../chat-messages';\n\ndescribe('[ChatMessages]', () => {\n runChatMessagesSharedTests(ChatMessages);\n});\n"],"names":["runChatMessagesSharedTests","ChatMessages","describe"],"mappings":"AAAA,SAASA,0BAA0B,QAAQ,+BAA+B;AAC1E,SAASC,YAAY,QAAQ,mBAAmB;AAEhDC,SAAS,kBAAkB;IACvBF,2BAA2BC;AAC/B"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { runChatNotificationsTests } from '@servicetitan/cypress-shared';
|
|
2
2
|
import { ChatNotifications } from '../chat-notifications';
|
|
3
|
-
describe('ChatNotifications', ()
|
|
3
|
+
describe('ChatNotifications', ()=>{
|
|
4
4
|
runChatNotificationsTests(ChatNotifications);
|
|
5
5
|
});
|
|
6
|
+
|
|
6
7
|
//# sourceMappingURL=chat-notifications.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-notifications.test.tsx"],"sourcesContent":["import { runChatNotificationsTests } from '@servicetitan/cypress-shared';\nimport { ChatNotifications } from '../chat-notifications';\n\ndescribe('ChatNotifications', () => {\n runChatNotificationsTests(ChatNotifications);\n});\n"],"names":["runChatNotificationsTests","ChatNotifications","describe"],"mappings":"AAAA,SAASA,yBAAyB,QAAQ,+BAA+B;AACzE,SAASC,iBAAiB,QAAQ,wBAAwB;AAE1DC,SAAS,qBAAqB;IAC1BF,0BAA0BC;AAC9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat-timer.test.tsx"],"sourcesContent":["import { runChatTimerTests } from '@servicetitan/cypress-shared';\nimport { ChatTimer } from '../chat-timer';\n\ndescribe('ChatTimer', () => {\n runChatTimerTests(ChatTimer);\n});\n"],"names":["runChatTimerTests","ChatTimer","describe"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,+BAA+B;AACjE,SAASC,SAAS,QAAQ,gBAAgB;AAE1CC,SAAS,aAAa;IAClBF,kBAAkBC;AACtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/chat/__tests-cy__/chat.test.tsx"],"sourcesContent":["import { runChatSharedTests } from '@servicetitan/cypress-shared';\nimport { Chat } from '../chat';\n\ndescribe('Chat', () => {\n runChatSharedTests(Chat);\n});\n"],"names":["runChatSharedTests","Chat","describe"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,+BAA+B;AAClE,SAASC,IAAI,QAAQ,UAAU;AAE/BC,SAAS,QAAQ;IACbF,mBAAmBC;AACvB"}
|
|
@@ -1,6 +1,25 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Flex, Spinner, Text } from '@servicetitan/anvil2';
|
|
3
|
-
export const ChatConnecting = ({ className })
|
|
4
|
-
return
|
|
3
|
+
export const ChatConnecting = ({ className })=>{
|
|
4
|
+
return /*#__PURE__*/ _jsx(Flex, {
|
|
5
|
+
direction: "column",
|
|
6
|
+
gap: "4",
|
|
7
|
+
alignItems: "center",
|
|
8
|
+
className: className,
|
|
9
|
+
"data-cy": "titan-chat-connecting",
|
|
10
|
+
children: /*#__PURE__*/ _jsxs(Flex, {
|
|
11
|
+
direction: "row",
|
|
12
|
+
gap: "4",
|
|
13
|
+
alignItems: "center",
|
|
14
|
+
children: [
|
|
15
|
+
/*#__PURE__*/ _jsx(Spinner, {}),
|
|
16
|
+
/*#__PURE__*/ _jsx(Text, {
|
|
17
|
+
className: "c-subdued",
|
|
18
|
+
children: "Starting..."
|
|
19
|
+
})
|
|
20
|
+
]
|
|
21
|
+
})
|
|
22
|
+
});
|
|
5
23
|
};
|
|
24
|
+
|
|
6
25
|
//# sourceMappingURL=chat-connecting.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/chat/chat-connecting.tsx"],"sourcesContent":["import { Flex, Spinner, Text } from '@servicetitan/anvil2';\nimport { FC } from 'react';\n\ninterface IChatConnectingProps {\n className?: string;\n}\n\nexport const ChatConnecting: FC<IChatConnectingProps> = ({ className }) => {\n return (\n <Flex\n direction=\"column\"\n gap=\"4\"\n alignItems=\"center\"\n className={className}\n data-cy=\"titan-chat-connecting\"\n >\n <Flex direction=\"row\" gap=\"4\" alignItems=\"center\">\n <Spinner />\n <Text className=\"c-subdued\">Starting...</Text>\n </Flex>\n </Flex>\n );\n};\n"],"names":["Flex","Spinner","Text","ChatConnecting","className","direction","gap","alignItems","data-cy"],"mappings":";AAAA,SAASA,IAAI,EAAEC,OAAO,EAAEC,IAAI,QAAQ,uBAAuB;AAO3D,OAAO,MAAMC,iBAA2C,CAAC,EAAEC,SAAS,EAAE;IAClE,qBACI,KAACJ;QACGK,WAAU;QACVC,KAAI;QACJC,YAAW;QACXH,WAAWA;QACXI,WAAQ;kBAER,cAAA,MAACR;YAAKK,WAAU;YAAMC,KAAI;YAAIC,YAAW;;8BACrC,KAACN;8BACD,KAACC;oBAAKE,WAAU;8BAAY;;;;;AAI5C,EAAE"}
|
|
@@ -5,15 +5,41 @@ import { CHAT_UI_STORE_TOKEN } from '@servicetitan/titan-chat-ui-common';
|
|
|
5
5
|
import { observer } from 'mobx-react';
|
|
6
6
|
import { useCallback } from 'react';
|
|
7
7
|
import { MultilineText } from '../common/multiline-text';
|
|
8
|
-
export const ChatError = observer(({ className })
|
|
8
|
+
export const ChatError = observer(({ className })=>{
|
|
9
9
|
const [chatUiStore] = useDependencies(CHAT_UI_STORE_TOKEN);
|
|
10
10
|
const { error } = chatUiStore;
|
|
11
|
-
const handleReconnect = useCallback(async ()
|
|
11
|
+
const handleReconnect = useCallback(async ()=>{
|
|
12
12
|
await chatUiStore.recover();
|
|
13
|
-
}, [
|
|
13
|
+
}, [
|
|
14
|
+
chatUiStore
|
|
15
|
+
]);
|
|
14
16
|
if (!error) {
|
|
15
17
|
return null;
|
|
16
18
|
}
|
|
17
|
-
return
|
|
19
|
+
return /*#__PURE__*/ _jsx(Alert, {
|
|
20
|
+
status: "danger",
|
|
21
|
+
title: error.title,
|
|
22
|
+
className: className,
|
|
23
|
+
"data-cy": "titan-chat-error",
|
|
24
|
+
children: /*#__PURE__*/ _jsxs(Flex, {
|
|
25
|
+
direction: "column",
|
|
26
|
+
gap: "4",
|
|
27
|
+
children: [
|
|
28
|
+
/*#__PURE__*/ _jsx(MultilineText, {
|
|
29
|
+
text: error.message,
|
|
30
|
+
"data-cy": "titan-chat-error-text"
|
|
31
|
+
}),
|
|
32
|
+
error.recoverStrategy && /*#__PURE__*/ _jsx(Button, {
|
|
33
|
+
type: "button",
|
|
34
|
+
appearance: "danger",
|
|
35
|
+
size: "small",
|
|
36
|
+
onClick: handleReconnect,
|
|
37
|
+
"data-cy": "titan-chat-error-recover",
|
|
38
|
+
children: error.recoverStrategy.recoverButtonTitle
|
|
39
|
+
})
|
|
40
|
+
]
|
|
41
|
+
})
|
|
42
|
+
});
|
|
18
43
|
});
|
|
44
|
+
|
|
19
45
|
//# sourceMappingURL=chat-error.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/chat/chat-error.tsx"],"sourcesContent":["import { Alert, Button, Flex } from '@servicetitan/anvil2';\nimport { useDependencies } from '@servicetitan/react-ioc';\nimport { CHAT_UI_STORE_TOKEN } from '@servicetitan/titan-chat-ui-common';\nimport { observer } from 'mobx-react';\nimport { FC, useCallback } from 'react';\nimport { MultilineText } from '../common/multiline-text';\n\nexport const ChatError: FC<{ className?: string }> = observer(({ className }) => {\n const [chatUiStore] = useDependencies(CHAT_UI_STORE_TOKEN);\n const { error } = chatUiStore;\n\n const handleReconnect = useCallback(async () => {\n await chatUiStore.recover();\n }, [chatUiStore]);\n\n if (!error) {\n return null;\n }\n return (\n <Alert status=\"danger\" title={error.title} className={className} data-cy=\"titan-chat-error\">\n <Flex direction=\"column\" gap=\"4\">\n <MultilineText text={error.message} data-cy=\"titan-chat-error-text\" />\n {error.recoverStrategy && (\n <Button\n type=\"button\"\n appearance=\"danger\"\n size=\"small\"\n onClick={handleReconnect}\n data-cy=\"titan-chat-error-recover\"\n >\n {error.recoverStrategy.recoverButtonTitle}\n </Button>\n )}\n </Flex>\n </Alert>\n );\n});\n"],"names":["Alert","Button","Flex","useDependencies","CHAT_UI_STORE_TOKEN","observer","useCallback","MultilineText","ChatError","className","chatUiStore","error","handleReconnect","recover","status","title","data-cy","direction","gap","text","message","recoverStrategy","type","appearance","size","onClick","recoverButtonTitle"],"mappings":";AAAA,SAASA,KAAK,EAAEC,MAAM,EAAEC,IAAI,QAAQ,uBAAuB;AAC3D,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,mBAAmB,QAAQ,qCAAqC;AACzE,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAAaC,WAAW,QAAQ,QAAQ;AACxC,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,OAAO,MAAMC,YAAwCH,SAAS,CAAC,EAAEI,SAAS,EAAE;IACxE,MAAM,CAACC,YAAY,GAAGP,gBAAgBC;IACtC,MAAM,EAAEO,KAAK,EAAE,GAAGD;IAElB,MAAME,kBAAkBN,YAAY;QAChC,MAAMI,YAAYG,OAAO;IAC7B,GAAG;QAACH;KAAY;IAEhB,IAAI,CAACC,OAAO;QACR,OAAO;IACX;IACA,qBACI,KAACX;QAAMc,QAAO;QAASC,OAAOJ,MAAMI,KAAK;QAAEN,WAAWA;QAAWO,WAAQ;kBACrE,cAAA,MAACd;YAAKe,WAAU;YAASC,KAAI;;8BACzB,KAACX;oBAAcY,MAAMR,MAAMS,OAAO;oBAAEJ,WAAQ;;gBAC3CL,MAAMU,eAAe,kBAClB,KAACpB;oBACGqB,MAAK;oBACLC,YAAW;oBACXC,MAAK;oBACLC,SAASb;oBACTI,WAAQ;8BAEPL,MAAMU,eAAe,CAACK,kBAAkB;;;;;AAMjE,GAAG"}
|
|
@@ -8,30 +8,114 @@ import { useDependencies } from '@servicetitan/react-ioc';
|
|
|
8
8
|
import { CHAT_UI_STORE_TOKEN } from '@servicetitan/titan-chat-ui-common';
|
|
9
9
|
import { observer } from 'mobx-react';
|
|
10
10
|
import { Fragment, useCallback, useRef } from 'react';
|
|
11
|
-
export const ChatInputFile = observer(({ className })
|
|
11
|
+
export const ChatInputFile = observer(({ className })=>{
|
|
12
12
|
const fileInputRef = useRef(null);
|
|
13
13
|
const [chatUiStore] = useDependencies(CHAT_UI_STORE_TOKEN);
|
|
14
|
-
const handleSelected = useCallback((event)
|
|
14
|
+
const handleSelected = useCallback((event)=>{
|
|
15
15
|
const files = event.target.files;
|
|
16
16
|
if (!files || files.length === 0) {
|
|
17
17
|
return;
|
|
18
18
|
}
|
|
19
19
|
const fileDescriptor = {
|
|
20
20
|
file: files[0],
|
|
21
|
-
displayName: files[0].name
|
|
21
|
+
displayName: files[0].name
|
|
22
22
|
};
|
|
23
23
|
chatUiStore.setFile(fileDescriptor);
|
|
24
|
-
}, [
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
24
|
+
}, [
|
|
25
|
+
chatUiStore
|
|
26
|
+
]);
|
|
27
|
+
const handleUpload = ()=>{
|
|
28
|
+
var _fileInputRef_current;
|
|
29
|
+
(_fileInputRef_current = fileInputRef.current) === null || _fileInputRef_current === void 0 ? void 0 : _fileInputRef_current.click();
|
|
28
30
|
};
|
|
29
|
-
const handleDelete = useCallback(()
|
|
31
|
+
const handleDelete = useCallback(()=>{
|
|
30
32
|
chatUiStore.setFile(undefined);
|
|
31
|
-
}, [
|
|
33
|
+
}, [
|
|
34
|
+
chatUiStore
|
|
35
|
+
]);
|
|
32
36
|
if (!chatUiStore.isFilePickerEnabled) {
|
|
33
37
|
return null;
|
|
34
38
|
}
|
|
35
|
-
return
|
|
39
|
+
return /*#__PURE__*/ _jsxs(Flex, {
|
|
40
|
+
className: className,
|
|
41
|
+
gap: "6",
|
|
42
|
+
direction: "column",
|
|
43
|
+
children: [
|
|
44
|
+
/*#__PURE__*/ _jsx(Text, {
|
|
45
|
+
variant: "eyebrow",
|
|
46
|
+
children: "Upload file"
|
|
47
|
+
}),
|
|
48
|
+
/*#__PURE__*/ _jsx("input", {
|
|
49
|
+
type: "file",
|
|
50
|
+
ref: fileInputRef,
|
|
51
|
+
onChange: handleSelected,
|
|
52
|
+
style: {
|
|
53
|
+
display: 'none'
|
|
54
|
+
},
|
|
55
|
+
accept: "*/*",
|
|
56
|
+
multiple: false
|
|
57
|
+
}),
|
|
58
|
+
/*#__PURE__*/ _jsx(Flex, {
|
|
59
|
+
direction: "column",
|
|
60
|
+
gap: "2",
|
|
61
|
+
"data-cy": "titan-chat-upload-file",
|
|
62
|
+
children: chatUiStore.file ? /*#__PURE__*/ _jsx(Card, {
|
|
63
|
+
padding: "small",
|
|
64
|
+
children: /*#__PURE__*/ _jsxs(Flex, {
|
|
65
|
+
style: {
|
|
66
|
+
width: '100%'
|
|
67
|
+
},
|
|
68
|
+
direction: "row",
|
|
69
|
+
alignItems: "center",
|
|
70
|
+
gap: "2",
|
|
71
|
+
children: [
|
|
72
|
+
/*#__PURE__*/ _jsx(Icon, {
|
|
73
|
+
svg: IconFile,
|
|
74
|
+
className: "m-inline-start-4"
|
|
75
|
+
}),
|
|
76
|
+
/*#__PURE__*/ _jsx(Text, {
|
|
77
|
+
variant: "body",
|
|
78
|
+
flexGrow: 1,
|
|
79
|
+
"data-cy": "titan-chat-upload-file-name",
|
|
80
|
+
children: chatUiStore.file.displayName
|
|
81
|
+
}),
|
|
82
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
83
|
+
icon: IconEdit,
|
|
84
|
+
"aria-label": "Replace file",
|
|
85
|
+
appearance: "ghost",
|
|
86
|
+
onClick: handleUpload,
|
|
87
|
+
"data-cy": "titan-chat-upload-file-edit"
|
|
88
|
+
}),
|
|
89
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
90
|
+
icon: IconDelete,
|
|
91
|
+
"aria-label": "Delete file",
|
|
92
|
+
appearance: "ghost",
|
|
93
|
+
onClick: handleDelete,
|
|
94
|
+
"data-cy": "titan-chat-upload-file-delete"
|
|
95
|
+
})
|
|
96
|
+
]
|
|
97
|
+
})
|
|
98
|
+
}) : /*#__PURE__*/ _jsxs(Fragment, {
|
|
99
|
+
children: [
|
|
100
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
101
|
+
type: "button",
|
|
102
|
+
appearance: "secondary",
|
|
103
|
+
icon: IconAttachment,
|
|
104
|
+
onClick: handleUpload,
|
|
105
|
+
"data-cy": "titan-chat-upload-file-btn",
|
|
106
|
+
children: "Upload File"
|
|
107
|
+
}),
|
|
108
|
+
/*#__PURE__*/ _jsx(Text, {
|
|
109
|
+
variant: "body",
|
|
110
|
+
size: "small",
|
|
111
|
+
subdued: true,
|
|
112
|
+
children: "e.g. Screenshot of issue"
|
|
113
|
+
})
|
|
114
|
+
]
|
|
115
|
+
})
|
|
116
|
+
})
|
|
117
|
+
]
|
|
118
|
+
});
|
|
36
119
|
});
|
|
120
|
+
|
|
37
121
|
//# sourceMappingURL=chat-input-file.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/chat/chat-input-file.tsx"],"sourcesContent":["import { Button, Card, Flex, Icon, Text } from '@servicetitan/anvil2';\nimport IconAttachment from '@servicetitan/anvil2/assets/icons/material/round/attach_file.svg';\nimport IconDelete from '@servicetitan/anvil2/assets/icons/material/round/delete.svg';\nimport IconFile from '@servicetitan/anvil2/assets/icons/material/round/insert_drive_file.svg';\nimport IconEdit from '@servicetitan/anvil2/assets/icons/material/round/refresh.svg';\nimport { useDependencies } from '@servicetitan/react-ioc';\nimport { CHAT_UI_STORE_TOKEN, FileDescriptor } from '@servicetitan/titan-chat-ui-common';\nimport { observer } from 'mobx-react';\nimport { ChangeEvent, FC, Fragment, useCallback, useRef } from 'react';\n\nexport const ChatInputFile: FC<{ className?: string }> = observer(({ className }) => {\n const fileInputRef = useRef<HTMLInputElement>(null);\n const [chatUiStore] = useDependencies(CHAT_UI_STORE_TOKEN);\n\n const handleSelected = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const files = event.target.files;\n if (!files || files.length === 0) {\n return;\n }\n const fileDescriptor: FileDescriptor = {\n file: files[0],\n displayName: files[0].name,\n };\n chatUiStore.setFile(fileDescriptor);\n },\n [chatUiStore]\n );\n\n const handleUpload = () => {\n fileInputRef.current?.click();\n };\n\n const handleDelete = useCallback(() => {\n chatUiStore.setFile(undefined);\n }, [chatUiStore]);\n\n if (!chatUiStore.isFilePickerEnabled) {\n return null;\n }\n return (\n <Flex className={className} gap=\"6\" direction=\"column\">\n <Text variant=\"eyebrow\">Upload file</Text>\n <input\n type=\"file\"\n ref={fileInputRef}\n onChange={handleSelected}\n style={{ display: 'none' }} // Hide the native input\n accept=\"*/*\"\n multiple={false}\n />\n <Flex direction=\"column\" gap=\"2\" data-cy=\"titan-chat-upload-file\">\n {chatUiStore.file ? (\n <Card padding=\"small\">\n <Flex style={{ width: '100%' }} direction=\"row\" alignItems=\"center\" gap=\"2\">\n <Icon svg={IconFile} className=\"m-inline-start-4\" />\n <Text variant=\"body\" flexGrow={1} data-cy=\"titan-chat-upload-file-name\">\n {chatUiStore.file.displayName}\n </Text>\n <Button\n icon={IconEdit}\n aria-label=\"Replace file\"\n appearance=\"ghost\"\n onClick={handleUpload}\n data-cy=\"titan-chat-upload-file-edit\"\n />\n <Button\n icon={IconDelete}\n aria-label=\"Delete file\"\n appearance=\"ghost\"\n onClick={handleDelete}\n data-cy=\"titan-chat-upload-file-delete\"\n />\n </Flex>\n </Card>\n ) : (\n <Fragment>\n <Button\n type=\"button\"\n appearance=\"secondary\"\n icon={IconAttachment}\n onClick={handleUpload}\n data-cy=\"titan-chat-upload-file-btn\"\n >\n Upload File\n </Button>\n <Text variant=\"body\" size=\"small\" subdued>\n e.g. Screenshot of issue\n </Text>\n </Fragment>\n )}\n </Flex>\n </Flex>\n );\n});\n"],"names":["Button","Card","Flex","Icon","Text","IconAttachment","IconDelete","IconFile","IconEdit","useDependencies","CHAT_UI_STORE_TOKEN","observer","Fragment","useCallback","useRef","ChatInputFile","className","fileInputRef","chatUiStore","handleSelected","event","files","target","length","fileDescriptor","file","displayName","name","setFile","handleUpload","current","click","handleDelete","undefined","isFilePickerEnabled","gap","direction","variant","input","type","ref","onChange","style","display","accept","multiple","data-cy","padding","width","alignItems","svg","flexGrow","icon","aria-label","appearance","onClick","size","subdued"],"mappings":";AAAA,SAASA,MAAM,EAAEC,IAAI,EAAEC,IAAI,EAAEC,IAAI,EAAEC,IAAI,QAAQ,uBAAuB;AACtE,OAAOC,oBAAoB,mEAAmE;AAC9F,OAAOC,gBAAgB,8DAA8D;AACrF,OAAOC,cAAc,yEAAyE;AAC9F,OAAOC,cAAc,+DAA+D;AACpF,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,mBAAmB,QAAwB,qCAAqC;AACzF,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAA0BC,QAAQ,EAAEC,WAAW,EAAEC,MAAM,QAAQ,QAAQ;AAEvE,OAAO,MAAMC,gBAA4CJ,SAAS,CAAC,EAAEK,SAAS,EAAE;IAC5E,MAAMC,eAAeH,OAAyB;IAC9C,MAAM,CAACI,YAAY,GAAGT,gBAAgBC;IAEtC,MAAMS,iBAAiBN,YACnB,CAACO;QACG,MAAMC,QAAQD,MAAME,MAAM,CAACD,KAAK;QAChC,IAAI,CAACA,SAASA,MAAME,MAAM,KAAK,GAAG;YAC9B;QACJ;QACA,MAAMC,iBAAiC;YACnCC,MAAMJ,KAAK,CAAC,EAAE;YACdK,aAAaL,KAAK,CAAC,EAAE,CAACM,IAAI;QAC9B;QACAT,YAAYU,OAAO,CAACJ;IACxB,GACA;QAACN;KAAY;IAGjB,MAAMW,eAAe;YACjBZ;SAAAA,wBAAAA,aAAaa,OAAO,cAApBb,4CAAAA,sBAAsBc,KAAK;IAC/B;IAEA,MAAMC,eAAenB,YAAY;QAC7BK,YAAYU,OAAO,CAACK;IACxB,GAAG;QAACf;KAAY;IAEhB,IAAI,CAACA,YAAYgB,mBAAmB,EAAE;QAClC,OAAO;IACX;IACA,qBACI,MAAChC;QAAKc,WAAWA;QAAWmB,KAAI;QAAIC,WAAU;;0BAC1C,KAAChC;gBAAKiC,SAAQ;0BAAU;;0BACxB,KAACC;gBACGC,MAAK;gBACLC,KAAKvB;gBACLwB,UAAUtB;gBACVuB,OAAO;oBAAEC,SAAS;gBAAO;gBACzBC,QAAO;gBACPC,UAAU;;0BAEd,KAAC3C;gBAAKkC,WAAU;gBAASD,KAAI;gBAAIW,WAAQ;0BACpC5B,YAAYO,IAAI,iBACb,KAACxB;oBAAK8C,SAAQ;8BACV,cAAA,MAAC7C;wBAAKwC,OAAO;4BAAEM,OAAO;wBAAO;wBAAGZ,WAAU;wBAAMa,YAAW;wBAASd,KAAI;;0CACpE,KAAChC;gCAAK+C,KAAK3C;gCAAUS,WAAU;;0CAC/B,KAACZ;gCAAKiC,SAAQ;gCAAOc,UAAU;gCAAGL,WAAQ;0CACrC5B,YAAYO,IAAI,CAACC,WAAW;;0CAEjC,KAAC1B;gCACGoD,MAAM5C;gCACN6C,cAAW;gCACXC,YAAW;gCACXC,SAAS1B;gCACTiB,WAAQ;;0CAEZ,KAAC9C;gCACGoD,MAAM9C;gCACN+C,cAAW;gCACXC,YAAW;gCACXC,SAASvB;gCACTc,WAAQ;;;;mCAKpB,MAAClC;;sCACG,KAACZ;4BACGuC,MAAK;4BACLe,YAAW;4BACXF,MAAM/C;4BACNkD,SAAS1B;4BACTiB,WAAQ;sCACX;;sCAGD,KAAC1C;4BAAKiC,SAAQ;4BAAOmB,MAAK;4BAAQC,OAAO;sCAAC;;;;;;;AAQlE,GAAG"}
|