diff --git a/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactHistory.vue b/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactHistory.vue index 463df9ce8..9e8722a07 100644 --- a/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactHistory.vue +++ b/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactHistory.vue @@ -11,8 +11,8 @@ const route = useRoute(); const conversations = useMapGetter( 'contactConversations/getAllConversationsByContactId' ); -const contacts = useMapGetter('contacts/getContact'); -const stateInbox = useMapGetter('inboxes/getInbox'); +const contactsById = useMapGetter('contacts/getContactById'); +const stateInbox = useMapGetter('inboxes/getInboxById'); const accountLabels = useMapGetter('labels/getLabels'); const accountLabelsValue = computed(() => accountLabels.value); @@ -42,7 +42,7 @@ const contactConversations = computed(() => v-if="conversation" :key="conversation.id" :conversation="conversation" - :contact="contacts(conversation.meta.sender.id)" + :contact="contactsById(conversation.meta.sender.id)" :state-inbox="stateInbox(conversation.inboxId)" :account-labels="accountLabelsValue" /> diff --git a/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreview.vue b/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreview.vue index 5740292d2..dfa31e100 100644 --- a/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreview.vue +++ b/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreview.vue @@ -21,9 +21,9 @@ const lastNonActivityMessageContent = computed(() => { const assignee = computed(() => { const { meta: { assignee: agent = {} } = {} } = props.conversation; return { - name: agent.name ?? agent.available_name, + name: agent.name ?? agent.availableName, thumbnail: agent.thumbnail, - status: agent.availability_status, + status: agent.availabilityStatus, }; }); diff --git a/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreviewWithMeta.vue b/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreviewWithMeta.vue index fc5166968..374da1f88 100644 --- a/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreviewWithMeta.vue +++ b/app/javascript/dashboard/components-next/Conversation/ConversationCard/CardMessagePreviewWithMeta.vue @@ -27,9 +27,9 @@ const lastNonActivityMessageContent = computed(() => { const assignee = computed(() => { const { meta: { assignee: agent = {} } = {} } = props.conversation; return { - name: agent.name ?? agent.available_name, + name: agent.name ?? agent.availableName, thumbnail: agent.thumbnail, - status: agent.availability_status, + status: agent.availabilityStatus, }; }); diff --git a/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.story.vue b/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.story.vue index 93c76f5c7..a71ab24d7 100644 --- a/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.story.vue +++ b/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.story.vue @@ -6,19 +6,19 @@ import ConversationCard from './ConversationCard.vue'; const conversationWithoutMeta = { meta: { sender: { - additional_attributes: {}, - availability_status: 'offline', + additionalAttributes: {}, + availabilityStatus: 'offline', email: 'candice@chatwoot.com', id: 29, name: 'Candice Matherson', phone_number: '+918585858585', identifier: null, thumbnail: '', - custom_attributes: { - link_contact: 'https://apple.com', - list_contact: 'Not spam', - text_contact: 'hey', - checkbox_contact: true, + customAttributes: { + linkContact: 'https://apple.com', + listContact: 'Not spam', + textContact: 'hey', + checkboxContact: true, }, last_activity_at: 1712127410, created_at: 1712127389, @@ -26,47 +26,47 @@ const conversationWithoutMeta = { channel: 'Channel::Email', assignee: { id: 1, - account_id: 2, - availability_status: 'online', - auto_offline: false, + accountId: 2, + availabilityStatus: 'online', + autoOffline: false, confirmed: true, email: 'sivin@chatwoot.com', - available_name: 'Sivin', + availableName: 'Sivin', name: 'Sivin', role: 'administrator', thumbnail: '', - custom_role_id: null, + customRoleId: null, }, - hmac_verified: false, + hmacVerified: false, }, id: 38, messages: [ { id: 3597, content: 'Sivin set the priority to low', - account_id: 2, - inbox_id: 7, - conversation_id: 38, - message_type: 2, - created_at: 1730885168, - updated_at: '2024-11-06T09:26:08.565Z', + accountId: 2, + inboxId: 7, + conversationId: 38, + messageType: 2, + createdAt: 1730885168, + updatedAt: '2024-11-06T09:26:08.565Z', private: false, status: 'sent', source_id: null, - content_type: 'text', - content_attributes: {}, - sender_type: null, - sender_id: null, - external_source_ids: {}, - additional_attributes: {}, - processed_message_content: 'Sivin set the priority to low', + contentType: 'text', + contentAttributes: {}, + senderType: null, + senderId: null, + externalSourceIds: {}, + additionalAttributes: {}, + processedMessageContent: 'Sivin set the priority to low', sentiment: {}, conversation: { - assignee_id: 1, - unread_count: 0, - last_activity_at: 1730885168, - contact_inbox: { - source_id: 'candice@chatwoot.com', + assigneeId: 1, + unreadCount: 0, + lastActivityAt: 1730885168, + contactInbox: { + sourceId: 'candice@chatwoot.com', }, }, }, @@ -143,38 +143,38 @@ const conversationWithoutMeta = { const conversationWithMeta = { meta: { sender: { - additional_attributes: {}, - availability_status: 'offline', + additionalAttributes: {}, + availabilityStatus: 'offline', email: 'willy@chatwoot.com', id: 29, name: 'Willy Castelot', - phone_number: '+918585858585', + phoneNumber: '+918585858585', identifier: null, thumbnail: '', - custom_attributes: { - link_contact: 'https://apple.com', - list_contact: 'Not spam', - text_contact: 'hey', - checkbox_contact: true, + customAttributes: { + linkContact: 'https://apple.com', + listContact: 'Not spam', + textContact: 'hey', + checkboxContact: true, }, - last_activity_at: 1712127410, - created_at: 1712127389, + lastActivityAt: 1712127410, + createdAt: 1712127389, }, channel: 'Channel::Email', assignee: { id: 1, - account_id: 2, - availability_status: 'online', - auto_offline: false, + accountId: 2, + availabilityStatus: 'online', + autoOffline: false, confirmed: true, email: 'sivin@chatwoot.com', - available_name: 'Sivin', + availableName: 'Sivin', name: 'Sivin', role: 'administrator', thumbnail: '', - custom_role_id: null, + customRoleId: null, }, - hmac_verified: false, + hmacVerified: false, }, id: 37, messages: [ @@ -182,27 +182,27 @@ const conversationWithMeta = { id: 3599, content: 'If you want to buy our premium supplies,we can offer you a 20% discount! They come with indices and lazer beams!', - account_id: 2, - inbox_id: 7, - conversation_id: 37, - message_type: 1, - created_at: 1730885428, - updated_at: '2024-11-06T09:30:30.619Z', + accountId: 2, + inboxId: 7, + conversationId: 37, + messageType: 1, + createdAt: 1730885428, + updatedAt: '2024-11-06T09:30:30.619Z', private: false, status: 'sent', - source_id: + sourceId: 'conversation/53df668d-329d-420e-8fe9-980cb0e4d63c/messages/3599@paperlayer.test', - content_type: 'text', - content_attributes: { - cc_emails: [], - bcc_emails: [], - to_emails: [], + contentType: 'text', + contentAttributes: { + ccEmails: [], + bccEmails: [], + toEmails: [], }, sender_type: 'User', - sender_id: 1, - external_source_ids: {}, - additional_attributes: {}, - processed_message_content: + senderId: 1, + externalSourceIds: {}, + additionalAttributes: {}, + processedMessageContent: 'If you want to buy our premium supplies,we can offer you a 20% discount! They come with indices and lazer beams!', sentiment: {}, conversation: { @@ -216,10 +216,10 @@ const conversationWithMeta = { sender: { id: 1, name: 'Sivin', - available_name: 'Sivin', - avatar_url: '', + availableName: 'Sivin', + avatarUrl: '', type: 'user', - availability_status: 'online', + availabilityStatus: 'online', thumbnail: '', }, }, @@ -332,31 +332,31 @@ const conversationWithMeta = { }; const contactForConversationWithoutMeta = computed(() => ({ - availability_status: null, + availabilityStatus: null, email: 'candice@chatwoot.com', id: 29, name: 'Candice Matherson', - phone_number: '+918585858585', + phoneNumber: '+918585858585', identifier: null, thumbnail: 'https://api.dicebear.com/9.x/dylan/svg?seed=George', - custom_attributes: {}, + customAttributes: {}, last_activity_at: 1712127410, - created_at: 1712127389, - contact_inboxes: [], + createdAt: 1712127389, + contactInboxes: [], })); const contactForConversationWithMeta = computed(() => ({ - availability_status: null, + availabilityStatus: null, email: 'willy@chatwoot.com', id: 29, name: 'Willy Castelot', - phone_number: '+918585858585', + phoneNumber: '+918585858585', identifier: null, thumbnail: 'https://api.dicebear.com/9.x/dylan/svg?seed=Liam', - custom_attributes: {}, - last_activity_at: 1712127410, - created_at: 1712127389, - contact_inboxes: [], + customAttributes: {}, + lastActivityAt: 1712127410, + createdAt: 1712127389, + contactInboxes: [], })); const webWidgetInbox = computed(() => ({ diff --git a/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.vue b/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.vue index 34a35098b..93a6955ed 100644 --- a/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.vue +++ b/app/javascript/dashboard/components-next/Conversation/ConversationCard/ConversationCard.vue @@ -33,14 +33,16 @@ const currentContact = computed(() => props.contact); const currentContactName = computed(() => currentContact.value?.name); const currentContactThumbnail = computed(() => currentContact.value?.thumbnail); const currentContactStatus = computed( - () => currentContact.value?.availability_status + () => currentContact.value?.availabilityStatus ); const inbox = computed(() => props.stateInbox); +const inboxName = computed(() => inbox.value?.name); + const inboxIcon = computed(() => { - const { phone_number: phoneNumber, channel_type: type } = inbox.value; - return getInboxIconByType(type, phoneNumber); + const { phoneNumber, channelType } = inbox.value; + return getInboxIconByType(channelType, phoneNumber); }); const lastActivityAt = computed(() => { @@ -73,6 +75,7 @@ const showMessagePreviewWithoutMeta = computed(() => {
{ + return Object.keys(object).reduce((acc, key) => { + acc[key.replace(/([A-Z])/g, '_$1').toLowerCase()] = object[key]; + return acc; + }, {}); +}; + const appliedSLA = computed(() => props.conversation?.appliedSla); const isSlaMissed = computed(() => slaStatus.value?.isSlaMissed); @@ -28,7 +37,7 @@ const slaStatusText = computed(() => { const updateSlaStatus = () => { slaStatus.value = evaluateSLAStatus({ - appliedSla: appliedSLA.value, + appliedSla: convertObjectCamelCaseToSnakeCase(appliedSLA.value), chat: props.conversation, }); }; diff --git a/app/javascript/dashboard/store/modules/contactConversations.js b/app/javascript/dashboard/store/modules/contactConversations.js index 8b3c84b5d..55dfcf441 100644 --- a/app/javascript/dashboard/store/modules/contactConversations.js +++ b/app/javascript/dashboard/store/modules/contactConversations.js @@ -77,7 +77,7 @@ export const getters = { }, getAllConversationsByContactId: $state => id => { const records = $state.records[Number(id)] || []; - return camelcaseKeys(records); + return camelcaseKeys(records, { deep: true }); }, }; diff --git a/app/javascript/dashboard/store/modules/contacts/getters.js b/app/javascript/dashboard/store/modules/contacts/getters.js index c72176171..e8fb54b98 100644 --- a/app/javascript/dashboard/store/modules/contacts/getters.js +++ b/app/javascript/dashboard/store/modules/contacts/getters.js @@ -1,3 +1,5 @@ +import camelcaseKeys from 'camelcase-keys'; + export const getters = { getContacts($state) { return $state.sortOrder.map(contactId => $state.records[contactId]); @@ -9,6 +11,10 @@ export const getters = { const contact = $state.records[id]; return contact || {}; }, + getContactById: $state => id => { + const contact = $state.records[id]; + return camelcaseKeys(contact || {}); + }, getMeta: $state => { return $state.meta; }, diff --git a/app/javascript/dashboard/store/modules/inboxes.js b/app/javascript/dashboard/store/modules/inboxes.js index 8e1dbb301..001cc237e 100644 --- a/app/javascript/dashboard/store/modules/inboxes.js +++ b/app/javascript/dashboard/store/modules/inboxes.js @@ -7,6 +7,7 @@ import FBChannel from '../../api/channel/fbChannel'; import TwilioChannel from '../../api/channel/twilioChannel'; import { throwErrorMessage } from '../utils/api'; import AnalyticsHelper from '../../helper/AnalyticsHelper'; +import camelcaseKeys from 'camelcase-keys'; import { ACCOUNT_EVENTS } from '../../helper/AnalyticsHelper/events'; const buildInboxData = inboxParams => { @@ -92,6 +93,12 @@ export const getters = { ); return inbox || {}; }, + getInboxById: $state => inboxId => { + const [inbox] = $state.records.filter( + record => record.id === Number(inboxId) + ); + return camelcaseKeys(inbox || {}, { deep: true }); + }, getUIFlags($state) { return $state.uiFlags; },