@adatechnology/conversations-ui 0.1.0-rc.5 → 0.1.0-rc.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-LITPZCWW.js +1465 -0
- package/dist/index.d.ts +135 -18
- package/dist/index.js +228 -589
- package/dist/preview/index.d.ts +82 -7
- package/dist/preview/index.js +314 -11
- package/dist/{types-C2Yexi8A.d.ts → types-CeixG2Z9.d.ts} +28 -1
- package/package.json +1 -1
- package/src/Avatar.tsx +13 -2
- package/src/ConversationListItem.tsx +18 -2
- package/src/DocumentsLibrary.tsx +322 -0
- package/src/FileIcon.test.ts +46 -1
- package/src/FileIcon.tsx +76 -10
- package/src/Lightbox.tsx +18 -3
- package/src/MessageBubble.tsx +18 -2
- package/src/MessageComposer.tsx +20 -3
- package/src/WhatsAppMessageEditor.tsx +28 -4
- package/src/index.ts +17 -10
- package/src/lib/createMediaUrlResolver.ts +33 -0
- package/src/preview/MediaTypesPreview.tsx +87 -0
- package/src/preview/createMockConversationsApi.ts +62 -8
- package/src/preview/index.ts +5 -0
- package/src/preview/mockDocumentsSearch.test.ts +57 -0
- package/src/preview/previewFileSamples.test.ts +151 -0
- package/src/preview/previewFileSamples.ts +74 -0
- package/src/preview/previewFixtures.ts +140 -8
- package/src/preview/previewMediaSource.test.ts +62 -0
- package/src/preview/previewMediaSource.ts +91 -0
- package/src/providers/types.ts +17 -0
- package/src/settings/WhatsAppCreateTemplateForm.tsx +3 -1
- package/dist/chunk-YWITIIHD.js +0 -728
package/dist/index.js
CHANGED
|
@@ -4,9 +4,17 @@ import {
|
|
|
4
4
|
} from "./chunk-NV2RZ5KT.js";
|
|
5
5
|
import {
|
|
6
6
|
AudioPlayer,
|
|
7
|
+
ConversationDocumentsPanel,
|
|
7
8
|
ConversationLocalesProvider,
|
|
8
9
|
ConversationWallpaper,
|
|
10
|
+
ConversationsProvider,
|
|
11
|
+
DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
|
|
12
|
+
DEFAULT_DOCUMENTS_LIBRARY_LABELS,
|
|
13
|
+
DEFAULT_LIGHTBOX_LABELS,
|
|
14
|
+
DEFAULT_MESSAGE_COMPOSER_LABELS,
|
|
15
|
+
DOCUMENT_SOURCE_FILTER,
|
|
9
16
|
DateDivider,
|
|
17
|
+
DocumentsLibrary,
|
|
10
18
|
EmojiPicker,
|
|
11
19
|
FileIcon,
|
|
12
20
|
Lightbox,
|
|
@@ -15,12 +23,21 @@ import {
|
|
|
15
23
|
MessageComposer,
|
|
16
24
|
StatusTicks,
|
|
17
25
|
cn,
|
|
26
|
+
conversationsOf,
|
|
27
|
+
createMediaUrlResolver,
|
|
18
28
|
formatDateTime,
|
|
19
29
|
formatFileSize,
|
|
30
|
+
formatPhone,
|
|
20
31
|
formatTimestamp,
|
|
21
32
|
isSameDay,
|
|
22
|
-
|
|
23
|
-
|
|
33
|
+
phoneCountryFlag,
|
|
34
|
+
phoneInitials,
|
|
35
|
+
totalOf,
|
|
36
|
+
useAsyncResource,
|
|
37
|
+
useConversationDocuments,
|
|
38
|
+
useConversationLocales,
|
|
39
|
+
useConversations
|
|
40
|
+
} from "./chunk-LITPZCWW.js";
|
|
24
41
|
import {
|
|
25
42
|
htmlToWA,
|
|
26
43
|
parseWhatsAppFormatting,
|
|
@@ -32,6 +49,15 @@ import {
|
|
|
32
49
|
import { useRef } from "react";
|
|
33
50
|
import { Bold, Italic, Strikethrough } from "lucide-react";
|
|
34
51
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
52
|
+
var DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS = {
|
|
53
|
+
bold: "Negrito",
|
|
54
|
+
boldHint: "Negrito (*texto*)",
|
|
55
|
+
italic: "It\xE1lico",
|
|
56
|
+
italicHint: "It\xE1lico (_texto_)",
|
|
57
|
+
strikethrough: "Tachado",
|
|
58
|
+
strikethroughHint: "Tachado (~texto~)",
|
|
59
|
+
insertPlaceholder: (token) => `Inserir ${token}`
|
|
60
|
+
};
|
|
35
61
|
var INLINE_TOKEN = /(\*[^*\n]+\*|_[^_\n]+_|~[^~\n]+~|`[^`\n]+`|\{[a-zA-Z_]+\})/g;
|
|
36
62
|
function renderLine(line, lineKey) {
|
|
37
63
|
const nodes = [];
|
|
@@ -67,8 +93,10 @@ function WhatsAppMessageEditor({
|
|
|
67
93
|
placeholders = [],
|
|
68
94
|
rows = 4,
|
|
69
95
|
previewLabel = "Pr\xE9via (como aparece no WhatsApp)",
|
|
70
|
-
emptyPreviewText = "Sua mensagem aparecer\xE1 aqui\u2026"
|
|
96
|
+
emptyPreviewText = "Sua mensagem aparecer\xE1 aqui\u2026",
|
|
97
|
+
labels
|
|
71
98
|
}) {
|
|
99
|
+
const editorLabels = { ...DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS, ...labels };
|
|
72
100
|
const textareaRef = useRef(null);
|
|
73
101
|
function wrapSelection(marker) {
|
|
74
102
|
const textarea = textareaRef.current;
|
|
@@ -99,9 +127,9 @@ function WhatsAppMessageEditor({
|
|
|
99
127
|
const toolbarButtonClass = "inline-flex items-center justify-center h-8 w-8 rounded-lg border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors";
|
|
100
128
|
return /* @__PURE__ */ jsxs("div", { children: [
|
|
101
129
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1.5 mb-2", children: [
|
|
102
|
-
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("*"), className: toolbarButtonClass, title:
|
|
103
|
-
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("_"), className: toolbarButtonClass, title:
|
|
104
|
-
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("~"), className: toolbarButtonClass, title:
|
|
130
|
+
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("*"), className: toolbarButtonClass, title: editorLabels.boldHint, "aria-label": editorLabels.bold, children: /* @__PURE__ */ jsx(Bold, { size: 15 }) }),
|
|
131
|
+
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("_"), className: toolbarButtonClass, title: editorLabels.italicHint, "aria-label": editorLabels.italic, children: /* @__PURE__ */ jsx(Italic, { size: 15 }) }),
|
|
132
|
+
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("~"), className: toolbarButtonClass, title: editorLabels.strikethroughHint, "aria-label": editorLabels.strikethrough, children: /* @__PURE__ */ jsx(Strikethrough, { size: 15 }) }),
|
|
105
133
|
placeholders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
106
134
|
/* @__PURE__ */ jsx("span", { className: "mx-1 h-5 w-px bg-gray-200 dark:bg-gray-600" }),
|
|
107
135
|
placeholders.map((token) => /* @__PURE__ */ jsx(
|
|
@@ -110,7 +138,7 @@ function WhatsAppMessageEditor({
|
|
|
110
138
|
type: "button",
|
|
111
139
|
onClick: () => insertAtCursor(token),
|
|
112
140
|
className: "inline-flex items-center h-8 px-2 rounded-lg border border-gray-200 dark:border-gray-600 text-xs text-blue-600 dark:text-blue-300 hover:bg-blue-50 dark:hover:bg-blue-900/40 transition-colors",
|
|
113
|
-
title:
|
|
141
|
+
title: editorLabels.insertPlaceholder(token),
|
|
114
142
|
children: token
|
|
115
143
|
},
|
|
116
144
|
token
|
|
@@ -270,6 +298,9 @@ function SimpleEmojiPicker({ onSelect, label = "Emojis", pickerWidth = "280px",
|
|
|
270
298
|
|
|
271
299
|
// src/Avatar.tsx
|
|
272
300
|
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
301
|
+
var DEFAULT_AVATAR_LABELS = {
|
|
302
|
+
unnamedContact: "Contato sem nome"
|
|
303
|
+
};
|
|
273
304
|
var sizeClasses = {
|
|
274
305
|
sm: "w-6 h-6 text-xs",
|
|
275
306
|
md: "w-8 h-8 text-sm",
|
|
@@ -295,8 +326,9 @@ function getBgColor(name) {
|
|
|
295
326
|
const hash = name.charCodeAt(0) + (name.charCodeAt(name.length - 1) || 0);
|
|
296
327
|
return bgColors[hash % bgColors.length];
|
|
297
328
|
}
|
|
298
|
-
function Avatar({ name, avatarUrl, size = "md", className = "" }) {
|
|
329
|
+
function Avatar({ name, avatarUrl, size = "md", className = "", labels }) {
|
|
299
330
|
const sizeClass = sizeClasses[size];
|
|
331
|
+
const unnamedContactLabel = labels?.unnamedContact ?? DEFAULT_AVATAR_LABELS.unnamedContact;
|
|
300
332
|
if (avatarUrl) {
|
|
301
333
|
return /* @__PURE__ */ jsx3(
|
|
302
334
|
"img",
|
|
@@ -314,7 +346,7 @@ function Avatar({ name, avatarUrl, size = "md", className = "" }) {
|
|
|
314
346
|
{
|
|
315
347
|
className: `${sizeClass} ${bgColor} rounded-full flex items-center justify-center text-white flex-shrink-0 ${className}`,
|
|
316
348
|
role: "img",
|
|
317
|
-
"aria-label":
|
|
349
|
+
"aria-label": unnamedContactLabel,
|
|
318
350
|
children: /* @__PURE__ */ jsx3("svg", { viewBox: "0 0 24 24", fill: "currentColor", className: "h-[60%] w-[60%]", "aria-hidden": true, children: /* @__PURE__ */ jsx3("path", { d: "M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5Z" }) })
|
|
319
351
|
}
|
|
320
352
|
);
|
|
@@ -332,51 +364,6 @@ function Avatar({ name, avatarUrl, size = "md", className = "" }) {
|
|
|
332
364
|
// src/ConversationListItem.tsx
|
|
333
365
|
import { useMemo } from "react";
|
|
334
366
|
|
|
335
|
-
// src/lib/phone.ts
|
|
336
|
-
function formatPhone(number) {
|
|
337
|
-
const digits = number.replace(/\D/g, "");
|
|
338
|
-
if (digits.length === 13) {
|
|
339
|
-
return `+${digits.slice(0, 2)} (${digits.slice(2, 4)}) ${digits.slice(4, 9)}-${digits.slice(9, 13)}`;
|
|
340
|
-
}
|
|
341
|
-
if (digits.length === 12) {
|
|
342
|
-
return `+${digits.slice(0, 2)} (${digits.slice(2, 4)}) ${digits.slice(4, 8)}-${digits.slice(8, 12)}`;
|
|
343
|
-
}
|
|
344
|
-
if (digits.length === 11) {
|
|
345
|
-
return `(${digits.slice(0, 2)}) ${digits.slice(2, 7)}-${digits.slice(7, 11)}`;
|
|
346
|
-
}
|
|
347
|
-
if (digits.length === 10) {
|
|
348
|
-
return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6, 10)}`;
|
|
349
|
-
}
|
|
350
|
-
return number;
|
|
351
|
-
}
|
|
352
|
-
var COUNTRY_FLAG_BY_DIAL_CODE = {
|
|
353
|
-
"55": "\u{1F1E7}\u{1F1F7}",
|
|
354
|
-
"351": "\u{1F1F5}\u{1F1F9}",
|
|
355
|
-
"34": "\u{1F1EA}\u{1F1F8}",
|
|
356
|
-
"54": "\u{1F1E6}\u{1F1F7}",
|
|
357
|
-
"56": "\u{1F1E8}\u{1F1F1}",
|
|
358
|
-
"57": "\u{1F1E8}\u{1F1F4}",
|
|
359
|
-
"52": "\u{1F1F2}\u{1F1FD}",
|
|
360
|
-
"598": "\u{1F1FA}\u{1F1FE}",
|
|
361
|
-
"595": "\u{1F1F5}\u{1F1FE}",
|
|
362
|
-
"44": "\u{1F1EC}\u{1F1E7}",
|
|
363
|
-
"49": "\u{1F1E9}\u{1F1EA}",
|
|
364
|
-
"39": "\u{1F1EE}\u{1F1F9}",
|
|
365
|
-
"33": "\u{1F1EB}\u{1F1F7}"
|
|
366
|
-
};
|
|
367
|
-
function phoneCountryFlag(number) {
|
|
368
|
-
const digits = number.replace(/\D/g, "");
|
|
369
|
-
for (const length of [3, 2, 1]) {
|
|
370
|
-
const flag = COUNTRY_FLAG_BY_DIAL_CODE[digits.slice(0, length)];
|
|
371
|
-
if (flag) return flag;
|
|
372
|
-
}
|
|
373
|
-
return "";
|
|
374
|
-
}
|
|
375
|
-
function phoneInitials(number) {
|
|
376
|
-
const digits = number.replace(/\D/g, "");
|
|
377
|
-
return digits.slice(-2);
|
|
378
|
-
}
|
|
379
|
-
|
|
380
367
|
// src/conversationChannel.ts
|
|
381
368
|
var CONVERSATION_CHANNEL = {
|
|
382
369
|
WHATSAPP: "whatsapp",
|
|
@@ -458,6 +445,10 @@ function contactFlag(params) {
|
|
|
458
445
|
|
|
459
446
|
// src/ConversationListItem.tsx
|
|
460
447
|
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
448
|
+
var DEFAULT_CONVERSATION_LIST_ITEM_LABELS = {
|
|
449
|
+
expiredWindow: "Janela expirada",
|
|
450
|
+
warningWindow: "Janela pr\xF3xima do fim"
|
|
451
|
+
};
|
|
461
452
|
function formatRelativeTime(dateStr) {
|
|
462
453
|
try {
|
|
463
454
|
const date = new Date(dateStr);
|
|
@@ -518,8 +509,11 @@ var ConversationListItem = ({
|
|
|
518
509
|
onClick,
|
|
519
510
|
onSelect,
|
|
520
511
|
showDivider = true,
|
|
521
|
-
highlightActive = true
|
|
512
|
+
highlightActive = true,
|
|
513
|
+
labels
|
|
522
514
|
}) => {
|
|
515
|
+
const expiredWindowLabel = labels?.expiredWindow ?? DEFAULT_CONVERSATION_LIST_ITEM_LABELS.expiredWindow;
|
|
516
|
+
const warningWindowLabel = labels?.warningWindow ?? DEFAULT_CONVERSATION_LIST_ITEM_LABELS.warningWindow;
|
|
523
517
|
const isActive = active || selected;
|
|
524
518
|
const windowStatus = useMemo(() => getWindowStatus(conversation.lastInboundAt), [conversation.lastInboundAt]);
|
|
525
519
|
const preview = useMemo(() => lastMessagePreview(conversation), [conversation.lastContent]);
|
|
@@ -551,8 +545,8 @@ var ConversationListItem = ({
|
|
|
551
545
|
/* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1.5 min-w-0", children: [
|
|
552
546
|
!conversation.clientName && flag ? /* @__PURE__ */ jsx4("span", { "aria-hidden": true, children: flag }) : null,
|
|
553
547
|
/* @__PURE__ */ jsx4("span", { className: "text-[16px] text-[#111b21] truncate", children: name }),
|
|
554
|
-
windowStatus && windowStatus.label === "expired" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-red-500 flex-shrink-0", title:
|
|
555
|
-
windowStatus && windowStatus.label === "warning" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-orange-500 flex-shrink-0", title:
|
|
548
|
+
windowStatus && windowStatus.label === "expired" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-red-500 flex-shrink-0", title: expiredWindowLabel }),
|
|
549
|
+
windowStatus && windowStatus.label === "warning" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-orange-500 flex-shrink-0", title: warningWindowLabel })
|
|
556
550
|
] }),
|
|
557
551
|
timestamp && /* @__PURE__ */ jsx4("span", { className: "text-xs text-[#667781] flex-shrink-0", children: timestamp })
|
|
558
552
|
] }),
|
|
@@ -1148,371 +1142,6 @@ function isWindowBlocking(window2) {
|
|
|
1148
1142
|
return window2 === CONVERSATION_WINDOW.EXPIRED;
|
|
1149
1143
|
}
|
|
1150
1144
|
|
|
1151
|
-
// src/ConversationDocumentsPanel.tsx
|
|
1152
|
-
import { useState as useState8 } from "react";
|
|
1153
|
-
import { ArrowUpDown, Bot, Download, Eye, Users } from "lucide-react";
|
|
1154
|
-
|
|
1155
|
-
// src/providers/ConversationsProvider.tsx
|
|
1156
|
-
import { createContext as createContext2, useContext as useContext2 } from "react";
|
|
1157
|
-
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
1158
|
-
var ConversationsContext = createContext2(null);
|
|
1159
|
-
function ConversationsProvider({
|
|
1160
|
-
api,
|
|
1161
|
-
sse,
|
|
1162
|
-
children
|
|
1163
|
-
}) {
|
|
1164
|
-
return /* @__PURE__ */ jsx14(ConversationsContext.Provider, { value: { api, sse }, children });
|
|
1165
|
-
}
|
|
1166
|
-
function useConversations() {
|
|
1167
|
-
return useContext2(ConversationsContext);
|
|
1168
|
-
}
|
|
1169
|
-
|
|
1170
|
-
// src/hooks/useAsyncResource.ts
|
|
1171
|
-
import { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3, useState as useState7 } from "react";
|
|
1172
|
-
function useAsyncResource(fetcher, deps) {
|
|
1173
|
-
const [data, setData] = useState7(void 0);
|
|
1174
|
-
const [loading, setLoading] = useState7(false);
|
|
1175
|
-
const [error, setError] = useState7(void 0);
|
|
1176
|
-
const requestIdRef = useRef3(0);
|
|
1177
|
-
const load = useCallback3(async () => {
|
|
1178
|
-
const requestId = ++requestIdRef.current;
|
|
1179
|
-
setLoading(true);
|
|
1180
|
-
setError(void 0);
|
|
1181
|
-
try {
|
|
1182
|
-
const result = await fetcher();
|
|
1183
|
-
if (requestId === requestIdRef.current) setData(result);
|
|
1184
|
-
} catch (err) {
|
|
1185
|
-
if (requestId === requestIdRef.current) setError(err instanceof Error ? err : new Error(String(err)));
|
|
1186
|
-
} finally {
|
|
1187
|
-
if (requestId === requestIdRef.current) setLoading(false);
|
|
1188
|
-
}
|
|
1189
|
-
}, deps);
|
|
1190
|
-
useEffect4(() => {
|
|
1191
|
-
load();
|
|
1192
|
-
}, [load]);
|
|
1193
|
-
return { data, loading, error, refetch: load };
|
|
1194
|
-
}
|
|
1195
|
-
|
|
1196
|
-
// src/lib/paginated.ts
|
|
1197
|
-
function conversationsOf(result) {
|
|
1198
|
-
return Array.isArray(result) ? result : result.conversations;
|
|
1199
|
-
}
|
|
1200
|
-
function documentsOf(result) {
|
|
1201
|
-
return Array.isArray(result) ? result : result.documents;
|
|
1202
|
-
}
|
|
1203
|
-
function totalOf(result) {
|
|
1204
|
-
return Array.isArray(result) ? result.length : result.total;
|
|
1205
|
-
}
|
|
1206
|
-
|
|
1207
|
-
// src/hooks/useConversationDocuments.ts
|
|
1208
|
-
function useConversationDocuments(conversationId, params) {
|
|
1209
|
-
const context = useConversations();
|
|
1210
|
-
if (!context) {
|
|
1211
|
-
throw new Error("useConversationDocuments requires an ancestor <ConversationsProvider>");
|
|
1212
|
-
}
|
|
1213
|
-
const { api } = context;
|
|
1214
|
-
const { data, loading, error, refetch } = useAsyncResource(
|
|
1215
|
-
() => conversationId ? api.getDocuments(conversationId, params) : Promise.resolve([]),
|
|
1216
|
-
[conversationId, params?.search, params?.page, params?.limit, params?.source, params?.sortDirection]
|
|
1217
|
-
);
|
|
1218
|
-
if (data === void 0) {
|
|
1219
|
-
return { documents: [], total: 0, loading, error, refetch };
|
|
1220
|
-
}
|
|
1221
|
-
return { documents: documentsOf(data), total: totalOf(data), loading, error, refetch };
|
|
1222
|
-
}
|
|
1223
|
-
|
|
1224
|
-
// src/ConversationDocumentsPanel.tsx
|
|
1225
|
-
import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1226
|
-
var DOCUMENT_SOURCE_FILTER = {
|
|
1227
|
-
ALL: "all",
|
|
1228
|
-
CUSTOMER: "customer",
|
|
1229
|
-
TEAM: "team"
|
|
1230
|
-
};
|
|
1231
|
-
var TEAM_SOURCES = /* @__PURE__ */ new Set(["agent", "bot"]);
|
|
1232
|
-
var DEFAULT_CONVERSATION_DOCUMENTS_LABELS = {
|
|
1233
|
-
toggle: "\u{1F4CE} Arquivos",
|
|
1234
|
-
title: "Arquivos da conversa",
|
|
1235
|
-
noResults: "Nenhum arquivo encontrado para os filtros aplicados",
|
|
1236
|
-
view: "Visualizar",
|
|
1237
|
-
sourceFilterAll: "Todas as origens",
|
|
1238
|
-
sourceFilterCustomer: "Cliente",
|
|
1239
|
-
sourceFilterTeam: "Equipe",
|
|
1240
|
-
sortMostRecent: "Mais recentes",
|
|
1241
|
-
sortOldest: "Mais antigos",
|
|
1242
|
-
clearFilters: "Limpar filtros",
|
|
1243
|
-
selectAll: "Selecionar todos desta p\xE1gina",
|
|
1244
|
-
downloadSelected: (count) => `Baixar ${count} selecionado${count === 1 ? "" : "s"} (.zip)`,
|
|
1245
|
-
archiveFailed: "N\xE3o foi poss\xEDvel montar o arquivo compactado.",
|
|
1246
|
-
total: (count) => `${count} arquivo${count === 1 ? "" : "s"}`,
|
|
1247
|
-
page: (current, last) => `${current} / ${last}`,
|
|
1248
|
-
searchPlaceholder: "Buscar por nome do arquivo",
|
|
1249
|
-
empty: "Nenhum arquivo nesta conversa.",
|
|
1250
|
-
loading: "Carregando arquivos\u2026",
|
|
1251
|
-
failure: "N\xE3o foi poss\xEDvel carregar os arquivos.",
|
|
1252
|
-
download: "Baixar"
|
|
1253
|
-
};
|
|
1254
|
-
var DEFAULT_PER_PAGE = 10;
|
|
1255
|
-
function ConversationDocumentsPanel({
|
|
1256
|
-
conversationId,
|
|
1257
|
-
open,
|
|
1258
|
-
perPage = DEFAULT_PER_PAGE,
|
|
1259
|
-
labels: labelsOverride,
|
|
1260
|
-
className,
|
|
1261
|
-
classNames
|
|
1262
|
-
}) {
|
|
1263
|
-
const labels = { ...DEFAULT_CONVERSATION_DOCUMENTS_LABELS, ...labelsOverride };
|
|
1264
|
-
const context = useConversations();
|
|
1265
|
-
const [search, setSearch] = useState8("");
|
|
1266
|
-
const [sourceFilter, setSourceFilter] = useState8(DOCUMENT_SOURCE_FILTER.ALL);
|
|
1267
|
-
const [sortDirection, setSortDirection] = useState8("desc");
|
|
1268
|
-
const [page, setPage] = useState8(1);
|
|
1269
|
-
const [selectedIds, setSelectedIds] = useState8([]);
|
|
1270
|
-
const [archiveError, setArchiveError] = useState8(false);
|
|
1271
|
-
const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
|
|
1272
|
-
const { documents, total, loading, error } = useConversationDocuments(open ? conversationId : void 0, {
|
|
1273
|
-
search,
|
|
1274
|
-
page,
|
|
1275
|
-
limit: perPage,
|
|
1276
|
-
sortDirection,
|
|
1277
|
-
...sourceFilter === DOCUMENT_SOURCE_FILTER.ALL ? {} : { source: sourceFilter }
|
|
1278
|
-
});
|
|
1279
|
-
const lastPage = Math.max(1, Math.ceil(total / perPage));
|
|
1280
|
-
function applyFilter(change) {
|
|
1281
|
-
change();
|
|
1282
|
-
setPage(1);
|
|
1283
|
-
}
|
|
1284
|
-
async function handleOpen(uploadId, disposition) {
|
|
1285
|
-
const url = await context?.api.getDocumentUrl(uploadId, disposition);
|
|
1286
|
-
if (url) window.open(url, "_blank", "noopener,noreferrer");
|
|
1287
|
-
}
|
|
1288
|
-
const canArchive = typeof context?.api.downloadDocumentsArchive === "function";
|
|
1289
|
-
const pageIds = documents.map((document2) => document2.id);
|
|
1290
|
-
const allOnPageSelected = pageIds.length > 0 && pageIds.every((id) => selectedIds.includes(id));
|
|
1291
|
-
function toggleSelected(uploadId) {
|
|
1292
|
-
setArchiveError(false);
|
|
1293
|
-
setSelectedIds(
|
|
1294
|
-
(current) => current.includes(uploadId) ? current.filter((id) => id !== uploadId) : [...current, uploadId]
|
|
1295
|
-
);
|
|
1296
|
-
}
|
|
1297
|
-
function toggleAllOnPage() {
|
|
1298
|
-
setArchiveError(false);
|
|
1299
|
-
setSelectedIds(
|
|
1300
|
-
(current) => allOnPageSelected ? current.filter((id) => !pageIds.includes(id)) : [...current, ...pageIds.filter((id) => !current.includes(id))]
|
|
1301
|
-
);
|
|
1302
|
-
}
|
|
1303
|
-
async function handleDownloadSelected() {
|
|
1304
|
-
const archive = context?.api.downloadDocumentsArchive;
|
|
1305
|
-
if (!archive || selectedIds.length === 0) return;
|
|
1306
|
-
setArchiveError(false);
|
|
1307
|
-
try {
|
|
1308
|
-
const blob = await archive(conversationId, selectedIds);
|
|
1309
|
-
const url = URL.createObjectURL(blob);
|
|
1310
|
-
const anchor = document.createElement("a");
|
|
1311
|
-
anchor.href = url;
|
|
1312
|
-
anchor.download = `conversa-${conversationId}.zip`;
|
|
1313
|
-
anchor.click();
|
|
1314
|
-
URL.revokeObjectURL(url);
|
|
1315
|
-
setSelectedIds([]);
|
|
1316
|
-
} catch {
|
|
1317
|
-
setArchiveError(true);
|
|
1318
|
-
}
|
|
1319
|
-
}
|
|
1320
|
-
if (!open) return null;
|
|
1321
|
-
return /* @__PURE__ */ jsx15("div", { className: cn("border-b", classNames?.root, className), children: /* @__PURE__ */ jsxs12("section", { className: cn("px-4 py-3", classNames?.body), children: [
|
|
1322
|
-
/* @__PURE__ */ jsx15("p", { className: cn("mb-2 text-sm font-medium", classNames?.title), children: labels.title }),
|
|
1323
|
-
/* @__PURE__ */ jsxs12("div", { className: cn("mb-2 flex flex-wrap items-center gap-2 border-b pb-2", classNames?.filters), children: [
|
|
1324
|
-
/* @__PURE__ */ jsx15(
|
|
1325
|
-
"input",
|
|
1326
|
-
{
|
|
1327
|
-
type: "search",
|
|
1328
|
-
value: search,
|
|
1329
|
-
onChange: (event) => applyFilter(() => setSearch(event.target.value)),
|
|
1330
|
-
placeholder: labels.searchPlaceholder,
|
|
1331
|
-
"aria-label": labels.searchPlaceholder,
|
|
1332
|
-
className: cn("w-full rounded-md border px-3 py-2 text-sm sm:w-52", classNames?.search)
|
|
1333
|
-
}
|
|
1334
|
-
),
|
|
1335
|
-
/* @__PURE__ */ jsxs12(
|
|
1336
|
-
"select",
|
|
1337
|
-
{
|
|
1338
|
-
value: sourceFilter,
|
|
1339
|
-
onChange: (event) => applyFilter(() => setSourceFilter(event.target.value)),
|
|
1340
|
-
"aria-label": labels.sourceFilterAll,
|
|
1341
|
-
className: cn("w-full rounded-md border px-2 py-2 text-sm sm:w-36", classNames?.sourceSelect),
|
|
1342
|
-
children: [
|
|
1343
|
-
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
|
|
1344
|
-
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
|
|
1345
|
-
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
|
|
1346
|
-
]
|
|
1347
|
-
}
|
|
1348
|
-
),
|
|
1349
|
-
/* @__PURE__ */ jsxs12(
|
|
1350
|
-
"button",
|
|
1351
|
-
{
|
|
1352
|
-
type: "button",
|
|
1353
|
-
onClick: () => applyFilter(() => setSortDirection(sortDirection === "desc" ? "asc" : "desc")),
|
|
1354
|
-
className: cn("cv-header-action inline-flex items-center gap-1", classNames?.sortButton),
|
|
1355
|
-
children: [
|
|
1356
|
-
/* @__PURE__ */ jsx15(ArrowUpDown, { size: 14 }),
|
|
1357
|
-
sortDirection === "desc" ? labels.sortMostRecent : labels.sortOldest
|
|
1358
|
-
]
|
|
1359
|
-
}
|
|
1360
|
-
),
|
|
1361
|
-
hasFilters ? /* @__PURE__ */ jsx15(
|
|
1362
|
-
"button",
|
|
1363
|
-
{
|
|
1364
|
-
type: "button",
|
|
1365
|
-
onClick: () => applyFilter(() => {
|
|
1366
|
-
setSearch("");
|
|
1367
|
-
setSourceFilter(DOCUMENT_SOURCE_FILTER.ALL);
|
|
1368
|
-
setSortDirection("desc");
|
|
1369
|
-
}),
|
|
1370
|
-
className: cn("cv-header-action", classNames?.clearButton),
|
|
1371
|
-
children: labels.clearFilters
|
|
1372
|
-
}
|
|
1373
|
-
) : null
|
|
1374
|
-
] }),
|
|
1375
|
-
loading ? /* @__PURE__ */ jsx15("p", { className: cn("text-xs text-gray-500", classNames?.status), children: labels.loading }) : null,
|
|
1376
|
-
error ? /* @__PURE__ */ jsx15("p", { role: "alert", className: cn("text-xs text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
|
|
1377
|
-
!loading && !error && documents.length === 0 ? /* @__PURE__ */ jsx15("p", { className: cn("text-xs text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
|
|
1378
|
-
canArchive && documents.length > 0 ? /* @__PURE__ */ jsxs12("div", { className: cn("mb-2 flex flex-wrap items-center gap-3 text-xs", classNames?.selectionBar), children: [
|
|
1379
|
-
/* @__PURE__ */ jsxs12("label", { className: "inline-flex items-center gap-1.5", children: [
|
|
1380
|
-
/* @__PURE__ */ jsx15(
|
|
1381
|
-
"input",
|
|
1382
|
-
{
|
|
1383
|
-
type: "checkbox",
|
|
1384
|
-
checked: allOnPageSelected,
|
|
1385
|
-
onChange: toggleAllOnPage,
|
|
1386
|
-
className: cn(classNames?.checkbox)
|
|
1387
|
-
}
|
|
1388
|
-
),
|
|
1389
|
-
labels.selectAll
|
|
1390
|
-
] }),
|
|
1391
|
-
selectedIds.length > 0 ? /* @__PURE__ */ jsx15("button", { type: "button", onClick: () => void handleDownloadSelected(), className: "cv-header-action", children: labels.downloadSelected(selectedIds.length) }) : null,
|
|
1392
|
-
archiveError ? /* @__PURE__ */ jsx15("span", { role: "alert", className: "text-red-600 dark:text-red-400", children: labels.archiveFailed }) : null
|
|
1393
|
-
] }) : null,
|
|
1394
|
-
/* @__PURE__ */ jsx15("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
|
|
1395
|
-
const isFromCustomer = !TEAM_SOURCES.has(document2.source);
|
|
1396
|
-
const SourceIcon = isFromCustomer ? Users : Bot;
|
|
1397
|
-
return /* @__PURE__ */ jsxs12(
|
|
1398
|
-
"li",
|
|
1399
|
-
{
|
|
1400
|
-
className: cn(
|
|
1401
|
-
"flex items-center justify-between gap-2 rounded-lg border px-3 py-2 dark:border-gray-700",
|
|
1402
|
-
classNames?.item
|
|
1403
|
-
),
|
|
1404
|
-
children: [
|
|
1405
|
-
/* @__PURE__ */ jsxs12("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
1406
|
-
canArchive ? /* @__PURE__ */ jsx15(
|
|
1407
|
-
"input",
|
|
1408
|
-
{
|
|
1409
|
-
type: "checkbox",
|
|
1410
|
-
checked: selectedIds.includes(document2.id),
|
|
1411
|
-
onChange: () => toggleSelected(document2.id),
|
|
1412
|
-
"aria-label": `${labels.download}: ${document2.filename}`,
|
|
1413
|
-
className: cn("shrink-0", classNames?.checkbox)
|
|
1414
|
-
}
|
|
1415
|
-
) : null,
|
|
1416
|
-
/* @__PURE__ */ jsx15(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
|
|
1417
|
-
/* @__PURE__ */ jsxs12("div", { className: "min-w-0 flex-1", children: [
|
|
1418
|
-
/* @__PURE__ */ jsxs12(
|
|
1419
|
-
"div",
|
|
1420
|
-
{
|
|
1421
|
-
className: cn(
|
|
1422
|
-
"mb-0.5 flex items-center gap-1 text-[11px] font-medium",
|
|
1423
|
-
isFromCustomer ? "text-blue-600 dark:text-blue-400" : "text-emerald-600 dark:text-emerald-400",
|
|
1424
|
-
classNames?.sourceBadge
|
|
1425
|
-
),
|
|
1426
|
-
children: [
|
|
1427
|
-
/* @__PURE__ */ jsx15(SourceIcon, { size: 11 }),
|
|
1428
|
-
isFromCustomer ? labels.sourceFilterCustomer : labels.sourceFilterTeam
|
|
1429
|
-
]
|
|
1430
|
-
}
|
|
1431
|
-
),
|
|
1432
|
-
/* @__PURE__ */ jsx15(
|
|
1433
|
-
"div",
|
|
1434
|
-
{
|
|
1435
|
-
className: cn("truncate text-sm font-medium", classNames?.filename),
|
|
1436
|
-
title: document2.filename,
|
|
1437
|
-
children: document2.filename
|
|
1438
|
-
}
|
|
1439
|
-
),
|
|
1440
|
-
/* @__PURE__ */ jsxs12("div", { className: cn("text-xs text-gray-500 dark:text-gray-400", classNames?.meta), children: [
|
|
1441
|
-
formatDateTime(document2.linkedAt),
|
|
1442
|
-
" \xB7 ",
|
|
1443
|
-
formatFileSize(document2.sizeBytes)
|
|
1444
|
-
] })
|
|
1445
|
-
] })
|
|
1446
|
-
] }),
|
|
1447
|
-
/* @__PURE__ */ jsxs12("div", { className: "flex shrink-0 gap-1", children: [
|
|
1448
|
-
/* @__PURE__ */ jsx15(
|
|
1449
|
-
"button",
|
|
1450
|
-
{
|
|
1451
|
-
type: "button",
|
|
1452
|
-
onClick: () => void handleOpen(document2.id, "inline"),
|
|
1453
|
-
title: labels.view,
|
|
1454
|
-
"aria-label": `${labels.view}: ${document2.filename}`,
|
|
1455
|
-
className: cn("cv-header-icon", classNames?.viewButton),
|
|
1456
|
-
children: /* @__PURE__ */ jsx15(Eye, { size: 14 })
|
|
1457
|
-
}
|
|
1458
|
-
),
|
|
1459
|
-
/* @__PURE__ */ jsx15(
|
|
1460
|
-
"button",
|
|
1461
|
-
{
|
|
1462
|
-
type: "button",
|
|
1463
|
-
onClick: () => void handleOpen(document2.id, "attachment"),
|
|
1464
|
-
title: labels.download,
|
|
1465
|
-
"aria-label": `${labels.download}: ${document2.filename}`,
|
|
1466
|
-
className: cn("cv-header-icon", classNames?.downloadButton),
|
|
1467
|
-
children: /* @__PURE__ */ jsx15(Download, { size: 14 })
|
|
1468
|
-
}
|
|
1469
|
-
)
|
|
1470
|
-
] })
|
|
1471
|
-
]
|
|
1472
|
-
},
|
|
1473
|
-
document2.id
|
|
1474
|
-
);
|
|
1475
|
-
}) }),
|
|
1476
|
-
total > perPage ? /* @__PURE__ */ jsxs12(
|
|
1477
|
-
"div",
|
|
1478
|
-
{
|
|
1479
|
-
className: cn(
|
|
1480
|
-
"mt-2 flex items-center justify-between border-t pt-2 text-xs dark:border-gray-700",
|
|
1481
|
-
classNames?.pagination
|
|
1482
|
-
),
|
|
1483
|
-
children: [
|
|
1484
|
-
/* @__PURE__ */ jsx15("span", { className: "text-gray-400", children: labels.total(total) }),
|
|
1485
|
-
/* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
|
|
1486
|
-
/* @__PURE__ */ jsx15(
|
|
1487
|
-
"button",
|
|
1488
|
-
{
|
|
1489
|
-
type: "button",
|
|
1490
|
-
onClick: () => setPage(page - 1),
|
|
1491
|
-
disabled: page <= 1,
|
|
1492
|
-
"aria-label": labels.sortOldest,
|
|
1493
|
-
className: "cv-header-icon disabled:opacity-40",
|
|
1494
|
-
children: "\u2039"
|
|
1495
|
-
}
|
|
1496
|
-
),
|
|
1497
|
-
/* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
|
|
1498
|
-
/* @__PURE__ */ jsx15(
|
|
1499
|
-
"button",
|
|
1500
|
-
{
|
|
1501
|
-
type: "button",
|
|
1502
|
-
onClick: () => setPage(page + 1),
|
|
1503
|
-
disabled: page >= lastPage,
|
|
1504
|
-
"aria-label": labels.sortMostRecent,
|
|
1505
|
-
className: "cv-header-icon disabled:opacity-40",
|
|
1506
|
-
children: "\u203A"
|
|
1507
|
-
}
|
|
1508
|
-
)
|
|
1509
|
-
] })
|
|
1510
|
-
]
|
|
1511
|
-
}
|
|
1512
|
-
) : null
|
|
1513
|
-
] }) });
|
|
1514
|
-
}
|
|
1515
|
-
|
|
1516
1145
|
// src/conversationTranscript.ts
|
|
1517
1146
|
var SENDER_LABEL = {
|
|
1518
1147
|
customer: "Cliente",
|
|
@@ -1549,7 +1178,7 @@ function downloadTextFile(filename, content) {
|
|
|
1549
1178
|
}
|
|
1550
1179
|
|
|
1551
1180
|
// src/useWaitingNotifications.ts
|
|
1552
|
-
import { useState as
|
|
1181
|
+
import { useState as useState7, useEffect as useEffect4, useRef as useRef3, useCallback as useCallback3 } from "react";
|
|
1553
1182
|
var DEFAULT_POLL_INTERVAL_MS = 1e4;
|
|
1554
1183
|
var DEFAULT_LIMIT = 50;
|
|
1555
1184
|
var DEFAULT_LABELS = {
|
|
@@ -1558,17 +1187,17 @@ var DEFAULT_LABELS = {
|
|
|
1558
1187
|
};
|
|
1559
1188
|
function useWaitingNotifications(params) {
|
|
1560
1189
|
const conversationsContext = useConversations();
|
|
1561
|
-
const [conversations, setConversations] =
|
|
1562
|
-
const previousUnreadMap =
|
|
1563
|
-
const notifiedIds =
|
|
1564
|
-
const isPollingRef =
|
|
1190
|
+
const [conversations, setConversations] = useState7([]);
|
|
1191
|
+
const previousUnreadMap = useRef3(/* @__PURE__ */ new Map());
|
|
1192
|
+
const notifiedIds = useRef3(/* @__PURE__ */ new Set());
|
|
1193
|
+
const isPollingRef = useRef3(false);
|
|
1565
1194
|
const isEnabled = params?.enabled ?? true;
|
|
1566
1195
|
const intervalMs = params?.intervalMs ?? DEFAULT_POLL_INTERVAL_MS;
|
|
1567
1196
|
const icon = params?.icon;
|
|
1568
1197
|
const listParams = params?.params;
|
|
1569
1198
|
const labelTitle = params?.labels?.title ?? DEFAULT_LABELS.title;
|
|
1570
1199
|
const labelBody = params?.labels?.body ?? DEFAULT_LABELS.body;
|
|
1571
|
-
const refresh =
|
|
1200
|
+
const refresh = useCallback3(async () => {
|
|
1572
1201
|
if (!conversationsContext || isPollingRef.current) return;
|
|
1573
1202
|
isPollingRef.current = true;
|
|
1574
1203
|
try {
|
|
@@ -1593,7 +1222,7 @@ function useWaitingNotifications(params) {
|
|
|
1593
1222
|
isPollingRef.current = false;
|
|
1594
1223
|
}
|
|
1595
1224
|
}, [conversationsContext, listParams, icon, labelTitle, labelBody]);
|
|
1596
|
-
|
|
1225
|
+
useEffect4(() => {
|
|
1597
1226
|
if (!isEnabled) return;
|
|
1598
1227
|
if (typeof window !== "undefined" && "Notification" in window && Notification.permission === "default") {
|
|
1599
1228
|
Notification.requestPermission();
|
|
@@ -1608,7 +1237,7 @@ function useWaitingNotifications(params) {
|
|
|
1608
1237
|
|
|
1609
1238
|
// src/settings/WhatsAppTemplateSettingsForm.tsx
|
|
1610
1239
|
import { Plus, RefreshCw, Save, Trash2 } from "lucide-react";
|
|
1611
|
-
import { jsx as
|
|
1240
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1612
1241
|
var DEFAULT_LABELS2 = {
|
|
1613
1242
|
sectionTitle: "WhatsApp",
|
|
1614
1243
|
sectionDescription: "Template usado para reabrir a janela de 24h com o cliente.",
|
|
@@ -1667,16 +1296,16 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1667
1296
|
}
|
|
1668
1297
|
onVariablesChange([...variables, token]);
|
|
1669
1298
|
}
|
|
1670
|
-
return /* @__PURE__ */
|
|
1671
|
-
/* @__PURE__ */
|
|
1672
|
-
/* @__PURE__ */
|
|
1673
|
-
/* @__PURE__ */
|
|
1299
|
+
return /* @__PURE__ */ jsxs12("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
|
|
1300
|
+
/* @__PURE__ */ jsxs12("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
|
|
1301
|
+
/* @__PURE__ */ jsx14("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
|
|
1302
|
+
/* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
|
|
1674
1303
|
] }),
|
|
1675
|
-
/* @__PURE__ */
|
|
1676
|
-
/* @__PURE__ */
|
|
1677
|
-
/* @__PURE__ */
|
|
1678
|
-
/* @__PURE__ */
|
|
1679
|
-
/* @__PURE__ */
|
|
1304
|
+
/* @__PURE__ */ jsxs12("form", { onSubmit: onSave, className: "p-6 space-y-4", children: [
|
|
1305
|
+
/* @__PURE__ */ jsxs12("div", { children: [
|
|
1306
|
+
/* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between mb-1.5", children: [
|
|
1307
|
+
/* @__PURE__ */ jsx14("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.templateLabel }),
|
|
1308
|
+
/* @__PURE__ */ jsxs12(
|
|
1680
1309
|
"button",
|
|
1681
1310
|
{
|
|
1682
1311
|
type: "button",
|
|
@@ -1684,31 +1313,31 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1684
1313
|
disabled: loadingTemplates,
|
|
1685
1314
|
className: "flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400 hover:underline disabled:opacity-50",
|
|
1686
1315
|
children: [
|
|
1687
|
-
/* @__PURE__ */
|
|
1316
|
+
/* @__PURE__ */ jsx14(RefreshCw, { size: 11, className: loadingTemplates ? "animate-spin" : "" }),
|
|
1688
1317
|
labels.refreshList
|
|
1689
1318
|
]
|
|
1690
1319
|
}
|
|
1691
1320
|
)
|
|
1692
1321
|
] }),
|
|
1693
|
-
templatesError && /* @__PURE__ */
|
|
1322
|
+
templatesError && /* @__PURE__ */ jsxs12("div", { className: "mb-2 rounded-lg bg-amber-50 dark:bg-amber-950/40 border border-amber-200 dark:border-amber-800 px-3 py-2 text-xs text-amber-700 dark:text-amber-400", children: [
|
|
1694
1323
|
labels.errorLoading,
|
|
1695
|
-
/* @__PURE__ */
|
|
1696
|
-
/* @__PURE__ */
|
|
1324
|
+
/* @__PURE__ */ jsx14("br", {}),
|
|
1325
|
+
/* @__PURE__ */ jsxs12("span", { className: "text-gray-500 dark:text-gray-400 mt-0.5 block", children: [
|
|
1697
1326
|
labels.currentNameSaved,
|
|
1698
1327
|
" ",
|
|
1699
|
-
/* @__PURE__ */
|
|
1328
|
+
/* @__PURE__ */ jsx14("strong", { children: selectedTemplateName || "\u2014" })
|
|
1700
1329
|
] })
|
|
1701
1330
|
] }),
|
|
1702
|
-
loadingTemplates && /* @__PURE__ */
|
|
1703
|
-
!loadingTemplates && !templatesError && /* @__PURE__ */
|
|
1331
|
+
loadingTemplates && /* @__PURE__ */ jsx14("div", { className: "h-10 rounded-xl bg-gray-100 dark:bg-gray-700 animate-pulse" }),
|
|
1332
|
+
!loadingTemplates && !templatesError && /* @__PURE__ */ jsxs12(
|
|
1704
1333
|
"select",
|
|
1705
1334
|
{
|
|
1706
1335
|
value: selectedTemplateName,
|
|
1707
1336
|
onChange: (e) => handleSelect(e.target.value),
|
|
1708
1337
|
className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
|
|
1709
1338
|
children: [
|
|
1710
|
-
/* @__PURE__ */
|
|
1711
|
-
templates.map((template) => /* @__PURE__ */
|
|
1339
|
+
/* @__PURE__ */ jsx14("option", { value: "", children: labels.selectPlaceholder }),
|
|
1340
|
+
templates.map((template) => /* @__PURE__ */ jsxs12("option", { value: template.name, disabled: template.status !== "APPROVED", children: [
|
|
1712
1341
|
template.displayName,
|
|
1713
1342
|
" \xB7 ",
|
|
1714
1343
|
template.shortId,
|
|
@@ -1720,27 +1349,27 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1720
1349
|
]
|
|
1721
1350
|
}
|
|
1722
1351
|
),
|
|
1723
|
-
selected?.bodyText && /* @__PURE__ */
|
|
1352
|
+
selected?.bodyText && /* @__PURE__ */ jsx14("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2 text-xs text-gray-600 dark:text-gray-300 whitespace-pre-wrap", children: selected.bodyText })
|
|
1724
1353
|
] }),
|
|
1725
|
-
/* @__PURE__ */
|
|
1726
|
-
/* @__PURE__ */
|
|
1727
|
-
/* @__PURE__ */
|
|
1728
|
-
/* @__PURE__ */
|
|
1354
|
+
/* @__PURE__ */ jsxs12("div", { children: [
|
|
1355
|
+
/* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between mb-1.5", children: [
|
|
1356
|
+
/* @__PURE__ */ jsx14("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.variablesLabel }),
|
|
1357
|
+
/* @__PURE__ */ jsxs12(
|
|
1729
1358
|
"button",
|
|
1730
1359
|
{
|
|
1731
1360
|
type: "button",
|
|
1732
1361
|
onClick: () => onVariablesChange([...variables, ""]),
|
|
1733
1362
|
className: "flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400 hover:underline",
|
|
1734
1363
|
children: [
|
|
1735
|
-
/* @__PURE__ */
|
|
1364
|
+
/* @__PURE__ */ jsx14(Plus, { size: 12 }),
|
|
1736
1365
|
labels.addVariable
|
|
1737
1366
|
]
|
|
1738
1367
|
}
|
|
1739
1368
|
)
|
|
1740
1369
|
] }),
|
|
1741
|
-
availableVariables.length > 0 && /* @__PURE__ */
|
|
1742
|
-
/* @__PURE__ */
|
|
1743
|
-
/* @__PURE__ */
|
|
1370
|
+
availableVariables.length > 0 && /* @__PURE__ */ jsxs12("div", { className: "mb-3 rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700/40 p-2.5", children: [
|
|
1371
|
+
/* @__PURE__ */ jsx14("p", { className: "text-xs font-medium text-gray-600 dark:text-gray-300 mb-1.5", children: labels.variablesAvailableTitle }),
|
|
1372
|
+
/* @__PURE__ */ jsx14("div", { className: "flex flex-wrap gap-1.5", children: availableVariables.map((available) => /* @__PURE__ */ jsxs12(
|
|
1744
1373
|
"button",
|
|
1745
1374
|
{
|
|
1746
1375
|
type: "button",
|
|
@@ -1748,8 +1377,8 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1748
1377
|
title: `Inserir ${available.token}`,
|
|
1749
1378
|
className: "inline-flex items-center gap-1 rounded-md border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-800 px-2 py-1 text-xs hover:border-blue-400 dark:hover:border-blue-500 transition-colors",
|
|
1750
1379
|
children: [
|
|
1751
|
-
/* @__PURE__ */
|
|
1752
|
-
/* @__PURE__ */
|
|
1380
|
+
/* @__PURE__ */ jsx14("code", { className: "text-blue-600 dark:text-blue-300", children: available.token }),
|
|
1381
|
+
/* @__PURE__ */ jsxs12("span", { className: "text-gray-400 dark:text-gray-500", children: [
|
|
1753
1382
|
"\xB7 ",
|
|
1754
1383
|
available.label
|
|
1755
1384
|
] })
|
|
@@ -1757,13 +1386,13 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1757
1386
|
},
|
|
1758
1387
|
available.token
|
|
1759
1388
|
)) }),
|
|
1760
|
-
/* @__PURE__ */
|
|
1389
|
+
/* @__PURE__ */ jsx14("p", { className: "mt-1.5 text-[11px] text-gray-400 dark:text-gray-500", children: labels.variablesAvailableHint })
|
|
1761
1390
|
] }),
|
|
1762
|
-
/* @__PURE__ */
|
|
1763
|
-
variables.length === 0 && /* @__PURE__ */
|
|
1764
|
-
/* @__PURE__ */
|
|
1765
|
-
/* @__PURE__ */
|
|
1766
|
-
/* @__PURE__ */
|
|
1391
|
+
/* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-400 dark:text-gray-500 mb-2", children: labels.variablesMappingHint }),
|
|
1392
|
+
variables.length === 0 && /* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-400 dark:text-gray-500 italic", children: labels.noVariables }),
|
|
1393
|
+
/* @__PURE__ */ jsx14("div", { className: "space-y-2", children: variables.map((variable, index) => /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
|
|
1394
|
+
/* @__PURE__ */ jsx14("span", { className: "text-xs text-gray-400 dark:text-gray-500 w-6 text-right flex-shrink-0", children: `{{${index + 1}}}` }),
|
|
1395
|
+
/* @__PURE__ */ jsx14(
|
|
1767
1396
|
"input",
|
|
1768
1397
|
{
|
|
1769
1398
|
type: "text",
|
|
@@ -1773,27 +1402,27 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1773
1402
|
className: "flex-1 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all placeholder:text-gray-400 dark:placeholder:text-gray-500"
|
|
1774
1403
|
}
|
|
1775
1404
|
),
|
|
1776
|
-
/* @__PURE__ */
|
|
1405
|
+
/* @__PURE__ */ jsx14(
|
|
1777
1406
|
"button",
|
|
1778
1407
|
{
|
|
1779
1408
|
type: "button",
|
|
1780
1409
|
onClick: () => removeVariable(index),
|
|
1781
1410
|
className: "text-gray-400 hover:text-red-500 dark:hover:text-red-400 transition-colors flex-shrink-0",
|
|
1782
1411
|
title: labels.removeVariable,
|
|
1783
|
-
children: /* @__PURE__ */
|
|
1412
|
+
children: /* @__PURE__ */ jsx14(Trash2, { size: 14 })
|
|
1784
1413
|
}
|
|
1785
1414
|
)
|
|
1786
1415
|
] }, index)) })
|
|
1787
1416
|
] }),
|
|
1788
|
-
saveSuccess && /* @__PURE__ */
|
|
1789
|
-
/* @__PURE__ */
|
|
1417
|
+
saveSuccess && /* @__PURE__ */ jsx14("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
|
|
1418
|
+
/* @__PURE__ */ jsx14("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs12(
|
|
1790
1419
|
"button",
|
|
1791
1420
|
{
|
|
1792
1421
|
type: "submit",
|
|
1793
1422
|
disabled: saving || !selectedTemplateName.trim(),
|
|
1794
1423
|
className: "flex items-center gap-2 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
|
|
1795
1424
|
children: [
|
|
1796
|
-
saving ? /* @__PURE__ */
|
|
1425
|
+
saving ? /* @__PURE__ */ jsx14("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx14(Save, { size: 14 }),
|
|
1797
1426
|
saving ? labels.saving : labels.save
|
|
1798
1427
|
]
|
|
1799
1428
|
}
|
|
@@ -1804,12 +1433,13 @@ function WhatsAppTemplateSettingsForm({
|
|
|
1804
1433
|
|
|
1805
1434
|
// src/settings/WhatsAppCreateTemplateForm.tsx
|
|
1806
1435
|
import { SendHorizonal } from "lucide-react";
|
|
1807
|
-
import { jsx as
|
|
1436
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1808
1437
|
var DEFAULT_LABELS3 = {
|
|
1809
1438
|
sectionTitle: "Criar novo template",
|
|
1810
1439
|
sectionDescription: "Envia um template para aprova\xE7\xE3o da Meta.",
|
|
1811
1440
|
nameLabel: "Nome do template",
|
|
1812
1441
|
nameHint: "Somente letras min\xFAsculas, n\xFAmeros e underscore.",
|
|
1442
|
+
namePlaceholder: "reengajamento_cliente",
|
|
1813
1443
|
categoryLabel: "Categoria",
|
|
1814
1444
|
languageLabel: "Idioma",
|
|
1815
1445
|
headerLabel: "Cabe\xE7alho",
|
|
@@ -1860,77 +1490,77 @@ function WhatsAppCreateTemplateForm({
|
|
|
1860
1490
|
function set(key, next) {
|
|
1861
1491
|
onChange({ ...value, [key]: next });
|
|
1862
1492
|
}
|
|
1863
|
-
return /* @__PURE__ */
|
|
1864
|
-
/* @__PURE__ */
|
|
1865
|
-
/* @__PURE__ */
|
|
1866
|
-
/* @__PURE__ */
|
|
1493
|
+
return /* @__PURE__ */ jsxs13("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
|
|
1494
|
+
/* @__PURE__ */ jsxs13("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
|
|
1495
|
+
/* @__PURE__ */ jsx15("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
|
|
1496
|
+
/* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
|
|
1867
1497
|
] }),
|
|
1868
|
-
/* @__PURE__ */
|
|
1869
|
-
/* @__PURE__ */
|
|
1870
|
-
/* @__PURE__ */
|
|
1871
|
-
/* @__PURE__ */
|
|
1872
|
-
/* @__PURE__ */
|
|
1498
|
+
/* @__PURE__ */ jsxs13("form", { onSubmit, className: "p-6 space-y-4", children: [
|
|
1499
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1500
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.nameLabel }),
|
|
1501
|
+
/* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.nameHint }),
|
|
1502
|
+
/* @__PURE__ */ jsx15(
|
|
1873
1503
|
"input",
|
|
1874
1504
|
{
|
|
1875
1505
|
type: "text",
|
|
1876
1506
|
value: value.name,
|
|
1877
1507
|
onChange: (e) => set("name", e.target.value.toLowerCase().replace(/[^a-z0-9_]/g, "_")),
|
|
1878
|
-
placeholder:
|
|
1508
|
+
placeholder: labels.namePlaceholder,
|
|
1879
1509
|
className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
|
|
1880
1510
|
required: true
|
|
1881
1511
|
}
|
|
1882
1512
|
)
|
|
1883
1513
|
] }),
|
|
1884
|
-
/* @__PURE__ */
|
|
1885
|
-
/* @__PURE__ */
|
|
1886
|
-
/* @__PURE__ */
|
|
1887
|
-
/* @__PURE__ */
|
|
1514
|
+
/* @__PURE__ */ jsxs13("div", { className: "grid grid-cols-2 gap-3", children: [
|
|
1515
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1516
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.categoryLabel }),
|
|
1517
|
+
/* @__PURE__ */ jsxs13(
|
|
1888
1518
|
"select",
|
|
1889
1519
|
{
|
|
1890
1520
|
value: value.category,
|
|
1891
1521
|
onChange: (e) => set("category", e.target.value),
|
|
1892
1522
|
className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
|
|
1893
1523
|
children: [
|
|
1894
|
-
/* @__PURE__ */
|
|
1895
|
-
/* @__PURE__ */
|
|
1524
|
+
/* @__PURE__ */ jsx15("option", { value: "UTILITY", children: "UTILITY (Transacional)" }),
|
|
1525
|
+
/* @__PURE__ */ jsx15("option", { value: "MARKETING", children: "MARKETING (Promocional)" })
|
|
1896
1526
|
]
|
|
1897
1527
|
}
|
|
1898
1528
|
)
|
|
1899
1529
|
] }),
|
|
1900
|
-
/* @__PURE__ */
|
|
1901
|
-
/* @__PURE__ */
|
|
1902
|
-
/* @__PURE__ */
|
|
1530
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1531
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.languageLabel }),
|
|
1532
|
+
/* @__PURE__ */ jsxs13(
|
|
1903
1533
|
"select",
|
|
1904
1534
|
{
|
|
1905
1535
|
value: value.language,
|
|
1906
1536
|
onChange: (e) => set("language", e.target.value),
|
|
1907
1537
|
className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
|
|
1908
1538
|
children: [
|
|
1909
|
-
/* @__PURE__ */
|
|
1910
|
-
/* @__PURE__ */
|
|
1911
|
-
/* @__PURE__ */
|
|
1539
|
+
/* @__PURE__ */ jsx15("option", { value: "pt_BR", children: "Portugu\xEAs (Brasil)" }),
|
|
1540
|
+
/* @__PURE__ */ jsx15("option", { value: "en_US", children: "Ingl\xEAs (EUA)" }),
|
|
1541
|
+
/* @__PURE__ */ jsx15("option", { value: "es_ES", children: "Espanhol" })
|
|
1912
1542
|
]
|
|
1913
1543
|
}
|
|
1914
1544
|
)
|
|
1915
1545
|
] })
|
|
1916
1546
|
] }),
|
|
1917
|
-
/* @__PURE__ */
|
|
1918
|
-
/* @__PURE__ */
|
|
1919
|
-
/* @__PURE__ */
|
|
1920
|
-
/* @__PURE__ */
|
|
1921
|
-
/* @__PURE__ */
|
|
1547
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1548
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.headerLabel }),
|
|
1549
|
+
/* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.headerHint }),
|
|
1550
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex gap-2", children: [
|
|
1551
|
+
/* @__PURE__ */ jsxs13(
|
|
1922
1552
|
"select",
|
|
1923
1553
|
{
|
|
1924
1554
|
value: value.headerType,
|
|
1925
1555
|
onChange: (e) => set("headerType", e.target.value),
|
|
1926
1556
|
className: "border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 transition-all",
|
|
1927
1557
|
children: [
|
|
1928
|
-
/* @__PURE__ */
|
|
1929
|
-
/* @__PURE__ */
|
|
1558
|
+
/* @__PURE__ */ jsx15("option", { value: "NONE", children: labels.headerNone }),
|
|
1559
|
+
/* @__PURE__ */ jsx15("option", { value: "TEXT", children: labels.headerText })
|
|
1930
1560
|
]
|
|
1931
1561
|
}
|
|
1932
1562
|
),
|
|
1933
|
-
value.headerType === "TEXT" && /* @__PURE__ */
|
|
1563
|
+
value.headerType === "TEXT" && /* @__PURE__ */ jsx15(
|
|
1934
1564
|
"input",
|
|
1935
1565
|
{
|
|
1936
1566
|
type: "text",
|
|
@@ -1943,10 +1573,10 @@ function WhatsAppCreateTemplateForm({
|
|
|
1943
1573
|
)
|
|
1944
1574
|
] })
|
|
1945
1575
|
] }),
|
|
1946
|
-
/* @__PURE__ */
|
|
1947
|
-
/* @__PURE__ */
|
|
1948
|
-
/* @__PURE__ */
|
|
1949
|
-
/* @__PURE__ */
|
|
1576
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1577
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.bodyLabel }),
|
|
1578
|
+
/* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.bodyHint }),
|
|
1579
|
+
/* @__PURE__ */ jsx15(
|
|
1950
1580
|
"textarea",
|
|
1951
1581
|
{
|
|
1952
1582
|
value: value.bodyText,
|
|
@@ -1957,26 +1587,26 @@ function WhatsAppCreateTemplateForm({
|
|
|
1957
1587
|
required: true
|
|
1958
1588
|
}
|
|
1959
1589
|
),
|
|
1960
|
-
detectedVariables.length > 0 && /* @__PURE__ */
|
|
1961
|
-
/* @__PURE__ */
|
|
1962
|
-
/* @__PURE__ */
|
|
1963
|
-
/* @__PURE__ */
|
|
1964
|
-
/* @__PURE__ */
|
|
1590
|
+
detectedVariables.length > 0 && /* @__PURE__ */ jsxs13("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2", children: [
|
|
1591
|
+
/* @__PURE__ */ jsx15("p", { className: "font-medium text-gray-500 dark:text-gray-400 mb-1.5 uppercase tracking-wide text-xs", children: labels.detectedVariables }),
|
|
1592
|
+
/* @__PURE__ */ jsx15("div", { className: "flex flex-wrap gap-2", children: detectedVariables.map((num) => /* @__PURE__ */ jsxs13("span", { className: "inline-flex items-center gap-1 text-xs", children: [
|
|
1593
|
+
/* @__PURE__ */ jsx15("code", { className: "bg-blue-100 dark:bg-blue-900/40 text-blue-700 dark:text-blue-300 px-1.5 py-0.5 rounded font-mono", children: `{{${num}}}` }),
|
|
1594
|
+
/* @__PURE__ */ jsxs13("span", { className: "text-gray-400 dark:text-gray-500", children: [
|
|
1965
1595
|
"= ",
|
|
1966
1596
|
variableExamples[Number(num) - 1] ?? labels.variableLabel(Number(num))
|
|
1967
1597
|
] })
|
|
1968
1598
|
] }, num)) }),
|
|
1969
|
-
/* @__PURE__ */
|
|
1599
|
+
/* @__PURE__ */ jsxs13("p", { className: "text-gray-400 dark:text-gray-500 mt-1.5 text-xs", children: [
|
|
1970
1600
|
labels.configureHintPrefix,
|
|
1971
|
-
/* @__PURE__ */
|
|
1601
|
+
/* @__PURE__ */ jsx15("strong", { children: labels.configureHintLink }),
|
|
1972
1602
|
labels.configureHintSuffix
|
|
1973
1603
|
] })
|
|
1974
1604
|
] })
|
|
1975
1605
|
] }),
|
|
1976
|
-
/* @__PURE__ */
|
|
1977
|
-
/* @__PURE__ */
|
|
1978
|
-
/* @__PURE__ */
|
|
1979
|
-
/* @__PURE__ */
|
|
1606
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1607
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.footerLabel }),
|
|
1608
|
+
/* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.footerHint }),
|
|
1609
|
+
/* @__PURE__ */ jsx15(
|
|
1980
1610
|
"input",
|
|
1981
1611
|
{
|
|
1982
1612
|
type: "text",
|
|
@@ -1988,48 +1618,48 @@ function WhatsAppCreateTemplateForm({
|
|
|
1988
1618
|
}
|
|
1989
1619
|
)
|
|
1990
1620
|
] }),
|
|
1991
|
-
/* @__PURE__ */
|
|
1992
|
-
/* @__PURE__ */
|
|
1993
|
-
/* @__PURE__ */
|
|
1994
|
-
/* @__PURE__ */
|
|
1995
|
-
/* @__PURE__ */
|
|
1996
|
-
/* @__PURE__ */
|
|
1997
|
-
/* @__PURE__ */
|
|
1998
|
-
/* @__PURE__ */
|
|
1621
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1622
|
+
/* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 block", children: labels.previewLabel }),
|
|
1623
|
+
/* @__PURE__ */ jsxs13("div", { className: "rounded-2xl bg-[#e5ddd5] dark:bg-[#1a1a2e] border border-gray-300 dark:border-gray-600 overflow-hidden shadow-inner", children: [
|
|
1624
|
+
/* @__PURE__ */ jsxs13("div", { className: "bg-[#075e54] px-4 py-2.5 flex items-center gap-2", children: [
|
|
1625
|
+
/* @__PURE__ */ jsx15("div", { className: "w-8 h-8 rounded-full bg-white/20 flex items-center justify-center text-white text-xs font-bold", children: previewCompanyName.slice(0, 2).toUpperCase() }),
|
|
1626
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
1627
|
+
/* @__PURE__ */ jsx15("p", { className: "text-white text-xs font-semibold leading-tight", children: previewCompanyName }),
|
|
1628
|
+
/* @__PURE__ */ jsx15("p", { className: "text-white/60 text-xs", children: labels.previewOnline })
|
|
1999
1629
|
] })
|
|
2000
1630
|
] }),
|
|
2001
|
-
/* @__PURE__ */
|
|
2002
|
-
/* @__PURE__ */
|
|
2003
|
-
/* @__PURE__ */
|
|
2004
|
-
/* @__PURE__ */
|
|
1631
|
+
/* @__PURE__ */ jsxs13("div", { className: "px-3 py-4 space-y-3", style: { minHeight: "120px" }, children: [
|
|
1632
|
+
/* @__PURE__ */ jsx15("div", { className: "flex justify-start", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs13("div", { className: "bg-white dark:bg-gray-700 rounded-lg rounded-tl-none px-3 py-2 shadow-sm", children: [
|
|
1633
|
+
/* @__PURE__ */ jsx15("p", { className: "text-gray-500 dark:text-gray-400 leading-tight text-sm", children: labels.previewDescription }),
|
|
1634
|
+
/* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-500 mt-1 text-right text-[9px]", children: "12:00" })
|
|
2005
1635
|
] }) }),
|
|
2006
|
-
/* @__PURE__ */
|
|
2007
|
-
value.headerType === "TEXT" && value.headerText && /* @__PURE__ */
|
|
2008
|
-
/* @__PURE__ */
|
|
2009
|
-
value.footerText && /* @__PURE__ */
|
|
2010
|
-
/* @__PURE__ */
|
|
1636
|
+
/* @__PURE__ */ jsx15("div", { className: "flex justify-end ml-auto", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs13("div", { className: "bg-[#dcf8c6] dark:bg-[#1b5e20] rounded-lg rounded-tr-none px-3 py-2 shadow-sm", children: [
|
|
1637
|
+
value.headerType === "TEXT" && value.headerText && /* @__PURE__ */ jsx15("p", { className: "text-xs font-bold text-gray-700 dark:text-gray-200 mb-1", children: fillPreviewTokens(value.headerText) || labels.previewHeaderFallback }),
|
|
1638
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm text-gray-800 dark:text-gray-100 leading-relaxed", children: value.bodyText ? fillPreviewTokens(value.bodyText) : /* @__PURE__ */ jsx15("span", { className: "text-gray-400 italic", children: labels.previewBodyPlaceholder }) }),
|
|
1639
|
+
value.footerText && /* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-xs", children: value.footerText }),
|
|
1640
|
+
/* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-right text-[9px]", children: "12:01 \u2713" })
|
|
2011
1641
|
] }) })
|
|
2012
1642
|
] })
|
|
2013
1643
|
] })
|
|
2014
1644
|
] }),
|
|
2015
|
-
result && /* @__PURE__ */
|
|
1645
|
+
result && /* @__PURE__ */ jsxs13(
|
|
2016
1646
|
"div",
|
|
2017
1647
|
{
|
|
2018
1648
|
className: `rounded-xl px-4 py-3 text-sm ${result.ok ? "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 text-green-700 dark:text-green-400" : "bg-red-50 dark:bg-red-950/40 border border-red-200 dark:border-red-800 text-red-700 dark:text-red-400"}`,
|
|
2019
1649
|
children: [
|
|
2020
1650
|
result.message,
|
|
2021
|
-
result.ok && result.status && /* @__PURE__ */
|
|
1651
|
+
result.ok && result.status && /* @__PURE__ */ jsx15("p", { className: "text-xs mt-1 opacity-75", children: labels.successStatus(result.status) })
|
|
2022
1652
|
]
|
|
2023
1653
|
}
|
|
2024
1654
|
),
|
|
2025
|
-
/* @__PURE__ */
|
|
1655
|
+
/* @__PURE__ */ jsx15("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs13(
|
|
2026
1656
|
"button",
|
|
2027
1657
|
{
|
|
2028
1658
|
type: "submit",
|
|
2029
1659
|
disabled: submitting || !value.name || !value.bodyText,
|
|
2030
1660
|
className: "flex items-center gap-2 bg-emerald-600 hover:bg-emerald-700 disabled:bg-emerald-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
|
|
2031
1661
|
children: [
|
|
2032
|
-
submitting ? /* @__PURE__ */
|
|
1662
|
+
submitting ? /* @__PURE__ */ jsx15("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx15(SendHorizonal, { size: 14 }),
|
|
2033
1663
|
submitting ? labels.sending : labels.sendForApproval
|
|
2034
1664
|
]
|
|
2035
1665
|
}
|
|
@@ -2040,7 +1670,7 @@ function WhatsAppCreateTemplateForm({
|
|
|
2040
1670
|
|
|
2041
1671
|
// src/settings/WelcomeFarewellForm.tsx
|
|
2042
1672
|
import { LogOut, Mail, Save as Save2 } from "lucide-react";
|
|
2043
|
-
import { jsx as
|
|
1673
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2044
1674
|
var DEFAULT_LABELS4 = {
|
|
2045
1675
|
sectionTitle: "Boas-vindas e encerramento",
|
|
2046
1676
|
welcomeMessage: "Mensagem de boas-vindas",
|
|
@@ -2068,15 +1698,15 @@ function WelcomeFarewellForm({
|
|
|
2068
1698
|
labels: labelsOverride
|
|
2069
1699
|
}) {
|
|
2070
1700
|
const labels = { ...DEFAULT_LABELS4, ...labelsOverride };
|
|
2071
|
-
return /* @__PURE__ */
|
|
2072
|
-
/* @__PURE__ */
|
|
2073
|
-
/* @__PURE__ */
|
|
2074
|
-
/* @__PURE__ */
|
|
2075
|
-
/* @__PURE__ */
|
|
2076
|
-
/* @__PURE__ */
|
|
1701
|
+
return /* @__PURE__ */ jsxs14("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
|
|
1702
|
+
/* @__PURE__ */ jsx16("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: /* @__PURE__ */ jsx16("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }) }),
|
|
1703
|
+
/* @__PURE__ */ jsxs14("form", { onSubmit: onSave, className: "p-6 space-y-5", children: [
|
|
1704
|
+
/* @__PURE__ */ jsxs14("div", { children: [
|
|
1705
|
+
/* @__PURE__ */ jsxs14("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
|
|
1706
|
+
/* @__PURE__ */ jsx16(Mail, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
|
|
2077
1707
|
labels.welcomeMessage
|
|
2078
1708
|
] }),
|
|
2079
|
-
/* @__PURE__ */
|
|
1709
|
+
/* @__PURE__ */ jsx16(
|
|
2080
1710
|
WhatsAppMessageEditor,
|
|
2081
1711
|
{
|
|
2082
1712
|
value: welcomeMessage,
|
|
@@ -2085,14 +1715,14 @@ function WelcomeFarewellForm({
|
|
|
2085
1715
|
placeholders: welcomePlaceholders
|
|
2086
1716
|
}
|
|
2087
1717
|
),
|
|
2088
|
-
/* @__PURE__ */
|
|
1718
|
+
/* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.welcomeMessageHint })
|
|
2089
1719
|
] }),
|
|
2090
|
-
/* @__PURE__ */
|
|
2091
|
-
/* @__PURE__ */
|
|
2092
|
-
/* @__PURE__ */
|
|
1720
|
+
/* @__PURE__ */ jsxs14("div", { children: [
|
|
1721
|
+
/* @__PURE__ */ jsxs14("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
|
|
1722
|
+
/* @__PURE__ */ jsx16(LogOut, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
|
|
2093
1723
|
labels.farewellMessage
|
|
2094
1724
|
] }),
|
|
2095
|
-
/* @__PURE__ */
|
|
1725
|
+
/* @__PURE__ */ jsx16(
|
|
2096
1726
|
WhatsAppMessageEditor,
|
|
2097
1727
|
{
|
|
2098
1728
|
value: farewellMessage,
|
|
@@ -2101,17 +1731,17 @@ function WelcomeFarewellForm({
|
|
|
2101
1731
|
placeholders: farewellPlaceholders
|
|
2102
1732
|
}
|
|
2103
1733
|
),
|
|
2104
|
-
/* @__PURE__ */
|
|
1734
|
+
/* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.farewellMessageHint })
|
|
2105
1735
|
] }),
|
|
2106
|
-
saveSuccess && /* @__PURE__ */
|
|
2107
|
-
/* @__PURE__ */
|
|
1736
|
+
saveSuccess && /* @__PURE__ */ jsx16("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
|
|
1737
|
+
/* @__PURE__ */ jsx16("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs14(
|
|
2108
1738
|
"button",
|
|
2109
1739
|
{
|
|
2110
1740
|
type: "submit",
|
|
2111
1741
|
disabled: saving,
|
|
2112
1742
|
className: "flex items-center gap-2 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
|
|
2113
1743
|
children: [
|
|
2114
|
-
saving ? /* @__PURE__ */
|
|
1744
|
+
saving ? /* @__PURE__ */ jsx16("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx16(Save2, { size: 14 }),
|
|
2115
1745
|
saving ? labels.saving : labels.save
|
|
2116
1746
|
]
|
|
2117
1747
|
}
|
|
@@ -2121,8 +1751,8 @@ function WelcomeFarewellForm({
|
|
|
2121
1751
|
}
|
|
2122
1752
|
|
|
2123
1753
|
// src/settings/WhatsAppTemplatesSettings.tsx
|
|
2124
|
-
import { useState as
|
|
2125
|
-
import { jsx as
|
|
1754
|
+
import { useState as useState8 } from "react";
|
|
1755
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2126
1756
|
var TEMPLATE_SETTINGS_TAB = {
|
|
2127
1757
|
SELECT: "select",
|
|
2128
1758
|
CREATE: "create"
|
|
@@ -2137,10 +1767,10 @@ function WhatsAppTemplatesSettings({
|
|
|
2137
1767
|
...settingsProps
|
|
2138
1768
|
}) {
|
|
2139
1769
|
const labels = { ...DEFAULT_TEMPLATES_SETTINGS_LABELS, ...labelsOverride };
|
|
2140
|
-
const [tab, setTab] =
|
|
2141
|
-
return /* @__PURE__ */
|
|
2142
|
-
/* @__PURE__ */
|
|
2143
|
-
/* @__PURE__ */
|
|
1770
|
+
const [tab, setTab] = useState8(TEMPLATE_SETTINGS_TAB.SELECT);
|
|
1771
|
+
return /* @__PURE__ */ jsxs15("div", { className: "space-y-4", children: [
|
|
1772
|
+
/* @__PURE__ */ jsxs15("nav", { className: "flex gap-1 border-b", role: "tablist", children: [
|
|
1773
|
+
/* @__PURE__ */ jsx17(
|
|
2144
1774
|
"button",
|
|
2145
1775
|
{
|
|
2146
1776
|
type: "button",
|
|
@@ -2151,7 +1781,7 @@ function WhatsAppTemplatesSettings({
|
|
|
2151
1781
|
children: labels.selectTab
|
|
2152
1782
|
}
|
|
2153
1783
|
),
|
|
2154
|
-
create ? /* @__PURE__ */
|
|
1784
|
+
create ? /* @__PURE__ */ jsx17(
|
|
2155
1785
|
"button",
|
|
2156
1786
|
{
|
|
2157
1787
|
type: "button",
|
|
@@ -2163,13 +1793,13 @@ function WhatsAppTemplatesSettings({
|
|
|
2163
1793
|
}
|
|
2164
1794
|
) : null
|
|
2165
1795
|
] }),
|
|
2166
|
-
tab === TEMPLATE_SETTINGS_TAB.SELECT ? /* @__PURE__ */
|
|
1796
|
+
tab === TEMPLATE_SETTINGS_TAB.SELECT ? /* @__PURE__ */ jsx17(WhatsAppTemplateSettingsForm, { ...settingsProps }) : create ? /* @__PURE__ */ jsx17(WhatsAppCreateTemplateForm, { ...create }) : null
|
|
2167
1797
|
] });
|
|
2168
1798
|
}
|
|
2169
1799
|
|
|
2170
1800
|
// src/settings/TopicsForm.tsx
|
|
2171
1801
|
import { Megaphone, Save as Save3 } from "lucide-react";
|
|
2172
|
-
import { jsx as
|
|
1802
|
+
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2173
1803
|
var DEFAULT_LABELS5 = {
|
|
2174
1804
|
sectionTitle: "T\xF3picos intermedi\xE1rios",
|
|
2175
1805
|
sectionDescription: "Mensagens autom\xE1ticas para assuntos espec\xEDficos, disparadas quando o cliente demonstra interesse.",
|
|
@@ -2187,19 +1817,19 @@ function TopicsForm({
|
|
|
2187
1817
|
labels: labelsOverride
|
|
2188
1818
|
}) {
|
|
2189
1819
|
const labels = { ...DEFAULT_LABELS5, ...labelsOverride };
|
|
2190
|
-
return /* @__PURE__ */
|
|
2191
|
-
/* @__PURE__ */
|
|
2192
|
-
/* @__PURE__ */
|
|
2193
|
-
/* @__PURE__ */
|
|
1820
|
+
return /* @__PURE__ */ jsxs16("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
|
|
1821
|
+
/* @__PURE__ */ jsxs16("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
|
|
1822
|
+
/* @__PURE__ */ jsxs16("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100 flex items-center gap-2", children: [
|
|
1823
|
+
/* @__PURE__ */ jsx18(Megaphone, { size: 16, className: "text-orange-600 dark:text-orange-400" }),
|
|
2194
1824
|
labels.sectionTitle
|
|
2195
1825
|
] }),
|
|
2196
|
-
/* @__PURE__ */
|
|
1826
|
+
/* @__PURE__ */ jsx18("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
|
|
2197
1827
|
] }),
|
|
2198
|
-
/* @__PURE__ */
|
|
2199
|
-
topics.map((topic) => /* @__PURE__ */
|
|
2200
|
-
/* @__PURE__ */
|
|
2201
|
-
/* @__PURE__ */
|
|
2202
|
-
/* @__PURE__ */
|
|
1828
|
+
/* @__PURE__ */ jsxs16("form", { onSubmit: onSave, className: "p-6 space-y-6", children: [
|
|
1829
|
+
topics.map((topic) => /* @__PURE__ */ jsxs16("div", { className: "space-y-2", children: [
|
|
1830
|
+
/* @__PURE__ */ jsxs16("div", { className: "flex items-start gap-4", children: [
|
|
1831
|
+
/* @__PURE__ */ jsx18("div", { className: "flex-1", children: /* @__PURE__ */ jsx18("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: topic.label }) }),
|
|
1832
|
+
/* @__PURE__ */ jsx18(
|
|
2203
1833
|
"button",
|
|
2204
1834
|
{
|
|
2205
1835
|
type: "button",
|
|
@@ -2207,7 +1837,7 @@ function TopicsForm({
|
|
|
2207
1837
|
className: `relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none ${topic.enabled ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-700"}`,
|
|
2208
1838
|
role: "switch",
|
|
2209
1839
|
"aria-checked": topic.enabled,
|
|
2210
|
-
children: /* @__PURE__ */
|
|
1840
|
+
children: /* @__PURE__ */ jsx18(
|
|
2211
1841
|
"span",
|
|
2212
1842
|
{
|
|
2213
1843
|
className: `pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${topic.enabled ? "translate-x-5" : "translate-x-0"}`
|
|
@@ -2216,7 +1846,7 @@ function TopicsForm({
|
|
|
2216
1846
|
}
|
|
2217
1847
|
)
|
|
2218
1848
|
] }),
|
|
2219
|
-
/* @__PURE__ */
|
|
1849
|
+
/* @__PURE__ */ jsx18(
|
|
2220
1850
|
"textarea",
|
|
2221
1851
|
{
|
|
2222
1852
|
value: topic.message,
|
|
@@ -2228,27 +1858,27 @@ function TopicsForm({
|
|
|
2228
1858
|
}
|
|
2229
1859
|
)
|
|
2230
1860
|
] }, topic.key)),
|
|
2231
|
-
/* @__PURE__ */
|
|
2232
|
-
/* @__PURE__ */
|
|
1861
|
+
/* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-3", children: [
|
|
1862
|
+
/* @__PURE__ */ jsxs16(
|
|
2233
1863
|
"button",
|
|
2234
1864
|
{
|
|
2235
1865
|
type: "submit",
|
|
2236
1866
|
disabled: saving,
|
|
2237
1867
|
className: "inline-flex items-center gap-2 rounded-lg bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:opacity-50",
|
|
2238
1868
|
children: [
|
|
2239
|
-
/* @__PURE__ */
|
|
1869
|
+
/* @__PURE__ */ jsx18(Save3, { size: 14 }),
|
|
2240
1870
|
labels.saveButton
|
|
2241
1871
|
]
|
|
2242
1872
|
}
|
|
2243
1873
|
),
|
|
2244
|
-
saveSuccess && /* @__PURE__ */
|
|
1874
|
+
saveSuccess && /* @__PURE__ */ jsx18("span", { className: "text-sm text-green-600 dark:text-green-400", children: labels.saveSuccess })
|
|
2245
1875
|
] })
|
|
2246
1876
|
] })
|
|
2247
1877
|
] });
|
|
2248
1878
|
}
|
|
2249
1879
|
|
|
2250
1880
|
// src/hooks/useConversationMessages.ts
|
|
2251
|
-
import { useCallback as
|
|
1881
|
+
import { useCallback as useCallback4 } from "react";
|
|
2252
1882
|
function useConversationMessages(conversationId, params) {
|
|
2253
1883
|
const context = useConversations();
|
|
2254
1884
|
if (!context) {
|
|
@@ -2259,7 +1889,7 @@ function useConversationMessages(conversationId, params) {
|
|
|
2259
1889
|
() => api.fetchMessages(conversationId, params),
|
|
2260
1890
|
[conversationId, params?.limit, params?.before]
|
|
2261
1891
|
);
|
|
2262
|
-
const sendMessage =
|
|
1892
|
+
const sendMessage = useCallback4(
|
|
2263
1893
|
async (text) => {
|
|
2264
1894
|
const message = await api.sendMessage(conversationId, text);
|
|
2265
1895
|
await refetch();
|
|
@@ -2267,7 +1897,7 @@ function useConversationMessages(conversationId, params) {
|
|
|
2267
1897
|
},
|
|
2268
1898
|
[api, conversationId, refetch]
|
|
2269
1899
|
);
|
|
2270
|
-
const sendMedia =
|
|
1900
|
+
const sendMedia = useCallback4(
|
|
2271
1901
|
async (mediaData) => {
|
|
2272
1902
|
const message = await api.sendMedia(conversationId, mediaData);
|
|
2273
1903
|
await refetch();
|
|
@@ -2275,14 +1905,14 @@ function useConversationMessages(conversationId, params) {
|
|
|
2275
1905
|
},
|
|
2276
1906
|
[api, conversationId, refetch]
|
|
2277
1907
|
);
|
|
2278
|
-
const sendTemplate =
|
|
1908
|
+
const sendTemplate = useCallback4(
|
|
2279
1909
|
async (templateData) => {
|
|
2280
1910
|
await api.sendTemplate(conversationId, templateData);
|
|
2281
1911
|
await refetch();
|
|
2282
1912
|
},
|
|
2283
1913
|
[api, conversationId, refetch]
|
|
2284
1914
|
);
|
|
2285
|
-
const markRead =
|
|
1915
|
+
const markRead = useCallback4(() => api.markRead(conversationId), [api, conversationId]);
|
|
2286
1916
|
return { messages: data ?? [], loading, error, refetch, sendMessage, sendMedia, sendTemplate, markRead };
|
|
2287
1917
|
}
|
|
2288
1918
|
|
|
@@ -2316,12 +1946,12 @@ function useConversationContext(conversationId) {
|
|
|
2316
1946
|
}
|
|
2317
1947
|
|
|
2318
1948
|
// src/hooks/useConversationRealtime.ts
|
|
2319
|
-
import { useEffect as
|
|
1949
|
+
import { useEffect as useEffect5, useRef as useRef4 } from "react";
|
|
2320
1950
|
function useConversationRealtime(conversationId, onEvent) {
|
|
2321
1951
|
const context = useConversations();
|
|
2322
|
-
const onEventRef =
|
|
1952
|
+
const onEventRef = useRef4(onEvent);
|
|
2323
1953
|
onEventRef.current = onEvent;
|
|
2324
|
-
|
|
1954
|
+
useEffect5(() => {
|
|
2325
1955
|
if (!context || !conversationId) return;
|
|
2326
1956
|
const source = context.sse.connectConversationStream(conversationId);
|
|
2327
1957
|
const handler = (event) => onEventRef.current(event);
|
|
@@ -2334,9 +1964,9 @@ function useConversationRealtime(conversationId, onEvent) {
|
|
|
2334
1964
|
}
|
|
2335
1965
|
function useGlobalRealtime(onEvent) {
|
|
2336
1966
|
const context = useConversations();
|
|
2337
|
-
const onEventRef =
|
|
1967
|
+
const onEventRef = useRef4(onEvent);
|
|
2338
1968
|
onEventRef.current = onEvent;
|
|
2339
|
-
|
|
1969
|
+
useEffect5(() => {
|
|
2340
1970
|
if (!context) return;
|
|
2341
1971
|
const source = context.sse.connectGlobalStream();
|
|
2342
1972
|
const handler = (event) => onEventRef.current(event);
|
|
@@ -2396,13 +2026,21 @@ export {
|
|
|
2396
2026
|
ConversationRow,
|
|
2397
2027
|
ConversationWallpaper,
|
|
2398
2028
|
ConversationsProvider,
|
|
2029
|
+
DEFAULT_AVATAR_LABELS,
|
|
2399
2030
|
DEFAULT_CONVERSATION_CHANNEL,
|
|
2400
2031
|
DEFAULT_CONVERSATION_CONTEXT_LABELS,
|
|
2401
2032
|
DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
|
|
2402
2033
|
DEFAULT_CONVERSATION_HEADER_LABELS,
|
|
2034
|
+
DEFAULT_CONVERSATION_LIST_ITEM_LABELS,
|
|
2035
|
+
DEFAULT_DOCUMENTS_LIBRARY_LABELS,
|
|
2036
|
+
DEFAULT_LIGHTBOX_LABELS,
|
|
2037
|
+
DEFAULT_MESSAGE_COMPOSER_LABELS,
|
|
2403
2038
|
DEFAULT_TEMPLATES_SETTINGS_LABELS,
|
|
2039
|
+
DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS,
|
|
2404
2040
|
DEFAULT_WINDOW_EXPIRED_LABELS,
|
|
2041
|
+
DOCUMENT_SOURCE_FILTER,
|
|
2405
2042
|
DateDivider,
|
|
2043
|
+
DocumentsLibrary,
|
|
2406
2044
|
EmojiPicker,
|
|
2407
2045
|
FileIcon,
|
|
2408
2046
|
HANDLE_KIND,
|
|
@@ -2432,6 +2070,7 @@ export {
|
|
|
2432
2070
|
capabilitiesOf,
|
|
2433
2071
|
channelFiltersFor,
|
|
2434
2072
|
contactFlag,
|
|
2073
|
+
createMediaUrlResolver,
|
|
2435
2074
|
downloadTextFile,
|
|
2436
2075
|
formatContactHandle,
|
|
2437
2076
|
formatDateTime,
|