FEAT: Agora é possível enviar media utilizando a meta API #1
@ -188,7 +188,7 @@ function MediaRenderer({ message, isAgent }) {
|
||||
|
||||
function AttachmentPreview({ file, onRemove }) {
|
||||
if (!file) return null;
|
||||
const mediaUrl = getMediaUrl({ data: file.data, mimetype: file.type });
|
||||
const mediaUrl = file.previewUrl || '';
|
||||
|
||||
return (
|
||||
<div
|
||||
@ -203,7 +203,7 @@ function AttachmentPreview({ file, onRemove }) {
|
||||
background: '#fff',
|
||||
}}
|
||||
>
|
||||
{file.type?.startsWith('image/') ? (
|
||||
{file.type?.startsWith('image/') && mediaUrl ? (
|
||||
<img
|
||||
src={mediaUrl}
|
||||
alt={file.name}
|
||||
|
||||
@ -16,11 +16,12 @@ import {
|
||||
listWhatsappChats,
|
||||
listWhatsappMessages,
|
||||
releaseWhatsappChat,
|
||||
sendWhatsappMedia,
|
||||
sendWhatsappMessage,
|
||||
transferWhatsappChat,
|
||||
} from '../services/whatsappChatService';
|
||||
|
||||
const MAX_ATTACHMENT_SIZE_BYTES = 15 * 1024 * 1024;
|
||||
const MAX_ATTACHMENT_SIZE_BYTES = 100 * 1024 * 1024;
|
||||
|
||||
function getPresenceByUserId(presenceList, userId) {
|
||||
return presenceList.find((presence) => Number(presence.user_id) === Number(userId)) || null;
|
||||
@ -165,17 +166,6 @@ function dedupeMessages(messages) {
|
||||
return messages.reduce((acc, message) => mergeMessageList(acc, message), []);
|
||||
}
|
||||
|
||||
function fileToBase64(file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader();
|
||||
reader.onload = () => {
|
||||
const result = String(reader.result || '');
|
||||
resolve(result.includes(',') ? result.split(',')[1] : result);
|
||||
};
|
||||
reader.onerror = reject;
|
||||
reader.readAsDataURL(file);
|
||||
});
|
||||
}
|
||||
|
||||
function normalizeComparableContact(contact) {
|
||||
return {
|
||||
@ -581,23 +571,23 @@ export function useChat() {
|
||||
}));
|
||||
}
|
||||
|
||||
async function attachFile(file) {
|
||||
function attachFile(file) {
|
||||
if (!file) return;
|
||||
if (file.size > MAX_ATTACHMENT_SIZE_BYTES) {
|
||||
setApiError('Arquivo muito grande. Envie uma mídia de até 15 MB.');
|
||||
setApiError('Arquivo muito grande. O limite máximo é 100 MB.');
|
||||
return;
|
||||
}
|
||||
|
||||
const data = await fileToBase64(file);
|
||||
setAttachedFile({
|
||||
name: file.name,
|
||||
type: file.type || 'application/octet-stream',
|
||||
data,
|
||||
previewUrl: URL.createObjectURL(file),
|
||||
rawFile: file,
|
||||
});
|
||||
setApiError(null);
|
||||
}
|
||||
|
||||
function removeAttachedFile() {
|
||||
if (attachedFile?.previewUrl) URL.revokeObjectURL(attachedFile.previewUrl);
|
||||
setAttachedFile(null);
|
||||
}
|
||||
|
||||
@ -763,28 +753,23 @@ export function useChat() {
|
||||
return;
|
||||
}
|
||||
|
||||
const media = attachedFile
|
||||
? {
|
||||
data: attachedFile.data,
|
||||
mimetype: attachedFile.type,
|
||||
filename: attachedFile.name,
|
||||
}
|
||||
: null;
|
||||
const fileToSend = attachedFile || null;
|
||||
const newMessage = {
|
||||
id: `temp-${Date.now()}`,
|
||||
chatId: contactId,
|
||||
sender: 'agent',
|
||||
text: trimmed,
|
||||
timestamp: Math.floor(Date.now() / 1000),
|
||||
hasMedia: Boolean(media),
|
||||
media,
|
||||
hasMedia: Boolean(fileToSend),
|
||||
mediaUrl: fileToSend?.previewUrl || null,
|
||||
mediaMimeType: fileToSend?.type || null,
|
||||
};
|
||||
|
||||
setMessagesByContact((current) => ({
|
||||
...current,
|
||||
[contactId]: mergeMessageList(current[contactId] || [], newMessage),
|
||||
}));
|
||||
updateContactPreview(contactId, trimmed || '[Mídia]', media);
|
||||
updateContactPreview(contactId, trimmed || '[Mídia]', fileToSend ? { filename: fileToSend.name } : null);
|
||||
if (contactId === activeContactId) {
|
||||
setDraft('');
|
||||
}
|
||||
@ -793,12 +778,20 @@ export function useChat() {
|
||||
if (!contactId) return;
|
||||
|
||||
try {
|
||||
if (fileToSend) {
|
||||
const form = new FormData();
|
||||
form.append('file', fileToSend.rawFile, fileToSend.name);
|
||||
form.append('to', contactId);
|
||||
form.append('senderName', getUserDisplayName(currentUser));
|
||||
if (trimmed) form.append('caption', trimmed);
|
||||
await sendWhatsappMedia(form);
|
||||
} else {
|
||||
await sendWhatsappMessage({
|
||||
to: contactId,
|
||||
message: trimmed,
|
||||
senderName: getUserDisplayName(currentUser),
|
||||
media,
|
||||
});
|
||||
}
|
||||
|
||||
setApiError(null);
|
||||
updateContact(contactId, (contact) => ({
|
||||
@ -810,7 +803,7 @@ export function useChat() {
|
||||
} catch (error) {
|
||||
setApiError(
|
||||
error.status === 413
|
||||
? 'Arquivo muito grande para envio. Tente uma midia menor.'
|
||||
? 'Arquivo muito grande para envio. Tente uma mídia menor.'
|
||||
: error.message,
|
||||
);
|
||||
}
|
||||
|
||||
@ -56,3 +56,11 @@ export function transferWhatsappChat(payload) {
|
||||
fallbackMessage: 'Nao foi possivel transferir o atendimento.',
|
||||
});
|
||||
}
|
||||
|
||||
export function sendWhatsappMedia(formData) {
|
||||
return apiRequest('/whatsapp/send-media', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
fallbackMessage: 'Não foi possível enviar a mídia.',
|
||||
});
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user