Compare commits

..
892 changed files with 4714 additions and 21965 deletions
+3 -3
View File
@@ -4,8 +4,8 @@
# lint js and vue files # lint js and vue files
npx --no-install lint-staged npx --no-install lint-staged
# lint only staged ruby files that still exist (not deleted) # lint only staged ruby files
git diff --name-only --cached | xargs -I {} sh -c 'test -f "{}" && echo "{}"' | grep '\.rb$' | xargs -I {} bundle exec rubocop --force-exclusion -a "{}" || true git diff --name-only --cached | xargs ls -1 2>/dev/null | grep '\.rb$' | xargs bundle exec rubocop --force-exclusion -a
# stage rubocop changes to files # stage rubocop changes to files
git diff --name-only --cached | xargs -I {} sh -c 'test -f "{}" && git add "{}"' || true git diff --name-only --cached | xargs git add
+5 -5
View File
@@ -485,7 +485,7 @@ GEM
uri uri
net-http-persistent (4.0.2) net-http-persistent (4.0.2)
connection_pool (~> 2.2) connection_pool (~> 2.2)
net-imap (0.4.20) net-imap (0.4.19)
date date
net-protocol net-protocol
net-pop (0.1.2) net-pop (0.1.2)
@@ -501,14 +501,14 @@ GEM
newrelic_rpm (9.6.0) newrelic_rpm (9.6.0)
base64 base64
nio4r (2.7.3) nio4r (2.7.3)
nokogiri (1.18.8) nokogiri (1.18.4)
mini_portile2 (~> 2.8.2) mini_portile2 (~> 2.8.2)
racc (~> 1.4) racc (~> 1.4)
nokogiri (1.18.8-arm64-darwin) nokogiri (1.18.4-arm64-darwin)
racc (~> 1.4) racc (~> 1.4)
nokogiri (1.18.8-x86_64-darwin) nokogiri (1.18.4-x86_64-darwin)
racc (~> 1.4) racc (~> 1.4)
nokogiri (1.18.8-x86_64-linux-gnu) nokogiri (1.18.4-x86_64-linux-gnu)
racc (~> 1.4) racc (~> 1.4)
oauth (1.1.0) oauth (1.1.0)
oauth-tty (~> 1.0, >= 1.0.1) oauth-tty (~> 1.0, >= 1.0.1)
@@ -9,7 +9,7 @@ class Campaigns::CampaignConversationBuilder
@contact_inbox.lock! @contact_inbox.lock!
# We won't send campaigns if a conversation is already present # We won't send campaigns if a conversation is already present
raise 'Conversation already present' if @contact_inbox.reload.conversations.present? raise 'Conversation alread present' if @contact_inbox.reload.conversations.present?
@conversation = ::Conversation.create!(conversation_params) @conversation = ::Conversation.create!(conversation_params)
Messages::MessageBuilder.new(@campaign.sender, @conversation, message_params).perform Messages::MessageBuilder.new(@campaign.sender, @conversation, message_params).perform
@@ -94,10 +94,11 @@ class Messages::Instagram::BaseMessageBuilder < Messages::Messenger::MessageBuil
def build_message def build_message
# Duplicate webhook events may be sent for the same message # Duplicate webhook events may be sent for the same message
# when a user is connected to the Instagram account through both Messenger and Instagram login. # when a user is connected to the Instagram account through both Messenger and Instagram login.
# There is chance for echo events to be sent for the same message.
# Therefore, we need to check if the message already exists before creating it. # Therefore, we need to check if the message already exists before creating it.
return if message_already_exists? return if message_already_exists?
return if @outgoing_echo
return if message_content.blank? && all_unsupported_files? return if message_content.blank? && all_unsupported_files?
@message = conversation.messages.create!(message_params) @message = conversation.messages.create!(message_params)
@@ -37,7 +37,7 @@ class Api::V1::Accounts::AgentBotsController < Api::V1::Accounts::BaseController
end end
def permitted_params def permitted_params
params.permit(:name, :description, :outgoing_url, :avatar, :avatar_url, :bot_type, bot_config: {}) params.permit(:name, :description, :outgoing_url, :avatar, :avatar_url, :bot_type, bot_config: [:csml_content])
end end
def process_avatar_from_url def process_avatar_from_url
@@ -163,16 +163,9 @@ class Api::V1::Accounts::ContactsController < Api::V1::Accounts::BaseController
@contact.custom_attributes @contact.custom_attributes
end end
def contact_additional_attributes
return @contact.additional_attributes.merge(permitted_params[:additional_attributes]) if permitted_params[:additional_attributes]
@contact.additional_attributes
end
def contact_update_params def contact_update_params
permitted_params.except(:custom_attributes, :avatar_url) # we want the merged custom attributes not the original one
.merge({ custom_attributes: contact_custom_attributes }) permitted_params.except(:custom_attributes, :avatar_url).merge({ custom_attributes: contact_custom_attributes })
.merge({ additional_attributes: contact_additional_attributes })
end end
def set_include_contact_inboxes def set_include_contact_inboxes
@@ -1,6 +1,4 @@
class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::Conversations::BaseController class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::Conversations::BaseController
before_action :ensure_api_inbox, only: :update
def index def index
@messages = message_finder.perform @messages = message_finder.perform
end end
@@ -13,11 +11,6 @@ class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::
render_could_not_create_error(e.message) render_could_not_create_error(e.message)
end end
def update
Messages::StatusUpdateService.new(message, permitted_params[:status], permitted_params[:external_error]).perform
@message = message
end
def destroy def destroy
ActiveRecord::Base.transaction do ActiveRecord::Base.transaction do
message.update!(content: I18n.t('conversations.messages.deleted'), content_type: :text, content_attributes: { deleted: true }) message.update!(content: I18n.t('conversations.messages.deleted'), content_type: :text, content_attributes: { deleted: true })
@@ -28,9 +21,7 @@ class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::
def retry def retry
return if message.blank? return if message.blank?
service = Messages::StatusUpdateService.new(message, 'sent') message.update!(status: :sent, content_attributes: {})
service.perform
message.update!(content_attributes: {})
::SendReplyJob.perform_later(message.id) ::SendReplyJob.perform_later(message.id)
rescue StandardError => e rescue StandardError => e
render_could_not_create_error(e.message) render_could_not_create_error(e.message)
@@ -65,16 +56,10 @@ class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::
end end
def permitted_params def permitted_params
params.permit(:id, :target_language, :status, :external_error) params.permit(:id, :target_language)
end end
def already_translated_content_available? def already_translated_content_available?
message.translations.present? && message.translations[permitted_params[:target_language]].present? message.translations.present? && message.translations[permitted_params[:target_language]].present?
end end
# API inbox check
def ensure_api_inbox
# Only API inboxes can update messages
render json: { error: 'Message status update is only allowed for API inboxes' }, status: :forbidden unless @conversation.inbox.api?
end
end end
@@ -44,9 +44,8 @@ class Api::V1::AccountsController < Api::BaseController
end end
def update def update
@account.assign_attributes(account_params.slice(:name, :locale, :domain, :support_email)) @account.assign_attributes(account_params.slice(:name, :locale, :domain, :support_email, :auto_resolve_duration))
@account.custom_attributes.merge!(custom_attributes_params) @account.custom_attributes.merge!(custom_attributes_params)
@account.settings.merge!(settings_params)
@account.custom_attributes['onboarding_step'] = 'invite_team' if @account.custom_attributes['onboarding_step'] == 'account_update' @account.custom_attributes['onboarding_step'] = 'invite_team' if @account.custom_attributes['onboarding_step'] == 'account_update'
@account.save! @account.save!
end end
@@ -84,17 +83,13 @@ class Api::V1::AccountsController < Api::BaseController
end end
def account_params def account_params
params.permit(:account_name, :email, :name, :password, :locale, :domain, :support_email, :user_full_name) params.permit(:account_name, :email, :name, :password, :locale, :domain, :support_email, :auto_resolve_duration, :user_full_name)
end end
def custom_attributes_params def custom_attributes_params
params.permit(:industry, :company_size, :timezone) params.permit(:industry, :company_size, :timezone)
end end
def settings_params
params.permit(:auto_resolve_after, :auto_resolve_message)
end
def check_signup_enabled def check_signup_enabled
raise ActionController::RoutingError, 'Not Found' if GlobalConfigService.load('ENABLE_ACCOUNT_SIGNUP', 'false') == 'false' raise ActionController::RoutingError, 'Not Found' if GlobalConfigService.load('ENABLE_ACCOUNT_SIGNUP', 'false') == 'false'
end end
@@ -2,15 +2,10 @@ class Api::V1::Widget::CampaignsController < Api::V1::Widget::BaseController
skip_before_action :set_contact skip_before_action :set_contact
def index def index
account = @web_widget.inbox.account @campaigns = @web_widget
@campaigns = if account.feature_enabled?('campaigns')
@web_widget
.inbox .inbox
.campaigns .campaigns
.where(enabled: true, account_id: account.id) .where(enabled: true, account_id: @web_widget.inbox.account_id)
.includes(:sender) .includes(:sender)
else
[]
end
end end
end end
@@ -54,7 +54,7 @@ class Api::V2::AccountsController < Api::BaseController
end end
def account_params def account_params
params.permit(:account_name, :email, :name, :password, :locale, :domain, :support_email, :user_full_name) params.permit(:account_name, :email, :name, :password, :locale, :domain, :support_email, :auto_resolve_duration, :user_full_name)
end end
def check_signup_enabled def check_signup_enabled
+1 -2
View File
@@ -36,7 +36,7 @@ class DashboardController < ActionController::Base
'LOGOUT_REDIRECT_LINK', 'LOGOUT_REDIRECT_LINK',
'DISABLE_USER_PROFILE_UPDATE', 'DISABLE_USER_PROFILE_UPDATE',
'DEPLOYMENT_ENV', 'DEPLOYMENT_ENV',
'INSTALLATION_PRICING_PLAN' 'CSML_EDITOR_HOST', 'INSTALLATION_PRICING_PLAN'
).merge(app_config) ).merge(app_config)
end end
@@ -65,7 +65,6 @@ class DashboardController < ActionController::Base
VAPID_PUBLIC_KEY: VapidService.public_key, VAPID_PUBLIC_KEY: VapidService.public_key,
ENABLE_ACCOUNT_SIGNUP: GlobalConfigService.load('ENABLE_ACCOUNT_SIGNUP', 'false'), ENABLE_ACCOUNT_SIGNUP: GlobalConfigService.load('ENABLE_ACCOUNT_SIGNUP', 'false'),
FB_APP_ID: GlobalConfigService.load('FB_APP_ID', ''), FB_APP_ID: GlobalConfigService.load('FB_APP_ID', ''),
INSTAGRAM_APP_ID: GlobalConfigService.load('INSTAGRAM_APP_ID', ''),
FACEBOOK_API_VERSION: GlobalConfigService.load('FACEBOOK_API_VERSION', 'v17.0'), FACEBOOK_API_VERSION: GlobalConfigService.load('FACEBOOK_API_VERSION', 'v17.0'),
IS_ENTERPRISE: ChatwootApp.enterprise?, IS_ENTERPRISE: ChatwootApp.enterprise?,
AZURE_APP_ID: GlobalConfigService.load('AZURE_APP_ID', ''), AZURE_APP_ID: GlobalConfigService.load('AZURE_APP_ID', ''),
@@ -55,7 +55,7 @@ class DeviseOverrides::OmniauthCallbacksController < DeviseTokenAuth::OmniauthCa
def validate_business_account? def validate_business_account?
# return true if the user is a business account, false if it is a gmail account # return true if the user is a business account, false if it is a gmail account
auth_hash['info']['email'].downcase.exclude?('@gmail.com') auth_hash['info']['email'].exclude?('@gmail.com')
end end
def create_account_for_user def create_account_for_user
@@ -66,5 +66,3 @@ class SuperAdmin::AccountsController < SuperAdmin::ApplicationController
# rubocop:enable Rails/I18nLocaleTexts # rubocop:enable Rails/I18nLocaleTexts
end end
end end
SuperAdmin::AccountsController.prepend_mod_with('SuperAdmin::AccountsController')
+6 -32
View File
@@ -9,17 +9,10 @@ class AccountDashboard < Administrate::BaseDashboard
# on pages throughout the dashboard. # on pages throughout the dashboard.
enterprise_attribute_types = if ChatwootApp.enterprise? enterprise_attribute_types = if ChatwootApp.enterprise?
attributes = { {
limits: AccountLimitsField limits: Enterprise::AccountLimitsField,
all_features: Enterprise::AccountFeaturesField
} }
# Only show manually managed features in Chatwoot Cloud deployment
attributes[:manually_managed_features] = ManuallyManagedFeaturesField if ChatwootApp.chatwoot_cloud?
# Add all_features last so it appears after manually_managed_features
attributes[:all_features] = AccountFeaturesField
attributes
else else
{} {}
end end
@@ -53,14 +46,7 @@ class AccountDashboard < Administrate::BaseDashboard
# SHOW_PAGE_ATTRIBUTES # SHOW_PAGE_ATTRIBUTES
# an array of attributes that will be displayed on the model's show page. # an array of attributes that will be displayed on the model's show page.
enterprise_show_page_attributes = if ChatwootApp.enterprise? enterprise_show_page_attributes = ChatwootApp.enterprise? ? %i[custom_attributes limits all_features] : []
attrs = %i[custom_attributes limits]
attrs << :manually_managed_features if ChatwootApp.chatwoot_cloud?
attrs << :all_features
attrs
else
[]
end
SHOW_PAGE_ATTRIBUTES = (%i[ SHOW_PAGE_ATTRIBUTES = (%i[
id id
name name
@@ -75,14 +61,7 @@ class AccountDashboard < Administrate::BaseDashboard
# FORM_ATTRIBUTES # FORM_ATTRIBUTES
# an array of attributes that will be displayed # an array of attributes that will be displayed
# on the model's form (`new` and `edit`) pages. # on the model's form (`new` and `edit`) pages.
enterprise_form_attributes = if ChatwootApp.enterprise? enterprise_form_attributes = ChatwootApp.enterprise? ? %i[limits all_features] : []
attrs = %i[limits]
attrs << :manually_managed_features if ChatwootApp.chatwoot_cloud?
attrs << :all_features
attrs
else
[]
end
FORM_ATTRIBUTES = (%i[ FORM_ATTRIBUTES = (%i[
name name
locale locale
@@ -117,11 +96,6 @@ class AccountDashboard < Administrate::BaseDashboard
# to prevent an error from being raised (wrong number of arguments) # to prevent an error from being raised (wrong number of arguments)
# Reference: https://github.com/thoughtbot/administrate/pull/2356/files#diff-4e220b661b88f9a19ac527c50d6f1577ef6ab7b0bed2bfdf048e22e6bfa74a05R204 # Reference: https://github.com/thoughtbot/administrate/pull/2356/files#diff-4e220b661b88f9a19ac527c50d6f1577ef6ab7b0bed2bfdf048e22e6bfa74a05R204
def permitted_attributes(action) def permitted_attributes(action)
attrs = super + [limits: {}] super + [limits: {}]
# Add manually_managed_features to permitted attributes only for Chatwoot Cloud
attrs << { manually_managed_features: [] } if ChatwootApp.chatwoot_cloud?
attrs
end end
end end
@@ -0,0 +1,7 @@
require 'administrate/field/base'
class Enterprise::AccountFeaturesField < Administrate::Field::Base
def to_s
data
end
end
@@ -1,6 +1,6 @@
require 'administrate/field/base' require 'administrate/field/base'
class AccountLimitsField < Administrate::Field::Base class Enterprise::AccountLimitsField < Administrate::Field::Base
def to_s def to_s
data.present? ? data.to_json : { agents: nil, inboxes: nil, captain_responses: nil, captain_documents: nil }.to_json data.present? ? data.to_json : { agents: nil, inboxes: nil, captain_responses: nil, captain_documents: nil }.to_json
end end
@@ -15,7 +15,7 @@ module SuperAdmin::AccountFeaturesHelper
end end
def self.filter_internal_features(features) def self.filter_internal_features(features)
return features if ChatwootApp.chatwoot_cloud? return features if GlobalConfig.get_value('DEPLOYMENT_ENV') == 'cloud'
internal_features = account_features.select { |f| f['chatwoot_internal'] }.pluck('name') internal_features = account_features.select { |f| f['chatwoot_internal'] }.pluck('name')
features.except(*internal_features) features.except(*internal_features)
-17
View File
@@ -1,26 +1,9 @@
/* global axios */
import ApiClient from './ApiClient'; import ApiClient from './ApiClient';
class AgentBotsAPI extends ApiClient { class AgentBotsAPI extends ApiClient {
constructor() { constructor() {
super('agent_bots', { accountScoped: true }); super('agent_bots', { accountScoped: true });
} }
create(data) {
return axios.post(this.url, data, {
headers: { 'Content-Type': 'multipart/form-data' },
});
}
update(id, data) {
return axios.patch(`${this.url}/${id}`, data, {
headers: { 'Content-Type': 'multipart/form-data' },
});
}
deleteAgentBotAvatar(botId) {
return axios.delete(`${this.url}/${botId}/avatar`);
}
} }
export default new AgentBotsAPI(); export default new AgentBotsAPI();
@@ -14,13 +14,6 @@ class CaptainAssistant extends ApiClient {
}, },
}); });
} }
playground({ assistantId, messageContent, messageHistory }) {
return axios.post(`${this.url}/${assistantId}/playground`, {
message_content: messageContent,
message_history: messageHistory,
});
}
} }
export default new CaptainAssistant(); export default new CaptainAssistant();
@@ -29,19 +29,6 @@
--iris-11: 87 83 198; --iris-11: 87 83 198;
--iris-12: 39 41 98; --iris-12: 39 41 98;
--blue-1: 251 253 255;
--blue-2: 245 249 255;
--blue-3: 233 243 255;
--blue-4: 218 236 255;
--blue-5: 201 226 255;
--blue-6: 181 213 255;
--blue-7: 155 195 252;
--blue-8: 117 171 247;
--blue-9: 39 129 246;
--blue-10: 16 115 233;
--blue-11: 8 109 224;
--blue-12: 11 50 101;
--ruby-1: 255 252 253; --ruby-1: 255 252 253;
--ruby-2: 255 247 248; --ruby-2: 255 247 248;
--ruby-3: 254 234 237; --ruby-3: 254 234 237;
@@ -144,19 +131,6 @@
--iris-11: 158 177 255; --iris-11: 158 177 255;
--iris-12: 224 223 254; --iris-12: 224 223 254;
--blue-1: 10 17 28;
--blue-2: 15 24 38;
--blue-3: 15 39 72;
--blue-4: 10 49 99;
--blue-5: 18 61 117;
--blue-6: 29 84 134;
--blue-7: 40 89 156;
--blue-8: 48 106 186;
--blue-9: 39 129 246;
--blue-10: 21 116 231;
--blue-11: 126 182 255;
--blue-12: 205 227 255;
--ruby-1: 25 17 19; --ruby-1: 25 17 19;
--ruby-2: 30 21 23; --ruby-2: 30 21 23;
--ruby-3: 58 20 30; --ruby-3: 58 20 30;
@@ -1,39 +0,0 @@
<script setup>
import { ref, watch } from 'vue';
const props = defineProps({
title: { type: String, required: true },
isOpen: { type: Boolean, default: false },
});
const isExpanded = ref(props.isOpen);
const toggleAccordion = () => {
isExpanded.value = !isExpanded.value;
};
watch(
() => props.isOpen,
newValue => {
isExpanded.value = newValue;
}
);
</script>
<template>
<div class="border rounded-lg border-n-slate-4">
<button
class="flex items-center justify-between w-full p-4 text-left"
@click="toggleAccordion"
>
<span class="text-sm font-medium text-n-slate-12">{{ title }}</span>
<span
class="w-5 h-5 transition-transform duration-200 i-lucide-chevron-down"
:class="{ 'rotate-180': isExpanded }"
/>
</button>
<div v-if="isExpanded" class="p-4 pt-0">
<slot />
</div>
</div>
</template>
@@ -51,7 +51,6 @@ defineExpose({ dialogRef, contactsFormRef, onSuccess });
<Button <Button
:label="t('DIALOG.BUTTONS.CANCEL')" :label="t('DIALOG.BUTTONS.CANCEL')"
variant="link" variant="link"
type="reset"
class="h-10 hover:!no-underline hover:text-n-brand" class="h-10 hover:!no-underline hover:text-n-brand"
@click="closeDialog" @click="closeDialog"
/> />
@@ -31,6 +31,10 @@ const sortMenus = [
label: t('CONTACTS_LAYOUT.HEADER.ACTIONS.SORT_BY.OPTIONS.EMAIL'), label: t('CONTACTS_LAYOUT.HEADER.ACTIONS.SORT_BY.OPTIONS.EMAIL'),
value: 'email', value: 'email',
}, },
{
label: t('CONTACTS_LAYOUT.HEADER.ACTIONS.SORT_BY.OPTIONS.PHONE_NUMBER'),
value: 'phone_number',
},
{ {
label: t('CONTACTS_LAYOUT.HEADER.ACTIONS.SORT_BY.OPTIONS.COMPANY'), label: t('CONTACTS_LAYOUT.HEADER.ACTIONS.SORT_BY.OPTIONS.COMPANY'),
value: 'company_name', value: 'company_name',
@@ -87,10 +87,8 @@ useKeyboardEvents(keyboardEvents);
<ContactNoteItem <ContactNoteItem
v-for="note in notes" v-for="note in notes"
:key="note.id" :key="note.id"
class="mx-6 py-4"
:note="note" :note="note"
:written-by="getWrittenBy(note)" :written-by="getWrittenBy(note)"
allow-delete
@delete="onDelete" @delete="onDelete"
/> />
</div> </div>
@@ -1,8 +1,6 @@
<script setup> <script setup>
import { useTemplateRef, onMounted, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { dynamicTime } from 'shared/helpers/timeHelper'; import { dynamicTime } from 'shared/helpers/timeHelper';
import { useToggle } from '@vueuse/core';
import { useMessageFormatter } from 'shared/composables/useMessageFormatter'; import { useMessageFormatter } from 'shared/composables/useMessageFormatter';
import Avatar from 'dashboard/components-next/avatar/Avatar.vue'; import Avatar from 'dashboard/components-next/avatar/Avatar.vue';
import Button from 'dashboard/components-next/button/Button.vue'; import Button from 'dashboard/components-next/button/Button.vue';
@@ -16,63 +14,39 @@ const props = defineProps({
type: String, type: String,
required: true, required: true,
}, },
allowDelete: {
type: Boolean,
default: false,
},
collapsible: {
type: Boolean,
default: false,
},
}); });
const emit = defineEmits(['delete']); const emit = defineEmits(['delete']);
const noteContentRef = useTemplateRef('noteContentRef');
const needsCollapse = ref(false);
const [isExpanded, toggleExpanded] = useToggle();
const { t } = useI18n(); const { t } = useI18n();
const { formatMessage } = useMessageFormatter(); const { formatMessage } = useMessageFormatter();
const handleDelete = () => { const handleDelete = () => {
emit('delete', props.note.id); emit('delete', props.note.id);
}; };
onMounted(() => {
if (props.collapsible) {
// Check if content height exceeds approximately 4 lines
// Assuming line height is ~1.625 and font size is ~14px
const threshold = 14 * 1.625 * 4; // ~84px
needsCollapse.value = noteContentRef.value?.clientHeight > threshold;
}
});
</script> </script>
<template> <template>
<div class="flex flex-col gap-2 border-b border-n-strong group/note"> <div
<div class="flex items-center justify-between gap-2"> class="flex flex-col gap-2 py-2 mx-6 border-b border-n-strong group/note"
<div class="flex items-center gap-1.5 min-w-0"> >
<div class="flex items-center justify-between">
<div class="flex items-center gap-1.5 py-2.5 min-w-0">
<Avatar <Avatar
:name="note?.user?.name || 'Bot'" :name="note?.user?.name || 'Bot'"
:src=" :src="note?.user?.thumbnail || '/assets/images/chatwoot_bot.png'"
note?.user?.name
? note?.user?.thumbnail
: '/assets/images/chatwoot_bot.png'
"
:size="16" :size="16"
rounded-full rounded-full
/> />
<div class="min-w-0 truncate"> <div class="min-w-0 truncate">
<span class="inline-flex items-center gap-1 text-sm text-n-slate-11"> <span class="inline-flex items-center gap-1 text-sm text-n-slate-11">
<span class="font-medium text-n-slate-12">{{ writtenBy }}</span> <span class="font-medium">{{ writtenBy }}</span>
{{ t('CONTACTS_LAYOUT.SIDEBAR.NOTES.WROTE') }} {{ t('CONTACTS_LAYOUT.SIDEBAR.NOTES.WROTE') }}
<span class="font-medium text-n-slate-12"> <span class="font-medium">{{ dynamicTime(note.createdAt) }}</span>
{{ dynamicTime(note.createdAt) }}
</span>
</span> </span>
</div> </div>
</div> </div>
<Button <Button
v-if="allowDelete"
variant="faded" variant="faded"
color="ruby" color="ruby"
size="xs" size="xs"
@@ -82,28 +56,8 @@ onMounted(() => {
/> />
</div> </div>
<p <p
ref="noteContentRef"
v-dompurify-html="formatMessage(note.content || '')" v-dompurify-html="formatMessage(note.content || '')"
class="mb-0 prose-sm prose-p:text-sm prose-p:leading-relaxed prose-p:mb-1 prose-p:mt-0 prose-ul:mb-1 prose-ul:mt-0 text-n-slate-12" class="mb-0 prose-sm prose-p:mb-1 prose-p:mt-0 prose-ul:mb-1 prose-ul:mt-0 text-n-slate-12"
:class="{
'line-clamp-4': collapsible && !isExpanded && needsCollapse,
}"
/> />
<p v-if="collapsible && needsCollapse">
<Button
variant="faded"
color="blue"
size="xs"
:icon="isExpanded ? 'i-lucide-chevron-up' : 'i-lucide-chevron-down'"
@click="() => toggleExpanded()"
>
<template v-if="isExpanded">
{{ t('CONTACTS_LAYOUT.SIDEBAR.NOTES.COLLAPSE') }}
</template>
<template v-else>
{{ t('CONTACTS_LAYOUT.SIDEBAR.NOTES.EXPAND') }}
</template>
</Button>
</p>
</div> </div>
</template> </template>
@@ -7,8 +7,8 @@ import { useStore, useStoreGetters } from 'dashboard/composables/store';
import { uploadFile } from 'dashboard/helper/uploadHelper'; import { uploadFile } from 'dashboard/helper/uploadHelper';
import { checkFileSizeLimit } from 'shared/helpers/FileHelper'; import { checkFileSizeLimit } from 'shared/helpers/FileHelper';
import { useVuelidate } from '@vuelidate/core'; import { useVuelidate } from '@vuelidate/core';
import { required, minLength, helpers } from '@vuelidate/validators'; import { required, minLength } from '@vuelidate/validators';
import { shouldBeUrl, isValidSlug } from 'shared/helpers/Validators'; import { shouldBeUrl } from 'shared/helpers/Validators';
import Button from 'dashboard/components-next/button/Button.vue'; import Button from 'dashboard/components-next/button/Button.vue';
import Input from 'dashboard/components-next/input/Input.vue'; import Input from 'dashboard/components-next/input/Input.vue';
@@ -61,16 +61,7 @@ const liveChatWidgets = computed(() => {
const rules = { const rules = {
name: { required, minLength: minLength(2) }, name: { required, minLength: minLength(2) },
slug: { slug: { required },
required: helpers.withMessage(
() => t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.ERROR'),
required
),
isValidSlug: helpers.withMessage(
() => t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.FORMAT_ERROR'),
isValidSlug
),
},
homePageLink: { shouldBeUrl }, homePageLink: { shouldBeUrl },
}; };
@@ -80,9 +71,9 @@ const nameError = computed(() =>
v$.value.name.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.ERROR') : '' v$.value.name.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.ERROR') : ''
); );
const slugError = computed(() => { const slugError = computed(() =>
return v$.value.slug.$errors[0]?.$message || ''; v$.value.slug.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.ERROR') : ''
}); );
const homePageLinkError = computed(() => const homePageLinkError = computed(() =>
v$.value.homePageLink.$error v$.value.homePageLink.$error
@@ -6,9 +6,8 @@ import { useAlert, useTrack } from 'dashboard/composables';
import { PORTALS_EVENTS } from 'dashboard/helper/AnalyticsHelper/events'; import { PORTALS_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
import { convertToCategorySlug } from 'dashboard/helper/commons.js'; import { convertToCategorySlug } from 'dashboard/helper/commons.js';
import { useVuelidate } from '@vuelidate/core'; import { useVuelidate } from '@vuelidate/core';
import { required, minLength, helpers } from '@vuelidate/validators'; import { required, minLength } from '@vuelidate/validators';
import { buildPortalURL } from 'dashboard/helper/portalHelper'; import { buildPortalURL } from 'dashboard/helper/portalHelper';
import { isValidSlug } from 'shared/helpers/Validators';
import Dialog from 'dashboard/components-next/dialog/Dialog.vue'; import Dialog from 'dashboard/components-next/dialog/Dialog.vue';
import Input from 'dashboard/components-next/input/Input.vue'; import Input from 'dashboard/components-next/input/Input.vue';
@@ -32,16 +31,7 @@ const state = reactive({
const rules = { const rules = {
name: { required, minLength: minLength(2) }, name: { required, minLength: minLength(2) },
slug: { slug: { required },
required: helpers.withMessage(
() => t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.ERROR'),
required
),
isValidSlug: helpers.withMessage(
() => t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.FORMAT_ERROR'),
isValidSlug
),
},
}; };
const v$ = useVuelidate(rules, state); const v$ = useVuelidate(rules, state);
@@ -50,9 +40,9 @@ const nameError = computed(() =>
v$.value.name.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.ERROR') : '' v$.value.name.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.ERROR') : ''
); );
const slugError = computed(() => { const slugError = computed(() =>
return v$.value.slug.$errors[0]?.$message || ''; v$.value.slug.$error ? t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.ERROR') : ''
}); );
const isSubmitDisabled = computed(() => v$.value.$invalid); const isSubmitDisabled = computed(() => v$.value.$invalid);
@@ -141,7 +131,6 @@ defineExpose({ dialogRef });
:message=" :message="
nameError || t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.MESSAGE') nameError || t('HELP_CENTER.CREATE_PORTAL_DIALOG.NAME.MESSAGE')
" "
@blur="v$.name.$touch()"
/> />
<Input <Input
id="portal-slug" id="portal-slug"
@@ -151,8 +140,6 @@ defineExpose({ dialogRef });
:label="t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.LABEL')" :label="t('HELP_CENTER.CREATE_PORTAL_DIALOG.SLUG.LABEL')"
:message-type="slugError ? 'error' : 'info'" :message-type="slugError ? 'error' : 'info'"
:message="slugError || buildPortalURL(state.slug)" :message="slugError || buildPortalURL(state.slug)"
@input="v$.slug.$touch()"
@blur="v$.slug.$touch()"
/> />
</div> </div>
</Dialog> </Dialog>
@@ -2,7 +2,6 @@
import { computed } from 'vue'; import { computed } from 'vue';
import { usePolicy } from 'dashboard/composables/usePolicy'; import { usePolicy } from 'dashboard/composables/usePolicy';
import Button from 'dashboard/components-next/button/Button.vue'; import Button from 'dashboard/components-next/button/Button.vue';
import BackButton from 'dashboard/components/widgets/BackButton.vue';
import PaginationFooter from 'dashboard/components-next/pagination/PaginationFooter.vue'; import PaginationFooter from 'dashboard/components-next/pagination/PaginationFooter.vue';
import Spinner from 'dashboard/components-next/spinner/Spinner.vue'; import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
import Policy from 'dashboard/components/policy.vue'; import Policy from 'dashboard/components/policy.vue';
@@ -24,10 +23,6 @@ const props = defineProps({
type: String, type: String,
default: '', default: '',
}, },
backUrl: {
type: [String, Object],
default: '',
},
buttonPolicy: { buttonPolicy: {
type: Array, type: Array,
default: () => [], default: () => [],
@@ -44,10 +39,6 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false, default: false,
}, },
showKnowMore: {
type: Boolean,
default: true,
},
isEmpty: { isEmpty: {
type: Boolean, type: Boolean,
default: false, default: false,
@@ -82,23 +73,19 @@ const handlePageChange = event => {
class="flex items-start lg:items-center justify-between w-full py-6 lg:py-0 lg:h-20 gap-4 lg:gap-2 flex-col lg:flex-row" class="flex items-start lg:items-center justify-between w-full py-6 lg:py-0 lg:h-20 gap-4 lg:gap-2 flex-col lg:flex-row"
> >
<div class="flex gap-4 items-center"> <div class="flex gap-4 items-center">
<BackButton v-if="backUrl" :to="backUrl" />
<slot name="headerTitle"> <slot name="headerTitle">
<span class="text-xl font-medium text-n-slate-12"> <span class="text-xl font-medium text-n-slate-12">
{{ headerTitle }} {{ headerTitle }}
</span> </span>
</slot> </slot>
<div <div v-if="!isEmpty" class="flex items-center gap-2">
v-if="!isEmpty && showKnowMore"
class="flex items-center gap-2"
>
<div class="w-0.5 h-4 rounded-2xl bg-n-weak" /> <div class="w-0.5 h-4 rounded-2xl bg-n-weak" />
<slot name="knowMore" /> <slot name="knowMore" />
</div> </div>
</div> </div>
<div <div
v-if="!showPaywall && buttonLabel" v-if="!showPaywall"
v-on-clickaway="() => emit('close')" v-on-clickaway="() => emit('close')"
class="relative group/campaign-button" class="relative group/campaign-button"
> >
@@ -117,7 +104,7 @@ const handlePageChange = event => {
</div> </div>
</header> </header>
<main class="flex-1 px-6 overflow-y-auto xl:px-0"> <main class="flex-1 px-6 overflow-y-auto xl:px-0">
<div class="w-full max-w-[60rem] h-full mx-auto py-4"> <div class="w-full max-w-[60rem] mx-auto py-4">
<slot v-if="!showPaywall" name="controls" /> <slot v-if="!showPaywall" name="controls" />
<div <div
v-if="isFetching" v-if="isFetching"
@@ -76,12 +76,9 @@ const handleAction = ({ action, value }) => {
<template> <template>
<CardLayout> <CardLayout>
<div class="flex justify-between w-full gap-1"> <div class="flex justify-between w-full gap-1">
<router-link <span class="text-base text-n-slate-12 line-clamp-1">
:to="{ name: 'captain_assistants_edit', params: { assistantId: id } }"
class="text-base text-n-slate-12 line-clamp-1 hover:underline transition-colors"
>
{{ name }} {{ name }}
</router-link> </span>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div <div
v-on-clickaway="() => toggleDropdown(false)" v-on-clickaway="() => toggleDropdown(false)"
@@ -1,111 +0,0 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import NextButton from 'dashboard/components-next/button/Button.vue';
import MessageList from './MessageList.vue';
import CaptainAssistant from 'dashboard/api/captain/assistant';
const { assistantId } = defineProps({
assistantId: {
type: Number,
required: true,
},
});
const { t } = useI18n();
const messages = ref([]);
const newMessage = ref('');
const isLoading = ref(false);
const formatMessagesForApi = () => {
return messages.value.map(message => ({
role: message.sender,
content: message.content,
}));
};
const resetConversation = () => {
messages.value = [];
newMessage.value = '';
};
const sendMessage = async () => {
if (!newMessage.value.trim() || isLoading.value) return;
const userMessage = {
content: newMessage.value,
sender: 'user',
timestamp: new Date().toISOString(),
};
messages.value.push(userMessage);
const currentMessage = newMessage.value;
newMessage.value = '';
try {
isLoading.value = true;
const { data } = await CaptainAssistant.playground({
assistantId,
messageContent: currentMessage,
messageHistory: formatMessagesForApi(),
});
messages.value.push({
content: data.response,
sender: 'assistant',
timestamp: new Date().toISOString(),
});
} catch (error) {
// eslint-disable-next-line no-console
console.error('Error getting assistant response:', error);
} finally {
isLoading.value = false;
}
};
</script>
<template>
<div
class="flex flex-col h-full rounded-lg p-4 border border-n-slate-4 text-n-slate-11"
>
<div class="mb-4">
<div class="flex justify-between items-center mb-1">
<h3 class="text-lg font-medium">
{{ t('CAPTAIN.PLAYGROUND.HEADER') }}
</h3>
<NextButton
ghost
size="small"
icon="i-lucide-rotate-ccw"
@click="resetConversation"
/>
</div>
<p class="text-sm text-n-slate-11">
{{ t('CAPTAIN.PLAYGROUND.DESCRIPTION') }}
</p>
</div>
<MessageList :messages="messages" :is-loading="isLoading" />
<div
class="flex items-center bg-n-solid-1 outline outline-n-container rounded-lg p-3"
>
<input
v-model="newMessage"
class="flex-1 bg-transparent border-none focus:outline-none text-sm mb-0"
:placeholder="t('CAPTAIN.PLAYGROUND.MESSAGE_PLACEHOLDER')"
@keyup.enter="sendMessage"
/>
<NextButton
ghost
size="small"
:disabled="!newMessage.trim()"
icon="i-lucide-send"
@click="sendMessage"
/>
</div>
<p class="text-xs text-n-slate-11 pt-2 text-center">
{{ t('CAPTAIN.PLAYGROUND.CREDIT_NOTE') }}
</p>
</div>
</template>
@@ -1,91 +0,0 @@
<script setup>
import { useI18n } from 'vue-i18n';
import { ref, watch, nextTick } from 'vue';
import Avatar from 'dashboard/components-next/avatar/Avatar.vue';
import { useMessageFormatter } from 'shared/composables/useMessageFormatter';
const props = defineProps({
messages: {
type: Array,
required: true,
},
isLoading: {
type: Boolean,
default: false,
},
});
const messageContainer = ref(null);
const { t } = useI18n();
const { formatMessage } = useMessageFormatter();
const isUserMessage = sender => sender === 'user';
const getMessageAlignment = sender =>
isUserMessage(sender) ? 'justify-end' : 'justify-start';
const getMessageDirection = sender =>
isUserMessage(sender) ? 'flex-row-reverse' : 'flex-row';
const getAvatarName = sender =>
isUserMessage(sender)
? t('CAPTAIN.PLAYGROUND.USER')
: t('CAPTAIN.PLAYGROUND.ASSISTANT');
const getMessageStyle = sender =>
isUserMessage(sender)
? 'bg-n-strong text-n-white'
: 'bg-n-solid-iris text-n-slate-12';
const scrollToBottom = async () => {
await nextTick();
if (messageContainer.value) {
messageContainer.value.scrollTop = messageContainer.value.scrollHeight;
}
};
watch(() => props.messages.length, scrollToBottom);
</script>
<template>
<div ref="messageContainer" class="flex-1 overflow-y-auto mb-4 space-y-2">
<div
v-for="(message, index) in messages"
:key="index"
class="flex"
:class="getMessageAlignment(message.sender)"
>
<div
class="flex items-start gap-1.5"
:class="getMessageDirection(message.sender)"
>
<Avatar :name="getAvatarName(message.sender)" rounded-full :size="24" />
<div
class="max-w-[80%] rounded-lg p-3 text-sm"
:class="getMessageStyle(message.sender)"
>
<div class="break-words" v-html="formatMessage(message.content)" />
</div>
</div>
</div>
<div v-if="isLoading" class="flex justify-start">
<div class="flex items-start gap-1.5">
<Avatar :name="getAvatarName('assistant')" rounded-full :size="24" />
<div
class="max-w-sm rounded-lg p-3 text-sm bg-n-solid-iris text-n-slate-12"
>
<div class="flex gap-1">
<div class="w-2 h-2 rounded-full bg-n-iris-10 animate-bounce" />
<div
class="w-2 h-2 rounded-full bg-n-iris-10 animate-bounce [animation-delay:0.2s]"
/>
<div
class="w-2 h-2 rounded-full bg-n-iris-10 animate-bounce [animation-delay:0.4s]"
/>
</div>
</div>
</div>
</div>
</div>
</template>
@@ -1,306 +0,0 @@
<script setup>
import { reactive, computed, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators';
import { useMapGetter } from 'dashboard/composables/store';
import Input from 'dashboard/components-next/input/Input.vue';
import Button from 'dashboard/components-next/button/Button.vue';
import Editor from 'dashboard/components-next/Editor/Editor.vue';
import Accordion from 'dashboard/components-next/Accordion/Accordion.vue';
const props = defineProps({
mode: {
type: String,
required: true,
validator: value => ['edit', 'create'].includes(value),
},
assistant: {
type: Object,
default: () => ({}),
},
});
const emit = defineEmits(['submit']);
const { t } = useI18n();
const formState = {
uiFlags: useMapGetter('captainAssistants/getUIFlags'),
};
const initialState = {
name: '',
description: '',
productName: '',
welcomeMessage: '',
handoffMessage: '',
resolutionMessage: '',
instructions: '',
features: {
conversationFaqs: false,
memories: false,
},
};
const state = reactive({ ...initialState });
const validationRules = {
name: { required, minLength: minLength(1) },
description: { required, minLength: minLength(1) },
productName: { required, minLength: minLength(1) },
welcomeMessage: { minLength: minLength(1) },
handoffMessage: { minLength: minLength(1) },
resolutionMessage: { minLength: minLength(1) },
instructions: { minLength: minLength(1) },
};
const v$ = useVuelidate(validationRules, state);
const isLoading = computed(() => formState.uiFlags.value.creatingItem);
const getErrorMessage = field => {
return v$.value[field].$error ? v$.value[field].$errors[0].$message : '';
};
const formErrors = computed(() => ({
name: getErrorMessage('name'),
description: getErrorMessage('description'),
productName: getErrorMessage('productName'),
welcomeMessage: getErrorMessage('welcomeMessage'),
handoffMessage: getErrorMessage('handoffMessage'),
resolutionMessage: getErrorMessage('resolutionMessage'),
instructions: getErrorMessage('instructions'),
}));
const updateStateFromAssistant = assistant => {
const { config = {} } = assistant;
state.name = assistant.name;
state.description = assistant.description;
state.productName = config.product_name;
state.welcomeMessage = config.welcome_message;
state.handoffMessage = config.handoff_message;
state.resolutionMessage = config.resolution_message;
state.instructions = config.instructions;
state.features = {
conversationFaqs: config.feature_faq || false,
memories: config.feature_memory || false,
};
};
const handleBasicInfoUpdate = async () => {
const result = await Promise.all([
v$.value.name.$validate(),
v$.value.description.$validate(),
v$.value.productName.$validate(),
]).then(results => results.every(Boolean));
if (!result) return;
const payload = {
name: state.name,
description: state.description,
product_name: state.productName,
};
emit('submit', payload);
};
const handleSystemMessagesUpdate = async () => {
const result = await Promise.all([
v$.value.welcomeMessage.$validate(),
v$.value.handoffMessage.$validate(),
v$.value.resolutionMessage.$validate(),
]).then(results => results.every(Boolean));
if (!result) return;
const payload = {
config: {
...props.assistant.config,
welcome_message: state.welcomeMessage,
handoff_message: state.handoffMessage,
resolution_message: state.resolutionMessage,
},
};
emit('submit', payload);
};
const handleInstructionsUpdate = async () => {
const result = await v$.value.instructions.$validate();
if (!result) return;
const payload = {
config: {
...props.assistant.config,
instructions: state.instructions,
},
};
emit('submit', payload);
};
const handleFeaturesUpdate = () => {
const payload = {
config: {
...props.assistant.config,
feature_faq: state.features.conversationFaqs,
feature_memory: state.features.memories,
},
};
emit('submit', payload);
};
watch(
() => props.assistant,
newAssistant => {
if (props.mode === 'edit' && newAssistant) {
updateStateFromAssistant(newAssistant);
}
},
{ immediate: true }
);
</script>
<template>
<form class="flex flex-col gap-4" @submit.prevent="handleSubmit">
<!-- Basic Information Section -->
<Accordion
:title="t('CAPTAIN.ASSISTANTS.FORM.SECTIONS.BASIC_INFO')"
is-open
>
<div class="flex flex-col gap-4 pt-4">
<Input
v-model="state.name"
:label="t('CAPTAIN.ASSISTANTS.FORM.NAME.LABEL')"
:placeholder="t('CAPTAIN.ASSISTANTS.FORM.NAME.PLACEHOLDER')"
:message="formErrors.name"
:message-type="formErrors.name ? 'error' : 'info'"
/>
<Editor
v-model="state.description"
:label="t('CAPTAIN.ASSISTANTS.FORM.DESCRIPTION.LABEL')"
:placeholder="t('CAPTAIN.ASSISTANTS.FORM.DESCRIPTION.PLACEHOLDER')"
:message="formErrors.description"
:message-type="formErrors.description ? 'error' : 'info'"
/>
<Input
v-model="state.productName"
:label="t('CAPTAIN.ASSISTANTS.FORM.PRODUCT_NAME.LABEL')"
:placeholder="t('CAPTAIN.ASSISTANTS.FORM.PRODUCT_NAME.PLACEHOLDER')"
:message="formErrors.productName"
:message-type="formErrors.productName ? 'error' : 'info'"
/>
<div class="flex justify-end">
<Button
size="small"
:loading="isLoading"
@click="handleBasicInfoUpdate"
>
{{ t('CAPTAIN.ASSISTANTS.FORM.UPDATE') }}
</Button>
</div>
</div>
</Accordion>
<!-- Instructions Section -->
<Accordion :title="t('CAPTAIN.ASSISTANTS.FORM.SECTIONS.INSTRUCTIONS')">
<div class="flex flex-col gap-4 pt-4">
<Editor
v-model="state.instructions"
:placeholder="t('CAPTAIN.ASSISTANTS.FORM.INSTRUCTIONS.PLACEHOLDER')"
:message="formErrors.instructions"
:max-length="20000"
:message-type="formErrors.instructions ? 'error' : 'info'"
/>
<div class="flex justify-end">
<Button
size="small"
:loading="isLoading"
:label="t('CAPTAIN.ASSISTANTS.FORM.UPDATE')"
@click="handleInstructionsUpdate"
/>
</div>
</div>
</Accordion>
<!-- Greeting Messages Section -->
<Accordion :title="t('CAPTAIN.ASSISTANTS.FORM.SECTIONS.SYSTEM_MESSAGES')">
<div class="flex flex-col gap-4 pt-4">
<Editor
v-model="state.handoffMessage"
:label="t('CAPTAIN.ASSISTANTS.FORM.HANDOFF_MESSAGE.LABEL')"
:placeholder="
t('CAPTAIN.ASSISTANTS.FORM.HANDOFF_MESSAGE.PLACEHOLDER')
"
:message="formErrors.handoffMessage"
:message-type="formErrors.handoffMessage ? 'error' : 'info'"
/>
<Editor
v-model="state.resolutionMessage"
:label="t('CAPTAIN.ASSISTANTS.FORM.RESOLUTION_MESSAGE.LABEL')"
:placeholder="
t('CAPTAIN.ASSISTANTS.FORM.RESOLUTION_MESSAGE.PLACEHOLDER')
"
:message="formErrors.resolutionMessage"
:message-type="formErrors.resolutionMessage ? 'error' : 'info'"
/>
<div class="flex justify-end">
<Button
size="small"
:loading="isLoading"
:label="t('CAPTAIN.ASSISTANTS.FORM.UPDATE')"
@click="handleSystemMessagesUpdate"
/>
</div>
</div>
</Accordion>
<!-- Features Section -->
<Accordion :title="t('CAPTAIN.ASSISTANTS.FORM.SECTIONS.FEATURES')">
<div class="flex flex-col gap-4 pt-4">
<div class="flex flex-col gap-2">
<label class="text-sm font-medium text-n-slate-12">
{{ t('CAPTAIN.ASSISTANTS.FORM.FEATURES.TITLE') }}
</label>
<div class="flex flex-col gap-2">
<label class="flex items-center gap-2">
<input
v-model="state.features.conversationFaqs"
type="checkbox"
class="form-checkbox"
/>
{{
t('CAPTAIN.ASSISTANTS.FORM.FEATURES.ALLOW_CONVERSATION_FAQS')
}}
</label>
<label class="flex items-center gap-2">
<input
v-model="state.features.memories"
type="checkbox"
class="form-checkbox"
/>
{{ t('CAPTAIN.ASSISTANTS.FORM.FEATURES.ALLOW_MEMORIES') }}
</label>
</div>
</div>
<div class="flex justify-end">
<Button
size="small"
:loading="isLoading"
:label="t('CAPTAIN.ASSISTANTS.FORM.UPDATE')"
@click="handleFeaturesUpdate"
/>
</div>
</div>
</Accordion>
</form>
</template>
@@ -1,6 +1,5 @@
<script setup> <script setup>
import { nextTick, ref, watch } from 'vue'; import { nextTick, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import { useTrack } from 'dashboard/composables'; import { useTrack } from 'dashboard/composables';
import { COPILOT_EVENTS } from 'dashboard/helper/AnalyticsHelper/events'; import { COPILOT_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
@@ -40,8 +39,6 @@ const props = defineProps({
const emit = defineEmits(['sendMessage', 'reset', 'setAssistant']); const emit = defineEmits(['sendMessage', 'reset', 'setAssistant']);
const { t } = useI18n();
const COPILOT_USER_ROLES = ['assistant', 'system']; const COPILOT_USER_ROLES = ['assistant', 'system'];
const sendMessage = message => { const sendMessage = message => {
@@ -50,7 +47,7 @@ const sendMessage = message => {
}; };
const useSuggestion = opt => { const useSuggestion = opt => {
emit('sendMessage', t(opt.prompt)); emit('sendMessage', opt.prompt);
useTrack(COPILOT_EVENTS.SEND_SUGGESTED); useTrack(COPILOT_EVENTS.SEND_SUGGESTED);
}; };
@@ -69,16 +66,16 @@ const scrollToBottom = async () => {
const promptOptions = [ const promptOptions = [
{ {
label: 'CAPTAIN.COPILOT.PROMPTS.SUMMARIZE.LABEL', label: 'Summarize this conversation',
prompt: 'CAPTAIN.COPILOT.PROMPTS.SUMMARIZE.CONTENT', prompt: `Summarize the key points discussed between the customer and the support agent, including the customer's concerns, questions, and the solutions or responses provided by the support agent`,
}, },
{ {
label: 'CAPTAIN.COPILOT.PROMPTS.SUGGEST.LABEL', label: 'Suggest an answer',
prompt: 'CAPTAIN.COPILOT.PROMPTS.SUGGEST.CONTENT', prompt: `Analyze the customers inquiry, and draft a response that effectively addresses their concerns or questions. Ensure the reply is clear, concise, and provides helpful information.`,
}, },
{ {
label: 'CAPTAIN.COPILOT.PROMPTS.RATE.LABEL', label: 'Rate this conversation',
prompt: 'CAPTAIN.COPILOT.PROMPTS.RATE.CONTENT', prompt: `Review the conversation to see how well it meets the customers needs. Share a rating out of 5 based on tone, clarity, and effectiveness.`,
}, },
]; ];
@@ -92,7 +89,7 @@ watch(
</script> </script>
<template> <template>
<div class="flex flex-col h-full text-sm leading-6 tracking-tight w-full"> <div class="flex flex-col h-full text-sm leading-6 tracking-tight">
<div ref="chatContainer" class="flex-1 px-4 py-4 space-y-6 overflow-y-auto"> <div ref="chatContainer" class="flex-1 px-4 py-4 space-y-6 overflow-y-auto">
<template v-for="message in messages" :key="message.id"> <template v-for="message in messages" :key="message.id">
<CopilotAgentMessage <CopilotAgentMessage
@@ -124,7 +121,7 @@ watch(
class="px-2 py-1 rounded-md border border-n-weak bg-n-slate-2 text-n-slate-11 flex items-center gap-1" class="px-2 py-1 rounded-md border border-n-weak bg-n-slate-2 text-n-slate-11 flex items-center gap-1"
@click="() => useSuggestion(prompt)" @click="() => useSuggestion(prompt)"
> >
<span>{{ t(prompt.label) }}</span> <span>{{ prompt.label }}</span>
<Icon icon="i-lucide-chevron-right" /> <Icon icon="i-lucide-chevron-right" />
</button> </button>
</div> </div>
@@ -33,8 +33,6 @@ const insertIntoRichEditor = computed(() => {
); );
}); });
const hasEmptyMessageContent = computed(() => !props.message?.content);
const useCopilotResponse = () => { const useCopilotResponse = () => {
if (insertIntoRichEditor.value) { if (insertIntoRichEditor.value) {
emitter.emit(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, props.message?.content); emitter.emit(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, props.message?.content);
@@ -55,17 +53,9 @@ const useCopilotResponse = () => {
/> />
<div class="flex flex-col gap-1 text-n-slate-12"> <div class="flex flex-col gap-1 text-n-slate-12">
<div class="font-medium">{{ $t('CAPTAIN.NAME') }}</div> <div class="font-medium">{{ $t('CAPTAIN.NAME') }}</div>
<span v-if="hasEmptyMessageContent" class="text-n-ruby-11"> <div v-dompurify-html="messageContent" class="prose-sm break-words" />
{{ $t('CAPTAIN.COPILOT.EMPTY_MESSAGE') }}
</span>
<div
v-else
v-dompurify-html="messageContent"
class="prose-sm break-words"
/>
<div class="flex flex-row mt-1"> <div class="flex flex-row mt-1">
<Button <Button
v-if="!hasEmptyMessageContent"
:label="$t('CAPTAIN.COPILOT.USE')" :label="$t('CAPTAIN.COPILOT.USE')"
faded faded
sm sm
@@ -125,10 +125,7 @@ defineExpose({ open, close });
<slot /> <slot />
<!-- Dialog content will be injected here --> <!-- Dialog content will be injected here -->
<slot name="footer"> <slot name="footer">
<div <div class="flex items-center justify-between w-full gap-3">
v-if="showCancelButton || showConfirmButton"
class="flex items-center justify-between w-full gap-3"
>
<Button <Button
v-if="showCancelButton" v-if="showCancelButton"
variant="faded" variant="faded"
@@ -1,66 +0,0 @@
<script setup>
import { computed, ref } from 'vue';
import Input from './Input.vue';
import { useI18n } from 'vue-i18n';
const props = defineProps({
min: { type: Number, default: 0 },
max: { type: Number, default: Infinity },
disabled: { type: Boolean, default: false },
});
const { t } = useI18n();
const duration = defineModel('modelValue', { type: Number, default: null });
const UNIT_TYPES = {
MINUTES: 'minutes',
HOURS: 'hours',
DAYS: 'days',
};
const unit = ref(UNIT_TYPES.MINUTES);
const transformedValue = computed({
get() {
if (unit.value === UNIT_TYPES.MINUTES) return duration.value;
if (unit.value === UNIT_TYPES.HOURS) return Math.floor(duration.value / 60);
if (unit.value === UNIT_TYPES.DAYS)
return Math.floor(duration.value / 24 / 60);
return 0;
},
set(newValue) {
let minuteValue;
if (unit.value === UNIT_TYPES.MINUTES) {
minuteValue = Math.floor(newValue);
} else if (unit.value === UNIT_TYPES.HOURS) {
minuteValue = Math.floor(newValue * 60);
} else if (unit.value === UNIT_TYPES.DAYS) {
minuteValue = Math.floor(newValue * 24 * 60);
}
duration.value = Math.min(Math.max(minuteValue, props.min), props.max);
},
});
</script>
<template>
<Input
v-model="transformedValue"
type="number"
autocomplete="off"
:disabled="disabled"
:placeholder="t('DURATION_INPUT.PLACEHOLDER')"
class="flex-grow w-full disabled:"
/>
<select
v-model="unit"
:disabled="disabled"
class="mb-0 text-sm disabled:outline-n-weak disabled:opacity-40"
>
<option :value="UNIT_TYPES.MINUTES">
{{ t('DURATION_INPUT.MINUTES') }}
</option>
<option :value="UNIT_TYPES.HOURS">{{ t('DURATION_INPUT.HOURS') }}</option>
<option :value="UNIT_TYPES.DAYS">{{ t('DURATION_INPUT.DAYS') }}</option>
</select>
</template>
@@ -117,7 +117,7 @@ const props = defineProps({
}, },
conversationId: { type: Number, required: true }, conversationId: { type: Number, required: true },
createdAt: { type: Number, required: true }, // eslint-disable-line vue/no-unused-properties createdAt: { type: Number, required: true }, // eslint-disable-line vue/no-unused-properties
currentUserId: { type: Number, required: true }, // eslint-disable-line vue/no-unused-properties currentUserId: { type: Number, required: true },
groupWithNext: { type: Boolean, default: false }, groupWithNext: { type: Boolean, default: false },
inboxId: { type: Number, default: null }, // eslint-disable-line vue/no-unused-properties inboxId: { type: Number, default: null }, // eslint-disable-line vue/no-unused-properties
inboxSupportsReplyTo: { type: Object, default: () => ({}) }, inboxSupportsReplyTo: { type: Object, default: () => ({}) },
@@ -173,10 +173,7 @@ const variant = computed(() => {
return variants[props.messageType] || MESSAGE_VARIANTS.USER; return variants[props.messageType] || MESSAGE_VARIANTS.USER;
}); });
const isBotOrAgentMessage = computed(() => { const isMyMessage = computed(() => {
if (props.messageType === MESSAGE_TYPES.ACTIVITY) {
return false;
}
// if an outgoing message is still processing, then it's definitely a // if an outgoing message is still processing, then it's definitely a
// message sent by the current user // message sent by the current user
if ( if (
@@ -189,10 +186,13 @@ const isBotOrAgentMessage = computed(() => {
const senderType = props.senderType ?? props.sender?.type; const senderType = props.senderType ?? props.sender?.type;
if (!senderType || !senderId) { if (!senderType || !senderId) {
return true; return false;
} }
return senderType.toLowerCase() === SENDER_TYPES.USER.toLowerCase(); return (
senderType.toLowerCase() === SENDER_TYPES.USER.toLowerCase() &&
props.currentUserId === senderId
);
}); });
/** /**
@@ -200,7 +200,7 @@ const isBotOrAgentMessage = computed(() => {
* @returns {import('vue').ComputedRef<'left'|'right'|'center'>} The computed orientation * @returns {import('vue').ComputedRef<'left'|'right'|'center'>} The computed orientation
*/ */
const orientation = computed(() => { const orientation = computed(() => {
if (isBotOrAgentMessage.value) { if (isMyMessage.value) {
return ORIENTATION.RIGHT; return ORIENTATION.RIGHT;
} }
@@ -221,8 +221,8 @@ const flexOrientationClass = computed(() => {
const gridClass = computed(() => { const gridClass = computed(() => {
const map = { const map = {
[ORIENTATION.LEFT]: 'grid grid-cols-1fr', [ORIENTATION.LEFT]: 'grid grid-cols-[24px_1fr]',
[ORIENTATION.RIGHT]: 'grid grid-cols-[1fr_24px]', [ORIENTATION.RIGHT]: 'grid grid-cols-1fr',
}; };
return map[orientation.value]; return map[orientation.value];
@@ -231,12 +231,12 @@ const gridClass = computed(() => {
const gridTemplate = computed(() => { const gridTemplate = computed(() => {
const map = { const map = {
[ORIENTATION.LEFT]: ` [ORIENTATION.LEFT]: `
"bubble" "avatar bubble"
"meta" "spacer meta"
`, `,
[ORIENTATION.RIGHT]: ` [ORIENTATION.RIGHT]: `
"bubble avatar" "bubble"
"meta spacer" "meta"
`, `,
}; };
@@ -251,7 +251,7 @@ const shouldGroupWithNext = computed(() => {
const shouldShowAvatar = computed(() => { const shouldShowAvatar = computed(() => {
if (props.messageType === MESSAGE_TYPES.ACTIVITY) return false; if (props.messageType === MESSAGE_TYPES.ACTIVITY) return false;
if (orientation.value === ORIENTATION.LEFT) return false; if (orientation.value === ORIENTATION.RIGHT) return false;
return true; return true;
}); });
@@ -394,29 +394,23 @@ function handleReplyTo() {
} }
const avatarInfo = computed(() => { const avatarInfo = computed(() => {
// If no sender, return bot info if (!props.sender || props.sender.type === SENDER_TYPES.AGENT_BOT) {
if (!props.sender) {
return { return {
name: t('CONVERSATION.BOT'), name: t('CONVERSATION.BOT'),
src: '', src: '',
}; };
} }
const { sender } = props; if (props.sender) {
const { name, type, avatarUrl, thumbnail } = sender || {};
// If sender type is agent bot, use avatarUrl
if (type === SENDER_TYPES.AGENT_BOT) {
return { return {
name: name ?? '', name: props.sender.name,
src: avatarUrl ?? '', src: props.sender?.thumbnail,
}; };
} }
// For all other senders, use thumbnail
return { return {
name: name ?? '', name: '',
src: thumbnail ?? '', src: '',
}; };
}); });
@@ -444,7 +438,7 @@ provideMessageContext({
isPrivate: computed(() => props.private), isPrivate: computed(() => props.private),
variant, variant,
orientation, orientation,
isBotOrAgentMessage, isMyMessage,
shouldGroupWithNext, shouldGroupWithNext,
}); });
</script> </script>
@@ -476,14 +470,14 @@ provideMessageContext({
'w-full': variant === MESSAGE_VARIANTS.EMAIL, 'w-full': variant === MESSAGE_VARIANTS.EMAIL,
}, },
]" ]"
class="gap-x-2" class="gap-x-3"
:style="{ :style="{
gridTemplateAreas: gridTemplate, gridTemplateAreas: gridTemplate,
}" }"
> >
<div <div
v-if="!shouldGroupWithNext && shouldShowAvatar" v-if="!shouldGroupWithNext && shouldShowAvatar"
v-tooltip.left-end="avatarTooltip" v-tooltip.right-end="avatarTooltip"
class="[grid-area:avatar] flex items-end" class="[grid-area:avatar] flex items-end"
> >
<Avatar v-bind="avatarInfo" :size="24" /> <Avatar v-bind="avatarInfo" :size="24" />
@@ -491,8 +485,7 @@ provideMessageContext({
<div <div
class="[grid-area:bubble] flex" class="[grid-area:bubble] flex"
:class="{ :class="{
'ltr:pl-8 rtl:pr-8 justify-end': orientation === ORIENTATION.RIGHT, 'ltr:pl-9 rtl:pl-0 justify-end': orientation === ORIENTATION.RIGHT,
'ltr:pr-8 rtl:pl-8': orientation === ORIENTATION.LEFT,
'min-w-0': variant === MESSAGE_VARIANTS.EMAIL, 'min-w-0': variant === MESSAGE_VARIANTS.EMAIL,
}" }"
@contextmenu="openContextMenu($event)" @contextmenu="openContextMenu($event)"
@@ -19,17 +19,11 @@ const {
isAWebWidgetInbox, isAWebWidgetInbox,
isAWhatsAppChannel, isAWhatsAppChannel,
isAnEmailChannel, isAnEmailChannel,
isAnInstagramChannel, isAInstagramChannel,
} = useInbox(); } = useInbox();
const { const { status, isPrivate, createdAt, sourceId, messageType } =
status, useMessageContext();
isPrivate,
createdAt,
sourceId,
messageType,
contentAttributes,
} = useMessageContext();
const readableTime = computed(() => const readableTime = computed(() =>
messageTimestamp(createdAt.value, 'LLL d, h:mm a') messageTimestamp(createdAt.value, 'LLL d, h:mm a')
@@ -37,11 +31,6 @@ const readableTime = computed(() =>
const showStatusIndicator = computed(() => { const showStatusIndicator = computed(() => {
if (isPrivate.value) return false; if (isPrivate.value) return false;
// Don't show status for failed messages, we already show error message
if (status.value === MESSAGE_STATUS.FAILED) return false;
// Don't show status for deleted messages
if (contentAttributes.value?.deleted) return false;
if (messageType.value === MESSAGE_TYPES.OUTGOING) return true; if (messageType.value === MESSAGE_TYPES.OUTGOING) return true;
if (messageType.value === MESSAGE_TYPES.TEMPLATE) return true; if (messageType.value === MESSAGE_TYPES.TEMPLATE) return true;
@@ -60,7 +49,7 @@ const isSent = computed(() => {
isAFacebookInbox.value || isAFacebookInbox.value ||
isASmsInbox.value || isASmsInbox.value ||
isATelegramChannel.value || isATelegramChannel.value ||
isAnInstagramChannel.value isAInstagramChannel.value
) { ) {
return sourceId.value && status.value === MESSAGE_STATUS.SENT; return sourceId.value && status.value === MESSAGE_STATUS.SENT;
} }
@@ -100,7 +89,7 @@ const isRead = computed(() => {
isAWhatsAppChannel.value || isAWhatsAppChannel.value ||
isATwilioChannel.value || isATwilioChannel.value ||
isAFacebookInbox.value || isAFacebookInbox.value ||
isAnInstagramChannel.value isAInstagramChannel.value
) { ) {
return sourceId.value && status.value === MESSAGE_STATUS.READ; return sourceId.value && status.value === MESSAGE_STATUS.READ;
} }
@@ -1,24 +0,0 @@
<script setup>
import { defineProps, defineEmits } from 'vue';
defineProps({
showingOriginal: Boolean,
});
defineEmits(['toggle']);
</script>
<template>
<span>
<span
class="text-xs text-n-slate-11 cursor-pointer hover:underline select-none"
@click="$emit('toggle')"
>
{{
showingOriginal
? $t('CONVERSATION.VIEW_TRANSLATED')
: $t('CONVERSATION.VIEW_ORIGINAL')
}}
</span>
</span>
</template>
@@ -14,7 +14,7 @@ const readableTime = computed(() =>
<template> <template>
<BaseBubble <BaseBubble
v-tooltip.top="readableTime" v-tooltip.top="readableTime"
class="px-3 py-1 !rounded-xl flex min-w-0 items-center gap-2" class="px-2 py-0.5 !rounded-full flex min-w-0 items-center gap-2"
data-bubble-name="activity" data-bubble-name="activity"
> >
<span v-dompurify-html="content" :title="content" /> <span v-dompurify-html="content" :title="content" />
@@ -9,11 +9,9 @@ import BaseBubble from 'next/message/bubbles/Base.vue';
import FormattedContent from 'next/message/bubbles/Text/FormattedContent.vue'; import FormattedContent from 'next/message/bubbles/Text/FormattedContent.vue';
import AttachmentChips from 'next/message/chips/AttachmentChips.vue'; import AttachmentChips from 'next/message/chips/AttachmentChips.vue';
import EmailMeta from './EmailMeta.vue'; import EmailMeta from './EmailMeta.vue';
import TranslationToggle from 'dashboard/components-next/message/TranslationToggle.vue';
import { useMessageContext } from '../../provider.js'; import { useMessageContext } from '../../provider.js';
import { MESSAGE_TYPES } from 'next/message/constants.js'; import { MESSAGE_TYPES } from 'next/message/constants.js';
import { useTranslations } from 'dashboard/composables/useTranslations';
const { content, contentAttributes, attachments, messageType } = const { content, contentAttributes, attachments, messageType } =
useMessageContext(); useMessageContext();
@@ -21,77 +19,35 @@ const { content, contentAttributes, attachments, messageType } =
const isExpandable = ref(false); const isExpandable = ref(false);
const isExpanded = ref(false); const isExpanded = ref(false);
const showQuotedMessage = ref(false); const showQuotedMessage = ref(false);
const renderOriginal = ref(false);
const contentContainer = useTemplateRef('contentContainer'); const contentContainer = useTemplateRef('contentContainer');
onMounted(() => { onMounted(() => {
isExpandable.value = contentContainer.value?.scrollHeight > 400; isExpandable.value = contentContainer.value?.scrollHeight > 400;
}); });
const isOutgoing = computed(() => messageType.value === MESSAGE_TYPES.OUTGOING); const isOutgoing = computed(() => {
return messageType.value === MESSAGE_TYPES.OUTGOING;
});
const isIncoming = computed(() => !isOutgoing.value); const isIncoming = computed(() => !isOutgoing.value);
const { hasTranslations, translationContent } = const textToShow = computed(() => {
useTranslations(contentAttributes);
const originalEmailText = computed(() => {
const text = const text =
contentAttributes?.value?.email?.textContent?.full ?? content.value; contentAttributes?.value?.email?.textContent?.full ?? content.value;
return text?.replace(/\n/g, '<br>'); return text?.replace(/\n/g, '<br>');
}); });
const originalEmailHtml = computed( // Use TextContent as the default to fullHTML
() =>
contentAttributes?.value?.email?.htmlContent?.full ??
originalEmailText.value
);
const messageContent = computed(() => {
// If translations exist and we're showing translations (not original)
if (hasTranslations.value && !renderOriginal.value) {
return translationContent.value;
}
// Otherwise show original content
return content.value;
});
const textToShow = computed(() => {
// If translations exist and we're showing translations (not original)
if (hasTranslations.value && !renderOriginal.value) {
return translationContent.value;
}
// Otherwise show original text
return originalEmailText.value;
});
const fullHTML = computed(() => { const fullHTML = computed(() => {
// If translations exist and we're showing translations (not original) return contentAttributes?.value?.email?.htmlContent?.full ?? textToShow.value;
if (hasTranslations.value && !renderOriginal.value) {
return translationContent.value;
}
// Otherwise show original HTML
return originalEmailHtml.value;
}); });
const unquotedHTML = computed(() => const unquotedHTML = computed(() => {
EmailQuoteExtractor.extractQuotes(fullHTML.value) return EmailQuoteExtractor.extractQuotes(fullHTML.value);
);
const hasQuotedMessage = computed(() =>
EmailQuoteExtractor.hasQuotes(fullHTML.value)
);
// Ensure unique keys for <Letter> when toggling between original and translated views.
// This forces Vue to re-render the component and update content correctly.
const translationKeySuffix = computed(() => {
if (renderOriginal.value) return 'original';
if (hasTranslations.value) return 'translated';
return 'original';
}); });
const handleSeeOriginal = () => { const hasQuotedMessage = computed(() => {
renderOriginal.value = !renderOriginal.value; return EmailQuoteExtractor.hasQuotes(fullHTML.value);
}; });
</script> </script>
<template> <template>
@@ -119,7 +75,7 @@ const handleSeeOriginal = () => {
> >
<div <div
v-if="isExpandable && !isExpanded" v-if="isExpandable && !isExpanded"
class="absolute left-0 right-0 bottom-0 h-40 px-8 flex items-end bg-gradient-to-t from-n-slate-4 via-n-slate-4 via-20% to-transparent" class="absolute left-0 right-0 bottom-0 h-40 px-8 flex items-end bg-gradient-to-t from-n-gray-3 via-n-gray-3 via-20% to-transparent"
> >
<button <button
class="text-n-slate-12 py-2 px-8 mx-auto text-center flex items-center gap-2" class="text-n-slate-12 py-2 px-8 mx-auto text-center flex items-center gap-2"
@@ -132,12 +88,11 @@ const handleSeeOriginal = () => {
<FormattedContent <FormattedContent
v-if="isOutgoing && content" v-if="isOutgoing && content"
class="text-n-slate-12" class="text-n-slate-12"
:content="messageContent" :content="content"
/> />
<template v-else> <template v-else>
<Letter <Letter
v-if="showQuotedMessage" v-if="showQuotedMessage"
:key="`letter-quoted-${translationKeySuffix}`"
class-name="prose prose-bubble !max-w-none letter-render" class-name="prose prose-bubble !max-w-none letter-render"
:allowed-css-properties="[ :allowed-css-properties="[
...allowedCssProperties, ...allowedCssProperties,
@@ -149,7 +104,6 @@ const handleSeeOriginal = () => {
/> />
<Letter <Letter
v-else v-else
:key="`letter-unquoted-${translationKeySuffix}`"
class-name="prose prose-bubble !max-w-none letter-render" class-name="prose prose-bubble !max-w-none letter-render"
:html="unquotedHTML" :html="unquotedHTML"
:allowed-css-properties="[ :allowed-css-properties="[
@@ -181,12 +135,6 @@ const handleSeeOriginal = () => {
</button> </button>
</div> </div>
</section> </section>
<TranslationToggle
v-if="hasTranslations"
class="py-2 px-3"
:showing-original="renderOriginal"
@toggle="handleSeeOriginal"
/>
<section <section
v-if="Array.isArray(attachments) && attachments.length" v-if="Array.isArray(attachments) && attachments.length"
class="px-4 pb-4 space-y-2" class="px-4 pb-4 space-y-2"
@@ -3,16 +3,16 @@ import { computed, ref } from 'vue';
import BaseBubble from 'next/message/bubbles/Base.vue'; import BaseBubble from 'next/message/bubbles/Base.vue';
import FormattedContent from './FormattedContent.vue'; import FormattedContent from './FormattedContent.vue';
import AttachmentChips from 'next/message/chips/AttachmentChips.vue'; import AttachmentChips from 'next/message/chips/AttachmentChips.vue';
import TranslationToggle from 'dashboard/components-next/message/TranslationToggle.vue';
import { MESSAGE_TYPES } from '../../constants'; import { MESSAGE_TYPES } from '../../constants';
import { useMessageContext } from '../../provider.js'; import { useMessageContext } from '../../provider.js';
import { useTranslations } from 'dashboard/composables/useTranslations';
const { content, attachments, contentAttributes, messageType } = const { content, attachments, contentAttributes, messageType } =
useMessageContext(); useMessageContext();
const { hasTranslations, translationContent } = const hasTranslations = computed(() => {
useTranslations(contentAttributes); const { translations = {} } = contentAttributes.value;
return Object.keys(translations || {}).length > 0;
});
const renderOriginal = ref(false); const renderOriginal = ref(false);
@@ -22,7 +22,8 @@ const renderContent = computed(() => {
} }
if (hasTranslations.value) { if (hasTranslations.value) {
return translationContent.value; const translations = contentAttributes.value.translations;
return translations[Object.keys(translations)[0]];
} }
return content.value; return content.value;
@@ -36,6 +37,12 @@ const isEmpty = computed(() => {
return !content.value && !attachments.value?.length; return !content.value && !attachments.value?.length;
}); });
const viewToggleKey = computed(() => {
return renderOriginal.value
? 'CONVERSATION.VIEW_TRANSLATED'
: 'CONVERSATION.VIEW_ORIGINAL';
});
const handleSeeOriginal = () => { const handleSeeOriginal = () => {
renderOriginal.value = !renderOriginal.value; renderOriginal.value = !renderOriginal.value;
}; };
@@ -48,12 +55,15 @@ const handleSeeOriginal = () => {
{{ $t('CONVERSATION.NO_CONTENT') }} {{ $t('CONVERSATION.NO_CONTENT') }}
</span> </span>
<FormattedContent v-if="renderContent" :content="renderContent" /> <FormattedContent v-if="renderContent" :content="renderContent" />
<TranslationToggle <span class="-mt-3">
<span
v-if="hasTranslations" v-if="hasTranslations"
class="-mt-3" class="text-xs text-n-slate-11 cursor-pointer hover:underline"
:showing-original="renderOriginal" @click="handleSeeOriginal"
@toggle="handleSeeOriginal" >
/> {{ $t(viewToggleKey) }}
</span>
</span>
<AttachmentChips :attachments="attachments" class="gap-2" /> <AttachmentChips :attachments="attachments" class="gap-2" />
<template v-if="isTemplate"> <template v-if="isTemplate">
<div <div
@@ -39,7 +39,7 @@ const textColorClass = computed(() => {
docx: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12 docx: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12
json: 'text-n-slate-12', json: 'text-n-slate-12',
odt: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12 odt: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12
pdf: 'text-n-slate-12', pdf: 'text-n-ruby-12',
ppt: 'dark:text-[#FFE0C2] text-[#582D1D]', ppt: 'dark:text-[#FFE0C2] text-[#582D1D]',
pptx: 'dark:text-[#FFE0C2] text-[#582D1D]', pptx: 'dark:text-[#FFE0C2] text-[#582D1D]',
rar: 'dark:text-[#EDEEF0] text-[#2F265F]', rar: 'dark:text-[#EDEEF0] text-[#2F265F]',
@@ -98,7 +98,7 @@ const MessageControl = Symbol('MessageControl');
* @property {import('vue').Ref<Sender|null>} [sender=null] - The sender information * @property {import('vue').Ref<Sender|null>} [sender=null] - The sender information
* @property {import('vue').ComputedRef<MessageOrientation>} orientation - The visual variant of the message * @property {import('vue').ComputedRef<MessageOrientation>} orientation - The visual variant of the message
* @property {import('vue').ComputedRef<MessageVariant>} variant - The visual variant of the message * @property {import('vue').ComputedRef<MessageVariant>} variant - The visual variant of the message
* @property {import('vue').ComputedRef<boolean>} isBotOrAgentMessage - Does the message belong to the current user * @property {import('vue').ComputedRef<boolean>} isMyMessage - Does the message belong to the current user
* @property {import('vue').ComputedRef<boolean>} isPrivate - Proxy computed value for private * @property {import('vue').ComputedRef<boolean>} isPrivate - Proxy computed value for private
* @property {import('vue').ComputedRef<boolean>} shouldGroupWithNext - Should group with the next message or not, it is differnt from groupWithNext, this has a bypass for a failed message * @property {import('vue').ComputedRef<boolean>} shouldGroupWithNext - Should group with the next message or not, it is differnt from groupWithNext, this has a bypass for a failed message
*/ */
@@ -15,13 +15,6 @@ const props = defineProps({
type: String, type: String,
required: true, required: true,
}, },
subMenuPosition: {
type: String,
default: 'right',
validator: value => {
return ['right', 'left', 'bottom'].includes(value);
},
},
}); });
const emit = defineEmits(['update:modelValue']); const emit = defineEmits(['update:modelValue']);
@@ -51,21 +44,14 @@ const handleSelect = value => {
trailing-icon trailing-icon
color="slate" color="slate"
variant="faded" variant="faded"
class="!w-fit max-w-40" class="!w-fit"
:class="{ 'dark:!bg-n-alpha-2 !bg-n-slate-9/20': isOpen }" :class="{ 'dark:!bg-n-alpha-2 !bg-n-slate-9/20': isOpen }"
:label="labelValue" :label="labelValue"
@click="toggleMenu" @click="toggleMenu"
/> />
<div <div
v-if="isOpen" v-if="isOpen"
class="absolute select-none max-w-64 flex flex-col gap-1 bg-n-alpha-3 backdrop-blur-[100px] p-1 top-0 shadow-lg z-40 rounded-lg border border-n-weak dark:border-n-strong/50" class="absolute ltr:left-full rtl:right-full select-none max-w-48 ltr:ml-1 rtl:mr-1 flex flex-col gap-1 bg-n-alpha-3 backdrop-blur-[100px] p-1 top-0 shadow-lg rounded-lg border border-n-weak"
:class="{
'ltr:left-full rtl:right-full ltr:ml-1 rtl:mr-1':
subMenuPosition === 'right',
'ltr:right-full rtl:left-full ltr:mr-1 rtl:ml-1':
subMenuPosition === 'left',
'top-full mt-1 ltr:right-0 rtl:left-0': subMenuPosition === 'bottom',
}"
> >
<Button <Button
v-for="option in options" v-for="option in options"
@@ -8,6 +8,7 @@ import { useStore } from 'vuex';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStorage } from '@vueuse/core'; import { useStorage } from '@vueuse/core';
import { useSidebarKeyboardShortcuts } from './useSidebarKeyboardShortcuts'; import { useSidebarKeyboardShortcuts } from './useSidebarKeyboardShortcuts';
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
import Button from 'dashboard/components-next/button/Button.vue'; import Button from 'dashboard/components-next/button/Button.vue';
import SidebarGroup from './SidebarGroup.vue'; import SidebarGroup from './SidebarGroup.vue';
@@ -36,6 +37,18 @@ const toggleShortcutModalFn = show => {
} }
}; };
const currentAccountId = useMapGetter('getCurrentAccountId');
const isFeatureEnabledonAccount = useMapGetter(
'accounts/isFeatureEnabledonAccount'
);
const showV4Routes = computed(() => {
return isFeatureEnabledonAccount.value(
currentAccountId.value,
FEATURE_FLAGS.REPORT_V4
);
});
useSidebarKeyboardShortcuts(toggleShortcutModalFn); useSidebarKeyboardShortcuts(toggleShortcutModalFn);
// We're using localStorage to store the expanded item in the sidebar // We're using localStorage to store the expanded item in the sidebar
@@ -103,7 +116,32 @@ const newReportRoutes = () => [
}, },
]; ];
const reportRoutes = computed(() => newReportRoutes()); const oldReportRoutes = () => [
{
name: 'Reports Agent',
label: t('SIDEBAR.REPORTS_AGENT'),
to: accountScopedRoute('agent_reports'),
},
{
name: 'Reports Label',
label: t('SIDEBAR.REPORTS_LABEL'),
to: accountScopedRoute('label_reports'),
},
{
name: 'Reports Inbox',
label: t('SIDEBAR.REPORTS_INBOX'),
to: accountScopedRoute('inbox_reports'),
},
{
name: 'Reports Team',
label: t('SIDEBAR.REPORTS_TEAM'),
to: accountScopedRoute('team_reports'),
},
];
const reportRoutes = computed(() =>
showV4Routes.value ? newReportRoutes() : oldReportRoutes()
);
const menuItems = computed(() => { const menuItems = computed(() => {
return [ return [
@@ -27,10 +27,10 @@ const updateValue = () => {
> >
<span class="sr-only">{{ t('SWITCH.TOGGLE') }}</span> <span class="sr-only">{{ t('SWITCH.TOGGLE') }}</span>
<span <span
class="absolute top-0.5 left-0.5 h-3 w-3 transform rounded-full shadow-sm transition-transform duration-200 ease-in-out" class="absolute top-[0.07rem] left-0.5 h-3 w-3 transform rounded-full shadow-sm transition-transform duration-200 ease-in-out"
:class=" :class="
modelValue modelValue
? 'translate-x-3 bg-white' ? 'translate-x-2.5 bg-white'
: 'translate-x-0 bg-white dark:bg-n-black' : 'translate-x-0 bg-white dark:bg-n-black'
" "
/> />
@@ -127,6 +127,7 @@ const settings = accountId => ({
meta: { meta: {
permissions: ['administrator'], permissions: ['administrator'],
}, },
globalConfigFlag: 'csmlEditorHost',
toState: frontendURL(`accounts/${accountId}/settings/agent-bots`), toState: frontendURL(`accounts/${accountId}/settings/agent-bots`),
toStateName: 'agent_bots', toStateName: 'agent_bots',
featureFlag: FEATURE_FLAGS.AGENT_BOTS, featureFlag: FEATURE_FLAGS.AGENT_BOTS,
@@ -49,6 +49,13 @@ export default {
return !!this.menuItem.children; return !!this.menuItem.children;
}, },
isMenuItemVisible() { isMenuItemVisible() {
if (this.menuItem.globalConfigFlag) {
// this checks for the `csmlEditorHost` flag in the global config
// if this is present, we toggle the CSML editor menu item
// TODO: This is very specific, and can be handled better, fix it
return !!this.globalConfig[this.menuItem.globalConfigFlag];
}
let isFeatureEnabled = true; let isFeatureEnabled = true;
if (this.menuItem.featureFlag) { if (this.menuItem.featureFlag) {
isFeatureEnabled = this.isFeatureEnabledonAccount( isFeatureEnabled = this.isFeatureEnabledonAccount(
@@ -218,14 +218,14 @@ const emitDateRange = () => {
/> />
<div <div
v-if="showDatePicker" v-if="showDatePicker"
class="flex absolute top-9 ltr:left-0 rtl:right-0 z-30 shadow-md select-none w-[880px] h-[490px] rounded-2xl bg-n-alpha-3 backdrop-blur-[100px] border-0 outline outline-1 outline-n-container" class="flex absolute top-9 ltr:left-0 rtl:right-0 z-30 shadow-md select-none w-[880px] h-[490px] rounded-2xl border border-slate-50 dark:border-slate-800 bg-white dark:bg-slate-800"
> >
<CalendarDateRange <CalendarDateRange
:selected-range="selectedRange" :selected-range="selectedRange"
@set-range="setDateRange" @set-range="setDateRange"
/> />
<div <div
class="flex flex-col w-[680px] ltr:border-l rtl:border-r border-n-strong" class="flex flex-col w-[680px] ltr:border-l rtl:border-r border-slate-50 dark:border-slate-700/50"
> >
<div class="flex justify-around h-fit"> <div class="flex justify-around h-fit">
<!-- Calendars for Start and End Dates --> <!-- Calendars for Start and End Dates -->
@@ -251,12 +251,12 @@ const emitDateRange = () => {
@validate="updateManualInput($event, calendar)" @validate="updateManualInput($event, calendar)"
@error="handleManualInputError($event)" @error="handleManualInputError($event)"
/> />
<div class="py-5 border-b border-n-strong"> <div class="py-5 border-b border-slate-50 dark:border-slate-700/50">
<div <div
class="flex flex-col items-center gap-2 px-5 min-w-[340px] max-h-[352px]" class="flex flex-col items-center gap-2 px-5 min-w-[340px] max-h-[352px]"
:class=" :class="
calendar === START_CALENDAR && calendar === START_CALENDAR &&
'ltr:border-r rtl:border-l border-n-strong' 'ltr:border-r rtl:border-l border-slate-50 dark:border-slate-700/50'
" "
> >
<CalendarYear <CalendarYear
@@ -1,8 +1,6 @@
<script setup> <script setup>
import { CALENDAR_PERIODS } from '../helpers/DatePickerHelper'; import { CALENDAR_PERIODS } from '../helpers/DatePickerHelper';
import NextButton from 'dashboard/components-next/button/Button.vue';
defineProps({ defineProps({
calendarType: { calendarType: {
type: String, type: String,
@@ -40,38 +38,42 @@ const onClickSetView = (type, mode) => {
<template> <template>
<div class="flex items-start justify-between w-full h-9"> <div class="flex items-start justify-between w-full h-9">
<NextButton <button
slate class="p-1 rounded-lg hover:bg-slate-75 dark:hover:bg-slate-700/50 rtl:rotate-180"
ghost
xs
icon="i-lucide-chevron-left"
class="rtl:rotate-180"
@click="onClickPrev(calendarType)" @click="onClickPrev(calendarType)"
>
<fluent-icon
icon="chevron-left"
size="14"
class="text-slate-900 dark:text-slate-50"
/> />
</button>
<div class="flex items-center gap-1"> <div class="flex items-center gap-1">
<button <button
v-if="firstButtonLabel" v-if="firstButtonLabel"
class="p-0 text-sm font-medium text-center text-n-slate-12 hover:text-n-brand" class="p-0 text-sm font-medium text-center text-slate-800 dark:text-slate-50 hover:text-woot-600 dark:hover:text-woot-600"
@click="onClickSetView(calendarType, viewMode)" @click="onClickSetView(calendarType, viewMode)"
> >
{{ firstButtonLabel }} {{ firstButtonLabel }}
</button> </button>
<button <button
v-if="buttonLabel" v-if="buttonLabel"
class="p-0 text-sm font-medium text-center text-n-slate-12" class="p-0 text-sm font-medium text-center text-slate-800 dark:text-slate-50"
:class="{ 'hover:text-n-brand': viewMode }" :class="{ 'hover:text-woot-600 dark:hover:text-woot-600': viewMode }"
@click="onClickSetView(calendarType, YEAR)" @click="onClickSetView(calendarType, YEAR)"
> >
{{ buttonLabel }} {{ buttonLabel }}
</button> </button>
</div> </div>
<NextButton <button
slate class="p-1 rounded-lg hover:bg-slate-75 dark:hover:bg-slate-700/50 rtl:rotate-180"
ghost
xs
icon="i-lucide-chevron-right"
class="rtl:rotate-180"
@click="onClickNext(calendarType)" @click="onClickNext(calendarType)"
>
<fluent-icon
icon="chevron-right"
size="14"
class="text-slate-900 dark:text-slate-50"
/> />
</button>
</div> </div>
</template> </template>
@@ -65,7 +65,7 @@ const validateDate = () => {
<input <input
v-model="localDateValue" v-model="localDateValue"
type="text" type="text"
class="!text-sm !mb-0 disabled:!outline-n-strong" class="reset-base border bg-slate-25 dark:bg-slate-900 ring-offset-ash-900 border-slate-50 dark:border-slate-700/50 w-full disabled:text-slate-200 dark:disabled:text-slate-700 disabled:cursor-not-allowed text-slate-800 dark:text-slate-50 px-1.5 py-1 text-sm rounded-xl h-10"
:placeholder="dateFormat" :placeholder="dateFormat"
:disabled="isDisabled" :disabled="isDisabled"
@keypress.enter="validateDate" @keypress.enter="validateDate"
@@ -18,7 +18,7 @@ const setDateRange = range => {
<template> <template>
<div class="w-[200px] flex flex-col items-start"> <div class="w-[200px] flex flex-col items-start">
<h4 <h4
class="w-full px-5 py-4 text-sm font-medium capitalize text-start text-n-slate-12" class="w-full px-5 py-4 text-sm font-medium capitalize text-start text-slate-600 dark:text-slate-200"
> >
{{ $t('DATE_PICKER.DATE_RANGE_OPTIONS.TITLE') }} {{ $t('DATE_PICKER.DATE_RANGE_OPTIONS.TITLE') }}
</h4> </h4>
@@ -26,11 +26,11 @@ const setDateRange = range => {
<button <button
v-for="range in dateRanges" v-for="range in dateRanges"
:key="range.label" :key="range.label"
class="w-full px-5 py-3 text-sm font-medium truncate border-none rounded-none text-start hover:bg-n-alpha-2 dark:hover:bg-n-solid-3" class="w-full px-5 py-3 text-sm font-medium truncate border-none rounded-none text-start hover:bg-slate-50 dark:hover:bg-slate-700"
:class=" :class="
range.value === selectedRange range.value === selectedRange
? 'text-n-slate-12 bg-n-alpha-1 dark:bg-n-solid-active' ? 'text-slate-800 dark:text-slate-50 bg-slate-50 dark:bg-slate-700'
: 'text-n-slate-12' : 'text-slate-600 dark:text-slate-200'
" "
@click="setDateRange(range)" @click="setDateRange(range)"
> >
@@ -1,6 +1,4 @@
<script setup> <script setup>
import NextButton from 'dashboard/components-next/button/Button.vue';
const emit = defineEmits(['clear', 'change']); const emit = defineEmits(['clear', 'change']);
const onClickClear = () => { const onClickClear = () => {
@@ -13,19 +11,18 @@ const onClickApply = () => {
</script> </script>
<template> <template>
<div class="h-[56px] flex justify-between gap-2 px-2 py-3 items-center"> <div class="h-[56px] flex justify-between px-5 py-3 items-center">
<NextButton <button
slate class="p-1.5 rounded-lg w-fit text-sm font-medium text-slate-600 dark:text-slate-200 hover:text-slate-800 dark:hover:text-slate-100"
ghost
sm
:label="$t('DATE_PICKER.CLEAR_BUTTON')"
@click="onClickClear" @click="onClickClear"
/> >
<NextButton {{ $t('DATE_PICKER.CLEAR_BUTTON') }}
sm </button>
ghost <button
:label="$t('DATE_PICKER.APPLY_BUTTON')" class="p-1.5 rounded-lg w-fit text-sm font-medium text-woot-500 dark:text-woot-300 hover:text-woot-700 dark:hover:text-woot-500"
@click="onClickApply" @click="onClickApply"
/> >
{{ $t('DATE_PICKER.APPLY_BUTTON') }}
</button>
</div> </div>
</template> </template>
@@ -71,12 +71,10 @@ const selectMonth = index => {
<button <button
v-for="(month, index) in months" v-for="(month, index) in months"
:key="index" :key="index"
class="p-2 text-sm font-medium text-center text-n-slate-12 w-[92px] h-10 rounded-lg py-2.5 px-2" class="p-2 text-sm font-medium text-center text-slate-800 dark:text-slate-50 w-[92px] h-10 rounded-lg py-2.5 px-2 hover:bg-slate-75 dark:hover:bg-slate-700"
:class="{ :class="{
'bg-n-brand text-white hover:bg-n-blue-10': 'bg-woot-600 dark:bg-woot-600 text-white dark:text-white hover:bg-woot-500 dark:bg-woot-700':
index === activeMonthIndex, index === activeMonthIndex,
'hover:bg-n-alpha-2 dark:hover:bg-n-solid-3':
index !== activeMonthIndex,
}" }"
@click="selectMonth(index)" @click="selectMonth(index)"
> >
@@ -107,16 +107,17 @@ const isNextDayInRange = day => {
}; };
const dayClasses = day => ({ const dayClasses = day => ({
'text-n-slate-10 pointer-events-none': !isInCurrentMonth(day), 'text-slate-500 dark:text-slate-400 pointer-events-none':
'text-n-slate-12 hover:text-n-slate-12 hover:bg-n-blue-6 dark:hover:bg-n-blue-7': !isInCurrentMonth(day),
'text-slate-800 dark:text-slate-50 hover:text-slate-800 dark:hover:text-white hover:bg-woot-100 dark:hover:bg-woot-700':
isInCurrentMonth(day), isInCurrentMonth(day),
'bg-n-brand text-white': 'bg-woot-600 dark:bg-woot-600 text-white dark:text-white':
isSelectedStartOrEndDate(day) && isInCurrentMonth(day), isSelectedStartOrEndDate(day) && isInCurrentMonth(day),
'bg-n-blue-4 dark:bg-n-blue-5': 'bg-woot-50 dark:bg-woot-800':
(isInRange(day) || isHoveringInRange(day)) && (isInRange(day) || isHoveringInRange(day)) &&
!isSelectedStartOrEndDate(day) && !isSelectedStartOrEndDate(day) &&
isInCurrentMonth(day), isInCurrentMonth(day),
'outline outline-1 outline-n-blue-8 -outline-offset-1 !text-n-blue-text': 'outline outline-1 outline-woot-200 -outline-offset-1 dark:outline-woot-700 text-woot-600 dark:text-woot-400':
isToday(props.currentDate, day) && !isSelectedStartOrEndDate(day), isToday(props.currentDate, day) && !isSelectedStartOrEndDate(day),
}); });
</script> </script>
@@ -163,7 +164,7 @@ const dayClasses = day => ({
!isLastDayOfMonth(day) && !isLastDayOfMonth(day) &&
isInCurrentMonth(day) isInCurrentMonth(day)
" "
class="absolute bottom-0 w-6 h-8 ltr:-right-4 rtl:-left-4 bg-n-blue-4 dark:bg-n-blue-5 -z-10" class="absolute bottom-0 w-6 h-8 ltr:-right-4 rtl:-left-4 bg-woot-50 dark:bg-woot-800 -z-10"
/> />
</div> </div>
</div> </div>
@@ -72,10 +72,10 @@ const selectYear = year => {
<button <button
v-for="year in years" v-for="year in years"
:key="year" :key="year"
class="p-2 text-sm font-medium text-center text-n-slate-12 w-[144px] h-10 rounded-lg py-2.5 px-2" class="p-2 text-sm font-medium text-center text-slate-800 dark:text-slate-50 w-[144px] h-10 rounded-lg py-2.5 px-2 hover:bg-slate-75 dark:hover:bg-slate-700"
:class="{ :class="{
'bg-n-brand text-white hover:bg-n-blue-10': year === activeYear, 'bg-woot-600 dark:bg-woot-600 text-white dark:text-white hover:bg-woot-500 dark:hover:bg-woot-700':
'hover:bg-n-alpha-2 dark:hover:bg-n-solid-3': year !== activeYear, year === activeYear,
}" }"
@click="selectYear(year)" @click="selectYear(year)"
> >
@@ -48,7 +48,7 @@ const openDatePicker = () => {
<template> <template>
<button <button
class="inline-flex relative items-center rounded-lg gap-2 py-1.5 px-3 h-8 bg-n-alpha-2 hover:bg-n-alpha-1 active:bg-n-alpha-1" class="inline-flex relative items-center rounded-lg gap-2 py-1.5 px-3 h-8 bg-slate-50 dark:bg-slate-800 hover:bg-slate-50 dark:hover:bg-slate-800 active:bg-slate-75 dark:active:bg-slate-800"
@click="openDatePicker" @click="openDatePicker"
> >
<fluent-icon <fluent-icon
@@ -17,9 +17,6 @@ export default {
hasFbConfigured() { hasFbConfigured() {
return window.chatwootConfig?.fbAppId; return window.chatwootConfig?.fbAppId;
}, },
hasInstagramConfigured() {
return window.chatwootConfig?.instagramAppId;
},
isActive() { isActive() {
const { key } = this.channel; const { key } = this.channel;
if (Object.keys(this.enabledFeatures).length === 0) { if (Object.keys(this.enabledFeatures).length === 0) {
@@ -36,9 +33,7 @@ export default {
} }
if (key === 'instagram') { if (key === 'instagram') {
return ( return this.enabledFeatures.channel_instagram;
this.enabledFeatures.channel_instagram && this.hasInstagramConfigured
);
} }
return [ return [
@@ -220,7 +220,6 @@ const plugins = computed(() => {
trigger: '@', trigger: '@',
showMenu: showUserMentions, showMenu: showUserMentions,
searchTerm: mentionSearchKey, searchTerm: mentionSearchKey,
isAllowed: () => props.isPrivate,
}), }),
createSuggestionPlugin({ createSuggestionPlugin({
trigger: '/', trigger: '/',
@@ -202,7 +202,7 @@ export default {
if (this.isALineChannel) { if (this.isALineChannel) {
return ALLOWED_FILE_TYPES_FOR_LINE; return ALLOWED_FILE_TYPES_FOR_LINE;
} }
if (this.isAnInstagramChannel || this.isInstagramDM) { if (this.isAInstagramChannel || this.isInstagramDM) {
return ALLOWED_FILE_TYPES_FOR_INSTAGRAM; return ALLOWED_FILE_TYPES_FOR_INSTAGRAM;
} }
@@ -1,129 +1,93 @@
<script setup> <script>
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useToggle } from '@vueuse/core';
import { vOnClickOutside } from '@vueuse/components';
import { useUISettings } from 'dashboard/composables/useUISettings';
import { useMapGetter, useStore } from 'dashboard/composables/store.js';
import wootConstants from 'dashboard/constants/globals'; import wootConstants from 'dashboard/constants/globals';
import SelectMenu from 'dashboard/components-next/selectmenu/SelectMenu.vue'; import { mapGetters } from 'vuex';
import FilterItem from './FilterItem.vue';
import { useUISettings } from 'dashboard/composables/useUISettings';
import NextButton from 'dashboard/components-next/button/Button.vue'; import NextButton from 'dashboard/components-next/button/Button.vue';
defineProps({ const CHAT_STATUS_FILTER_ITEMS = Object.freeze([
'open',
'resolved',
'pending',
'snoozed',
'all',
]);
const SORT_ORDER_ITEMS = Object.freeze([
'last_activity_at_asc',
'last_activity_at_desc',
'created_at_desc',
'created_at_asc',
'priority_desc',
'priority_asc',
'waiting_since_asc',
'waiting_since_desc',
]);
export default {
components: {
FilterItem,
NextButton,
},
props: {
isOnExpandedLayout: { isOnExpandedLayout: {
type: Boolean, type: Boolean,
required: true, required: true,
}, },
}); },
emits: ['changeFilter'],
const emit = defineEmits(['changeFilter']); setup() {
const store = useStore();
const { t } = useI18n();
const { updateUISettings } = useUISettings(); const { updateUISettings } = useUISettings();
const chatStatusFilter = useMapGetter('getChatStatusFilter'); return {
const chatSortFilter = useMapGetter('getChatSortFilter'); updateUISettings,
};
const [showActionsDropdown, toggleDropdown] = useToggle(); },
data() {
const currentStatusFilter = computed(() => { return {
return chatStatusFilter.value || wootConstants.STATUS_TYPE.OPEN; showActionsDropdown: false,
}); chatStatusItems: CHAT_STATUS_FILTER_ITEMS,
chatSortItems: SORT_ORDER_ITEMS,
const currentSortBy = computed(() => { };
},
computed: {
...mapGetters({
chatStatusFilter: 'getChatStatusFilter',
chatSortFilter: 'getChatSortFilter',
}),
chatStatus() {
return this.chatStatusFilter || wootConstants.STATUS_TYPE.OPEN;
},
sortFilter() {
return ( return (
chatSortFilter.value || wootConstants.SORT_BY_TYPE.LAST_ACTIVITY_AT_DESC this.chatSortFilter || wootConstants.SORT_BY_TYPE.LAST_ACTIVITY_AT_DESC
); );
});
const chatStatusOptions = [
{
label: t('CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.open.TEXT'),
value: 'open',
}, },
{
label: t('CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.resolved.TEXT'),
value: 'resolved',
}, },
{ methods: {
label: t('CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.pending.TEXT'), onTabChange(value) {
value: 'pending', this.$emit('changeFilter', value);
this.closeDropdown();
}, },
{ toggleDropdown() {
label: t('CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.snoozed.TEXT'), this.showActionsDropdown = !this.showActionsDropdown;
value: 'snoozed',
}, },
{ closeDropdown() {
label: t('CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.all.TEXT'), this.showActionsDropdown = false;
value: 'all',
}, },
]; onChangeFilter(value, type) {
this.$emit('changeFilter', value, type);
const chatSortOptions = [ this.saveSelectedFilter(type, value);
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.last_activity_at_asc.TEXT'),
value: 'last_activity_at_asc',
}, },
{ saveSelectedFilter(type, value) {
label: t('CHAT_LIST.SORT_ORDER_ITEMS.last_activity_at_desc.TEXT'), this.updateUISettings({
value: 'last_activity_at_desc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.created_at_desc.TEXT'),
value: 'created_at_desc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.created_at_asc.TEXT'),
value: 'created_at_asc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.priority_desc.TEXT'),
value: 'priority_desc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.priority_asc.TEXT'),
value: 'priority_asc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.waiting_since_asc.TEXT'),
value: 'waiting_since_asc',
},
{
label: t('CHAT_LIST.SORT_ORDER_ITEMS.waiting_since_desc.TEXT'),
value: 'waiting_since_desc',
},
];
const activeChatStatusLabel = computed(
() =>
chatStatusOptions.find(m => m.value === chatStatusFilter.value)?.label || ''
);
const activeChatSortLabel = computed(
() => chatSortOptions.find(m => m.value === chatSortFilter.value)?.label || ''
);
const saveSelectedFilter = (type, value) => {
updateUISettings({
conversations_filter_by: { conversations_filter_by: {
status: type === 'status' ? value : currentStatusFilter.value, status: type === 'status' ? value : this.chatStatus,
order_by: type === 'sort' ? value : currentSortBy.value, order_by: type === 'sort' ? value : this.sortFilter,
}, },
}); });
}; },
},
const handleStatusChange = value => {
emit('changeFilter', value, 'status');
store.dispatch('setChatStatusFilter', value);
saveSelectedFilter('status', value);
};
const handleSortChange = value => {
emit('changeFilter', value, 'sort');
store.dispatch('setChatSortFilter', value);
saveSelectedFilter('sort', value);
}; };
</script> </script>
@@ -135,39 +99,39 @@ const handleSortChange = value => {
slate slate
faded faded
xs xs
@click="toggleDropdown()" @click="toggleDropdown"
/> />
<div <div
v-if="showActionsDropdown" v-if="showActionsDropdown"
v-on-click-outside="() => toggleDropdown()" v-on-clickaway="closeDropdown"
class="mt-1 bg-n-alpha-3 backdrop-blur-[100px] border border-n-weak w-72 rounded-xl p-4 absolute z-40 top-full" class="mt-1 dropdown-pane dropdown-pane--open !w-52 !p-4 top-6 border !border-n-weak dark:!border-n-weak !bg-n-alpha-3 dark:!bg-n-alpha-3 backdrop-blur-[100px]"
:class="{ :class="{
'ltr:left-0 rtl:right-0': !isOnExpandedLayout, 'ltr:left-0 rtl:right-0': !isOnExpandedLayout,
'ltr:right-0 rtl:left-0': isOnExpandedLayout, 'ltr:right-0 rtl:left-0': isOnExpandedLayout,
}" }"
> >
<div class="flex items-center justify-between last:mt-4 gap-2"> <div class="flex items-center justify-between last:mt-4">
<span class="text-sm truncate text-n-slate-12"> <span class="text-xs font-medium text-n-slate-12">{{
{{ $t('CHAT_LIST.CHAT_SORT.STATUS') }} $t('CHAT_LIST.CHAT_SORT.STATUS')
</span> }}</span>
<SelectMenu <FilterItem
:model-value="chatStatusFilter" type="status"
:options="chatStatusOptions" :selected-value="chatStatus"
:label="activeChatStatusLabel" :items="chatStatusItems"
:sub-menu-position="isOnExpandedLayout ? 'left' : 'right'" path-prefix="CHAT_LIST.CHAT_STATUS_FILTER_ITEMS"
@update:model-value="handleStatusChange" @on-change-filter="onChangeFilter"
/> />
</div> </div>
<div class="flex items-center justify-between last:mt-4 gap-2"> <div class="flex items-center justify-between last:mt-4">
<span class="text-sm truncate text-n-slate-12"> <span class="text-xs font-medium text-n-slate-12">{{
{{ $t('CHAT_LIST.CHAT_SORT.ORDER_BY') }} $t('CHAT_LIST.CHAT_SORT.ORDER_BY')
</span> }}</span>
<SelectMenu <FilterItem
:model-value="chatSortFilter" type="sort"
:options="chatSortOptions" :selected-value="sortFilter"
:label="activeChatSortLabel" :items="chatSortItems"
:sub-menu-position="isOnExpandedLayout ? 'left' : 'right'" path-prefix="CHAT_LIST.SORT_ORDER_ITEMS"
@update:model-value="handleSortChange" @on-change-filter="onChangeFilter"
/> />
</div> </div>
</div> </div>
@@ -36,7 +36,6 @@ import { REPLY_POLICY } from 'shared/constants/links';
import wootConstants from 'dashboard/constants/globals'; import wootConstants from 'dashboard/constants/globals';
import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage'; import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
import { FEATURE_FLAGS } from '../../../featureFlags'; import { FEATURE_FLAGS } from '../../../featureFlags';
import { INBOX_TYPES } from 'dashboard/helper/inbox';
import NextButton from 'dashboard/components-next/button/Button.vue'; import NextButton from 'dashboard/components-next/button/Button.vue';
@@ -210,22 +209,6 @@ export default {
return contactLastSeenAt; return contactLastSeenAt;
}, },
// Check there is a instagram inbox exists with the same instagram_id
hasDuplicateInstagramInbox() {
const instagramId = this.inbox.instagram_id;
const { additional_attributes: additionalAttributes = {} } = this.inbox;
const instagramInbox =
this.$store.getters['inboxes/getInstagramInboxByInstagramId'](
instagramId
);
return (
this.inbox.channel_type === INBOX_TYPES.FB &&
additionalAttributes.type === 'instagram_direct_message' &&
instagramInbox
);
},
replyWindowBannerMessage() { replyWindowBannerMessage() {
if (this.isAWhatsAppChannel) { if (this.isAWhatsAppChannel) {
return this.$t('CONVERSATION.TWILIO_WHATSAPP_CAN_REPLY'); return this.$t('CONVERSATION.TWILIO_WHATSAPP_CAN_REPLY');
@@ -235,21 +218,15 @@ export default {
if (additionalAttributes) { if (additionalAttributes) {
const { const {
agent_reply_time_window_message: agentReplyTimeWindowMessage, agent_reply_time_window_message: agentReplyTimeWindowMessage,
agent_reply_time_window: agentReplyTimeWindow,
} = additionalAttributes; } = additionalAttributes;
return ( return agentReplyTimeWindowMessage;
agentReplyTimeWindowMessage ||
this.$t('CONVERSATION.API_HOURS_WINDOW', {
hours: agentReplyTimeWindow,
})
);
} }
return ''; return '';
} }
return this.$t('CONVERSATION.CANNOT_REPLY'); return this.$t('CONVERSATION.CANNOT_REPLY');
}, },
replyWindowLink() { replyWindowLink() {
if (this.isAFacebookInbox || this.isAnInstagramChannel) { if (this.isAFacebookInbox || this.isAInstagramChannel) {
return REPLY_POLICY.FACEBOOK; return REPLY_POLICY.FACEBOOK;
} }
if (this.isAWhatsAppCloudChannel) { if (this.isAWhatsAppCloudChannel) {
@@ -264,7 +241,7 @@ export default {
if ( if (
this.isAWhatsAppChannel || this.isAWhatsAppChannel ||
this.isAFacebookInbox || this.isAFacebookInbox ||
this.isAnInstagramChannel this.isAInstagramChannel
) { ) {
return this.$t('CONVERSATION.24_HOURS_WINDOW'); return this.$t('CONVERSATION.24_HOURS_WINDOW');
} }
@@ -520,12 +497,6 @@ export default {
:href-link="replyWindowLink" :href-link="replyWindowLink"
:href-link-text="replyWindowLinkText" :href-link-text="replyWindowLinkText"
/> />
<Banner
v-else-if="hasDuplicateInstagramInbox"
color-scheme="alert"
class="mx-2 mt-2 overflow-hidden rounded-lg"
:banner-message="$t('CONVERSATION.OLD_INSTAGRAM_INBOX_REPLY_BANNER')"
/>
<div class="flex justify-end"> <div class="flex justify-end">
<NextButton <NextButton
faded faded
@@ -241,27 +241,15 @@ export default {
if (this.isAFacebookInbox) { if (this.isAFacebookInbox) {
return MESSAGE_MAX_LENGTH.FACEBOOK; return MESSAGE_MAX_LENGTH.FACEBOOK;
} }
if (this.isAnInstagramChannel) { if (this.isAWhatsAppChannel) {
return MESSAGE_MAX_LENGTH.INSTAGRAM;
}
if (this.isATwilioWhatsAppChannel) {
return MESSAGE_MAX_LENGTH.TWILIO_WHATSAPP; return MESSAGE_MAX_LENGTH.TWILIO_WHATSAPP;
} }
if (this.isAWhatsAppCloudChannel) {
return MESSAGE_MAX_LENGTH.WHATSAPP_CLOUD;
}
if (this.isASmsInbox) { if (this.isASmsInbox) {
return MESSAGE_MAX_LENGTH.TWILIO_SMS; return MESSAGE_MAX_LENGTH.TWILIO_SMS;
} }
if (this.isAnEmailChannel) { if (this.isAnEmailChannel) {
return MESSAGE_MAX_LENGTH.EMAIL; return MESSAGE_MAX_LENGTH.EMAIL;
} }
if (this.isATwilioSMSChannel) {
return MESSAGE_MAX_LENGTH.TWILIO_SMS;
}
if (this.isAWhatsAppChannel) {
return MESSAGE_MAX_LENGTH.WHATSAPP_CLOUD;
}
return MESSAGE_MAX_LENGTH.GENERAL; return MESSAGE_MAX_LENGTH.GENERAL;
}, },
showFileUpload() { showFileUpload() {
@@ -274,7 +262,7 @@ export default {
this.isASmsInbox || this.isASmsInbox ||
this.isATelegramChannel || this.isATelegramChannel ||
this.isALineChannel || this.isALineChannel ||
this.isAnInstagramChannel this.isAInstagramChannel
); );
}, },
replyButtonLabel() { replyButtonLabel() {
@@ -400,14 +388,9 @@ export default {
}, },
}, },
watch: { watch: {
currentChat(conversation, oldConversation) { currentChat(conversation) {
const { can_reply: canReply } = conversation; const { can_reply: canReply } = conversation;
if (oldConversation && oldConversation.id !== conversation.id) {
// Only update email fields when switching to a completely different conversation (by ID)
// This prevents overwriting user input (e.g., CC/BCC fields) when performing actions
// like self-assign or other updates that do not actually change the conversation context
this.setCCAndToEmailsFromLastChat(); this.setCCAndToEmailsFromLastChat();
}
if (this.isOnPrivateNote) { if (this.isOnPrivateNote) {
return; return;
@@ -423,12 +406,13 @@ export default {
}, },
// When moving from one conversation to another, the store may not have the // When moving from one conversation to another, the store may not have the
// list of all the messages. A fetch is subsequently made to get the messages. // list of all the messages. A fetch is subsequently made to get the messages.
// This watcher handles two main cases: // However, this update does not trigger the `currentChat` watcher.
// 1. When switching conversations and messages are fetched/updated, ensures CC/BCC fields are set from the latest OUTGOING/INCOMING email (not activity/private messages). // We can add a deep watcher to it, but then, that would be too broad of a net to cast
// 2. Fixes and issue where CC/BCC fields could be reset/lost after assignment/activity actions or message mutations that did not represent a true email context change. // And would impact performance too. So we watch the messages directly.
lastEmail: { // The watcher here is `deep` too, because the messages array is mutated and
handler(lastEmail) { // not replaced. So, a shallow watcher would not catch the change.
if (!lastEmail) return; 'currentChat.messages': {
handler() {
this.setCCAndToEmailsFromLastChat(); this.setCCAndToEmailsFromLastChat();
}, },
deep: true, deep: true,
@@ -702,11 +686,7 @@ export default {
this.isATwilioWhatsAppChannel || this.isATwilioWhatsAppChannel ||
this.isAWhatsAppCloudChannel || this.isAWhatsAppCloudChannel ||
this.is360DialogWhatsAppChannel; this.is360DialogWhatsAppChannel;
// When users send messages containing both text and attachments on Instagram, Instagram treats them as separate messages. if (isOnWhatsApp && !this.isPrivate) {
// Although Chatwoot combines these into a single message, Instagram sends separate echo events for each component.
// This can create duplicate messages in Chatwoot. To prevent this issue, we'll handle text and attachments as separate messages.
const isOnInstagram = this.isAnInstagramChannel;
if ((isOnWhatsApp || isOnInstagram) && !this.isPrivate) {
this.sendMessageAsMultipleMessages(this.message); this.sendMessageAsMultipleMessages(this.message);
} else { } else {
const messagePayload = this.getMessagePayload(this.message); const messagePayload = this.getMessagePayload(this.message);
@@ -723,7 +703,7 @@ export default {
} }
}, },
sendMessageAsMultipleMessages(message) { sendMessageAsMultipleMessages(message) {
const messages = this.getMultipleMessagesPayload(message); const messages = this.getMessagePayloadForWhatsapp(message);
messages.forEach(messagePayload => { messages.forEach(messagePayload => {
this.sendMessage(messagePayload); this.sendMessage(messagePayload);
}); });
@@ -955,11 +935,11 @@ export default {
return payload; return payload;
}, },
getMultipleMessagesPayload(message) { getMessagePayloadForWhatsapp(message) {
const multipleMessagePayload = []; const multipleMessagePayload = [];
if (this.attachedFiles && this.attachedFiles.length) { if (this.attachedFiles && this.attachedFiles.length) {
let caption = this.isAnInstagramChannel ? '' : message; let caption = message;
this.attachedFiles.forEach(attachment => { this.attachedFiles.forEach(attachment => {
const attachedFile = this.globalConfig.directUploadsEnabled const attachedFile = this.globalConfig.directUploadsEnabled
? attachment.blobSignedId ? attachment.blobSignedId
@@ -974,19 +954,9 @@ export default {
attachmentPayload = this.setReplyToInPayload(attachmentPayload); attachmentPayload = this.setReplyToInPayload(attachmentPayload);
multipleMessagePayload.push(attachmentPayload); multipleMessagePayload.push(attachmentPayload);
// For WhatsApp, only the first attachment gets a caption caption = '';
if (!this.isAnInstagramChannel) caption = '';
}); });
} } else {
const hasNoAttachments =
!this.attachedFiles || !this.attachedFiles.length;
// For Instagram, we need a separate text message
// For WhatsApp, we only need a text message if there are no attachments
if (
(this.isAnInstagramChannel && this.message) ||
(!this.isAnInstagramChannel && hasNoAttachments)
) {
let messagePayload = { let messagePayload = {
conversationId: this.currentChat.id, conversationId: this.currentChat.id,
message, message,
@@ -1166,7 +1136,7 @@ export default {
v-else-if="!showRichContentEditor" v-else-if="!showRichContentEditor"
ref="messageInput" ref="messageInput"
v-model="message" v-model="message"
class="rounded-none input" class="input"
:placeholder="messagePlaceHolder" :placeholder="messagePlaceHolder"
:min-height="4" :min-height="4"
:signature="signatureToApply" :signature="signatureToApply"
@@ -69,6 +69,10 @@ const onAgentSelect = index => {
v-if="items.length" v-if="items.length"
ref="tagAgentsRef" ref="tagAgentsRef"
class="vertical dropdown menu mention--box bg-n-solid-1 p-1 rounded-xl text-sm overflow-auto absolute w-full z-20 shadow-md left-0 leading-[1.2] bottom-full max-h-[12.5rem] border border-solid border-n-strong" class="vertical dropdown menu mention--box bg-n-solid-1 p-1 rounded-xl text-sm overflow-auto absolute w-full z-20 shadow-md left-0 leading-[1.2] bottom-full max-h-[12.5rem] border border-solid border-n-strong"
:class="{
'border-b-[0.5rem] border-solid border-white dark:!border-slate-700':
items.length <= 4,
}"
> >
<li <li
v-for="(agent, index) in items" v-for="(agent, index) in items"
@@ -56,7 +56,7 @@ const unlinkIssue = () => {
<template> <template>
<div <div
class="absolute flex flex-col items-start bg-n-alpha-3 backdrop-blur-[100px] z-50 px-4 py-3 border border-solid border-n-container w-[384px] rounded-xl gap-4 max-h-96 overflow-auto" class="absolute flex flex-col items-start bg-white dark:bg-slate-800 z-50 px-4 py-3 border border-solid border-ash-200 w-[384px] rounded-xl gap-4 max-h-96 overflow-auto"
> >
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
<IssueHeader <IssueHeader
@@ -66,37 +66,37 @@ const unlinkIssue = () => {
@unlink-issue="unlinkIssue" @unlink-issue="unlinkIssue"
/> />
<span class="mt-2 text-sm font-medium text-n-slate-12"> <span class="mt-2 text-sm font-medium text-ash-900">
{{ issue.title }} {{ issue.title }}
</span> </span>
<span <span
v-if="issue.description" v-if="issue.description"
class="mt-1 text-sm text-n-slate-11 line-clamp-3" class="mt-1 text-sm text-ash-800 line-clamp-3"
> >
{{ issue.description }} {{ issue.description }}
</span> </span>
</div> </div>
<div class="flex flex-row items-center h-6 gap-2"> <div class="flex flex-row items-center h-6 gap-2">
<UserAvatarWithName v-if="assignee" :user="assignee" class="py-1" /> <UserAvatarWithName v-if="assignee" :user="assignee" class="py-1" />
<div v-if="assignee" class="w-px h-3 bg-n-slate-4" /> <div v-if="assignee" class="w-px h-3 bg-ash-200" />
<div class="flex items-center gap-1 py-1"> <div class="flex items-center gap-1 py-1">
<fluent-icon <fluent-icon
icon="status" icon="status"
size="14" size="14"
:style="{ color: issue.state.color }" :style="{ color: issue.state.color }"
/> />
<h6 class="text-xs text-n-slate-12"> <h6 class="text-xs text-ash-900">
{{ issue.state.name }} {{ issue.state.name }}
</h6> </h6>
</div> </div>
<div v-if="priorityLabel" class="w-px h-3 bg-n-slate-4" /> <div v-if="priorityLabel" class="w-px h-3 bg-ash-200" />
<div v-if="priorityLabel" class="flex items-center gap-1 py-1"> <div v-if="priorityLabel" class="flex items-center gap-1 py-1">
<fluent-icon <fluent-icon
:icon="`priority-${priorityLabel.toLowerCase()}`" :icon="`priority-${priorityLabel.toLowerCase()}`"
size="14" size="14"
view-box="0 0 12 12" view-box="0 0 12 12"
/> />
<h6 class="text-xs text-n-slate-12">{{ priorityLabel }}</h6> <h6 class="text-xs text-ash-900">{{ priorityLabel }}</h6>
</div> </div>
</div> </div>
<div v-if="labels.length" class="flex flex-wrap items-center gap-1"> <div v-if="labels.length" class="flex flex-wrap items-center gap-1">
@@ -111,7 +111,7 @@ const unlinkIssue = () => {
/> />
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<span class="text-xs text-n-slate-11"> <span class="text-xs text-ash-800">
{{ {{
$t('INTEGRATION_SETTINGS.LINEAR.ISSUE.CREATED_AT', { $t('INTEGRATION_SETTINGS.LINEAR.ISSUE.CREATED_AT', {
createdAt: formattedDate, createdAt: formattedDate,
@@ -100,17 +100,14 @@ onMounted(() => {
</script> </script>
<template> <template>
<div <div class="relative" :class="{ group: linkedIssue }">
class="relative after:content-[''] after:h-5 after:bg-transparent after:top-5 after:w-full after:block after:absolute after:z-0"
:class="{ group: linkedIssue }"
>
<Button <Button
v-on-clickaway="closeIssue" v-on-clickaway="closeIssue"
v-tooltip="tooltipText" v-tooltip="tooltipText"
sm sm
ghost ghost
slate slate
class="!gap-1 group-hover:bg-n-alpha-2" class="!gap-1"
@click="openIssue" @click="openIssue"
> >
<fluent-icon <fluent-icon
@@ -127,7 +124,7 @@ onMounted(() => {
v-if="linkedIssue" v-if="linkedIssue"
:issue="linkedIssue.issue" :issue="linkedIssue.issue"
:link-id="linkedIssue.id" :link-id="linkedIssue.id"
class="absolute right-0 top-[36px] invisible group-hover:visible" class="absolute right-0 top-[40px] invisible group-hover:visible"
@unlink-issue="unlinkIssue" @unlink-issue="unlinkIssue"
/> />
<woot-modal <woot-modal
@@ -1,39 +0,0 @@
import { ref } from 'vue';
import { useTranslations } from '../useTranslations';
describe('useTranslations', () => {
it('returns false and null when contentAttributes is null', () => {
const contentAttributes = ref(null);
const { hasTranslations, translationContent } =
useTranslations(contentAttributes);
expect(hasTranslations.value).toBe(false);
expect(translationContent.value).toBeNull();
});
it('returns false and null when translations are missing', () => {
const contentAttributes = ref({});
const { hasTranslations, translationContent } =
useTranslations(contentAttributes);
expect(hasTranslations.value).toBe(false);
expect(translationContent.value).toBeNull();
});
it('returns false and null when translations is an empty object', () => {
const contentAttributes = ref({ translations: {} });
const { hasTranslations, translationContent } =
useTranslations(contentAttributes);
expect(hasTranslations.value).toBe(false);
expect(translationContent.value).toBeNull();
});
it('returns true and correct translation content when translations exist', () => {
const contentAttributes = ref({
translations: { en: 'Hello' },
});
const { hasTranslations, translationContent } =
useTranslations(contentAttributes);
expect(hasTranslations.value).toBe(true);
// Should return the first translation (en: 'Hello')
expect(translationContent.value).toBe('Hello');
});
});
@@ -1,6 +1,6 @@
import { computed } from 'vue'; import { computed } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useMapGetter, useStore } from './store'; import { useMapGetter } from './store';
/** /**
* Composable for account-related operations. * Composable for account-related operations.
@@ -12,7 +12,6 @@ export function useAccount() {
* @type {import('vue').ComputedRef<number>} * @type {import('vue').ComputedRef<number>}
*/ */
const route = useRoute(); const route = useRoute();
const store = useStore();
const getAccountFn = useMapGetter('accounts/getAccount'); const getAccountFn = useMapGetter('accounts/getAccount');
const isOnChatwootCloud = useMapGetter('globalConfig/isOnChatwootCloud'); const isOnChatwootCloud = useMapGetter('globalConfig/isOnChatwootCloud');
const isFeatureEnabledonAccount = useMapGetter( const isFeatureEnabledonAccount = useMapGetter(
@@ -45,12 +44,6 @@ export function useAccount() {
}; };
}; };
const updateAccount = async data => {
await store.dispatch('accounts/update', {
...data,
});
};
return { return {
accountId, accountId,
route, route,
@@ -59,6 +52,5 @@ export function useAccount() {
accountScopedRoute, accountScopedRoute,
isCloudFeatureEnabled, isCloudFeatureEnabled,
isOnChatwootCloud, isOnChatwootCloud,
updateAccount,
}; };
} }
@@ -121,7 +121,7 @@ export const useInbox = () => {
); );
}); });
const isAnInstagramChannel = computed(() => { const isAInstagramChannel = computed(() => {
return channelType.value === INBOX_TYPES.INSTAGRAM; return channelType.value === INBOX_TYPES.INSTAGRAM;
}); });
@@ -141,6 +141,6 @@ export const useInbox = () => {
isAWhatsAppCloudChannel, isAWhatsAppCloudChannel,
is360DialogWhatsAppChannel, is360DialogWhatsAppChannel,
isAnEmailChannel, isAnEmailChannel,
isAnInstagramChannel, isAInstagramChannel,
}; };
}; };
@@ -7,12 +7,8 @@ import { formatTime } from '@chatwoot/utils';
* @param {string} [accountSummaryKey='getAccountSummary'] - The key for accessing account summary data. * @param {string} [accountSummaryKey='getAccountSummary'] - The key for accessing account summary data.
* @returns {Object} An object containing utility functions for report metrics. * @returns {Object} An object containing utility functions for report metrics.
*/ */
export function useReportMetrics( export function useReportMetrics(accountSummaryKey = 'getAccountSummary') {
accountSummaryKey = 'getAccountSummary',
summarFetchingKey = 'getAccountSummaryFetchingStatus'
) {
const accountSummary = useMapGetter(accountSummaryKey); const accountSummary = useMapGetter(accountSummaryKey);
const fetchingStatus = useMapGetter(summarFetchingKey);
/** /**
* Calculates the trend percentage for a given metric. * Calculates the trend percentage for a given metric.
@@ -57,6 +53,5 @@ export function useReportMetrics(
calculateTrend, calculateTrend,
isAverageMetricType, isAverageMetricType,
displayMetric, displayMetric,
fetchingStatus,
}; };
} }
@@ -1,22 +0,0 @@
import { computed } from 'vue';
/**
* Composable to extract translation state/content from contentAttributes.
* @param {Ref|Reactive} contentAttributes - Ref or reactive object containing `translations` property
* @returns {Object} { hasTranslations, translationContent }
*/
export function useTranslations(contentAttributes) {
const hasTranslations = computed(() => {
if (!contentAttributes.value) return false;
const { translations = {} } = contentAttributes.value;
return Object.keys(translations || {}).length > 0;
});
const translationContent = computed(() => {
if (!hasTranslations.value) return null;
const translations = contentAttributes.value.translations;
return translations[Object.keys(translations)[0]];
});
return { hasTranslations, translationContent };
}
@@ -6,7 +6,6 @@ export const DEFAULT_CONVERSATION_SIDEBAR_ITEMS_ORDER = Object.freeze([
{ name: 'macros' }, { name: 'macros' },
{ name: 'conversation_info' }, { name: 'conversation_info' },
{ name: 'contact_attributes' }, { name: 'contact_attributes' },
{ name: 'contact_notes' },
{ name: 'previous_conversation' }, { name: 'previous_conversation' },
{ name: 'conversation_participants' }, { name: 'conversation_participants' },
{ name: 'shopify_orders' }, { name: 'shopify_orders' },
@@ -37,7 +36,7 @@ const useConversationSidebarItemsOrder = uiSettings => {
const { conversation_sidebar_items_order: itemsOrder } = uiSettings.value; const { conversation_sidebar_items_order: itemsOrder } = uiSettings.value;
// If the sidebar order is not set, use the default order. // If the sidebar order is not set, use the default order.
if (!itemsOrder) { if (!itemsOrder) {
return [...DEFAULT_CONVERSATION_SIDEBAR_ITEMS_ORDER]; return DEFAULT_CONVERSATION_SIDEBAR_ITEMS_ORDER;
} }
// Create a copy of itemsOrder to avoid mutating the original store object. // Create a copy of itemsOrder to avoid mutating the original store object.
const itemsOrderCopy = [...itemsOrder]; const itemsOrderCopy = [...itemsOrder];
@@ -16,15 +16,6 @@ export const getUserPermissions = (user, accountId) => {
return currentAccount.permissions || []; return currentAccount.permissions || [];
}; };
export const getUserRole = (user, accountId) => {
const currentAccount = getCurrentAccount(user, accountId) || {};
if (currentAccount.custom_role_id) {
return 'custom_role';
}
return currentAccount.role || 'agent';
};
const isPermissionsPresentInRoute = route => const isPermissionsPresentInRoute = route =>
route.meta && route.meta.permissions; route.meta && route.meta.permissions;
@@ -1,44 +1,6 @@
/** export const buildPortalURL = portalSlug => {
* Formats a custom domain with https protocol if needed const { hostURL, helpCenterURL } = window.chatwootConfig;
* @param {string} customDomain - The custom domain to format
* @returns {string} Formatted domain with https protocol
*/
const formatCustomDomain = customDomain =>
customDomain.startsWith('https') ? customDomain : `https://${customDomain}`;
/**
* Gets the default base URL from configuration
* @returns {string} The default base URL
* @throws {Error} If no valid base URL is found
*/
const getDefaultBaseURL = () => {
const { hostURL, helpCenterURL } = window.chatwootConfig || {};
const baseURL = helpCenterURL || hostURL || ''; const baseURL = helpCenterURL || hostURL || '';
if (!baseURL) {
throw new Error('No valid base URL found in configuration');
}
return baseURL;
};
/**
* Gets the base URL from configuration or custom domain
* @param {string} [customDomain] - Optional custom domain for the portal
* @returns {string} The base URL for the portal
*/
const getPortalBaseURL = customDomain =>
customDomain ? formatCustomDomain(customDomain) : getDefaultBaseURL();
/**
* Builds a portal URL using the provided portal slug and optional custom domain
* @param {string} portalSlug - The slug identifier for the portal
* @param {string} [customDomain] - Optional custom domain for the portal
* @returns {string} The complete portal URL
* @throws {Error} If portalSlug is not provided or invalid
*/
export const buildPortalURL = (portalSlug, customDomain) => {
const baseURL = getPortalBaseURL(customDomain);
return `${baseURL}/hc/${portalSlug}`; return `${baseURL}/hc/${portalSlug}`;
}; };
@@ -46,10 +8,9 @@ export const buildPortalArticleURL = (
portalSlug, portalSlug,
categorySlug, categorySlug,
locale, locale,
articleSlug, articleSlug
customDomain
) => { ) => {
const portalURL = buildPortalURL(portalSlug, customDomain); const portalURL = buildPortalURL(portalSlug);
return `${portalURL}/articles/${articleSlug}`; return `${portalURL}/articles/${articleSlug}`;
}; };
@@ -25,47 +25,5 @@ describe('PortalHelper', () => {
).toEqual('https://help.chatwoot.com/hc/handbook/articles/article-slug'); ).toEqual('https://help.chatwoot.com/hc/handbook/articles/article-slug');
window.chatwootConfig = {}; window.chatwootConfig = {};
}); });
it('returns the correct url with custom domain', () => {
window.chatwootConfig = {
hostURL: 'https://app.chatwoot.com',
helpCenterURL: 'https://help.chatwoot.com',
};
expect(
buildPortalArticleURL(
'handbook',
'culture',
'fr',
'article-slug',
'custom-domain.dev'
)
).toEqual('https://custom-domain.dev/hc/handbook/articles/article-slug');
});
it('handles https in custom domain correctly', () => {
window.chatwootConfig = {
hostURL: 'https://app.chatwoot.com',
helpCenterURL: 'https://help.chatwoot.com',
};
expect(
buildPortalArticleURL(
'handbook',
'culture',
'fr',
'article-slug',
'https://custom-domain.dev'
)
).toEqual('https://custom-domain.dev/hc/handbook/articles/article-slug');
});
it('uses hostURL when helpCenterURL is not available', () => {
window.chatwootConfig = {
hostURL: 'https://app.chatwoot.com',
helpCenterURL: '',
};
expect(
buildPortalArticleURL('handbook', 'culture', 'fr', 'article-slug')
).toEqual('https://app.chatwoot.com/hc/handbook/articles/article-slug');
});
}); });
}); });
@@ -2,13 +2,23 @@
"AGENT_BOTS": { "AGENT_BOTS": {
"HEADER": "Bots", "HEADER": "Bots",
"LOADING_EDITOR": "Loading editor...", "LOADING_EDITOR": "Loading editor...",
"DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try. You can manage your bots from this page or create new ones using the 'Add Bot' button.", "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try.You can manage your bots from this page or create new ones using the 'Configure new bot' button.",
"LEARN_MORE": "Learn about agent bots", "LEARN_MORE": "Learn about agent bots",
"GLOBAL_BOT": "System bot", "CSML_BOT_EDITOR": {
"GLOBAL_BOT_BADGE": "System", "NAME": {
"AVATAR": { "LABEL": "Bot name",
"SUCCESS_DELETE": "Bot avatar deleted successfully", "PLACEHOLDER": "Name your bot.",
"ERROR_DELETE": "Error deleting bot avatar, please try again" "ERROR": "Bot name is required."
},
"DESCRIPTION": {
"LABEL": "Bot description",
"PLACEHOLDER": "What does this bot do?"
},
"BOT_CONFIG": {
"ERROR": "Please enter your CSML bot configuration above.",
"API_ERROR": "Your CSML configuration is invalid. Please fix it and try again."
},
"SUBMIT": "Validate and save"
}, },
"BOT_CONFIGURATION": { "BOT_CONFIGURATION": {
"TITLE": "Select an agent bot", "TITLE": "Select an agent bot",
@@ -22,7 +32,7 @@
"SELECT_PLACEHOLDER": "Select bot" "SELECT_PLACEHOLDER": "Select bot"
}, },
"ADD": { "ADD": {
"TITLE": "Add Bot", "TITLE": "Configure new bot",
"CANCEL_BUTTON_TEXT": "Cancel", "CANCEL_BUTTON_TEXT": "Cancel",
"API": { "API": {
"SUCCESS_MESSAGE": "Bot added successfully.", "SUCCESS_MESSAGE": "Bot added successfully.",
@@ -30,22 +40,16 @@
} }
}, },
"LIST": { "LIST": {
"404": "No bots found. You can create a bot by clicking the 'Add Bot' button.", "404": "No bots found. You can create a bot by clicking the 'Configure new bot' button",
"LOADING": "Fetching bots...", "LOADING": "Fetching bots...",
"TABLE_HEADER": { "TYPE": "Bot type"
"DETAILS": "Bot Details",
"URL": "Webhook URL"
}
}, },
"DELETE": { "DELETE": {
"BUTTON_TEXT": "Delete", "BUTTON_TEXT": "Delete",
"TITLE": "Delete bot", "TITLE": "Delete bot",
"CONFIRM": { "SUBMIT": "Delete",
"TITLE": "Confirm Deletion", "CANCEL_BUTTON_TEXT": "Cancel",
"MESSAGE": "Are you sure you want to delete {name}?", "DESCRIPTION": "Are you sure you want to delete this bot? This action is irreversible.",
"YES": "Yes, Delete",
"NO": "No, Keep"
},
"API": { "API": {
"SUCCESS_MESSAGE": "Bot deleted successfully.", "SUCCESS_MESSAGE": "Bot deleted successfully.",
"ERROR_MESSAGE": "Could not delete bot. Please try again." "ERROR_MESSAGE": "Could not delete bot. Please try again."
@@ -53,44 +57,17 @@
}, },
"EDIT": { "EDIT": {
"BUTTON_TEXT": "Edit", "BUTTON_TEXT": "Edit",
"LOADING": "Fetching bots...",
"TITLE": "Edit bot", "TITLE": "Edit bot",
"CANCEL_BUTTON_TEXT": "Cancel",
"API": { "API": {
"SUCCESS_MESSAGE": "Bot updated successfully.", "SUCCESS_MESSAGE": "Bot updated successfully.",
"ERROR_MESSAGE": "Could not update bot. Please try again." "ERROR_MESSAGE": "Could not update bot. Please try again."
} }
}, },
"FORM": {
"AVATAR": {
"LABEL": "Bot avatar"
},
"NAME": {
"LABEL": "Bot name",
"PLACEHOLDER": "Enter bot name",
"REQUIRED": "Bot name is required"
},
"DESCRIPTION": {
"LABEL": "Description",
"PLACEHOLDER": "What does this bot do?"
},
"WEBHOOK_URL": {
"LABEL": "Webhook URL",
"PLACEHOLDER": "https://example.com/webhook",
"REQUIRED": "Webhook URL is required"
},
"ERRORS": {
"NAME": "Bot name is required",
"URL": "Webhook URL is required",
"VALID_URL": "Please enter a valid URL starting with http:// or https://"
},
"CANCEL": "Cancel",
"CREATE": "Create Bot",
"UPDATE": "Update Bot"
},
"WEBHOOK": {
"DESCRIPTION": "Configure a webhook bot to integrate with your custom services. The bot will receive and process events from conversations and can respond to them."
},
"TYPES": { "TYPES": {
"WEBHOOK": "Webhook bot" "WEBHOOK": "Webhook bot",
"CSML": "CSML bot"
} }
} }
} }
@@ -126,44 +126,6 @@
"ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required", "ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required",
"ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required" "ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required"
}, },
"NONE_OPTION": "None", "NONE_OPTION": "None"
"EVENTS": {
"CONVERSATION_CREATED": "Conversation Created",
"CONVERSATION_UPDATED": "Conversation Updated",
"MESSAGE_CREATED": "Message Created",
"CONVERSATION_OPENED": "Conversation Opened"
},
"ACTIONS": {
"ASSIGN_AGENT": "Assign to Agent",
"ASSIGN_TEAM": "Assign a Team",
"ADD_LABEL": "Add a Label",
"REMOVE_LABEL": "Remove a Label",
"SEND_EMAIL_TO_TEAM": "Send an Email to Team",
"SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
"MUTE_CONVERSATION": "Mute Conversation",
"SNOOZE_CONVERSATION": "Snooze Conversation",
"RESOLVE_CONVERSATION": "Resolve Conversation",
"SEND_WEBHOOK_EVENT": "Send Webhook Event",
"SEND_ATTACHMENT": "Send Attachment",
"SEND_MESSAGE": "Send a Message",
"CHANGE_PRIORITY": "Change Priority",
"ADD_SLA": "Add SLA"
},
"ATTRIBUTES": {
"MESSAGE_TYPE": "Message Type",
"MESSAGE_CONTAINS": "Message Contains",
"EMAIL": "Email",
"INBOX": "Inbox",
"CONVERSATION_LANGUAGE": "Conversation Language",
"PHONE_NUMBER": "Phone Number",
"STATUS": "Status",
"BROWSER_LANGUAGE": "Browser Language",
"MAIL_SUBJECT": "Email Subject",
"COUNTRY_NAME": "Country",
"REFERER_LINK": "Referrer Link",
"ASSIGNEE_NAME": "Assignee",
"TEAM_NAME": "Team",
"PRIORITY": "Priority"
}
} }
} }
@@ -544,9 +544,6 @@
"WROTE": "wrote", "WROTE": "wrote",
"YOU": "You", "YOU": "You",
"SAVE": "Save note", "SAVE": "Save note",
"EXPAND": "Expand",
"COLLAPSE": "Collapse",
"NO_NOTES": "No notes, you can add notes from the contact details page.",
"EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above." "EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above."
} }
}, },
@@ -32,12 +32,10 @@
"LOADING_CONVERSATIONS": "Loading Conversations", "LOADING_CONVERSATIONS": "Loading Conversations",
"CANNOT_REPLY": "You cannot reply due to", "CANNOT_REPLY": "You cannot reply due to",
"24_HOURS_WINDOW": "24 hour message window restriction", "24_HOURS_WINDOW": "24 hour message window restriction",
"API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
"NOT_ASSIGNED_TO_YOU": "This conversation is not assigned to you. Would you like to assign this conversation to yourself?", "NOT_ASSIGNED_TO_YOU": "This conversation is not assigned to you. Would you like to assign this conversation to yourself?",
"ASSIGN_TO_ME": "Assign to me", "ASSIGN_TO_ME": "Assign to me",
"TWILIO_WHATSAPP_CAN_REPLY": "You can only reply to this conversation using a template message due to", "TWILIO_WHATSAPP_CAN_REPLY": "You can only reply to this conversation using a template message due to",
"TWILIO_WHATSAPP_24_HOURS_WINDOW": "24 hour message window restriction", "TWILIO_WHATSAPP_24_HOURS_WINDOW": "24 hour message window restriction",
"OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You wont be able to send messages from this conversation anymore.",
"REPLYING_TO": "You are replying to:", "REPLYING_TO": "You are replying to:",
"REMOVE_SELECTION": "Remove Selection", "REMOVE_SELECTION": "Remove Selection",
"DOWNLOAD": "Download", "DOWNLOAD": "Download",
@@ -295,7 +293,6 @@
"CONVERSATION_ACTIONS": "Conversation Actions", "CONVERSATION_ACTIONS": "Conversation Actions",
"CONVERSATION_LABELS": "Conversation Labels", "CONVERSATION_LABELS": "Conversation Labels",
"CONVERSATION_INFO": "Conversation Information", "CONVERSATION_INFO": "Conversation Information",
"CONTACT_NOTES": "Contact Notes",
"CONTACT_ATTRIBUTES": "Contact Attributes", "CONTACT_ATTRIBUTES": "Contact Attributes",
"PREVIOUS_CONVERSATION": "Previous Conversations", "PREVIOUS_CONVERSATION": "Previous Conversations",
"MACROS": "Macros", "MACROS": "Macros",
@@ -1,11 +1,5 @@
{ {
"GENERAL_SETTINGS": { "GENERAL_SETTINGS": {
"LIMIT_MESSAGES": {
"CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
"INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
"AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
"NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
},
"TITLE": "Account settings", "TITLE": "Account settings",
"SUBMIT": "Update settings", "SUBMIT": "Update settings",
"BACK": "Back", "BACK": "Back",
@@ -14,26 +8,6 @@
"ERROR": "Could not update settings, try again!", "ERROR": "Could not update settings, try again!",
"SUCCESS": "Successfully updated account settings" "SUCCESS": "Successfully updated account settings"
}, },
"ACCOUNT_DELETE_SECTION": {
"TITLE": "Delete your Account",
"NOTE": "Once you delete your account, all your data will be deleted.",
"BUTTON_TEXT": "Delete Your Account",
"CONFIRM": {
"TITLE": "Delete Account",
"MESSAGE": "Deleting your Account is irreversible. Enter your account name below to confirm you want to permanently delete it.",
"BUTTON_TEXT": "Delete",
"DISMISS": "Cancel",
"PLACE_HOLDER": "Please type {accountName} to confirm"
},
"SUCCESS": "Account marked for deletion",
"FAILURE": "Could not delete account, try again!",
"SCHEDULED_DELETION": {
"TITLE": "Account Scheduled for Deletion",
"MESSAGE_MANUAL": "This account is scheduled for deletion on {deletionDate}. This was requested by an administrator. You can cancel the deletion before this date.",
"MESSAGE_INACTIVITY": "This account is scheduled for deletion on {deletionDate} due to account inactivity. You can cancel the deletion before this date.",
"CLEAR_BUTTON": "Cancel Scheduled Deletion"
}
},
"FORM": { "FORM": {
"ERROR": "Please fix form errors", "ERROR": "Please fix form errors",
"GENERAL_SECTION": { "GENERAL_SECTION": {
@@ -77,7 +51,6 @@
"UPDATE_CHATWOOT": "An update {latestChatwootVersion} for Chatwoot is available. Please update your instance.", "UPDATE_CHATWOOT": "An update {latestChatwootVersion} for Chatwoot is available. Please update your instance.",
"LEARN_MORE": "Learn more", "LEARN_MORE": "Learn more",
"PAYMENT_PENDING": "Your payment is pending. Please update your payment information to continue using Chatwoot", "PAYMENT_PENDING": "Your payment is pending. Please update your payment information to continue using Chatwoot",
"UPGRADE": "Upgrade to continue using Chatwoot",
"LIMITS_UPGRADE": "Your account has exceeded the usage limits, please upgrade your plan to continue using Chatwoot", "LIMITS_UPGRADE": "Your account has exceeded the usage limits, please upgrade your plan to continue using Chatwoot",
"OPEN_BILLING": "Open billing" "OPEN_BILLING": "Open billing"
}, },
@@ -696,8 +696,7 @@
"SLUG": { "SLUG": {
"LABEL": "Slug", "LABEL": "Slug",
"PLACEHOLDER": "user-guide", "PLACEHOLDER": "user-guide",
"ERROR": "Slug is required", "ERROR": "Slug is required"
"FORMAT_ERROR": "Please enter a valid slug, for eg: user-guide"
} }
}, },
"PORTAL_SETTINGS": { "PORTAL_SETTINGS": {
@@ -43,17 +43,7 @@
"INBOX_NAME": "Inbox Name", "INBOX_NAME": "Inbox Name",
"ADD_NAME": "Add a name for your inbox", "ADD_NAME": "Add a name for your inbox",
"PICK_NAME": "Pick a Name for your Inbox", "PICK_NAME": "Pick a Name for your Inbox",
"PICK_A_VALUE": "Pick a value", "PICK_A_VALUE": "Pick a value"
"CREATE_INBOX": "Create Inbox"
},
"INSTAGRAM": {
"CONTINUE_WITH_INSTAGRAM": "Continue with Instagram",
"CONNECT_YOUR_INSTAGRAM_PROFILE": "Connect your Instagram Profile",
"HELP": "To add your Instagram profile as a channel, you need to authenticate your Instagram Profile by clicking on 'Continue with Instagram' ",
"ERROR_MESSAGE": "There was an error connecting to Instagram, please try again",
"ERROR_AUTH": "There was an error connecting to Instagram, please try again",
"NEW_INBOX_SUGGESTION": "This Instagram account was previously linked to a different inbox and has now been migrated here. All new messages will appear here. The old inbox will no longer be able to send or receive messages for this account.",
"DUPLICATE_INBOX_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. You wont be able to send/receive Instagram messages from this inbox anymore."
}, },
"TWITTER": { "TWITTER": {
"HELP": "To add your Twitter profile as a channel, you need to authenticate your Twitter Profile by clicking on 'Sign in with Twitter' ", "HELP": "To add your Twitter profile as a channel, you need to authenticate your Twitter Profile by clicking on 'Sign in with Twitter' ",
@@ -763,8 +753,7 @@
"EMAIL": "Email", "EMAIL": "Email",
"TELEGRAM": "Telegram", "TELEGRAM": "Telegram",
"LINE": "Line", "LINE": "Line",
"API": "API Channel", "API": "API Channel"
"INSTAGRAM": "Instagram"
} }
} }
} }
@@ -329,34 +329,11 @@
"HEADER_KNOW_MORE": "Know more", "HEADER_KNOW_MORE": "Know more",
"COPILOT": { "COPILOT": {
"SEND_MESSAGE": "Send message...", "SEND_MESSAGE": "Send message...",
"EMPTY_MESSAGE": "There was an error generating the response. Please try again.",
"LOADER": "Captain is thinking", "LOADER": "Captain is thinking",
"YOU": "You", "YOU": "You",
"USE": "Use this", "USE": "Use this",
"RESET": "Reset", "RESET": "Reset",
"SELECT_ASSISTANT": "Select Assistant", "SELECT_ASSISTANT": "Select Assistant"
"PROMPTS": {
"SUMMARIZE": {
"LABEL": "Summarize this conversation",
"CONTENT": "Summarize the key points discussed between the customer and the support agent, including the customer's concerns, questions, and the solutions or responses provided by the support agent"
},
"SUGGEST": {
"LABEL": "Suggest an answer",
"CONTENT": "Analyze the customer's inquiry, and draft a response that effectively addresses their concerns or questions. Ensure the reply is clear, concise, and provides helpful information."
},
"RATE": {
"LABEL": "Rate this conversation",
"CONTENT": "Review the conversation to see how well it meets the customer's needs. Share a rating out of 5 based on tone, clarity, and effectiveness."
}
}
},
"PLAYGROUND": {
"USER": "You",
"ASSISTANT": "Assistant",
"MESSAGE_PLACEHOLDER": "Type your message...",
"HEADER": "Playground",
"DESCRIPTION": "Use this playground to send messages to your assistant and check if it responds accurately, quickly, and in the tone you expect.",
"CREDIT_NOTE": "Messages sent here will count toward your Captain credits."
}, },
"PAYWALL": { "PAYWALL": {
"TITLE": "Upgrade to use Captain AI", "TITLE": "Upgrade to use Captain AI",
@@ -396,45 +373,21 @@
"ERROR_MESSAGE": "There was an error creating the assistant, please try again." "ERROR_MESSAGE": "There was an error creating the assistant, please try again."
}, },
"FORM": { "FORM": {
"UPDATE": "Update",
"SECTIONS": {
"BASIC_INFO": "Basic Information",
"SYSTEM_MESSAGES": "System Messages",
"INSTRUCTIONS": "Instructions",
"FEATURES": "Features",
"TOOLS": "Tools "
},
"NAME": { "NAME": {
"LABEL": "Name", "LABEL": "Assistant Name",
"PLACEHOLDER": "Enter assistant name", "PLACEHOLDER": "Enter a name for the assistant",
"ERROR": "The name is required" "ERROR": "Please provide a name for the assistant"
}, },
"DESCRIPTION": { "DESCRIPTION": {
"LABEL": "Description", "LABEL": "Assistant Description",
"PLACEHOLDER": "Enter assistant description", "PLACEHOLDER": "Describe how and where this assistant will be used",
"ERROR": "The description is required" "ERROR": "A description is required"
}, },
"PRODUCT_NAME": { "PRODUCT_NAME": {
"LABEL": "Product Name", "LABEL": "Product Name",
"PLACEHOLDER": "Enter product name", "PLACEHOLDER": "Enter the name of the product this assistant is designed for",
"ERROR": "The product name is required" "ERROR": "The product name is required"
}, },
"WELCOME_MESSAGE": {
"LABEL": "Welcome Message",
"PLACEHOLDER": "Enter welcome message"
},
"HANDOFF_MESSAGE": {
"LABEL": "Handoff Message",
"PLACEHOLDER": "Enter handoff message"
},
"RESOLUTION_MESSAGE": {
"LABEL": "Resolution Message",
"PLACEHOLDER": "Enter resolution message"
},
"INSTRUCTIONS": {
"LABEL": "Instructions",
"PLACEHOLDER": "Enter instructions for the assistant"
},
"FEATURES": { "FEATURES": {
"TITLE": "Features", "TITLE": "Features",
"ALLOW_CONVERSATION_FAQS": "Generate FAQs from resolved conversations", "ALLOW_CONVERSATION_FAQS": "Generate FAQs from resolved conversations",
@@ -444,8 +397,7 @@
"EDIT": { "EDIT": {
"TITLE": "Update the assistant", "TITLE": "Update the assistant",
"SUCCESS_MESSAGE": "The assistant has been successfully updated", "SUCCESS_MESSAGE": "The assistant has been successfully updated",
"ERROR_MESSAGE": "There was an error updating the assistant, please try again.", "ERROR_MESSAGE": "There was an error updating the assistant, please try again."
"NOT_FOUND": "Could not find the assistant. Please try again."
}, },
"OPTIONS": { "OPTIONS": {
"EDIT_ASSISTANT": "Edit Assistant", "EDIT_ASSISTANT": "Edit Assistant",
@@ -83,22 +83,6 @@
"ACTION_PARAMETERS_REQUIRED": "Action parameters are required", "ACTION_PARAMETERS_REQUIRED": "Action parameters are required",
"ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required", "ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required",
"ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required" "ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required"
},
"ACTIONS": {
"ASSIGN_TEAM": "Assign a Team",
"ASSIGN_AGENT": "Assign an Agent",
"ADD_LABEL": "Add a Label",
"REMOVE_LABEL": "Remove a Label",
"REMOVE_ASSIGNED_TEAM": "Remove Assigned Team",
"SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
"MUTE_CONVERSATION": "Mute Conversation",
"SNOOZE_CONVERSATION": "Snooze Conversation",
"RESOLVE_CONVERSATION": "Resolve Conversation",
"SEND_ATTACHMENT": "Send Attachment",
"SEND_MESSAGE": "Send a Message",
"CHANGE_PRIORITY": "Change Priority",
"ADD_PRIVATE_NOTE": "Add a Private Note",
"SEND_WEBHOOK_EVENT": "Send Webhook Event"
} }
} }
} }
@@ -387,8 +387,7 @@
"LABEL": "Company Name", "LABEL": "Company Name",
"PLACEHOLDER": "Wayne Enterprises" "PLACEHOLDER": "Wayne Enterprises"
}, },
"SUBMIT": "Submit", "SUBMIT": "Submit"
"CANCEL": "Cancel"
} }
}, },
"KEYBOARD_SHORTCUTS": { "KEYBOARD_SHORTCUTS": {
@@ -2,13 +2,23 @@
"AGENT_BOTS": { "AGENT_BOTS": {
"HEADER": "الروبوتات", "HEADER": "الروبوتات",
"LOADING_EDITOR": "جار جلب المحرر...", "LOADING_EDITOR": "جار جلب المحرر...",
"DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try. You can manage your bots from this page or create new ones using the 'Add Bot' button.", "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try.You can manage your bots from this page or create new ones using the 'Configure new bot' button.",
"LEARN_MORE": "Learn about agent bots", "LEARN_MORE": "Learn about agent bots",
"GLOBAL_BOT": "System bot", "CSML_BOT_EDITOR": {
"GLOBAL_BOT_BADGE": "النظام", "NAME": {
"AVATAR": { "LABEL": "اسم الروبوت",
"SUCCESS_DELETE": "Bot avatar deleted successfully", "PLACEHOLDER": "قم بتسمية الروبوت الخاص بك.",
"ERROR_DELETE": "Error deleting bot avatar, please try again" "ERROR": "اسم الروبوت مطلوب."
},
"DESCRIPTION": {
"LABEL": "وصف الروبوت",
"PLACEHOLDER": "ماذا يفعل هذا الروبوت؟"
},
"BOT_CONFIG": {
"ERROR": "يرجى إدخال تكوين نبوت CSML الخاص بك أعلاه.",
"API_ERROR": "تكوين CSML الخاص بك غير صالح. يرجى إصلاحه والمحاولة مرة أخرى."
},
"SUBMIT": "التحقق والحفظ"
}, },
"BOT_CONFIGURATION": { "BOT_CONFIGURATION": {
"TITLE": "اختر الروبوت", "TITLE": "اختر الروبوت",
@@ -22,7 +32,7 @@
"SELECT_PLACEHOLDER": "اختر الروبوت" "SELECT_PLACEHOLDER": "اختر الروبوت"
}, },
"ADD": { "ADD": {
"TITLE": "Add Bot", "TITLE": "تكوين روبوت جديد",
"CANCEL_BUTTON_TEXT": "إلغاء", "CANCEL_BUTTON_TEXT": "إلغاء",
"API": { "API": {
"SUCCESS_MESSAGE": "تمت إضافة الروبوت بنجاح.", "SUCCESS_MESSAGE": "تمت إضافة الروبوت بنجاح.",
@@ -30,22 +40,16 @@
} }
}, },
"LIST": { "LIST": {
"404": "No bots found. You can create a bot by clicking the 'Add Bot' button.", "404": "لم يتم العثور على أي روبوتات. يمكنك إنشاء الروبوت بالنقر على زر 'تكوين روبوت جديد' ↗",
"LOADING": "جار جلب الروبوتات...", "LOADING": "جار جلب الروبوتات...",
"TABLE_HEADER": { "TYPE": "نوع الروبوت"
"DETAILS": "Bot Details",
"URL": "رابط Webhook"
}
}, },
"DELETE": { "DELETE": {
"BUTTON_TEXT": "حذف", "BUTTON_TEXT": "حذف",
"TITLE": "حذف الروبوت", "TITLE": "حذف الروبوت",
"CONFIRM": { "SUBMIT": "حذف",
"TITLE": "تأكيد الحذف", "CANCEL_BUTTON_TEXT": "إلغاء",
"MESSAGE": "Are you sure you want to delete {name}?", "DESCRIPTION": "هل أنت متأكد أنك تريد حذف هذا الروبوت؟ هذا الإجراء لا يمكن التراجع عنه.",
"YES": "نعم، احذف",
"NO": "لا، احتفظ"
},
"API": { "API": {
"SUCCESS_MESSAGE": "تم حذف الروبوت بنجاح.", "SUCCESS_MESSAGE": "تم حذف الروبوت بنجاح.",
"ERROR_MESSAGE": "تعذر حذف الروبوت. يرجى المحاولة مرة أخرى." "ERROR_MESSAGE": "تعذر حذف الروبوت. يرجى المحاولة مرة أخرى."
@@ -53,44 +57,17 @@
}, },
"EDIT": { "EDIT": {
"BUTTON_TEXT": "تعديل", "BUTTON_TEXT": "تعديل",
"LOADING": "جار جلب الروبوتات...",
"TITLE": "تعديل الروبوت", "TITLE": "تعديل الروبوت",
"CANCEL_BUTTON_TEXT": "إلغاء",
"API": { "API": {
"SUCCESS_MESSAGE": "تم تحديث الروبوت بنجاح.", "SUCCESS_MESSAGE": "تم تحديث الروبوت بنجاح.",
"ERROR_MESSAGE": "تعذر تحديث الروبوت. يرجى المحاولة مرة أخرى." "ERROR_MESSAGE": "تعذر تحديث الروبوت. يرجى المحاولة مرة أخرى."
} }
}, },
"FORM": {
"AVATAR": {
"LABEL": "Bot avatar"
},
"NAME": {
"LABEL": "اسم الروبوت",
"PLACEHOLDER": "Enter bot name",
"REQUIRED": "اسم الروبوت مطلوب"
},
"DESCRIPTION": {
"LABEL": "الوصف",
"PLACEHOLDER": "ماذا يفعل هذا الروبوت؟"
},
"WEBHOOK_URL": {
"LABEL": "رابط Webhook",
"PLACEHOLDER": "https://example.com/webhook",
"REQUIRED": "Webhook URL is required"
},
"ERRORS": {
"NAME": "اسم الروبوت مطلوب",
"URL": "Webhook URL is required",
"VALID_URL": "Please enter a valid URL starting with http:// or https://"
},
"CANCEL": "إلغاء",
"CREATE": "Create Bot",
"UPDATE": "Update Bot"
},
"WEBHOOK": {
"DESCRIPTION": "Configure a webhook bot to integrate with your custom services. The bot will receive and process events from conversations and can respond to them."
},
"TYPES": { "TYPES": {
"WEBHOOK": "روبوت الـWebhook" "WEBHOOK": "روبوت الـWebhook",
"CSML": "بوت CSML"
} }
} }
} }
@@ -126,44 +126,6 @@
"ATLEAST_ONE_CONDITION_REQUIRED": "شرط واحد على الأقل مطلوب", "ATLEAST_ONE_CONDITION_REQUIRED": "شرط واحد على الأقل مطلوب",
"ATLEAST_ONE_ACTION_REQUIRED": "إجراء واحد على الأقل مطلوب" "ATLEAST_ONE_ACTION_REQUIRED": "إجراء واحد على الأقل مطلوب"
}, },
"NONE_OPTION": "لا شيء", "NONE_OPTION": "لا شيء"
"EVENTS": {
"CONVERSATION_CREATED": "تم إنشاء المحادثة",
"CONVERSATION_UPDATED": "تم تحديث المحادثة",
"MESSAGE_CREATED": "Message Created",
"CONVERSATION_OPENED": "Conversation Opened"
},
"ACTIONS": {
"ASSIGN_AGENT": "Assign to Agent",
"ASSIGN_TEAM": "Assign a Team",
"ADD_LABEL": "Add a Label",
"REMOVE_LABEL": "Remove a Label",
"SEND_EMAIL_TO_TEAM": "Send an Email to Team",
"SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
"MUTE_CONVERSATION": "كتم المحادثة",
"SNOOZE_CONVERSATION": "تأجيل المحادثة",
"RESOLVE_CONVERSATION": "إعادة فتح المحادثة",
"SEND_WEBHOOK_EVENT": "Send Webhook Event",
"SEND_ATTACHMENT": "Send Attachment",
"SEND_MESSAGE": "Send a Message",
"CHANGE_PRIORITY": "تغيير الأولوية",
"ADD_SLA": "Add SLA"
},
"ATTRIBUTES": {
"MESSAGE_TYPE": "Message Type",
"MESSAGE_CONTAINS": "Message Contains",
"EMAIL": "البريد الإلكتروني",
"INBOX": "صندوق الوارد",
"CONVERSATION_LANGUAGE": "Conversation Language",
"PHONE_NUMBER": "رقم الهاتف",
"STATUS": "الحالة",
"BROWSER_LANGUAGE": "لغة المتصفح",
"MAIL_SUBJECT": "Email Subject",
"COUNTRY_NAME": "الدولة",
"REFERER_LINK": "Referrer Link",
"ASSIGNEE_NAME": "المكلَّف",
"TEAM_NAME": "الفريق",
"PRIORITY": "الأولوية"
}
} }
} }
@@ -544,9 +544,6 @@
"WROTE": "كتب", "WROTE": "كتب",
"YOU": "أنت", "YOU": "أنت",
"SAVE": "Save note", "SAVE": "Save note",
"EXPAND": "Expand",
"COLLAPSE": "Collapse",
"NO_NOTES": "No notes, you can add notes from the contact details page.",
"EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above." "EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above."
} }
}, },
@@ -32,12 +32,10 @@
"LOADING_CONVERSATIONS": "جاري جلب المحادثات", "LOADING_CONVERSATIONS": "جاري جلب المحادثات",
"CANNOT_REPLY": "لا يمكنك الرد بسبب", "CANNOT_REPLY": "لا يمكنك الرد بسبب",
"24_HOURS_WINDOW": "قيد نافذة الـ 24 ساعة", "24_HOURS_WINDOW": "قيد نافذة الـ 24 ساعة",
"API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
"NOT_ASSIGNED_TO_YOU": "لم يتم تعيين هذه المحادثة لك. هل ترغب في تعيين هذه المحادثة لنفسك؟", "NOT_ASSIGNED_TO_YOU": "لم يتم تعيين هذه المحادثة لك. هل ترغب في تعيين هذه المحادثة لنفسك؟",
"ASSIGN_TO_ME": "إسناد لي", "ASSIGN_TO_ME": "إسناد لي",
"TWILIO_WHATSAPP_CAN_REPLY": "يمكنك فقط الرد على هذه المحادثة باستخدام رسالة قالب بسبب", "TWILIO_WHATSAPP_CAN_REPLY": "يمكنك فقط الرد على هذه المحادثة باستخدام رسالة قالب بسبب",
"TWILIO_WHATSAPP_24_HOURS_WINDOW": "قيد نافذة الـ 24 ساعة", "TWILIO_WHATSAPP_24_HOURS_WINDOW": "قيد نافذة الـ 24 ساعة",
"OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You wont be able to send messages from this conversation anymore.",
"REPLYING_TO": "أنت ترد على:", "REPLYING_TO": "أنت ترد على:",
"REMOVE_SELECTION": "إزالة التحديد", "REMOVE_SELECTION": "إزالة التحديد",
"DOWNLOAD": "تحميل", "DOWNLOAD": "تحميل",
@@ -295,7 +293,6 @@
"CONVERSATION_ACTIONS": "إجراءات المحادثة", "CONVERSATION_ACTIONS": "إجراءات المحادثة",
"CONVERSATION_LABELS": "وسوم المحادثة", "CONVERSATION_LABELS": "وسوم المحادثة",
"CONVERSATION_INFO": "معلومات المحادثة", "CONVERSATION_INFO": "معلومات المحادثة",
"CONTACT_NOTES": "Contact Notes",
"CONTACT_ATTRIBUTES": "سمات جهة الاتصال", "CONTACT_ATTRIBUTES": "سمات جهة الاتصال",
"PREVIOUS_CONVERSATION": "المحادثات السابقة", "PREVIOUS_CONVERSATION": "المحادثات السابقة",
"MACROS": "ماكروس", "MACROS": "ماكروس",
@@ -1,11 +1,5 @@
{ {
"GENERAL_SETTINGS": { "GENERAL_SETTINGS": {
"LIMIT_MESSAGES": {
"CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
"INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
"AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
"NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
},
"TITLE": "إعدادات الحساب", "TITLE": "إعدادات الحساب",
"SUBMIT": "تحديث الإعدادات", "SUBMIT": "تحديث الإعدادات",
"BACK": "العودة", "BACK": "العودة",
@@ -14,26 +8,6 @@
"ERROR": "تعذر تحديث الإعدادات، الرجاء المحاولة مرة أخرى!", "ERROR": "تعذر تحديث الإعدادات، الرجاء المحاولة مرة أخرى!",
"SUCCESS": "تم تحديث إعدادات الحساب بنجاح" "SUCCESS": "تم تحديث إعدادات الحساب بنجاح"
}, },
"ACCOUNT_DELETE_SECTION": {
"TITLE": "Delete your Account",
"NOTE": "Once you delete your account, all your data will be deleted.",
"BUTTON_TEXT": "Delete Your Account",
"CONFIRM": {
"TITLE": "Delete Account",
"MESSAGE": "Deleting your Account is irreversible. Enter your account name below to confirm you want to permanently delete it.",
"BUTTON_TEXT": "حذف",
"DISMISS": "إلغاء",
"PLACE_HOLDER": "الرجاء كتابة {accountName} للتأكيد"
},
"SUCCESS": "Account marked for deletion",
"FAILURE": "Could not delete account, try again!",
"SCHEDULED_DELETION": {
"TITLE": "Account Scheduled for Deletion",
"MESSAGE_MANUAL": "This account is scheduled for deletion on {deletionDate}. This was requested by an administrator. You can cancel the deletion before this date.",
"MESSAGE_INACTIVITY": "This account is scheduled for deletion on {deletionDate} due to account inactivity. You can cancel the deletion before this date.",
"CLEAR_BUTTON": "Cancel Scheduled Deletion"
}
},
"FORM": { "FORM": {
"ERROR": "الرجاء إصلاح الأخطاء في النموذج", "ERROR": "الرجاء إصلاح الأخطاء في النموذج",
"GENERAL_SECTION": { "GENERAL_SECTION": {
@@ -77,7 +51,6 @@
"UPDATE_CHATWOOT": "يتوفر تحديث {latestChatwootVersion} لـ Chatwoot. الرجاء التحديث.", "UPDATE_CHATWOOT": "يتوفر تحديث {latestChatwootVersion} لـ Chatwoot. الرجاء التحديث.",
"LEARN_MORE": "اعرف المزيد", "LEARN_MORE": "اعرف المزيد",
"PAYMENT_PENDING": "الدفعة الخاصة بك معلقة. الرجاء تحديث معلومات الدفع الخاصة بك للاستمرار في استخدام Chatwoot", "PAYMENT_PENDING": "الدفعة الخاصة بك معلقة. الرجاء تحديث معلومات الدفع الخاصة بك للاستمرار في استخدام Chatwoot",
"UPGRADE": "Upgrade to continue using Chatwoot",
"LIMITS_UPGRADE": "لقد تجاوز حسابك حدود الاستخدام، يرجى ترقية خطتك للاستمرار في استخدام Chatwoot", "LIMITS_UPGRADE": "لقد تجاوز حسابك حدود الاستخدام، يرجى ترقية خطتك للاستمرار في استخدام Chatwoot",
"OPEN_BILLING": "فتح الفواتير" "OPEN_BILLING": "فتح الفواتير"
}, },
@@ -696,8 +696,7 @@
"SLUG": { "SLUG": {
"LABEL": "Slug", "LABEL": "Slug",
"PLACEHOLDER": "user-guide", "PLACEHOLDER": "user-guide",
"ERROR": "Slug is required", "ERROR": "Slug is required"
"FORMAT_ERROR": "Please enter a valid slug, for eg: user-guide"
} }
}, },
"PORTAL_SETTINGS": { "PORTAL_SETTINGS": {
@@ -43,17 +43,7 @@
"INBOX_NAME": "اسم صندوق الوارد لقناة التواصل", "INBOX_NAME": "اسم صندوق الوارد لقناة التواصل",
"ADD_NAME": "قم بتعيين اسم لصندوق الوارد الخاص بقناتك الجديدة", "ADD_NAME": "قم بتعيين اسم لصندوق الوارد الخاص بقناتك الجديدة",
"PICK_NAME": "Pick a Name for your Inbox", "PICK_NAME": "Pick a Name for your Inbox",
"PICK_A_VALUE": "اختر قيمة", "PICK_A_VALUE": "اختر قيمة"
"CREATE_INBOX": "إنشاء قناة تواصل"
},
"INSTAGRAM": {
"CONTINUE_WITH_INSTAGRAM": "Continue with Instagram",
"CONNECT_YOUR_INSTAGRAM_PROFILE": "Connect your Instagram Profile",
"HELP": "To add your Instagram profile as a channel, you need to authenticate your Instagram Profile by clicking on 'Continue with Instagram' ",
"ERROR_MESSAGE": "There was an error connecting to Instagram, please try again",
"ERROR_AUTH": "There was an error connecting to Instagram, please try again",
"NEW_INBOX_SUGGESTION": "This Instagram account was previously linked to a different inbox and has now been migrated here. All new messages will appear here. The old inbox will no longer be able to send or receive messages for this account.",
"DUPLICATE_INBOX_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. You wont be able to send/receive Instagram messages from this inbox anymore."
}, },
"TWITTER": { "TWITTER": {
"HELP": "لإضافة حساب تويتر الخاص بك كقناة تواصل، تحتاج إلى مصادقة حسابك على تويتر بك بالنقر على زر \"تسجيل الدخول باستخدام تويتر\" ", "HELP": "لإضافة حساب تويتر الخاص بك كقناة تواصل، تحتاج إلى مصادقة حسابك على تويتر بك بالنقر على زر \"تسجيل الدخول باستخدام تويتر\" ",
@@ -763,8 +753,7 @@
"EMAIL": "البريد الإلكتروني", "EMAIL": "البريد الإلكتروني",
"TELEGRAM": "تيليجرام", "TELEGRAM": "تيليجرام",
"LINE": "Line", "LINE": "Line",
"API": "قناة API", "API": "قناة API"
"INSTAGRAM": "Instagram"
} }
} }
} }
@@ -329,34 +329,11 @@
"HEADER_KNOW_MORE": "Know more", "HEADER_KNOW_MORE": "Know more",
"COPILOT": { "COPILOT": {
"SEND_MESSAGE": "إرسال الرسالة...", "SEND_MESSAGE": "إرسال الرسالة...",
"EMPTY_MESSAGE": "There was an error generating the response. Please try again.",
"LOADER": "Captain is thinking", "LOADER": "Captain is thinking",
"YOU": "أنت", "YOU": "أنت",
"USE": "Use this", "USE": "Use this",
"RESET": "Reset", "RESET": "Reset",
"SELECT_ASSISTANT": "Select Assistant", "SELECT_ASSISTANT": "Select Assistant"
"PROMPTS": {
"SUMMARIZE": {
"LABEL": "Summarize this conversation",
"CONTENT": "Summarize the key points discussed between the customer and the support agent, including the customer's concerns, questions, and the solutions or responses provided by the support agent"
},
"SUGGEST": {
"LABEL": "Suggest an answer",
"CONTENT": "Analyze the customer's inquiry, and draft a response that effectively addresses their concerns or questions. Ensure the reply is clear, concise, and provides helpful information."
},
"RATE": {
"LABEL": "Rate this conversation",
"CONTENT": "Review the conversation to see how well it meets the customer's needs. Share a rating out of 5 based on tone, clarity, and effectiveness."
}
}
},
"PLAYGROUND": {
"USER": "أنت",
"ASSISTANT": "Assistant",
"MESSAGE_PLACEHOLDER": "أكتب رسالتك...",
"HEADER": "Playground",
"DESCRIPTION": "Use this playground to send messages to your assistant and check if it responds accurately, quickly, and in the tone you expect.",
"CREDIT_NOTE": "Messages sent here will count toward your Captain credits."
}, },
"PAYWALL": { "PAYWALL": {
"TITLE": "Upgrade to use Captain AI", "TITLE": "Upgrade to use Captain AI",
@@ -396,45 +373,21 @@
"ERROR_MESSAGE": "There was an error creating the assistant, please try again." "ERROR_MESSAGE": "There was an error creating the assistant, please try again."
}, },
"FORM": { "FORM": {
"UPDATE": "تحديث",
"SECTIONS": {
"BASIC_INFO": "Basic Information",
"SYSTEM_MESSAGES": "System Messages",
"INSTRUCTIONS": "Instructions",
"FEATURES": "الخصائص",
"TOOLS": "Tools "
},
"NAME": { "NAME": {
"LABEL": "الاسم", "LABEL": "Assistant Name",
"PLACEHOLDER": "Enter assistant name", "PLACEHOLDER": "Enter a name for the assistant",
"ERROR": "The name is required" "ERROR": "Please provide a name for the assistant"
}, },
"DESCRIPTION": { "DESCRIPTION": {
"LABEL": "الوصف", "LABEL": "Assistant Description",
"PLACEHOLDER": "Enter assistant description", "PLACEHOLDER": "Describe how and where this assistant will be used",
"ERROR": "The description is required" "ERROR": "A description is required"
}, },
"PRODUCT_NAME": { "PRODUCT_NAME": {
"LABEL": "Product Name", "LABEL": "Product Name",
"PLACEHOLDER": "Enter product name", "PLACEHOLDER": "Enter the name of the product this assistant is designed for",
"ERROR": "The product name is required" "ERROR": "The product name is required"
}, },
"WELCOME_MESSAGE": {
"LABEL": "Welcome Message",
"PLACEHOLDER": "Enter welcome message"
},
"HANDOFF_MESSAGE": {
"LABEL": "Handoff Message",
"PLACEHOLDER": "Enter handoff message"
},
"RESOLUTION_MESSAGE": {
"LABEL": "Resolution Message",
"PLACEHOLDER": "Enter resolution message"
},
"INSTRUCTIONS": {
"LABEL": "Instructions",
"PLACEHOLDER": "Enter instructions for the assistant"
},
"FEATURES": { "FEATURES": {
"TITLE": "الخصائص", "TITLE": "الخصائص",
"ALLOW_CONVERSATION_FAQS": "Generate FAQs from resolved conversations", "ALLOW_CONVERSATION_FAQS": "Generate FAQs from resolved conversations",
@@ -444,8 +397,7 @@
"EDIT": { "EDIT": {
"TITLE": "Update the assistant", "TITLE": "Update the assistant",
"SUCCESS_MESSAGE": "The assistant has been successfully updated", "SUCCESS_MESSAGE": "The assistant has been successfully updated",
"ERROR_MESSAGE": "There was an error updating the assistant, please try again.", "ERROR_MESSAGE": "There was an error updating the assistant, please try again."
"NOT_FOUND": "Could not find the assistant. Please try again."
}, },
"OPTIONS": { "OPTIONS": {
"EDIT_ASSISTANT": "Edit Assistant", "EDIT_ASSISTANT": "Edit Assistant",
@@ -83,22 +83,6 @@
"ACTION_PARAMETERS_REQUIRED": "معلمات الإجراء مطلوبة", "ACTION_PARAMETERS_REQUIRED": "معلمات الإجراء مطلوبة",
"ATLEAST_ONE_CONDITION_REQUIRED": "شرط واحد على الأقل مطلوب", "ATLEAST_ONE_CONDITION_REQUIRED": "شرط واحد على الأقل مطلوب",
"ATLEAST_ONE_ACTION_REQUIRED": "إجراء واحد على الأقل مطلوب" "ATLEAST_ONE_ACTION_REQUIRED": "إجراء واحد على الأقل مطلوب"
},
"ACTIONS": {
"ASSIGN_TEAM": "Assign a Team",
"ASSIGN_AGENT": "Assign an Agent",
"ADD_LABEL": "Add a Label",
"REMOVE_LABEL": "Remove a Label",
"REMOVE_ASSIGNED_TEAM": "Remove Assigned Team",
"SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
"MUTE_CONVERSATION": "كتم المحادثة",
"SNOOZE_CONVERSATION": "تأجيل المحادثة",
"RESOLVE_CONVERSATION": "إعادة فتح المحادثة",
"SEND_ATTACHMENT": "Send Attachment",
"SEND_MESSAGE": "Send a Message",
"CHANGE_PRIORITY": "تغيير الأولوية",
"ADD_PRIVATE_NOTE": "Add a Private Note",
"SEND_WEBHOOK_EVENT": "Send Webhook Event"
} }
} }
} }
@@ -387,8 +387,7 @@
"LABEL": "اسم المنشأة", "LABEL": "اسم المنشأة",
"PLACEHOLDER": "مؤسسة Wayne" "PLACEHOLDER": "مؤسسة Wayne"
}, },
"SUBMIT": "إرسال", "SUBMIT": "إرسال"
"CANCEL": "إلغاء"
} }
}, },
"KEYBOARD_SHORTCUTS": { "KEYBOARD_SHORTCUTS": {
@@ -2,13 +2,23 @@
"AGENT_BOTS": { "AGENT_BOTS": {
"HEADER": "Bots", "HEADER": "Bots",
"LOADING_EDITOR": "Loading editor...", "LOADING_EDITOR": "Loading editor...",
"DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try. You can manage your bots from this page or create new ones using the 'Add Bot' button.", "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try.You can manage your bots from this page or create new ones using the 'Configure new bot' button.",
"LEARN_MORE": "Learn about agent bots", "LEARN_MORE": "Learn about agent bots",
"GLOBAL_BOT": "System bot", "CSML_BOT_EDITOR": {
"GLOBAL_BOT_BADGE": "System", "NAME": {
"AVATAR": { "LABEL": "Bot name",
"SUCCESS_DELETE": "Bot avatar deleted successfully", "PLACEHOLDER": "Name your bot.",
"ERROR_DELETE": "Error deleting bot avatar, please try again" "ERROR": "Bot name is required."
},
"DESCRIPTION": {
"LABEL": "Bot description",
"PLACEHOLDER": "What does this bot do?"
},
"BOT_CONFIG": {
"ERROR": "Please enter your CSML bot configuration above.",
"API_ERROR": "Your CSML configuration is invalid. Please fix it and try again."
},
"SUBMIT": "Validate and save"
}, },
"BOT_CONFIGURATION": { "BOT_CONFIGURATION": {
"TITLE": "Select an agent bot", "TITLE": "Select an agent bot",
@@ -22,7 +32,7 @@
"SELECT_PLACEHOLDER": "Select bot" "SELECT_PLACEHOLDER": "Select bot"
}, },
"ADD": { "ADD": {
"TITLE": "Add Bot", "TITLE": "Configure new bot",
"CANCEL_BUTTON_TEXT": "Cancel", "CANCEL_BUTTON_TEXT": "Cancel",
"API": { "API": {
"SUCCESS_MESSAGE": "Bot added successfully.", "SUCCESS_MESSAGE": "Bot added successfully.",
@@ -30,22 +40,16 @@
} }
}, },
"LIST": { "LIST": {
"404": "No bots found. You can create a bot by clicking the 'Add Bot' button.", "404": "No bots found. You can create a bot by clicking the 'Configure new bot' button",
"LOADING": "Fetching bots...", "LOADING": "Fetching bots...",
"TABLE_HEADER": { "TYPE": "Bot type"
"DETAILS": "Bot Details",
"URL": "Webhook URL"
}
}, },
"DELETE": { "DELETE": {
"BUTTON_TEXT": "Delete", "BUTTON_TEXT": "Delete",
"TITLE": "Delete bot", "TITLE": "Delete bot",
"CONFIRM": { "SUBMIT": "Delete",
"TITLE": "Confirm Deletion", "CANCEL_BUTTON_TEXT": "Cancel",
"MESSAGE": "Are you sure you want to delete {name}?", "DESCRIPTION": "Are you sure you want to delete this bot? This action is irreversible.",
"YES": "Yes, Delete",
"NO": "No, Keep"
},
"API": { "API": {
"SUCCESS_MESSAGE": "Bot deleted successfully.", "SUCCESS_MESSAGE": "Bot deleted successfully.",
"ERROR_MESSAGE": "Could not delete bot. Please try again." "ERROR_MESSAGE": "Could not delete bot. Please try again."
@@ -53,44 +57,17 @@
}, },
"EDIT": { "EDIT": {
"BUTTON_TEXT": "Edit", "BUTTON_TEXT": "Edit",
"LOADING": "Fetching bots...",
"TITLE": "Edit bot", "TITLE": "Edit bot",
"CANCEL_BUTTON_TEXT": "Cancel",
"API": { "API": {
"SUCCESS_MESSAGE": "Bot updated successfully.", "SUCCESS_MESSAGE": "Bot updated successfully.",
"ERROR_MESSAGE": "Could not update bot. Please try again." "ERROR_MESSAGE": "Could not update bot. Please try again."
} }
}, },
"FORM": {
"AVATAR": {
"LABEL": "Bot avatar"
},
"NAME": {
"LABEL": "Bot name",
"PLACEHOLDER": "Enter bot name",
"REQUIRED": "Bot name is required"
},
"DESCRIPTION": {
"LABEL": "Description",
"PLACEHOLDER": "What does this bot do?"
},
"WEBHOOK_URL": {
"LABEL": "Webhook URL",
"PLACEHOLDER": "https://example.com/webhook",
"REQUIRED": "Webhook URL is required"
},
"ERRORS": {
"NAME": "Bot name is required",
"URL": "Webhook URL is required",
"VALID_URL": "Please enter a valid URL starting with http:// or https://"
},
"CANCEL": "Cancel",
"CREATE": "Create Bot",
"UPDATE": "Update Bot"
},
"WEBHOOK": {
"DESCRIPTION": "Configure a webhook bot to integrate with your custom services. The bot will receive and process events from conversations and can respond to them."
},
"TYPES": { "TYPES": {
"WEBHOOK": "Webhook bot" "WEBHOOK": "Webhook bot",
"CSML": "CSML bot"
} }
} }
} }
@@ -126,44 +126,6 @@
"ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required", "ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required",
"ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required" "ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required"
}, },
"NONE_OPTION": "None", "NONE_OPTION": "None"
"EVENTS": {
"CONVERSATION_CREATED": "Conversation Created",
"CONVERSATION_UPDATED": "Conversation Updated",
"MESSAGE_CREATED": "Message Created",
"CONVERSATION_OPENED": "Conversation Opened"
},
"ACTIONS": {
"ASSIGN_AGENT": "Assign to Agent",
"ASSIGN_TEAM": "Assign a Team",
"ADD_LABEL": "Add a Label",
"REMOVE_LABEL": "Remove a Label",
"SEND_EMAIL_TO_TEAM": "Send an Email to Team",
"SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
"MUTE_CONVERSATION": "Mute Conversation",
"SNOOZE_CONVERSATION": "Snooze Conversation",
"RESOLVE_CONVERSATION": "Resolve Conversation",
"SEND_WEBHOOK_EVENT": "Send Webhook Event",
"SEND_ATTACHMENT": "Send Attachment",
"SEND_MESSAGE": "Send a Message",
"CHANGE_PRIORITY": "Change Priority",
"ADD_SLA": "Add SLA"
},
"ATTRIBUTES": {
"MESSAGE_TYPE": "Message Type",
"MESSAGE_CONTAINS": "Message Contains",
"EMAIL": "Email",
"INBOX": "Inbox",
"CONVERSATION_LANGUAGE": "Conversation Language",
"PHONE_NUMBER": "Phone Number",
"STATUS": "Status",
"BROWSER_LANGUAGE": "Browser Language",
"MAIL_SUBJECT": "Email Subject",
"COUNTRY_NAME": "Country",
"REFERER_LINK": "Referrer Link",
"ASSIGNEE_NAME": "Assignee",
"TEAM_NAME": "Team",
"PRIORITY": "Priority"
}
} }
} }
@@ -544,9 +544,6 @@
"WROTE": "wrote", "WROTE": "wrote",
"YOU": "You", "YOU": "You",
"SAVE": "Save note", "SAVE": "Save note",
"EXPAND": "Expand",
"COLLAPSE": "Collapse",
"NO_NOTES": "No notes, you can add notes from the contact details page.",
"EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above." "EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above."
} }
}, },
@@ -32,12 +32,10 @@
"LOADING_CONVERSATIONS": "Loading Conversations", "LOADING_CONVERSATIONS": "Loading Conversations",
"CANNOT_REPLY": "You cannot reply due to", "CANNOT_REPLY": "You cannot reply due to",
"24_HOURS_WINDOW": "24 hour message window restriction", "24_HOURS_WINDOW": "24 hour message window restriction",
"API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
"NOT_ASSIGNED_TO_YOU": "This conversation is not assigned to you. Would you like to assign this conversation to yourself?", "NOT_ASSIGNED_TO_YOU": "This conversation is not assigned to you. Would you like to assign this conversation to yourself?",
"ASSIGN_TO_ME": "Assign to me", "ASSIGN_TO_ME": "Assign to me",
"TWILIO_WHATSAPP_CAN_REPLY": "You can only reply to this conversation using a template message due to", "TWILIO_WHATSAPP_CAN_REPLY": "You can only reply to this conversation using a template message due to",
"TWILIO_WHATSAPP_24_HOURS_WINDOW": "24 hour message window restriction", "TWILIO_WHATSAPP_24_HOURS_WINDOW": "24 hour message window restriction",
"OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You wont be able to send messages from this conversation anymore.",
"REPLYING_TO": "You are replying to:", "REPLYING_TO": "You are replying to:",
"REMOVE_SELECTION": "Remove Selection", "REMOVE_SELECTION": "Remove Selection",
"DOWNLOAD": "Download", "DOWNLOAD": "Download",
@@ -295,7 +293,6 @@
"CONVERSATION_ACTIONS": "Conversation Actions", "CONVERSATION_ACTIONS": "Conversation Actions",
"CONVERSATION_LABELS": "Conversation Labels", "CONVERSATION_LABELS": "Conversation Labels",
"CONVERSATION_INFO": "Conversation Information", "CONVERSATION_INFO": "Conversation Information",
"CONTACT_NOTES": "Contact Notes",
"CONTACT_ATTRIBUTES": "Contact Attributes", "CONTACT_ATTRIBUTES": "Contact Attributes",
"PREVIOUS_CONVERSATION": "Previous Conversations", "PREVIOUS_CONVERSATION": "Previous Conversations",
"MACROS": "Macros", "MACROS": "Macros",

Some files were not shown because too many files have changed in this diff Show More