Merge branch 'develop' into feat/more-report-downloads
This commit is contained in:
@@ -24,9 +24,8 @@ class Api::V1::Accounts::ContactsController < Api::V1::Accounts::BaseController
|
||||
def search
|
||||
render json: { error: 'Specify search string with parameter q' }, status: :unprocessable_entity if params[:q].blank? && return
|
||||
|
||||
contacts = resolved_contacts.where(
|
||||
'name ILIKE :search OR email ILIKE :search OR phone_number ILIKE :search OR contacts.identifier LIKE :search
|
||||
OR contacts.additional_attributes->>\'company_name\' ILIKE :search',
|
||||
contacts = Current.account.contacts.where(
|
||||
'name ILIKE :search OR email ILIKE :search OR phone_number ILIKE :search OR contacts.identifier LIKE :search',
|
||||
search: "%#{params[:q].strip}%"
|
||||
)
|
||||
@contacts = fetch_contacts(contacts)
|
||||
|
||||
@@ -110,6 +110,15 @@ class Api::V1::Accounts::ConversationsController < Api::V1::Accounts::BaseContro
|
||||
end
|
||||
|
||||
def update_last_seen
|
||||
# High-traffic accounts generate excessive DB writes when agents frequently switch between conversations.
|
||||
# Throttle last_seen updates to once per hour when there are no unread messages to reduce DB load.
|
||||
# Always update immediately if there are unread messages to maintain accurate read/unread state.
|
||||
return update_last_seen_on_conversation(DateTime.now.utc, true) if assignee? && @conversation.assignee_unread_messages.any?
|
||||
return update_last_seen_on_conversation(DateTime.now.utc, false) if !assignee? && @conversation.unread_messages.any?
|
||||
|
||||
# No unread messages - apply throttling to limit DB writes
|
||||
return unless should_update_last_seen?
|
||||
|
||||
update_last_seen_on_conversation(DateTime.now.utc, assignee?)
|
||||
end
|
||||
|
||||
@@ -142,12 +151,25 @@ class Api::V1::Accounts::ConversationsController < Api::V1::Accounts::BaseContro
|
||||
end
|
||||
|
||||
def update_last_seen_on_conversation(last_seen_at, update_assignee)
|
||||
updates = { agent_last_seen_at: last_seen_at }
|
||||
updates[:assignee_last_seen_at] = last_seen_at if update_assignee.present?
|
||||
|
||||
# rubocop:disable Rails/SkipsModelValidations
|
||||
@conversation.update_column(:agent_last_seen_at, last_seen_at)
|
||||
@conversation.update_column(:assignee_last_seen_at, last_seen_at) if update_assignee.present?
|
||||
@conversation.update_columns(updates)
|
||||
# rubocop:enable Rails/SkipsModelValidations
|
||||
end
|
||||
|
||||
def should_update_last_seen?
|
||||
# Update if at least one relevant timestamp is older than 1 hour or not set
|
||||
# This prevents redundant DB writes when agents repeatedly view the same conversation
|
||||
agent_needs_update = @conversation.agent_last_seen_at.blank? || @conversation.agent_last_seen_at < 1.hour.ago
|
||||
return agent_needs_update unless assignee?
|
||||
|
||||
# For assignees, check both timestamps - update if either is old
|
||||
assignee_needs_update = @conversation.assignee_last_seen_at.blank? || @conversation.assignee_last_seen_at < 1.hour.ago
|
||||
agent_needs_update || assignee_needs_update
|
||||
end
|
||||
|
||||
def set_conversation_status
|
||||
@conversation.status = params[:status]
|
||||
@conversation.snoozed_until = parse_date_time(params[:snoozed_until].to_s) if params[:snoozed_until]
|
||||
|
||||
@@ -92,8 +92,11 @@ class Api::V1::AccountsController < Api::BaseController
|
||||
end
|
||||
|
||||
def settings_params
|
||||
params.permit(:auto_resolve_after, :auto_resolve_message, :auto_resolve_ignore_waiting, :audio_transcriptions, :auto_resolve_label,
|
||||
conversation_required_attributes: [])
|
||||
params.permit(*permitted_settings_attributes)
|
||||
end
|
||||
|
||||
def permitted_settings_attributes
|
||||
[:auto_resolve_after, :auto_resolve_message, :auto_resolve_ignore_waiting, :audio_transcriptions, :auto_resolve_label]
|
||||
end
|
||||
|
||||
def check_signup_enabled
|
||||
@@ -112,3 +115,5 @@ class Api::V1::AccountsController < Api::BaseController
|
||||
}
|
||||
end
|
||||
end
|
||||
|
||||
Api::V1::AccountsController.prepend_mod_with('Api::V1::AccountsSettings')
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 130 KiB |
@@ -0,0 +1,17 @@
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex justify-between items-center px-4 py-4 w-full">
|
||||
<div
|
||||
class="flex justify-center items-center py-6 w-full custom-dashed-border"
|
||||
>
|
||||
<span class="text-sm text-n-slate-11">
|
||||
{{ t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.NO_ATTRIBUTES') }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
+56
@@ -0,0 +1,56 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import Button from 'dashboard/components-next/button/Button.vue';
|
||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
||||
import { ATTRIBUTE_TYPES } from './constants';
|
||||
|
||||
const props = defineProps({
|
||||
attribute: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['delete']);
|
||||
|
||||
const iconByType = {
|
||||
[ATTRIBUTE_TYPES.TEXT]: 'i-lucide-align-justify',
|
||||
[ATTRIBUTE_TYPES.CHECKBOX]: 'i-lucide-circle-check-big',
|
||||
[ATTRIBUTE_TYPES.LIST]: 'i-lucide-list',
|
||||
[ATTRIBUTE_TYPES.DATE]: 'i-lucide-calendar',
|
||||
[ATTRIBUTE_TYPES.LINK]: 'i-lucide-link',
|
||||
[ATTRIBUTE_TYPES.NUMBER]: 'i-lucide-hash',
|
||||
};
|
||||
|
||||
const attributeIcon = computed(() => {
|
||||
const typeKey = props.attribute.type?.toLowerCase();
|
||||
return iconByType[typeKey] || 'i-lucide-align-justify';
|
||||
});
|
||||
|
||||
const handleDelete = () => {
|
||||
emit('delete', props.attribute);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex justify-between items-center px-4 py-3 w-full">
|
||||
<div class="flex gap-3 items-center">
|
||||
<h5 class="text-sm font-medium text-n-slate-12 line-clamp-1">
|
||||
{{ attribute.label }}
|
||||
</h5>
|
||||
<div class="w-px h-2.5 bg-n-slate-5" />
|
||||
<div class="flex gap-1.5 items-center">
|
||||
<Icon :icon="attributeIcon" class="size-4 text-n-slate-11" />
|
||||
<span class="text-sm text-n-slate-11">{{ attribute.type }}</span>
|
||||
</div>
|
||||
<div class="w-px h-2.5 bg-n-slate-5" />
|
||||
<div class="flex gap-1.5 items-center">
|
||||
<Icon icon="i-lucide-key-round" class="size-4 text-n-slate-11" />
|
||||
<span class="text-sm text-n-slate-11">{{ attribute.value }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex gap-2 items-center">
|
||||
<Button icon="i-lucide-trash" sm slate ghost @click.stop="handleDelete" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
+186
@@ -0,0 +1,186 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { useToggle } from '@vueuse/core';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useMapGetter } from 'dashboard/composables/store';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import Button from 'dashboard/components-next/button/Button.vue';
|
||||
import DropdownMenu from 'dashboard/components-next/dropdown-menu/DropdownMenu.vue';
|
||||
import ConversationRequiredAttributeItem from 'dashboard/components-next/ConversationWorkflow/ConversationRequiredAttributeItem.vue';
|
||||
import ConversationRequiredEmpty from 'dashboard/components-next/Conversation/ConversationRequiredEmpty.vue';
|
||||
import BasePaywallModal from 'dashboard/routes/dashboard/settings/components/BasePaywallModal.vue';
|
||||
|
||||
const props = defineProps({
|
||||
isEnabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['click']);
|
||||
const router = useRouter();
|
||||
const { t } = useI18n();
|
||||
const { currentAccount, accountId, isOnChatwootCloud, updateAccount } =
|
||||
useAccount();
|
||||
const [showDropdown, toggleDropdown] = useToggle(false);
|
||||
const [isSaving, toggleSaving] = useToggle(false);
|
||||
const conversationAttributes = useMapGetter(
|
||||
'attributes/getConversationAttributes'
|
||||
);
|
||||
const currentUser = useMapGetter('getCurrentUser');
|
||||
|
||||
const isSuperAdmin = computed(() => currentUser.value.type === 'SuperAdmin');
|
||||
const showPaywall = computed(() => !props.isEnabled && isOnChatwootCloud.value);
|
||||
const i18nKey = computed(() =>
|
||||
isOnChatwootCloud.value ? 'PAYWALL' : 'ENTERPRISE_PAYWALL'
|
||||
);
|
||||
|
||||
const goToBillingSettings = () => {
|
||||
router.push({
|
||||
name: 'billing_settings_index',
|
||||
params: { accountId: accountId.value },
|
||||
});
|
||||
};
|
||||
|
||||
const handleClick = () => {
|
||||
emit('click');
|
||||
};
|
||||
|
||||
const selectedAttributeKeys = computed(
|
||||
() => currentAccount.value?.settings?.conversation_required_attributes || []
|
||||
);
|
||||
|
||||
const allAttributeOptions = computed(() =>
|
||||
(conversationAttributes.value || []).map(attribute => ({
|
||||
...attribute,
|
||||
action: 'add',
|
||||
value: attribute.attributeKey,
|
||||
label: attribute.attributeDisplayName,
|
||||
type: attribute.attributeDisplayType,
|
||||
}))
|
||||
);
|
||||
|
||||
const attributeOptions = computed(() => {
|
||||
const selectedKeysSet = new Set(selectedAttributeKeys.value);
|
||||
return allAttributeOptions.value.filter(
|
||||
attribute => !selectedKeysSet.has(attribute.value)
|
||||
);
|
||||
});
|
||||
|
||||
const conversationRequiredAttributes = computed(() => {
|
||||
const attributeMap = new Map(
|
||||
allAttributeOptions.value.map(attr => [attr.value, attr])
|
||||
);
|
||||
return selectedAttributeKeys.value
|
||||
.map(key => attributeMap.get(key))
|
||||
.filter(Boolean);
|
||||
});
|
||||
|
||||
const handleAddAttributesClick = event => {
|
||||
event.stopPropagation();
|
||||
toggleDropdown();
|
||||
};
|
||||
|
||||
const saveRequiredAttributes = async keys => {
|
||||
try {
|
||||
toggleSaving(true);
|
||||
await updateAccount(
|
||||
{ conversation_required_attributes: keys },
|
||||
{ silent: true }
|
||||
);
|
||||
useAlert(t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.SAVE.SUCCESS'));
|
||||
} catch (error) {
|
||||
useAlert(t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.SAVE.ERROR'));
|
||||
} finally {
|
||||
toggleSaving(false);
|
||||
toggleDropdown(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleAttributeAction = ({ value }) => {
|
||||
if (!value || isSaving.value) return;
|
||||
const updatedKeys = Array.from(
|
||||
new Set([...selectedAttributeKeys.value, value])
|
||||
);
|
||||
saveRequiredAttributes(updatedKeys);
|
||||
};
|
||||
|
||||
const closeDropdown = () => {
|
||||
toggleDropdown(false);
|
||||
};
|
||||
|
||||
const handleDelete = attribute => {
|
||||
if (isSaving.value) return;
|
||||
const updatedKeys = selectedAttributeKeys.value.filter(
|
||||
key => key !== attribute.value
|
||||
);
|
||||
saveRequiredAttributes(updatedKeys);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-if="isEnabled || showPaywall"
|
||||
class="flex flex-col w-full outline-1 outline outline-n-container rounded-xl bg-n-solid-2 divide-y divide-n-weak"
|
||||
@click="handleClick"
|
||||
>
|
||||
<div class="flex flex-col gap-2 items-start px-5 py-4">
|
||||
<div class="flex justify-between items-center w-full">
|
||||
<div class="flex flex-col gap-2">
|
||||
<h3 class="text-base font-medium text-n-slate-12">
|
||||
{{ $t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.TITLE') }}
|
||||
</h3>
|
||||
<p class="mb-0 text-sm text-n-slate-11">
|
||||
{{ $t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.DESCRIPTION') }}
|
||||
</p>
|
||||
</div>
|
||||
<div v-if="isEnabled" v-on-clickaway="closeDropdown" class="relative">
|
||||
<Button
|
||||
icon="i-lucide-circle-plus"
|
||||
:label="$t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.ADD.TITLE')"
|
||||
:is-loading="isSaving"
|
||||
:disabled="isSaving || attributeOptions.length === 0"
|
||||
@click="handleAddAttributesClick"
|
||||
/>
|
||||
<DropdownMenu
|
||||
v-if="showDropdown"
|
||||
:menu-items="attributeOptions"
|
||||
show-search
|
||||
:search-placeholder="
|
||||
$t(
|
||||
'CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.ADD.SEARCH_PLACEHOLDER'
|
||||
)
|
||||
"
|
||||
class="top-full mt-1 w-52 ltr:right-0 rtl:left-0"
|
||||
@action="handleAttributeAction"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template v-if="isEnabled">
|
||||
<ConversationRequiredEmpty
|
||||
v-if="conversationRequiredAttributes.length === 0"
|
||||
/>
|
||||
|
||||
<ConversationRequiredAttributeItem
|
||||
v-for="attribute in conversationRequiredAttributes"
|
||||
:key="attribute.value"
|
||||
:attribute="attribute"
|
||||
@delete="handleDelete"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<BasePaywallModal
|
||||
v-else
|
||||
class="mx-auto my-8"
|
||||
feature-prefix="CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES"
|
||||
:i18n-key="i18nKey"
|
||||
:is-on-chatwoot-cloud="isOnChatwootCloud"
|
||||
:is-super-admin="isSuperAdmin"
|
||||
@upgrade="goToBillingSettings"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
+248
@@ -0,0 +1,248 @@
|
||||
<script setup>
|
||||
import { ref, computed, reactive } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useVuelidate } from '@vuelidate/core';
|
||||
import { required, url, helpers } from '@vuelidate/validators';
|
||||
import { getRegexp } from 'shared/helpers/Validators';
|
||||
import Dialog from 'dashboard/components-next/dialog/Dialog.vue';
|
||||
import TextArea from 'next/textarea/TextArea.vue';
|
||||
import ComboBox from 'dashboard/components-next/combobox/ComboBox.vue';
|
||||
import Input from 'dashboard/components-next/input/Input.vue';
|
||||
import ChoiceToggle from 'dashboard/components-next/input/ChoiceToggle.vue';
|
||||
import { ATTRIBUTE_TYPES } from './constants';
|
||||
|
||||
const emit = defineEmits(['submit']);
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const dialogRef = ref(null);
|
||||
const visibleAttributes = ref([]);
|
||||
const formValues = reactive({});
|
||||
const conversationContext = ref(null);
|
||||
|
||||
const placeholders = computed(() => ({
|
||||
text: t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.PLACEHOLDERS.TEXT'),
|
||||
number: t(
|
||||
'CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.PLACEHOLDERS.NUMBER'
|
||||
),
|
||||
link: t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.PLACEHOLDERS.LINK'),
|
||||
date: t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.PLACEHOLDERS.DATE'),
|
||||
list: t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.PLACEHOLDERS.LIST'),
|
||||
}));
|
||||
|
||||
const getPlaceholder = type => placeholders.value[type] || '';
|
||||
|
||||
const validationRules = computed(() => {
|
||||
const rules = {};
|
||||
visibleAttributes.value.forEach(attribute => {
|
||||
if (attribute.type === ATTRIBUTE_TYPES.LINK) {
|
||||
rules[attribute.value] = { required, url };
|
||||
} else if (attribute.type === ATTRIBUTE_TYPES.CHECKBOX) {
|
||||
// Checkbox doesn't need validation - any selection is valid
|
||||
rules[attribute.value] = {};
|
||||
} else {
|
||||
rules[attribute.value] = { required };
|
||||
if (attribute.regexPattern) {
|
||||
rules[attribute.value].regexValidation = helpers.withParams(
|
||||
{ regexCue: attribute.regexCue },
|
||||
value => !value || getRegexp(attribute.regexPattern).test(value)
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
return rules;
|
||||
});
|
||||
|
||||
const v$ = useVuelidate(validationRules, formValues);
|
||||
|
||||
const getErrorMessage = attributeKey => {
|
||||
const field = v$.value[attributeKey];
|
||||
if (!field || !field.$error) return '';
|
||||
|
||||
if (field.url && field.url.$invalid) {
|
||||
return t('CUSTOM_ATTRIBUTES.VALIDATIONS.INVALID_URL');
|
||||
}
|
||||
if (field.regexValidation && field.regexValidation.$invalid) {
|
||||
return (
|
||||
field.regexValidation.$params?.regexCue ||
|
||||
t('CUSTOM_ATTRIBUTES.VALIDATIONS.INVALID_INPUT')
|
||||
);
|
||||
}
|
||||
if (field.required && field.required.$invalid) {
|
||||
return t('CUSTOM_ATTRIBUTES.VALIDATIONS.REQUIRED');
|
||||
}
|
||||
return '';
|
||||
};
|
||||
|
||||
const isFormComplete = computed(() =>
|
||||
visibleAttributes.value.every(attribute => {
|
||||
const value = formValues[attribute.value];
|
||||
|
||||
// For checkbox attributes, ensure the agent has explicitly selected a value
|
||||
if (attribute.type === ATTRIBUTE_TYPES.CHECKBOX) {
|
||||
return formValues[attribute.value] !== null;
|
||||
}
|
||||
|
||||
// For other attribute types, check for valid non-empty values
|
||||
return value !== undefined && value !== null && String(value).trim() !== '';
|
||||
})
|
||||
);
|
||||
|
||||
const comboBoxOptions = computed(() => {
|
||||
const options = {};
|
||||
visibleAttributes.value.forEach(attribute => {
|
||||
if (attribute.type === ATTRIBUTE_TYPES.LIST) {
|
||||
options[attribute.value] = (attribute.attributeValues || []).map(
|
||||
option => ({
|
||||
value: option,
|
||||
label: option,
|
||||
})
|
||||
);
|
||||
}
|
||||
});
|
||||
return options;
|
||||
});
|
||||
|
||||
const close = () => {
|
||||
dialogRef.value?.close();
|
||||
conversationContext.value = null;
|
||||
v$.value.$reset();
|
||||
};
|
||||
|
||||
const open = (attributes = [], initialValues = {}, context = null) => {
|
||||
visibleAttributes.value = attributes;
|
||||
conversationContext.value = context;
|
||||
|
||||
// Clear existing formValues
|
||||
Object.keys(formValues).forEach(key => {
|
||||
delete formValues[key];
|
||||
});
|
||||
|
||||
// Initialize form values
|
||||
attributes.forEach(attribute => {
|
||||
const presetValue = initialValues[attribute.value];
|
||||
if (presetValue !== undefined && presetValue !== null) {
|
||||
formValues[attribute.value] = presetValue;
|
||||
} else {
|
||||
// For checkbox attributes, initialize to null to avoid pre-selection
|
||||
// For other attributes, initialize to empty string
|
||||
formValues[attribute.value] =
|
||||
attribute.type === ATTRIBUTE_TYPES.CHECKBOX ? null : '';
|
||||
}
|
||||
});
|
||||
|
||||
v$.value.$reset();
|
||||
dialogRef.value?.open();
|
||||
};
|
||||
|
||||
const handleConfirm = async () => {
|
||||
v$.value.$touch();
|
||||
if (v$.value.$invalid) {
|
||||
return;
|
||||
}
|
||||
|
||||
emit('submit', {
|
||||
attributes: { ...formValues },
|
||||
context: conversationContext.value,
|
||||
});
|
||||
close();
|
||||
};
|
||||
|
||||
defineExpose({ open, close });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Dialog
|
||||
ref="dialogRef"
|
||||
width="lg"
|
||||
:title="t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.TITLE')"
|
||||
:description="
|
||||
t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.DESCRIPTION')
|
||||
"
|
||||
:confirm-button-label="
|
||||
t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.ACTIONS.RESOLVE')
|
||||
"
|
||||
:cancel-button-label="
|
||||
t('CONVERSATION_WORKFLOW.REQUIRED_ATTRIBUTES.MODAL.ACTIONS.CANCEL')
|
||||
"
|
||||
:disable-confirm-button="!isFormComplete"
|
||||
@confirm="handleConfirm"
|
||||
>
|
||||
<div class="flex flex-col gap-4">
|
||||
<div
|
||||
v-for="attribute in visibleAttributes"
|
||||
:key="attribute.value"
|
||||
class="flex flex-col gap-2"
|
||||
>
|
||||
<div class="flex justify-between items-center">
|
||||
<label class="mb-0.5 text-sm font-medium text-n-slate-12">
|
||||
{{ attribute.label }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<template v-if="attribute.type === ATTRIBUTE_TYPES.TEXT">
|
||||
<TextArea
|
||||
v-model="formValues[attribute.value]"
|
||||
class="w-full"
|
||||
:placeholder="getPlaceholder(ATTRIBUTE_TYPES.TEXT)"
|
||||
:message="getErrorMessage(attribute.value)"
|
||||
:message-type="v$[attribute.value].$error ? 'error' : 'info'"
|
||||
@blur="v$[attribute.value].$touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-else-if="attribute.type === ATTRIBUTE_TYPES.NUMBER">
|
||||
<Input
|
||||
v-model="formValues[attribute.value]"
|
||||
type="number"
|
||||
size="md"
|
||||
:placeholder="getPlaceholder(ATTRIBUTE_TYPES.NUMBER)"
|
||||
:message="getErrorMessage(attribute.value)"
|
||||
:message-type="v$[attribute.value].$error ? 'error' : 'info'"
|
||||
@blur="v$[attribute.value].$touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-else-if="attribute.type === ATTRIBUTE_TYPES.LINK">
|
||||
<Input
|
||||
v-model="formValues[attribute.value]"
|
||||
type="url"
|
||||
size="md"
|
||||
:placeholder="getPlaceholder(ATTRIBUTE_TYPES.LINK)"
|
||||
:message="getErrorMessage(attribute.value)"
|
||||
:message-type="v$[attribute.value].$error ? 'error' : 'info'"
|
||||
@blur="v$[attribute.value].$touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-else-if="attribute.type === ATTRIBUTE_TYPES.DATE">
|
||||
<Input
|
||||
v-model="formValues[attribute.value]"
|
||||
type="date"
|
||||
size="md"
|
||||
:placeholder="getPlaceholder(ATTRIBUTE_TYPES.DATE)"
|
||||
:message="getErrorMessage(attribute.value)"
|
||||
:message-type="v$[attribute.value].$error ? 'error' : 'info'"
|
||||
@blur="v$[attribute.value].$touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-else-if="attribute.type === ATTRIBUTE_TYPES.LIST">
|
||||
<ComboBox
|
||||
v-model="formValues[attribute.value]"
|
||||
:options="comboBoxOptions[attribute.value]"
|
||||
:placeholder="getPlaceholder(ATTRIBUTE_TYPES.LIST)"
|
||||
:message="getErrorMessage(attribute.value)"
|
||||
:message-type="v$[attribute.value].$error ? 'error' : 'info'"
|
||||
:has-error="v$[attribute.value].$error"
|
||||
class="w-full"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-else-if="attribute.type === ATTRIBUTE_TYPES.CHECKBOX">
|
||||
<ChoiceToggle v-model="formValues[attribute.value]" />
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</Dialog>
|
||||
</template>
|
||||
@@ -0,0 +1,8 @@
|
||||
export const ATTRIBUTE_TYPES = {
|
||||
TEXT: 'text',
|
||||
NUMBER: 'number',
|
||||
LINK: 'link',
|
||||
DATE: 'date',
|
||||
LIST: 'list',
|
||||
CHECKBOX: 'checkbox',
|
||||
};
|
||||
@@ -0,0 +1,45 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:modelValue']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const options = computed(() => [
|
||||
{ label: t('CHOICE_TOGGLE.YES'), value: true },
|
||||
{ label: t('CHOICE_TOGGLE.NO'), value: false },
|
||||
]);
|
||||
|
||||
const handleSelect = value => {
|
||||
emit('update:modelValue', value);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="flex gap-4 items-center px-4 py-2.5 w-full rounded-lg divide-x transition-colors bg-n-solid-1 outline outline-1 outline-n-weak hover:outline-n-slate-6 focus-within:outline-n-brand divide-n-weak"
|
||||
>
|
||||
<div
|
||||
v-for="option in options"
|
||||
:key="option.value"
|
||||
class="flex flex-1 gap-2 justify-center items-center"
|
||||
>
|
||||
<label class="inline-flex gap-2 items-center text-base cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
:value="option.value"
|
||||
:checked="modelValue === option.value"
|
||||
class="size-4 accent-n-blue-9 text-n-blue-9"
|
||||
@change="handleSelect(option.value)"
|
||||
/>
|
||||
<span class="text-sm text-n-slate-12">{{ option.label }}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -529,7 +529,7 @@ const menuItems = computed(() => {
|
||||
{
|
||||
name: 'Settings Automation',
|
||||
label: t('SIDEBAR.AUTOMATION'),
|
||||
icon: 'i-lucide-workflow',
|
||||
icon: 'i-lucide-repeat',
|
||||
to: accountScopedRoute('automation_list'),
|
||||
},
|
||||
{
|
||||
@@ -574,6 +574,12 @@ const menuItems = computed(() => {
|
||||
icon: 'i-lucide-clock-alert',
|
||||
to: accountScopedRoute('sla_list'),
|
||||
},
|
||||
{
|
||||
name: 'Conversation Workflow',
|
||||
label: t('SIDEBAR.CONVERSATION_WORKFLOW'),
|
||||
icon: 'i-lucide-workflow',
|
||||
to: accountScopedRoute('conversation_workflow_index'),
|
||||
},
|
||||
{
|
||||
name: 'Settings Security',
|
||||
label: t('SIDEBAR.SECURITY'),
|
||||
@@ -655,7 +661,7 @@ const menuItems = computed(() => {
|
||||
</ul>
|
||||
</nav>
|
||||
<section
|
||||
class="flex flex-col flex-shrink-0 relative gap-1 justify-between items-center"
|
||||
class="flex relative flex-col flex-shrink-0 gap-1 justify-between items-center"
|
||||
>
|
||||
<div
|
||||
class="pointer-events-none absolute inset-x-0 -top-[31px] h-8 bg-gradient-to-t from-n-solid-2 to-transparent"
|
||||
|
||||
@@ -32,7 +32,7 @@ const props = defineProps({
|
||||
allowSignature: { type: Boolean, default: false }, // allowSignature is a kill switch, ensuring no signature methods are triggered except when this flag is true
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:modelValue']);
|
||||
const emit = defineEmits(['update:modelValue', 'blur', 'focus']);
|
||||
|
||||
const textareaRef = ref(null);
|
||||
const isFocused = ref(false);
|
||||
@@ -96,15 +96,17 @@ const handleInput = event => {
|
||||
}
|
||||
};
|
||||
|
||||
const handleFocus = () => {
|
||||
const handleFocus = event => {
|
||||
if (!props.disabled) {
|
||||
isFocused.value = true;
|
||||
emit('focus', event);
|
||||
}
|
||||
};
|
||||
|
||||
const handleBlur = () => {
|
||||
const handleBlur = event => {
|
||||
if (!props.disabled) {
|
||||
isFocused.value = false;
|
||||
emit('blur', event);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -32,6 +32,7 @@ import ConversationBulkActions from './widgets/conversation/conversationBulkActi
|
||||
import IntersectionObserver from './IntersectionObserver.vue';
|
||||
import TeleportWithDirection from 'dashboard/components-next/TeleportWithDirection.vue';
|
||||
import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
|
||||
import ConversationResolveAttributesModal from 'dashboard/components-next/ConversationWorkflow/ConversationResolveAttributesModal.vue';
|
||||
|
||||
import { useUISettings } from 'dashboard/composables/useUISettings';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
@@ -46,6 +47,7 @@ import {
|
||||
} from 'dashboard/composables/useTransformKeys';
|
||||
import { useEmitter } from 'dashboard/composables/emitter';
|
||||
import { useEventListener } from '@vueuse/core';
|
||||
import { useConversationRequiredAttributes } from 'dashboard/composables/useConversationRequiredAttributes';
|
||||
|
||||
import { emitter } from 'shared/helpers/mitt';
|
||||
|
||||
@@ -87,6 +89,7 @@ const router = useRouter();
|
||||
const route = useRoute();
|
||||
const store = useStore();
|
||||
|
||||
const resolveAttributesModalRef = ref(null);
|
||||
const conversationListRef = ref(null);
|
||||
const conversationDynamicScroller = ref(null);
|
||||
|
||||
@@ -129,6 +132,7 @@ const labels = useMapGetter('labels/getLabels');
|
||||
const currentAccountId = useMapGetter('getCurrentAccountId');
|
||||
// We can't useFunctionGetter here since it needs to be called on setup?
|
||||
const getTeamFn = useMapGetter('teams/getTeam');
|
||||
const getConversationById = useMapGetter('getConversationById');
|
||||
|
||||
useChatListKeyboardEvents(conversationListRef);
|
||||
const {
|
||||
@@ -153,6 +157,8 @@ const {
|
||||
attributeModel: 'conversation_attribute',
|
||||
});
|
||||
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
// computed
|
||||
const intersectionObserverOptions = computed(() => {
|
||||
return {
|
||||
@@ -729,22 +735,76 @@ async function onAssignTeam(team, conversationId = null) {
|
||||
}
|
||||
}
|
||||
|
||||
function toggleConversationStatus(conversationId, status, snoozedUntil) {
|
||||
store
|
||||
.dispatch('toggleStatus', {
|
||||
conversationId,
|
||||
status,
|
||||
function toggleConversationStatus(
|
||||
conversationId,
|
||||
status,
|
||||
snoozedUntil,
|
||||
customAttributes = null
|
||||
) {
|
||||
const payload = {
|
||||
conversationId,
|
||||
status,
|
||||
snoozedUntil,
|
||||
};
|
||||
|
||||
if (customAttributes) {
|
||||
payload.customAttributes = customAttributes;
|
||||
}
|
||||
|
||||
store.dispatch('toggleStatus', payload).then(() => {
|
||||
useAlert(t('CONVERSATION.CHANGE_STATUS'));
|
||||
});
|
||||
}
|
||||
|
||||
function handleResolveConversation(conversationId, status, snoozedUntil) {
|
||||
if (status !== wootConstants.STATUS_TYPE.RESOLVED) {
|
||||
toggleConversationStatus(conversationId, status, snoozedUntil);
|
||||
return;
|
||||
}
|
||||
|
||||
// Check for required attributes before resolving
|
||||
const conversation = getConversationById.value(conversationId);
|
||||
const currentCustomAttributes = conversation?.custom_attributes || {};
|
||||
const { hasMissing, missing } = checkMissingAttributes(
|
||||
currentCustomAttributes
|
||||
);
|
||||
|
||||
if (hasMissing) {
|
||||
// Pass conversation context through the modal's API
|
||||
const conversationContext = {
|
||||
id: conversationId,
|
||||
snoozedUntil,
|
||||
})
|
||||
.then(() => {
|
||||
useAlert(t('CONVERSATION.CHANGE_STATUS'));
|
||||
});
|
||||
};
|
||||
resolveAttributesModalRef.value?.open(
|
||||
missing,
|
||||
currentCustomAttributes,
|
||||
conversationContext
|
||||
);
|
||||
} else {
|
||||
toggleConversationStatus(conversationId, status, snoozedUntil);
|
||||
}
|
||||
}
|
||||
|
||||
function handleResolveWithAttributes({ attributes, context }) {
|
||||
if (context) {
|
||||
const existingConversation = getConversationById.value(context.id);
|
||||
const currentCustomAttributes =
|
||||
existingConversation?.custom_attributes || {};
|
||||
const mergedAttributes = { ...currentCustomAttributes, ...attributes };
|
||||
|
||||
toggleConversationStatus(
|
||||
context.id,
|
||||
wootConstants.STATUS_TYPE.RESOLVED,
|
||||
context.snoozedUntil,
|
||||
mergedAttributes
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function allSelectedConversationsStatus(status) {
|
||||
if (!selectedConversations.value.length) return false;
|
||||
return selectedConversations.value.every(item => {
|
||||
return store.getters.getConversationById(item)?.status === status;
|
||||
return getConversationById.value(item)?.status === status;
|
||||
});
|
||||
}
|
||||
|
||||
@@ -799,7 +859,7 @@ provide('deSelectConversation', deSelectConversation);
|
||||
provide('assignAgent', onAssignAgent);
|
||||
provide('assignTeam', onAssignTeam);
|
||||
provide('assignLabels', onAssignLabels);
|
||||
provide('updateConversationStatus', toggleConversationStatus);
|
||||
provide('updateConversationStatus', handleResolveConversation);
|
||||
provide('toggleContextMenu', onContextMenuToggle);
|
||||
provide('markAsUnread', markAsUnread);
|
||||
provide('markAsRead', markAsRead);
|
||||
@@ -895,7 +955,7 @@ watch(conversationFilters, (newVal, oldVal) => {
|
||||
|
||||
<p
|
||||
v-if="!chatListLoading && !conversationList.length"
|
||||
class="flex items-center justify-center p-4 overflow-auto"
|
||||
class="flex overflow-auto justify-center items-center p-4"
|
||||
>
|
||||
{{ $t('CHAT_LIST.LIST.404') }}
|
||||
</p>
|
||||
@@ -915,14 +975,14 @@ watch(conversationFilters, (newVal, oldVal) => {
|
||||
/>
|
||||
<div
|
||||
ref="conversationListRef"
|
||||
class="flex-1 overflow-hidden conversations-list hover:overflow-y-auto"
|
||||
class="overflow-hidden flex-1 conversations-list hover:overflow-y-auto"
|
||||
:class="{ 'overflow-hidden': isContextMenuOpen }"
|
||||
>
|
||||
<DynamicScroller
|
||||
ref="conversationDynamicScroller"
|
||||
:items="conversationList"
|
||||
:min-item-size="24"
|
||||
class="w-full h-full overflow-auto"
|
||||
class="overflow-auto w-full h-full"
|
||||
>
|
||||
<template #default="{ item, index, active }">
|
||||
<!--
|
||||
@@ -997,5 +1057,9 @@ watch(conversationFilters, (newVal, oldVal) => {
|
||||
@close="closeAdvanceFiltersModal"
|
||||
/>
|
||||
</TeleportWithDirection>
|
||||
<ConversationResolveAttributesModal
|
||||
ref="resolveAttributesModalRef"
|
||||
@submit="handleResolveWithAttributes"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -6,6 +6,7 @@ import { useI18n } from 'vue-i18n';
|
||||
import { useStore, useStoreGetters } from 'dashboard/composables/store';
|
||||
import { useEmitter } from 'dashboard/composables/emitter';
|
||||
import { useKeyboardEvents } from 'dashboard/composables/useKeyboardEvents';
|
||||
import { useConversationRequiredAttributes } from 'dashboard/composables/useConversationRequiredAttributes';
|
||||
|
||||
import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
|
||||
import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
|
||||
@@ -17,13 +18,16 @@ import {
|
||||
|
||||
import ButtonGroup from 'dashboard/components-next/buttonGroup/ButtonGroup.vue';
|
||||
import Button from 'dashboard/components-next/button/Button.vue';
|
||||
import ConversationResolveAttributesModal from 'dashboard/components-next/ConversationWorkflow/ConversationResolveAttributesModal.vue';
|
||||
|
||||
const store = useStore();
|
||||
const getters = useStoreGetters();
|
||||
const { t } = useI18n();
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const arrowDownButtonRef = ref(null);
|
||||
const isLoading = ref(false);
|
||||
const resolveAttributesModalRef = ref(null);
|
||||
|
||||
const [showActionsDropdown, toggleDropdown] = useToggle();
|
||||
const closeDropdown = () => toggleDropdown(false);
|
||||
@@ -77,19 +81,36 @@ const openSnoozeModal = () => {
|
||||
ninja.open({ parent: 'snooze_conversation' });
|
||||
};
|
||||
|
||||
const toggleStatus = (status, snoozedUntil) => {
|
||||
const toggleStatus = (status, snoozedUntil, customAttributes = null) => {
|
||||
closeDropdown();
|
||||
isLoading.value = true;
|
||||
store
|
||||
.dispatch('toggleStatus', {
|
||||
conversationId: currentChat.value.id,
|
||||
status,
|
||||
snoozedUntil,
|
||||
})
|
||||
.then(() => {
|
||||
useAlert(t('CONVERSATION.CHANGE_STATUS'));
|
||||
isLoading.value = false;
|
||||
});
|
||||
|
||||
const payload = {
|
||||
conversationId: currentChat.value.id,
|
||||
status,
|
||||
snoozedUntil,
|
||||
};
|
||||
|
||||
if (customAttributes) {
|
||||
payload.customAttributes = customAttributes;
|
||||
}
|
||||
|
||||
store.dispatch('toggleStatus', payload).then(() => {
|
||||
useAlert(t('CONVERSATION.CHANGE_STATUS'));
|
||||
isLoading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
const handleResolveWithAttributes = ({ attributes, context }) => {
|
||||
if (context) {
|
||||
const currentCustomAttributes = currentChat.value.custom_attributes || {};
|
||||
const mergedAttributes = { ...currentCustomAttributes, ...attributes };
|
||||
toggleStatus(
|
||||
wootConstants.STATUS_TYPE.RESOLVED,
|
||||
context.snoozedUntil,
|
||||
mergedAttributes
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const onCmdOpenConversation = () => {
|
||||
@@ -97,7 +118,24 @@ const onCmdOpenConversation = () => {
|
||||
};
|
||||
|
||||
const onCmdResolveConversation = () => {
|
||||
toggleStatus(wootConstants.STATUS_TYPE.RESOLVED);
|
||||
const currentCustomAttributes = currentChat.value.custom_attributes || {};
|
||||
const { hasMissing, missing } = checkMissingAttributes(
|
||||
currentCustomAttributes
|
||||
);
|
||||
|
||||
if (hasMissing) {
|
||||
const conversationContext = {
|
||||
id: currentChat.value.id,
|
||||
snoozedUntil: null,
|
||||
};
|
||||
resolveAttributesModalRef.value?.open(
|
||||
missing,
|
||||
currentCustomAttributes,
|
||||
conversationContext
|
||||
);
|
||||
} else {
|
||||
toggleStatus(wootConstants.STATUS_TYPE.RESOLVED);
|
||||
}
|
||||
};
|
||||
|
||||
const keyboardEvents = {
|
||||
@@ -107,13 +145,13 @@ const keyboardEvents = {
|
||||
},
|
||||
'Alt+KeyE': {
|
||||
action: async () => {
|
||||
await toggleStatus(wootConstants.STATUS_TYPE.RESOLVED);
|
||||
onCmdResolveConversation();
|
||||
},
|
||||
},
|
||||
'$mod+Alt+KeyE': {
|
||||
action: async event => {
|
||||
const { all, activeIndex, lastIndex } = getConversationParams();
|
||||
await toggleStatus(wootConstants.STATUS_TYPE.RESOLVED);
|
||||
onCmdResolveConversation();
|
||||
|
||||
if (activeIndex < lastIndex) {
|
||||
all[activeIndex + 1].click();
|
||||
@@ -133,9 +171,9 @@ useEmitter(CMD_RESOLVE_CONVERSATION, onCmdResolveConversation);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="relative flex items-center justify-end resolve-actions">
|
||||
<div class="flex relative justify-end items-center resolve-actions">
|
||||
<ButtonGroup
|
||||
class="rounded-lg shadow outline-1 outline flex-shrink-0"
|
||||
class="flex-shrink-0 rounded-lg shadow outline-1 outline"
|
||||
:class="!showOpenButton ? 'outline-n-container' : 'outline-transparent'"
|
||||
>
|
||||
<Button
|
||||
@@ -212,5 +250,9 @@ useEmitter(CMD_RESOLVE_CONVERSATION, onCmdResolveConversation);
|
||||
</WootDropdownItem>
|
||||
</WootDropdownMenu>
|
||||
</div>
|
||||
<ConversationResolveAttributesModal
|
||||
ref="resolveAttributesModalRef"
|
||||
@submit="handleResolveWithAttributes"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import { ref, provide } from 'vue';
|
||||
// composable
|
||||
import { useKeyboardEvents } from 'dashboard/composables/useKeyboardEvents';
|
||||
import { useCaptain } from 'dashboard/composables/useCaptain';
|
||||
import { useLabelSuggestions } from 'dashboard/composables/useLabelSuggestions';
|
||||
import { useSnakeCase } from 'dashboard/composables/useTransformKeys';
|
||||
|
||||
// components
|
||||
@@ -59,7 +59,11 @@ export default {
|
||||
|
||||
useKeyboardEvents(keyboardEvents);
|
||||
|
||||
const { captainTasksEnabled, getLabelSuggestions } = useCaptain();
|
||||
const {
|
||||
captainTasksEnabled,
|
||||
isLabelSuggestionFeatureEnabled,
|
||||
getLabelSuggestions,
|
||||
} = useLabelSuggestions();
|
||||
|
||||
provide('contextMenuElementTarget', conversationPanelRef);
|
||||
|
||||
@@ -67,6 +71,7 @@ export default {
|
||||
isPopOutReplyBox,
|
||||
captainTasksEnabled,
|
||||
getLabelSuggestions,
|
||||
isLabelSuggestionFeatureEnabled,
|
||||
conversationPanelRef,
|
||||
};
|
||||
},
|
||||
@@ -94,7 +99,10 @@ export default {
|
||||
},
|
||||
shouldShowLabelSuggestions() {
|
||||
return (
|
||||
this.isOpen && this.captainTasksEnabled && !this.messageSentSinceOpened
|
||||
this.isOpen &&
|
||||
this.captainTasksEnabled &&
|
||||
this.isLabelSuggestionFeatureEnabled &&
|
||||
!this.messageSentSinceOpened
|
||||
);
|
||||
},
|
||||
inboxId() {
|
||||
@@ -282,7 +290,7 @@ export default {
|
||||
const existingLabels = this.currentChat?.labels || [];
|
||||
if (existingLabels.length > 0) return;
|
||||
|
||||
if (!this.captainTasksEnabled) {
|
||||
if (!this.captainTasksEnabled || !this.isLabelSuggestionFeatureEnabled) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
@@ -1271,7 +1271,7 @@ export default {
|
||||
key="copilot-bottom-panel"
|
||||
:is-generating-content="copilot.isButtonDisabled.value"
|
||||
@submit="onSubmitCopilotReply"
|
||||
@cancel="copilot.toggleEditor"
|
||||
@cancel="copilot.reset"
|
||||
/>
|
||||
<ReplyBottomPanel
|
||||
v-else
|
||||
|
||||
+4
@@ -515,6 +515,10 @@ const languages = [
|
||||
name: 'Portuguese',
|
||||
id: 'pt',
|
||||
},
|
||||
{
|
||||
name: 'Portuguese (Brazil)',
|
||||
id: 'pt_BR',
|
||||
},
|
||||
{
|
||||
name: 'Punjabi',
|
||||
id: 'pa',
|
||||
|
||||
+3
-3
@@ -13,7 +13,7 @@ import { mapGetters } from 'vuex';
|
||||
// utils & constants
|
||||
import { LocalStorage } from 'shared/helpers/localStorage';
|
||||
import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
|
||||
import { OPEN_AI_EVENTS } from '../../../../helper/AnalyticsHelper/events';
|
||||
import { CAPTAIN_EVENTS } from '../../../../helper/AnalyticsHelper/events';
|
||||
|
||||
export default {
|
||||
name: 'LabelSuggestion',
|
||||
@@ -114,7 +114,7 @@ export default {
|
||||
|
||||
// dismiss this once the values are set
|
||||
this.isDismissed = true;
|
||||
this.trackLabelEvent(OPEN_AI_EVENTS.DISMISS_LABEL_SUGGESTION);
|
||||
this.trackLabelEvent(CAPTAIN_EVENTS.LABEL_SUGGESTION_DISMISSED);
|
||||
},
|
||||
isConversationDismissed() {
|
||||
return LocalStorage.getFlag(
|
||||
@@ -132,7 +132,7 @@ export default {
|
||||
conversationId: this.conversationId,
|
||||
labels: labelsToAdd,
|
||||
});
|
||||
this.trackLabelEvent(OPEN_AI_EVENTS.APPLY_LABEL_SUGGESTION);
|
||||
this.trackLabelEvent(CAPTAIN_EVENTS.LABEL_SUGGESTION_APPLIED);
|
||||
},
|
||||
trackLabelEvent(event) {
|
||||
const payload = {
|
||||
|
||||
@@ -3,10 +3,13 @@ import { useStore } from 'vuex';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useMapGetter } from 'dashboard/composables/store.js';
|
||||
import { useConversationRequiredAttributes } from 'dashboard/composables/useConversationRequiredAttributes';
|
||||
import wootConstants from 'dashboard/constants/globals';
|
||||
|
||||
export function useBulkActions() {
|
||||
const store = useStore();
|
||||
const { t } = useI18n();
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const selectedConversations = useMapGetter(
|
||||
'bulkActions/getSelectedConversationIds'
|
||||
@@ -116,17 +119,61 @@ export function useBulkActions() {
|
||||
}
|
||||
|
||||
async function onUpdateConversations(status, snoozedUntil) {
|
||||
try {
|
||||
await store.dispatch('bulkActions/process', {
|
||||
type: 'Conversation',
|
||||
ids: selectedConversations.value,
|
||||
fields: {
|
||||
status,
|
||||
let conversationIds = selectedConversations.value;
|
||||
let skippedCount = 0;
|
||||
|
||||
// If resolving, check for required attributes
|
||||
if (status === wootConstants.STATUS_TYPE.RESOLVED) {
|
||||
const { validIds, skippedIds } = selectedConversations.value.reduce(
|
||||
(acc, id) => {
|
||||
const conversation = store.getters.getConversationById(id);
|
||||
const currentCustomAttributes = conversation?.custom_attributes || {};
|
||||
const { hasMissing } = checkMissingAttributes(
|
||||
currentCustomAttributes
|
||||
);
|
||||
|
||||
if (!hasMissing) {
|
||||
acc.validIds.push(id);
|
||||
} else {
|
||||
acc.skippedIds.push(id);
|
||||
}
|
||||
return acc;
|
||||
},
|
||||
snoozed_until: snoozedUntil,
|
||||
});
|
||||
{ validIds: [], skippedIds: [] }
|
||||
);
|
||||
|
||||
conversationIds = validIds;
|
||||
skippedCount = skippedIds.length;
|
||||
|
||||
if (skippedCount > 0 && validIds.length === 0) {
|
||||
// All conversations have missing attributes
|
||||
useAlert(
|
||||
t('BULK_ACTION.RESOLVE.ALL_MISSING_ATTRIBUTES') ||
|
||||
'Cannot resolve conversations due to missing required attributes'
|
||||
);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
if (conversationIds.length > 0) {
|
||||
await store.dispatch('bulkActions/process', {
|
||||
type: 'Conversation',
|
||||
ids: conversationIds,
|
||||
fields: {
|
||||
status,
|
||||
},
|
||||
snoozed_until: snoozedUntil,
|
||||
});
|
||||
}
|
||||
|
||||
store.dispatch('bulkActions/clearSelectedConversationIds');
|
||||
useAlert(t('BULK_ACTION.UPDATE.UPDATE_SUCCESFUL'));
|
||||
|
||||
if (skippedCount > 0) {
|
||||
useAlert(t('BULK_ACTION.RESOLVE.PARTIAL_SUCCESS'));
|
||||
} else {
|
||||
useAlert(t('BULK_ACTION.UPDATE.UPDATE_SUCCESFUL'));
|
||||
}
|
||||
} catch (err) {
|
||||
useAlert(t('BULK_ACTION.UPDATE.UPDATE_FAILED'));
|
||||
}
|
||||
|
||||
@@ -8,7 +8,6 @@ import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { useConfig } from 'dashboard/composables/useConfig';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import TasksAPI from 'dashboard/api/captain/tasks';
|
||||
import analyticsHelper from 'dashboard/helper/AnalyticsHelper/index';
|
||||
|
||||
vi.mock('dashboard/composables/store');
|
||||
vi.mock('dashboard/composables/useAccount');
|
||||
@@ -23,8 +22,8 @@ vi.mock('dashboard/helper/AnalyticsHelper/index', async importOriginal => {
|
||||
return actual;
|
||||
});
|
||||
vi.mock('dashboard/helper/AnalyticsHelper/events', () => ({
|
||||
OPEN_AI_EVENTS: {
|
||||
TEST_EVENT: 'open_ai_test_event',
|
||||
CAPTAIN_EVENTS: {
|
||||
TEST_EVENT: 'captain_test_event',
|
||||
},
|
||||
}));
|
||||
|
||||
@@ -65,29 +64,6 @@ describe('useCaptain', () => {
|
||||
expect(draftMessage.value).toBe('Draft message');
|
||||
});
|
||||
|
||||
it('records analytics correctly', async () => {
|
||||
const { recordAnalytics } = useCaptain();
|
||||
|
||||
await recordAnalytics('TEST_EVENT', { data: 'test' });
|
||||
|
||||
expect(analyticsHelper.track).toHaveBeenCalledWith('open_ai_test_event', {
|
||||
type: 'TEST_EVENT',
|
||||
data: 'test',
|
||||
});
|
||||
});
|
||||
|
||||
it('gets label suggestions', async () => {
|
||||
TasksAPI.labelSuggestion.mockResolvedValue({
|
||||
data: { message: 'label1, label2' },
|
||||
});
|
||||
|
||||
const { getLabelSuggestions } = useCaptain();
|
||||
const result = await getLabelSuggestions();
|
||||
|
||||
expect(TasksAPI.labelSuggestion).toHaveBeenCalledWith('123');
|
||||
expect(result).toEqual(['label1', 'label2']);
|
||||
});
|
||||
|
||||
it('rewrites content', async () => {
|
||||
TasksAPI.rewrite.mockResolvedValue({
|
||||
data: { message: 'Rewritten content', follow_up_context: { id: 'ctx1' } },
|
||||
@@ -193,21 +169,4 @@ describe('useCaptain', () => {
|
||||
await processEvent('improve', 'content', {});
|
||||
expect(TasksAPI.rewrite).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('returns empty array when no conversation ID for label suggestions', async () => {
|
||||
useMapGetter.mockImplementation(getter => {
|
||||
const mockValues = {
|
||||
'accounts/getUIFlags': { isFetchingLimits: false },
|
||||
getSelectedChat: { id: null },
|
||||
'draftMessages/getReplyEditorMode': 'reply',
|
||||
};
|
||||
return { value: mockValues[getter] };
|
||||
});
|
||||
|
||||
const { getLabelSuggestions } = useCaptain();
|
||||
const result = await getLabelSuggestions();
|
||||
|
||||
expect(result).toEqual([]);
|
||||
expect(TasksAPI.labelSuggestion).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -0,0 +1,348 @@
|
||||
import { useConversationRequiredAttributes } from '../useConversationRequiredAttributes';
|
||||
import { useMapGetter } from 'dashboard/composables/store';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
|
||||
vi.mock('dashboard/composables/store');
|
||||
vi.mock('dashboard/composables/useAccount');
|
||||
|
||||
const defaultAttributes = [
|
||||
{
|
||||
attributeKey: 'priority',
|
||||
attributeDisplayName: 'Priority',
|
||||
attributeDisplayType: 'list',
|
||||
attributeValues: ['High', 'Medium', 'Low'],
|
||||
},
|
||||
{
|
||||
attributeKey: 'category',
|
||||
attributeDisplayName: 'Category',
|
||||
attributeDisplayType: 'text',
|
||||
attributeValues: [],
|
||||
},
|
||||
{
|
||||
attributeKey: 'is_urgent',
|
||||
attributeDisplayName: 'Is Urgent',
|
||||
attributeDisplayType: 'checkbox',
|
||||
attributeValues: [],
|
||||
},
|
||||
];
|
||||
|
||||
describe('useConversationRequiredAttributes', () => {
|
||||
beforeEach(() => {
|
||||
useMapGetter.mockImplementation(getter => {
|
||||
if (getter === 'accounts/isFeatureEnabledonAccount') {
|
||||
return { value: () => true };
|
||||
}
|
||||
if (getter === 'attributes/getConversationAttributes') {
|
||||
return { value: defaultAttributes };
|
||||
}
|
||||
return { value: null };
|
||||
});
|
||||
|
||||
useAccount.mockReturnValue({
|
||||
currentAccount: {
|
||||
value: {
|
||||
settings: {
|
||||
conversation_required_attributes: [
|
||||
'priority',
|
||||
'category',
|
||||
'is_urgent',
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
accountId: { value: 1 },
|
||||
});
|
||||
});
|
||||
|
||||
const setupMocks = (
|
||||
requiredAttributes = ['priority', 'category', 'is_urgent'],
|
||||
{ attributes = defaultAttributes, featureEnabled = true } = {}
|
||||
) => {
|
||||
useMapGetter.mockImplementation(getter => {
|
||||
if (getter === 'accounts/isFeatureEnabledonAccount') {
|
||||
return { value: () => featureEnabled };
|
||||
}
|
||||
if (getter === 'attributes/getConversationAttributes') {
|
||||
return { value: attributes };
|
||||
}
|
||||
return { value: null };
|
||||
});
|
||||
|
||||
useAccount.mockReturnValue({
|
||||
currentAccount: {
|
||||
value: {
|
||||
settings: {
|
||||
conversation_required_attributes: requiredAttributes,
|
||||
},
|
||||
},
|
||||
},
|
||||
accountId: { value: 1 },
|
||||
});
|
||||
};
|
||||
|
||||
describe('requiredAttributeKeys', () => {
|
||||
it('should return required attribute keys from account settings', () => {
|
||||
setupMocks();
|
||||
const { requiredAttributeKeys } = useConversationRequiredAttributes();
|
||||
|
||||
expect(requiredAttributeKeys.value).toEqual([
|
||||
'priority',
|
||||
'category',
|
||||
'is_urgent',
|
||||
]);
|
||||
});
|
||||
|
||||
it('should return empty array when no required attributes configured', () => {
|
||||
setupMocks([]);
|
||||
const { requiredAttributeKeys } = useConversationRequiredAttributes();
|
||||
|
||||
expect(requiredAttributeKeys.value).toEqual([]);
|
||||
});
|
||||
|
||||
it('should return empty array when account settings is null', () => {
|
||||
setupMocks([], { attributes: [] });
|
||||
useAccount.mockReturnValue({
|
||||
currentAccount: { value: { settings: null } },
|
||||
accountId: { value: 1 },
|
||||
});
|
||||
|
||||
const { requiredAttributeKeys } = useConversationRequiredAttributes();
|
||||
|
||||
expect(requiredAttributeKeys.value).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('requiredAttributes', () => {
|
||||
it('should return full attribute definitions for required attributes only', () => {
|
||||
setupMocks();
|
||||
const { requiredAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
expect(requiredAttributes.value).toHaveLength(3);
|
||||
expect(requiredAttributes.value[0]).toEqual({
|
||||
attributeKey: 'priority',
|
||||
attributeDisplayName: 'Priority',
|
||||
attributeDisplayType: 'list',
|
||||
attributeValues: ['High', 'Medium', 'Low'],
|
||||
value: 'priority',
|
||||
label: 'Priority',
|
||||
type: 'list',
|
||||
});
|
||||
});
|
||||
|
||||
it('should filter out deleted attributes that no longer exist', () => {
|
||||
// Mock with only 2 attributes available but 3 required
|
||||
setupMocks(['priority', 'category', 'is_urgent'], {
|
||||
attributes: [
|
||||
{
|
||||
attributeKey: 'priority',
|
||||
attributeDisplayName: 'Priority',
|
||||
attributeDisplayType: 'list',
|
||||
attributeValues: ['High', 'Medium', 'Low'],
|
||||
},
|
||||
{
|
||||
attributeKey: 'is_urgent',
|
||||
attributeDisplayName: 'Is Urgent',
|
||||
attributeDisplayType: 'checkbox',
|
||||
attributeValues: [],
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const { requiredAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
expect(requiredAttributes.value).toHaveLength(2);
|
||||
expect(requiredAttributes.value.map(attr => attr.value)).toEqual([
|
||||
'priority',
|
||||
'is_urgent',
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('checkMissingAttributes', () => {
|
||||
beforeEach(() => {
|
||||
setupMocks();
|
||||
});
|
||||
|
||||
it('should return no missing when all attributes are filled', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: 'Bug Report',
|
||||
is_urgent: true,
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
expect(result.all).toHaveLength(3);
|
||||
});
|
||||
|
||||
it('should detect missing text attributes', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
is_urgent: true,
|
||||
// category is missing
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(true);
|
||||
expect(result.missing).toHaveLength(1);
|
||||
expect(result.missing[0].value).toBe('category');
|
||||
});
|
||||
|
||||
it('should detect empty string values as missing', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: '', // empty string
|
||||
is_urgent: true,
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(true);
|
||||
expect(result.missing[0].value).toBe('category');
|
||||
});
|
||||
|
||||
it('should consider checkbox attribute present when value is true', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: 'Bug Report',
|
||||
is_urgent: true,
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
});
|
||||
|
||||
it('should consider checkbox attribute present when value is false', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: 'Bug Report',
|
||||
is_urgent: false, // false is still considered "filled"
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
});
|
||||
|
||||
it('should detect missing checkbox when key does not exist', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: 'Bug Report',
|
||||
// is_urgent key is completely missing
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(true);
|
||||
expect(result.missing).toHaveLength(1);
|
||||
expect(result.missing[0].value).toBe('is_urgent');
|
||||
expect(result.missing[0].type).toBe('checkbox');
|
||||
});
|
||||
|
||||
it('should handle falsy values correctly for non-checkbox attributes', () => {
|
||||
setupMocks(['score', 'status_flag'], {
|
||||
attributes: [
|
||||
{
|
||||
attributeKey: 'score',
|
||||
attributeDisplayName: 'Score',
|
||||
attributeDisplayType: 'number',
|
||||
attributeValues: [],
|
||||
},
|
||||
{
|
||||
attributeKey: 'status_flag',
|
||||
attributeDisplayName: 'Status Flag',
|
||||
attributeDisplayType: 'text',
|
||||
attributeValues: [],
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
score: 0, // zero should be considered valid, not missing
|
||||
status_flag: false, // false should be considered valid, not missing
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
});
|
||||
|
||||
it('should handle null values as missing for text attributes', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: null, // null should be missing for text attribute
|
||||
is_urgent: true, // checkbox is present
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(true);
|
||||
expect(result.missing).toHaveLength(1);
|
||||
expect(result.missing[0].value).toBe('category');
|
||||
});
|
||||
|
||||
it('should consider undefined checkbox values as present when key exists', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: 'Bug Report',
|
||||
is_urgent: undefined, // key exists but value is undefined - still considered "filled" for checkbox
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
});
|
||||
|
||||
it('should return no missing when no attributes are required', () => {
|
||||
setupMocks([]); // No required attributes
|
||||
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const result = checkMissingAttributes({});
|
||||
|
||||
expect(result.hasMissing).toBe(false);
|
||||
expect(result.missing).toEqual([]);
|
||||
});
|
||||
|
||||
it('should handle whitespace-only values as missing', () => {
|
||||
const { checkMissingAttributes } = useConversationRequiredAttributes();
|
||||
|
||||
const customAttributes = {
|
||||
priority: 'High',
|
||||
category: ' ', // whitespace only
|
||||
is_urgent: true,
|
||||
};
|
||||
|
||||
const result = checkMissingAttributes(customAttributes);
|
||||
|
||||
expect(result.hasMissing).toBe(true);
|
||||
expect(result.missing[0].value).toBe('category');
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -7,26 +7,11 @@ import {
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { useConfig } from 'dashboard/composables/useConfig';
|
||||
import { useCamelCase } from 'dashboard/composables/useTransformKeys';
|
||||
import { useAlert, useTrack } from 'dashboard/composables';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
||||
import { OPEN_AI_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
|
||||
import TasksAPI from 'dashboard/api/captain/tasks';
|
||||
|
||||
/**
|
||||
* Cleans and normalizes a list of labels.
|
||||
* @param {string} labels - A comma-separated string of labels.
|
||||
* @returns {string[]} An array of cleaned and unique labels.
|
||||
*/
|
||||
const cleanLabels = labels => {
|
||||
return labels
|
||||
.toLowerCase()
|
||||
.split(',')
|
||||
.filter(label => label.trim())
|
||||
.map(label => label.trim())
|
||||
.filter((label, index, self) => self.indexOf(label) === index);
|
||||
};
|
||||
|
||||
export function useCaptain() {
|
||||
const store = useStore();
|
||||
const { t } = useI18n();
|
||||
@@ -93,23 +78,6 @@ export function useCaptain() {
|
||||
useAlert(errorMessage);
|
||||
};
|
||||
|
||||
// === Analytics ===
|
||||
/**
|
||||
* Records analytics for AI-related events.
|
||||
* @param {string} type - The type of event.
|
||||
* @param {Object} payload - Additional data for the event.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
const recordAnalytics = async (type, payload) => {
|
||||
const event = OPEN_AI_EVENTS[type.toUpperCase()];
|
||||
if (event) {
|
||||
useTrack(event, {
|
||||
type,
|
||||
...payload,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// === Task Methods ===
|
||||
/**
|
||||
* Rewrites content with a specific operation.
|
||||
@@ -183,24 +151,6 @@ export function useCaptain() {
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Gets label suggestions for the current conversation.
|
||||
* @returns {Promise<string[]>} An array of suggested labels.
|
||||
*/
|
||||
const getLabelSuggestions = async () => {
|
||||
if (!conversationId.value) return [];
|
||||
|
||||
try {
|
||||
const result = await TasksAPI.labelSuggestion(conversationId.value);
|
||||
const {
|
||||
data: { message: labels },
|
||||
} = result;
|
||||
return cleanLabels(labels);
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Sends a follow-up message to refine a previous AI task result.
|
||||
* @param {Object} options - The follow-up options.
|
||||
@@ -264,11 +214,7 @@ export function useCaptain() {
|
||||
rewriteContent,
|
||||
summarizeConversation,
|
||||
getReplySuggestion,
|
||||
getLabelSuggestions,
|
||||
followUp,
|
||||
processEvent,
|
||||
|
||||
// Analytics
|
||||
recordAnalytics,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -0,0 +1,97 @@
|
||||
import { computed } from 'vue';
|
||||
import { useMapGetter } from 'dashboard/composables/store';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
||||
import { ATTRIBUTE_TYPES } from 'dashboard/components-next/ConversationWorkflow/constants';
|
||||
|
||||
/**
|
||||
* Composable for managing conversation required attributes workflow
|
||||
*
|
||||
* This handles the logic for checking if conversations have all required
|
||||
* custom attributes filled before they can be resolved.
|
||||
*/
|
||||
export function useConversationRequiredAttributes() {
|
||||
const { currentAccount, accountId } = useAccount();
|
||||
const isFeatureEnabledonAccount = useMapGetter(
|
||||
'accounts/isFeatureEnabledonAccount'
|
||||
);
|
||||
const conversationAttributes = useMapGetter(
|
||||
'attributes/getConversationAttributes'
|
||||
);
|
||||
|
||||
const isFeatureEnabled = computed(() =>
|
||||
isFeatureEnabledonAccount.value(
|
||||
accountId.value,
|
||||
FEATURE_FLAGS.CONVERSATION_REQUIRED_ATTRIBUTES
|
||||
)
|
||||
);
|
||||
|
||||
const requiredAttributeKeys = computed(() => {
|
||||
if (!isFeatureEnabled.value) return [];
|
||||
return (
|
||||
currentAccount.value?.settings?.conversation_required_attributes || []
|
||||
);
|
||||
});
|
||||
|
||||
const allAttributeOptions = computed(() =>
|
||||
(conversationAttributes.value || []).map(attribute => ({
|
||||
...attribute,
|
||||
value: attribute.attributeKey,
|
||||
label: attribute.attributeDisplayName,
|
||||
type: attribute.attributeDisplayType,
|
||||
attributeValues: attribute.attributeValues,
|
||||
}))
|
||||
);
|
||||
|
||||
/**
|
||||
* Get the full attribute definitions for only the required attributes
|
||||
* Filters allAttributeOptions to only include attributes marked as required
|
||||
*/
|
||||
const requiredAttributes = computed(
|
||||
() =>
|
||||
requiredAttributeKeys.value
|
||||
.map(key =>
|
||||
allAttributeOptions.value.find(attribute => attribute.value === key)
|
||||
)
|
||||
.filter(Boolean) // Remove any undefined attributes (deleted attributes)
|
||||
);
|
||||
|
||||
/**
|
||||
* Check if a conversation is missing any required attributes
|
||||
*
|
||||
* @param {Object} conversationCustomAttributes - Current conversation's custom attributes
|
||||
* @returns {Object} - Analysis result with missing attributes info
|
||||
*/
|
||||
const checkMissingAttributes = (conversationCustomAttributes = {}) => {
|
||||
// If no attributes are required, conversation can be resolved
|
||||
if (!requiredAttributes.value.length) {
|
||||
return { hasMissing: false, missing: [] };
|
||||
}
|
||||
|
||||
// Find attributes that are missing or empty
|
||||
const missing = requiredAttributes.value.filter(attribute => {
|
||||
const value = conversationCustomAttributes[attribute.value];
|
||||
|
||||
// For checkbox/boolean attributes, only check if the key exists
|
||||
if (attribute.type === ATTRIBUTE_TYPES.CHECKBOX) {
|
||||
return !(attribute.value in conversationCustomAttributes);
|
||||
}
|
||||
|
||||
// For other attribute types, only consider null, undefined, empty string, or whitespace-only as missing
|
||||
// Allow falsy values like 0, false as they are valid filled values
|
||||
return value == null || String(value).trim() === '';
|
||||
});
|
||||
|
||||
return {
|
||||
hasMissing: missing.length > 0,
|
||||
missing,
|
||||
all: requiredAttributes.value,
|
||||
};
|
||||
};
|
||||
|
||||
return {
|
||||
requiredAttributeKeys,
|
||||
requiredAttributes,
|
||||
checkMissingAttributes,
|
||||
};
|
||||
}
|
||||
@@ -1,6 +1,56 @@
|
||||
import { ref, computed } from 'vue';
|
||||
import { useCaptain } from 'dashboard/composables/useCaptain';
|
||||
import { useUISettings } from 'dashboard/composables/useUISettings';
|
||||
import { useTrack } from 'dashboard/composables';
|
||||
import { CAPTAIN_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
|
||||
|
||||
// Actions that map to REWRITE events (with operation attribute)
|
||||
const REWRITE_ACTIONS = [
|
||||
'improve',
|
||||
'fix_spelling_grammar',
|
||||
'casual',
|
||||
'professional',
|
||||
'expand',
|
||||
'shorten',
|
||||
'rephrase',
|
||||
'make_friendly',
|
||||
'make_formal',
|
||||
'simplify',
|
||||
];
|
||||
|
||||
/**
|
||||
* Gets the event key suffix based on action type.
|
||||
* @param {string} action - The action type
|
||||
* @returns {string} The event key prefix (REWRITE, SUMMARIZE, or REPLY_SUGGESTION)
|
||||
*/
|
||||
function getEventPrefix(action) {
|
||||
if (action === 'summarize') return 'SUMMARIZE';
|
||||
if (action === 'reply_suggestion') return 'REPLY_SUGGESTION';
|
||||
return 'REWRITE';
|
||||
}
|
||||
|
||||
/**
|
||||
* Builds the analytics payload based on action type.
|
||||
* @param {string} action - The action type
|
||||
* @param {number} conversationId - The conversation ID
|
||||
* @param {number} [followUpCount] - Optional follow-up count
|
||||
* @returns {Object} The payload object
|
||||
*/
|
||||
function buildPayload(action, conversationId, followUpCount = undefined) {
|
||||
const payload = { conversationId };
|
||||
|
||||
// Add operation for rewrite actions
|
||||
if (REWRITE_ACTIONS.includes(action)) {
|
||||
payload.operation = action;
|
||||
}
|
||||
|
||||
// Add followUpCount if provided
|
||||
if (followUpCount !== undefined) {
|
||||
payload.followUpCount = followUpCount;
|
||||
}
|
||||
|
||||
return payload;
|
||||
}
|
||||
|
||||
/**
|
||||
* Composable for managing Copilot reply generation state and actions.
|
||||
@@ -9,7 +59,7 @@ import { useUISettings } from 'dashboard/composables/useUISettings';
|
||||
* @returns {Object} Copilot reply state and methods
|
||||
*/
|
||||
export function useCopilotReply() {
|
||||
const { processEvent, followUp } = useCaptain();
|
||||
const { processEvent, followUp, currentChat } = useCaptain();
|
||||
const { updateUISettings } = useUISettings();
|
||||
|
||||
const showEditor = ref(false);
|
||||
@@ -19,6 +69,13 @@ export function useCopilotReply() {
|
||||
const followUpContext = ref(null);
|
||||
const abortController = ref(null);
|
||||
|
||||
// Tracking state
|
||||
const currentAction = ref(null);
|
||||
const followUpCount = ref(0);
|
||||
const trackedConversationId = ref(null);
|
||||
|
||||
const conversationId = computed(() => currentChat.value?.id);
|
||||
|
||||
const isActive = computed(() => showEditor.value || isGenerating.value);
|
||||
const isButtonDisabled = computed(
|
||||
() => isGenerating.value || !isContentReady.value
|
||||
@@ -29,8 +86,22 @@ export function useCopilotReply() {
|
||||
|
||||
/**
|
||||
* Resets all copilot editor state and cancels any ongoing generation.
|
||||
* @param {boolean} [trackDismiss=true] - Whether to track dismiss event
|
||||
*/
|
||||
function reset() {
|
||||
function reset(trackDismiss = true) {
|
||||
// Track dismiss event if there was content and we're not accepting
|
||||
if (trackDismiss && generatedContent.value && currentAction.value) {
|
||||
const eventKey = `${getEventPrefix(currentAction.value)}_DISMISSED`;
|
||||
useTrack(
|
||||
CAPTAIN_EVENTS[eventKey],
|
||||
buildPayload(
|
||||
currentAction.value,
|
||||
trackedConversationId.value,
|
||||
followUpCount.value
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
if (abortController.value) {
|
||||
abortController.value.abort();
|
||||
abortController.value = null;
|
||||
@@ -40,6 +111,9 @@ export function useCopilotReply() {
|
||||
isContentReady.value = false;
|
||||
generatedContent.value = '';
|
||||
followUpContext.value = null;
|
||||
currentAction.value = null;
|
||||
followUpCount.value = 0;
|
||||
trackedConversationId.value = null;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -70,11 +144,14 @@ export function useCopilotReply() {
|
||||
return;
|
||||
}
|
||||
|
||||
// Reset and start new generation
|
||||
reset();
|
||||
// Reset without tracking dismiss (starting new action)
|
||||
reset(false);
|
||||
abortController.value = new AbortController();
|
||||
isGenerating.value = true;
|
||||
isContentReady.value = false;
|
||||
currentAction.value = action;
|
||||
followUpCount.value = 0;
|
||||
trackedConversationId.value = conversationId.value;
|
||||
|
||||
try {
|
||||
const { message: content, followUpContext: newContext } =
|
||||
@@ -85,7 +162,15 @@ export function useCopilotReply() {
|
||||
if (!abortController.value?.signal.aborted) {
|
||||
generatedContent.value = content;
|
||||
followUpContext.value = newContext;
|
||||
if (content) showEditor.value = true;
|
||||
if (content) {
|
||||
showEditor.value = true;
|
||||
// Track "Used" event on successful generation
|
||||
const eventKey = `${getEventPrefix(action)}_USED`;
|
||||
useTrack(
|
||||
CAPTAIN_EVENTS[eventKey],
|
||||
buildPayload(action, trackedConversationId.value)
|
||||
);
|
||||
}
|
||||
isGenerating.value = false;
|
||||
}
|
||||
} catch {
|
||||
@@ -106,6 +191,12 @@ export function useCopilotReply() {
|
||||
isGenerating.value = true;
|
||||
isContentReady.value = false;
|
||||
|
||||
// Track follow-up sent event
|
||||
useTrack(CAPTAIN_EVENTS.FOLLOW_UP_SENT, {
|
||||
conversationId: trackedConversationId.value,
|
||||
});
|
||||
followUpCount.value += 1;
|
||||
|
||||
try {
|
||||
const { message: content, followUpContext: updatedContext } =
|
||||
await followUp({
|
||||
@@ -137,7 +228,28 @@ export function useCopilotReply() {
|
||||
*/
|
||||
function accept() {
|
||||
const content = generatedContent.value;
|
||||
|
||||
// Track "Applied" event
|
||||
if (currentAction.value) {
|
||||
const eventKey = `${getEventPrefix(currentAction.value)}_APPLIED`;
|
||||
useTrack(
|
||||
CAPTAIN_EVENTS[eventKey],
|
||||
buildPayload(
|
||||
currentAction.value,
|
||||
trackedConversationId.value,
|
||||
followUpCount.value
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
// Reset state without tracking dismiss
|
||||
showEditor.value = false;
|
||||
generatedContent.value = '';
|
||||
followUpContext.value = null;
|
||||
currentAction.value = null;
|
||||
followUpCount.value = 0;
|
||||
trackedConversationId.value = null;
|
||||
|
||||
return content;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
import { computed, onMounted } from 'vue';
|
||||
import { useMapGetter, useStore } from 'dashboard/composables/store';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
||||
import TasksAPI from 'dashboard/api/captain/tasks';
|
||||
|
||||
/**
|
||||
* Cleans and normalizes a list of labels.
|
||||
* @param {string} labels - A comma-separated string of labels.
|
||||
* @returns {string[]} An array of cleaned and unique labels.
|
||||
*/
|
||||
const cleanLabels = labels => {
|
||||
return labels
|
||||
.toLowerCase()
|
||||
.split(',')
|
||||
.filter(label => label.trim())
|
||||
.map(label => label.trim())
|
||||
.filter((label, index, self) => self.indexOf(label) === index);
|
||||
};
|
||||
|
||||
export function useLabelSuggestions() {
|
||||
const store = useStore();
|
||||
const { isCloudFeatureEnabled } = useAccount();
|
||||
const appIntegrations = useMapGetter('integrations/getAppIntegrations');
|
||||
const currentChat = useMapGetter('getSelectedChat');
|
||||
const conversationId = computed(() => currentChat.value?.id);
|
||||
|
||||
const captainTasksEnabled = computed(() => {
|
||||
return isCloudFeatureEnabled(FEATURE_FLAGS.CAPTAIN_TASKS);
|
||||
});
|
||||
|
||||
const aiIntegration = computed(
|
||||
() =>
|
||||
appIntegrations.value.find(
|
||||
integration => integration.id === 'openai' && !!integration.hooks.length
|
||||
)?.hooks[0]
|
||||
);
|
||||
|
||||
const isLabelSuggestionFeatureEnabled = computed(() => {
|
||||
if (aiIntegration.value) {
|
||||
const { settings = {} } = aiIntegration.value || {};
|
||||
return !!settings.label_suggestion;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
const fetchIntegrationsIfRequired = async () => {
|
||||
if (!appIntegrations.value.length) {
|
||||
await store.dispatch('integrations/get');
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Gets label suggestions for the current conversation.
|
||||
* @returns {Promise<string[]>} An array of suggested labels.
|
||||
*/
|
||||
const getLabelSuggestions = async () => {
|
||||
if (!conversationId.value) return [];
|
||||
|
||||
try {
|
||||
const result = await TasksAPI.labelSuggestion(conversationId.value);
|
||||
const {
|
||||
data: { message: labels },
|
||||
} = result;
|
||||
return cleanLabels(labels);
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
fetchIntegrationsIfRequired();
|
||||
});
|
||||
|
||||
return {
|
||||
captainTasksEnabled,
|
||||
isLabelSuggestionFeatureEnabled,
|
||||
getLabelSuggestions,
|
||||
};
|
||||
}
|
||||
@@ -34,7 +34,8 @@ export default {
|
||||
DOCS_URL: 'https://www.chatwoot.com/docs/product/',
|
||||
HELP_CENTER_DOCS_URL:
|
||||
'https://www.chatwoot.com/docs/product/others/help-center',
|
||||
TESTIMONIAL_URL: 'https://testimonials.cdn.chatwoot.com/content.json',
|
||||
TESTIMONIAL_URL:
|
||||
'https://testimonials.cdn.chatwoot.com/testimonial-content.json',
|
||||
WHATSAPP_EMBEDDED_SIGNUP_DOCS_URL:
|
||||
'https://developers.facebook.com/docs/whatsapp/embedded-signup/custom-flows/onboarding-business-app-users#limitations',
|
||||
SMALL_SCREEN_BREAKPOINT: 768,
|
||||
|
||||
@@ -45,6 +45,7 @@ export const FEATURE_FLAGS = {
|
||||
QUOTED_EMAIL_REPLY: 'quoted_email_reply',
|
||||
COMPANIES: 'companies',
|
||||
ADVANCED_SEARCH: 'advanced_search',
|
||||
CONVERSATION_REQUIRED_ATTRIBUTES: 'conversation_required_attributes',
|
||||
};
|
||||
|
||||
export const PREMIUM_FEATURES = [
|
||||
@@ -54,4 +55,5 @@ export const PREMIUM_FEATURES = [
|
||||
FEATURE_FLAGS.AUDIT_LOGS,
|
||||
FEATURE_FLAGS.HELP_CENTER,
|
||||
FEATURE_FLAGS.SAML,
|
||||
FEATURE_FLAGS.CONVERSATION_REQUIRED_ATTRIBUTES,
|
||||
];
|
||||
|
||||
@@ -84,22 +84,28 @@ export const PORTALS_EVENTS = Object.freeze({
|
||||
PREVIEW_ARTICLE: 'Previewed article',
|
||||
});
|
||||
|
||||
export const OPEN_AI_EVENTS = Object.freeze({
|
||||
SUMMARIZE: 'OpenAI: Used summarize',
|
||||
REPLY_SUGGESTION: 'OpenAI: Used reply suggestion',
|
||||
REPHRASE: 'OpenAI: Used rephrase',
|
||||
IMPROVE: 'OpenAI: Used improve',
|
||||
FIX_SPELLING_AND_GRAMMAR: 'OpenAI: Used fix spelling and grammar',
|
||||
SHORTEN: 'OpenAI: Used shorten',
|
||||
EXPAND: 'OpenAI: Used expand',
|
||||
MAKE_FRIENDLY: 'OpenAI: Used make friendly',
|
||||
MAKE_FORMAL: 'OpenAI: Used make formal',
|
||||
SIMPLIFY: 'OpenAI: Used simplify',
|
||||
APPLY_LABEL_SUGGESTION: 'OpenAI: Apply label from suggestion',
|
||||
DISMISS_LABEL_SUGGESTION: 'OpenAI: Dismiss label suggestions',
|
||||
ADDED_AI_INTEGRATION_VIA_CTA_BUTTON:
|
||||
'OpenAI: Added AI integration via CTA button',
|
||||
DISMISS_AI_SUGGESTION: 'OpenAI: Dismiss AI suggestions',
|
||||
export const CAPTAIN_EVENTS = Object.freeze({
|
||||
// Rewrite events (with operation attribute in payload)
|
||||
REWRITE_USED: 'Captain: Rewrite used',
|
||||
REWRITE_APPLIED: 'Captain: Rewrite applied',
|
||||
REWRITE_DISMISSED: 'Captain: Rewrite dismissed',
|
||||
|
||||
// Summarize events
|
||||
SUMMARIZE_USED: 'Captain: Summarize used',
|
||||
SUMMARIZE_APPLIED: 'Captain: Summarize applied',
|
||||
SUMMARIZE_DISMISSED: 'Captain: Summarize dismissed',
|
||||
|
||||
// Reply suggestion events
|
||||
REPLY_SUGGESTION_USED: 'Captain: Reply suggestion used',
|
||||
REPLY_SUGGESTION_APPLIED: 'Captain: Reply suggestion applied',
|
||||
REPLY_SUGGESTION_DISMISSED: 'Captain: Reply suggestion dismissed',
|
||||
|
||||
// Follow-up events
|
||||
FOLLOW_UP_SENT: 'Captain: Follow-up sent',
|
||||
|
||||
// Label suggestions
|
||||
LABEL_SUGGESTION_APPLIED: 'Captain: Label suggestion applied',
|
||||
LABEL_SUGGESTION_DISMISSED: 'Captain: Label suggestion dismissed',
|
||||
});
|
||||
|
||||
export const COPILOT_EVENTS = Object.freeze({
|
||||
|
||||
@@ -63,6 +63,10 @@
|
||||
},
|
||||
"ENABLE_REGEX": {
|
||||
"LABEL": "Enable regex validation"
|
||||
},
|
||||
"BADGES": {
|
||||
"PRE_CHAT": "Pre-chat",
|
||||
"RESOLUTION": "Resolution"
|
||||
}
|
||||
},
|
||||
"API": {
|
||||
|
||||
@@ -22,6 +22,10 @@
|
||||
"UPDATE_SUCCESFUL": "Conversation status updated successfully.",
|
||||
"UPDATE_FAILED": "Failed to update conversations. Please try again."
|
||||
},
|
||||
"RESOLVE": {
|
||||
"ALL_MISSING_ATTRIBUTES": "Cannot resolve conversations due to missing required attributes",
|
||||
"PARTIAL_SUCCESS": "Some conversations need required attributes before resolving and were skipped"
|
||||
},
|
||||
"LABELS": {
|
||||
"ASSIGN_LABELS": "Assign labels",
|
||||
"NO_LABELS_FOUND": "No labels found",
|
||||
|
||||
@@ -11,5 +11,9 @@
|
||||
"ACCEPT": "Accept",
|
||||
"DISCARD": "Discard",
|
||||
"PREFERRED": "Preferred"
|
||||
},
|
||||
"CHOICE_TOGGLE": {
|
||||
"YES": "Yes",
|
||||
"NO": "No"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -379,7 +379,8 @@
|
||||
},
|
||||
"DOCS": "Read docs",
|
||||
"SECURITY": "Security",
|
||||
"CAPTAIN_AI": "Captain"
|
||||
"CAPTAIN_AI": "Captain",
|
||||
"CONVERSATION_WORKFLOW": "Conversation Workflow"
|
||||
},
|
||||
"CAPTAIN_SETTINGS": {
|
||||
"TITLE": "Captain Settings",
|
||||
@@ -555,6 +556,58 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"CONVERSATION_WORKFLOW": {
|
||||
"INDEX": {
|
||||
"HEADER": {
|
||||
"TITLE": "Conversation Workflows",
|
||||
"DESCRIPTION": "Configure rules and required fields for conversation resolution."
|
||||
}
|
||||
},
|
||||
"REQUIRED_ATTRIBUTES": {
|
||||
"TITLE": "Attributes required on resolution",
|
||||
"DESCRIPTION": "When resolving a conversation, agents will be prompted to fill these attributes if they haven't yet.",
|
||||
"NO_ATTRIBUTES": "No attributes added yet",
|
||||
"ADD": {
|
||||
"TITLE": "Add Attributes",
|
||||
"SEARCH_PLACEHOLDER": "Search attributes"
|
||||
},
|
||||
"SAVE": {
|
||||
"SUCCESS": "Required attributes updated",
|
||||
"ERROR": "Could not update required attributes, please try again"
|
||||
},
|
||||
"MODAL": {
|
||||
"TITLE": "Resolve conversation",
|
||||
"DESCRIPTION": "Please fill in the following custom attributes before resolving this conversation",
|
||||
"ACTIONS": {
|
||||
"RESOLVE": "Resolve conversation",
|
||||
"CANCEL": "Cancel"
|
||||
},
|
||||
"PLACEHOLDERS": {
|
||||
"TEXT": "Write a note...",
|
||||
"NUMBER": "Enter a number",
|
||||
"LINK": "Add a link",
|
||||
"DATE": "Pick a date",
|
||||
"LIST": "Select an option"
|
||||
},
|
||||
"CHECKBOX": {
|
||||
"YES": "Yes",
|
||||
"NO": "No"
|
||||
}
|
||||
},
|
||||
"PAYWALL": {
|
||||
"TITLE": "Upgrade to use required attributes",
|
||||
"AVAILABLE_ON": "The required conversation attributes feature is available on the Business and Enterprise plans.",
|
||||
"UPGRADE_PROMPT": "Upgrade your plan to prompt agents to fill required attributes before conversation resolution.",
|
||||
"UPGRADE_NOW": "Upgrade now",
|
||||
"CANCEL_ANYTIME": "You can change or cancel your plan anytime"
|
||||
},
|
||||
"ENTERPRISE_PAYWALL": {
|
||||
"AVAILABLE_ON": "The required conversation attributes feature is available on the paid plans.",
|
||||
"UPGRADE_PROMPT": "Upgrade to a paid plan to enforce required attributes before conversation resolution.",
|
||||
"ASK_ADMIN": "Please reach out to your administrator for the upgrade."
|
||||
}
|
||||
}
|
||||
},
|
||||
"CREATE_ACCOUNT": {
|
||||
"NO_ACCOUNT_WARNING": "Uh oh! We could not find any Chatwoot accounts. Please create a new account to continue.",
|
||||
"NEW_ACCOUNT": "New Account",
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
{
|
||||
"REGISTER": {
|
||||
"TRY_WOOT": "Create an account",
|
||||
"GET_STARTED": "Get started with Chatwoot",
|
||||
"TITLE": "Register",
|
||||
"TESTIMONIAL_HEADER": "All it takes is one step to move forward",
|
||||
"TESTIMONIAL_CONTENT": "You're one step away from engaging your customers, retaining them and finding new ones.",
|
||||
|
||||
+1
-4
@@ -76,10 +76,7 @@ const toggleButtonText = computed(() =>
|
||||
const filteredCustomAttributes = computed(() =>
|
||||
attributes.value.map(attribute => {
|
||||
// Check if the attribute key exists in customAttributes
|
||||
const hasValue = Object.hasOwnProperty.call(
|
||||
customAttributes.value,
|
||||
attribute.attribute_key
|
||||
);
|
||||
const hasValue = attribute.attribute_key in customAttributes.value;
|
||||
|
||||
return {
|
||||
...attribute,
|
||||
|
||||
@@ -14,7 +14,6 @@ import NextButton from 'dashboard/components-next/button/Button.vue';
|
||||
import AccountId from './components/AccountId.vue';
|
||||
import BuildInfo from './components/BuildInfo.vue';
|
||||
import AccountDelete from './components/AccountDelete.vue';
|
||||
import AutoResolve from './components/AutoResolve.vue';
|
||||
import AudioTranscription from './components/AudioTranscription.vue';
|
||||
import SectionLayout from './components/SectionLayout.vue';
|
||||
|
||||
@@ -25,7 +24,6 @@ export default {
|
||||
AccountId,
|
||||
BuildInfo,
|
||||
AccountDelete,
|
||||
AutoResolve,
|
||||
AudioTranscription,
|
||||
SectionLayout,
|
||||
WithLabel,
|
||||
@@ -64,12 +62,6 @@ export default {
|
||||
isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
|
||||
isOnChatwootCloud: 'globalConfig/isOnChatwootCloud',
|
||||
}),
|
||||
showAutoResolutionConfig() {
|
||||
return this.isFeatureEnabledonAccount(
|
||||
this.accountId,
|
||||
FEATURE_FLAGS.AUTO_RESOLVE_CONVERSATIONS
|
||||
);
|
||||
},
|
||||
showAudioTranscriptionConfig() {
|
||||
return this.isFeatureEnabledonAccount(
|
||||
this.accountId,
|
||||
@@ -239,7 +231,6 @@ export default {
|
||||
|
||||
<woot-loading-state v-if="uiFlags.isFetchingItem" />
|
||||
</div>
|
||||
<AutoResolve v-if="showAutoResolutionConfig" />
|
||||
<AudioTranscription v-if="showAudioTranscriptionConfig" />
|
||||
<AccountId />
|
||||
<div v-if="!uiFlags.isFetchingItem && isOnChatwootCloud">
|
||||
|
||||
+80
-72
@@ -4,7 +4,6 @@ import { useMapGetter } from 'dashboard/composables/store';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import SectionLayout from './SectionLayout.vue';
|
||||
import WithLabel from 'v3/components/Form/WithLabel.vue';
|
||||
import TextArea from 'next/textarea/TextArea.vue';
|
||||
import Switch from 'next/switch/Switch.vue';
|
||||
@@ -125,81 +124,90 @@ const toggleAutoResolve = async () => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<SectionLayout
|
||||
:title="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.TITLE')"
|
||||
:description="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.NOTE')"
|
||||
:hide-content="!isEnabled"
|
||||
with-border
|
||||
<div
|
||||
class="flex flex-col w-full outline-1 outline outline-n-container rounded-xl bg-n-solid-2 divide-y divide-n-weak"
|
||||
>
|
||||
<template #headerActions>
|
||||
<div class="flex justify-end">
|
||||
<Switch v-model="isEnabled" @change="toggleAutoResolve" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<form class="grid gap-5" @submit.prevent="handleSubmit">
|
||||
<WithLabel
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.DURATION.LABEL')"
|
||||
:help-message="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.DURATION.HELP')"
|
||||
>
|
||||
<div class="gap-2 w-full grid grid-cols-[3fr_1fr]">
|
||||
<!-- allow 10 mins to 999 days -->
|
||||
<DurationInput
|
||||
v-model="duration"
|
||||
v-model:unit="unit"
|
||||
min="0"
|
||||
max="1438560"
|
||||
class="w-full"
|
||||
/>
|
||||
<div class="flex flex-col gap-2 items-start px-5 py-4">
|
||||
<div class="flex justify-between items-center w-full">
|
||||
<h3 class="text-base font-medium text-n-slate-12">
|
||||
{{ t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.TITLE') }}
|
||||
</h3>
|
||||
<div class="flex justify-end">
|
||||
<Switch v-model="isEnabled" @change="toggleAutoResolve" />
|
||||
</div>
|
||||
</WithLabel>
|
||||
<WithLabel
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.LABEL')"
|
||||
:help-message="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.HELP')"
|
||||
>
|
||||
<TextArea
|
||||
v-model="message"
|
||||
class="w-full"
|
||||
:placeholder="
|
||||
t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.PLACEHOLDER')
|
||||
"
|
||||
/>
|
||||
</WithLabel>
|
||||
<WithLabel :label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.PREFERENCES')">
|
||||
<div
|
||||
class="rounded-xl border border-n-weak bg-n-solid-1 w-full text-sm text-n-slate-12 divide-y divide-n-weak"
|
||||
</div>
|
||||
<p class="mb-0 text-sm text-n-slate-11">
|
||||
{{ t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.NOTE') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div v-if="isEnabled" class="px-5 py-4">
|
||||
<form class="grid gap-5" @submit.prevent="handleSubmit">
|
||||
<WithLabel
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.DURATION.LABEL')"
|
||||
:help-message="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.DURATION.HELP')"
|
||||
>
|
||||
<div class="p-3 h-12 flex items-center justify-between">
|
||||
<span>
|
||||
{{ t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.IGNORE_WAITING.LABEL') }}
|
||||
</span>
|
||||
<Switch v-model="ignoreWaiting" />
|
||||
</div>
|
||||
<div class="p-3 h-12 flex items-center justify-between">
|
||||
<span>
|
||||
{{ t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.LABEL.LABEL') }}
|
||||
</span>
|
||||
<SingleSelect
|
||||
v-model="labelToApply"
|
||||
:options="labelOptions"
|
||||
:placeholder="
|
||||
$t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.LABEL.PLACEHOLDER')
|
||||
"
|
||||
placeholder-icon="i-lucide-chevron-down"
|
||||
placeholder-trailing-icon
|
||||
variant="faded"
|
||||
<div class="gap-2 w-full grid grid-cols-[3fr_1fr]">
|
||||
<!-- allow 10 mins to 999 days -->
|
||||
<DurationInput
|
||||
v-model="duration"
|
||||
v-model:unit="unit"
|
||||
min="0"
|
||||
max="1438560"
|
||||
class="w-full"
|
||||
/>
|
||||
</div>
|
||||
</WithLabel>
|
||||
<WithLabel
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.LABEL')"
|
||||
:help-message="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.HELP')"
|
||||
>
|
||||
<TextArea
|
||||
v-model="message"
|
||||
class="w-full"
|
||||
:placeholder="
|
||||
t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.MESSAGE.PLACEHOLDER')
|
||||
"
|
||||
/>
|
||||
</WithLabel>
|
||||
<WithLabel :label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.PREFERENCES')">
|
||||
<div
|
||||
class="rounded-xl border border-n-weak bg-n-solid-1 w-full text-sm text-n-slate-12 divide-y divide-n-weak"
|
||||
>
|
||||
<div class="p-3 h-12 flex items-center justify-between">
|
||||
<span>
|
||||
{{
|
||||
t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.IGNORE_WAITING.LABEL')
|
||||
}}
|
||||
</span>
|
||||
<Switch v-model="ignoreWaiting" />
|
||||
</div>
|
||||
<div class="p-3 h-12 flex items-center justify-between">
|
||||
<span>
|
||||
{{ t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.LABEL.LABEL') }}
|
||||
</span>
|
||||
<SingleSelect
|
||||
v-model="labelToApply"
|
||||
:options="labelOptions"
|
||||
:placeholder="
|
||||
$t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.LABEL.PLACEHOLDER')
|
||||
"
|
||||
placeholder-icon="i-lucide-chevron-down"
|
||||
placeholder-trailing-icon
|
||||
variant="faded"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</WithLabel>
|
||||
<div class="flex gap-2">
|
||||
<NextButton
|
||||
blue
|
||||
type="submit"
|
||||
:is-loading="isSubmitting"
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.UPDATE_BUTTON')"
|
||||
/>
|
||||
</div>
|
||||
</WithLabel>
|
||||
<div class="flex gap-2">
|
||||
<NextButton
|
||||
blue
|
||||
type="submit"
|
||||
:is-loading="isSubmitting"
|
||||
:label="t('GENERAL_SETTINGS.FORM.AUTO_RESOLVE.UPDATE_BUTTON')"
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
</SectionLayout>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,176 +0,0 @@
|
||||
<script setup>
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import EditAttribute from './EditAttribute.vue';
|
||||
import { useStoreGetters, useStore } from 'dashboard/composables/store';
|
||||
import { computed, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import Button from 'dashboard/components-next/button/Button.vue';
|
||||
|
||||
const props = defineProps({
|
||||
attributeModel: {
|
||||
type: String,
|
||||
default: 'conversation_attribute',
|
||||
},
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const showEditPopup = ref(false);
|
||||
const showDeletePopup = ref(false);
|
||||
const selectedAttribute = ref({});
|
||||
|
||||
const getters = useStoreGetters();
|
||||
const store = useStore();
|
||||
|
||||
const attributes = computed(() =>
|
||||
getters['attributes/getAttributesByModel'].value(props.attributeModel)
|
||||
);
|
||||
const uiFlags = computed(() => getters['attributes/getUIFlags'].value);
|
||||
|
||||
const attributeDisplayName = computed(
|
||||
() => selectedAttribute.value.attribute_display_name
|
||||
);
|
||||
const deleteConfirmText = computed(
|
||||
() =>
|
||||
`${t('ATTRIBUTES_MGMT.DELETE.CONFIRM.YES')} ${attributeDisplayName.value}`
|
||||
);
|
||||
const deleteRejectText = computed(() => t('ATTRIBUTES_MGMT.DELETE.CONFIRM.NO'));
|
||||
const confirmDeleteTitle = computed(() =>
|
||||
t('ATTRIBUTES_MGMT.DELETE.CONFIRM.TITLE', {
|
||||
attributeName: attributeDisplayName.value,
|
||||
})
|
||||
);
|
||||
const confirmPlaceHolderText = computed(
|
||||
() =>
|
||||
`${t('ATTRIBUTES_MGMT.DELETE.CONFIRM.PLACE_HOLDER', {
|
||||
attributeName: attributeDisplayName.value,
|
||||
})}`
|
||||
);
|
||||
|
||||
const deleteAttributes = async ({ id }) => {
|
||||
try {
|
||||
await store.dispatch('attributes/delete', id);
|
||||
useAlert(t('ATTRIBUTES_MGMT.DELETE.API.SUCCESS_MESSAGE'));
|
||||
} catch (error) {
|
||||
const errorMessage =
|
||||
error?.response?.message || t('ATTRIBUTES_MGMT.DELETE.API.ERROR_MESSAGE');
|
||||
useAlert(errorMessage);
|
||||
}
|
||||
};
|
||||
const openEditPopup = response => {
|
||||
showEditPopup.value = true;
|
||||
selectedAttribute.value = response;
|
||||
};
|
||||
const hideEditPopup = () => {
|
||||
showEditPopup.value = false;
|
||||
};
|
||||
|
||||
const closeDelete = () => {
|
||||
showDeletePopup.value = false;
|
||||
selectedAttribute.value = {};
|
||||
};
|
||||
const confirmDeletion = () => {
|
||||
deleteAttributes(selectedAttribute.value);
|
||||
closeDelete();
|
||||
};
|
||||
const openDelete = value => {
|
||||
showDeletePopup.value = true;
|
||||
selectedAttribute.value = value;
|
||||
};
|
||||
|
||||
const tableHeaders = computed(() => {
|
||||
return [
|
||||
t('ATTRIBUTES_MGMT.LIST.TABLE_HEADER.NAME'),
|
||||
t('ATTRIBUTES_MGMT.LIST.TABLE_HEADER.DESCRIPTION'),
|
||||
t('ATTRIBUTES_MGMT.LIST.TABLE_HEADER.TYPE'),
|
||||
t('ATTRIBUTES_MGMT.LIST.TABLE_HEADER.KEY'),
|
||||
];
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex flex-col">
|
||||
<table class="min-w-full overflow-x-auto">
|
||||
<thead>
|
||||
<th
|
||||
v-for="tableHeader in tableHeaders"
|
||||
:key="tableHeader"
|
||||
class="py-4 ltr:pr-4 rtl:pl-4 text-left font-semibold text-n-slate-11"
|
||||
>
|
||||
{{ tableHeader }}
|
||||
</th>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-n-weak flex-1 text-n-slate-12">
|
||||
<tr v-for="attribute in attributes" :key="attribute.attribute_key">
|
||||
<td
|
||||
class="py-4 ltr:pr-4 rtl:pl-4 overflow-hidden whitespace-nowrap text-ellipsis"
|
||||
>
|
||||
{{ attribute.attribute_display_name }}
|
||||
</td>
|
||||
<td class="py-4 ltr:pr-4 rtl:pl-4">
|
||||
{{ attribute.attribute_description }}
|
||||
</td>
|
||||
<td
|
||||
class="py-4 ltr:pr-4 rtl:pl-4 overflow-hidden whitespace-nowrap text-ellipsis"
|
||||
>
|
||||
{{
|
||||
$t(
|
||||
`ATTRIBUTES_MGMT.ATTRIBUTE_TYPES.${attribute.attribute_display_type?.toUpperCase()}`
|
||||
)
|
||||
}}
|
||||
</td>
|
||||
<td
|
||||
class="py-4 ltr:pr-4 rtl:pl-4 attribute-key overflow-hidden whitespace-nowrap text-ellipsis"
|
||||
>
|
||||
{{ attribute.attribute_key }}
|
||||
</td>
|
||||
<td class="py-4 min-w-xs">
|
||||
<div class="flex gap-1 justify-end">
|
||||
<Button
|
||||
v-tooltip.top="$t('ATTRIBUTES_MGMT.LIST.BUTTONS.EDIT')"
|
||||
icon="i-lucide-pen"
|
||||
slate
|
||||
xs
|
||||
faded
|
||||
@click="openEditPopup(attribute)"
|
||||
/>
|
||||
<Button
|
||||
v-tooltip.top="$t('ATTRIBUTES_MGMT.LIST.BUTTONS.DELETE')"
|
||||
icon="i-lucide-trash-2"
|
||||
xs
|
||||
ruby
|
||||
faded
|
||||
@click="openDelete(attribute)"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<woot-modal v-model:show="showEditPopup" :on-close="hideEditPopup">
|
||||
<EditAttribute
|
||||
:selected-attribute="selectedAttribute"
|
||||
:is-updating="uiFlags.isUpdating"
|
||||
@on-close="hideEditPopup"
|
||||
/>
|
||||
</woot-modal>
|
||||
<woot-confirm-delete-modal
|
||||
v-if="showDeletePopup"
|
||||
v-model:show="showDeletePopup"
|
||||
:title="confirmDeleteTitle"
|
||||
:message="$t('ATTRIBUTES_MGMT.DELETE.CONFIRM.MESSAGE')"
|
||||
:confirm-text="deleteConfirmText"
|
||||
:reject-text="deleteRejectText"
|
||||
:confirm-value="selectedAttribute.attribute_display_name"
|
||||
:confirm-place-holder-text="confirmPlaceHolderText"
|
||||
@on-confirm="confirmDeletion"
|
||||
@on-close="closeDelete"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.attribute-key {
|
||||
font-family: monospace;
|
||||
}
|
||||
</style>
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
import { frontendURL } from '../../../../helper/URLHelper';
|
||||
import SettingsWrapper from '../SettingsWrapper.vue';
|
||||
import ConversationWorkflowIndex from './index.vue';
|
||||
|
||||
export default {
|
||||
routes: [
|
||||
{
|
||||
path: frontendURL('accounts/:accountId/settings/conversation-workflow'),
|
||||
component: SettingsWrapper,
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'conversation_workflow_index',
|
||||
component: ConversationWorkflowIndex,
|
||||
meta: {
|
||||
permissions: ['administrator'],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
@@ -0,0 +1,48 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { useMapGetter } from 'dashboard/composables/store';
|
||||
import { useAccount } from 'dashboard/composables/useAccount';
|
||||
import { FEATURE_FLAGS } from '../../../../featureFlags';
|
||||
import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
|
||||
import SettingsLayout from '../SettingsLayout.vue';
|
||||
import ConversationRequiredAttributes from 'dashboard/components-next/ConversationWorkflow/ConversationRequiredAttributes.vue';
|
||||
import AutoResolve from 'dashboard/routes/dashboard/settings/account/components/AutoResolve.vue';
|
||||
|
||||
const { accountId } = useAccount();
|
||||
const isFeatureEnabledonAccount = useMapGetter(
|
||||
'accounts/isFeatureEnabledonAccount'
|
||||
);
|
||||
|
||||
const showAutoResolutionConfig = computed(() => {
|
||||
return isFeatureEnabledonAccount.value(
|
||||
accountId.value,
|
||||
FEATURE_FLAGS.AUTO_RESOLVE_CONVERSATIONS
|
||||
);
|
||||
});
|
||||
|
||||
const showRequiredAttributes = computed(() => {
|
||||
return isFeatureEnabledonAccount.value(
|
||||
accountId.value,
|
||||
FEATURE_FLAGS.CONVERSATION_REQUIRED_ATTRIBUTES
|
||||
);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<SettingsLayout :no-records-found="false" class="gap-10">
|
||||
<template #header>
|
||||
<BaseSettingsHeader
|
||||
:title="$t('CONVERSATION_WORKFLOW.INDEX.HEADER.TITLE')"
|
||||
:description="$t('CONVERSATION_WORKFLOW.INDEX.HEADER.DESCRIPTION')"
|
||||
feature-name="conversation-workflow"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #body>
|
||||
<div class="flex flex-col gap-6">
|
||||
<AutoResolve v-if="showAutoResolutionConfig" />
|
||||
<ConversationRequiredAttributes :is-enabled="showRequiredAttributes" />
|
||||
</div>
|
||||
</template>
|
||||
</SettingsLayout>
|
||||
</template>
|
||||
@@ -24,6 +24,7 @@ import teams from './teams/teams.routes';
|
||||
import customRoles from './customRoles/customRole.routes';
|
||||
import profile from './profile/profile.routes';
|
||||
import security from './security/security.routes';
|
||||
import conversationWorkflow from './conversationWorkflow/conversationWorkflow.routes';
|
||||
import captain from './captain/captain.routes';
|
||||
|
||||
export default {
|
||||
@@ -64,6 +65,7 @@ export default {
|
||||
...customRoles.routes,
|
||||
...profile.routes,
|
||||
...security.routes,
|
||||
...conversationWorkflow.routes,
|
||||
...captain.routes,
|
||||
],
|
||||
};
|
||||
|
||||
@@ -240,9 +240,21 @@ const actions = {
|
||||
|
||||
toggleStatus: async (
|
||||
{ commit },
|
||||
{ conversationId, status, snoozedUntil = null }
|
||||
{ conversationId, status, snoozedUntil = null, customAttributes = null }
|
||||
) => {
|
||||
try {
|
||||
// Update custom attributes first if provided
|
||||
if (customAttributes) {
|
||||
await ConversationApi.updateCustomAttributes({
|
||||
conversationId,
|
||||
customAttributes,
|
||||
});
|
||||
commit(types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES, {
|
||||
conversationId,
|
||||
customAttributes,
|
||||
});
|
||||
}
|
||||
|
||||
const {
|
||||
data: {
|
||||
payload: {
|
||||
@@ -459,7 +471,10 @@ const actions = {
|
||||
customAttributes,
|
||||
});
|
||||
const { custom_attributes } = response.data;
|
||||
commit(types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES, custom_attributes);
|
||||
commit(types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES, {
|
||||
conversationId,
|
||||
customAttributes: custom_attributes,
|
||||
});
|
||||
} catch (error) {
|
||||
// Handle error
|
||||
}
|
||||
|
||||
@@ -121,9 +121,19 @@ export const mutations = {
|
||||
chat.priority = priority;
|
||||
},
|
||||
|
||||
[types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES](_state, custom_attributes) {
|
||||
const [chat] = getSelectedChatConversation(_state);
|
||||
chat.custom_attributes = custom_attributes;
|
||||
[types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES](
|
||||
_state,
|
||||
{ conversationId, customAttributes }
|
||||
) {
|
||||
const conversation = _state.allConversations.find(
|
||||
c => c.id === conversationId
|
||||
);
|
||||
if (conversation) {
|
||||
conversation.custom_attributes = {
|
||||
...conversation.custom_attributes,
|
||||
...customAttributes,
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
[types.CHANGE_CONVERSATION_STATUS](
|
||||
|
||||
@@ -548,7 +548,13 @@ describe('#deleteMessage', () => {
|
||||
}
|
||||
);
|
||||
expect(commit.mock.calls).toEqual([
|
||||
[types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES, { order_d: '1001' }],
|
||||
[
|
||||
types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES,
|
||||
{
|
||||
conversationId: 1,
|
||||
customAttributes: { order_d: '1001' },
|
||||
},
|
||||
],
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -239,14 +239,14 @@ describe('#mutations', () => {
|
||||
describe('#UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES', () => {
|
||||
it('update conversation custom attributes', () => {
|
||||
const custom_attributes = { order_id: 1001 };
|
||||
const state = { allConversations: [{ id: 1 }], selectedChatId: 1 };
|
||||
const state = { allConversations: [{ id: 1, custom_attributes: {} }] };
|
||||
mutations[types.UPDATE_CONVERSATION_CUSTOM_ATTRIBUTES](state, {
|
||||
conversationId: 1,
|
||||
custom_attributes,
|
||||
customAttributes: custom_attributes,
|
||||
});
|
||||
expect(
|
||||
state.allConversations[0].custom_attributes.custom_attributes
|
||||
).toEqual(custom_attributes);
|
||||
expect(state.allConversations[0].custom_attributes).toEqual(
|
||||
custom_attributes
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -4,7 +4,10 @@ import {
|
||||
clearLocalStorageOnLogout,
|
||||
} from 'dashboard/store/utils/api';
|
||||
import wootAPI from './apiClient';
|
||||
import { getLoginRedirectURL } from '../helpers/AuthHelper';
|
||||
import {
|
||||
getLoginRedirectURL,
|
||||
getCredentialsFromEmail,
|
||||
} from '../helpers/AuthHelper';
|
||||
|
||||
export const login = async ({
|
||||
ssoAccountId,
|
||||
@@ -46,9 +49,10 @@ export const login = async ({
|
||||
|
||||
export const register = async creds => {
|
||||
try {
|
||||
const { fullName, accountName } = getCredentialsFromEmail(creds.email);
|
||||
const response = await wootAPI.post('api/v1/accounts.json', {
|
||||
account_name: creds.accountName.trim(),
|
||||
user_full_name: creds.fullName.trim(),
|
||||
account_name: accountName,
|
||||
user_full_name: fullName,
|
||||
email: creds.email,
|
||||
password: creds.password,
|
||||
h_captcha_client_response: creds.hCaptchaClientResponse,
|
||||
|
||||
@@ -22,6 +22,21 @@ const getSSOAccountPath = ({ ssoAccountId, user }) => {
|
||||
return accountPath;
|
||||
};
|
||||
|
||||
const capitalize = str =>
|
||||
str
|
||||
.split(/[._-]+/)
|
||||
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
|
||||
.join(' ');
|
||||
|
||||
export const getCredentialsFromEmail = email => {
|
||||
const [localPart, domain] = email.split('@');
|
||||
const namePart = localPart.split('+')[0];
|
||||
return {
|
||||
fullName: capitalize(namePart),
|
||||
accountName: capitalize(domain.split('.')[0]),
|
||||
};
|
||||
};
|
||||
|
||||
export const getLoginRedirectURL = ({
|
||||
ssoAccountId,
|
||||
ssoConversationId,
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { getLoginRedirectURL } from '../AuthHelper';
|
||||
import { getLoginRedirectURL, getCredentialsFromEmail } from '../AuthHelper';
|
||||
|
||||
describe('#URL Helpers', () => {
|
||||
describe('getLoginRedirectURL', () => {
|
||||
@@ -40,4 +40,41 @@ describe('#URL Helpers', () => {
|
||||
expect(getLoginRedirectURL('7500', null)).toBe('/app/');
|
||||
});
|
||||
});
|
||||
|
||||
describe('getCredentialsFromEmail', () => {
|
||||
it('should capitalize fullName and accountName from a standard email', () => {
|
||||
expect(getCredentialsFromEmail('john@company.com')).toEqual({
|
||||
fullName: 'John',
|
||||
accountName: 'Company',
|
||||
});
|
||||
});
|
||||
|
||||
it('should handle subdomains by using the first part of the domain', () => {
|
||||
expect(getCredentialsFromEmail('jane@mail.example.org')).toEqual({
|
||||
fullName: 'Jane',
|
||||
accountName: 'Mail',
|
||||
});
|
||||
});
|
||||
|
||||
it('should split by dots and capitalize each word', () => {
|
||||
expect(getCredentialsFromEmail('john.doe@acme.co')).toEqual({
|
||||
fullName: 'John Doe',
|
||||
accountName: 'Acme',
|
||||
});
|
||||
});
|
||||
|
||||
it('should omit everything after + in the local part', () => {
|
||||
expect(getCredentialsFromEmail('user+tag@startup.io')).toEqual({
|
||||
fullName: 'User',
|
||||
accountName: 'Startup',
|
||||
});
|
||||
});
|
||||
|
||||
it('should split by underscores and hyphens', () => {
|
||||
expect(getCredentialsFromEmail('first_last@my-company.com')).toEqual({
|
||||
fullName: 'First Last',
|
||||
accountName: 'My Company',
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,83 +1,84 @@
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { useBranding } from 'shared/composables/useBranding';
|
||||
<script setup>
|
||||
import { ref, computed, onBeforeMount } from 'vue';
|
||||
import { useStore } from 'vuex';
|
||||
import SignupForm from './components/Signup/Form.vue';
|
||||
import Testimonials from './components/Testimonials/Index.vue';
|
||||
import Spinner from 'shared/components/Spinner.vue';
|
||||
import signupBg from 'assets/images/auth/signup-bg.jpg';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SignupForm,
|
||||
Spinner,
|
||||
Testimonials,
|
||||
},
|
||||
setup() {
|
||||
const { replaceInstallationName } = useBranding();
|
||||
return { replaceInstallationName };
|
||||
},
|
||||
data() {
|
||||
return { isLoading: false };
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({ globalConfig: 'globalConfig/get' }),
|
||||
isAChatwootInstance() {
|
||||
return this.globalConfig.installationName === 'Chatwoot';
|
||||
},
|
||||
},
|
||||
beforeMount() {
|
||||
this.isLoading = this.isAChatwootInstance;
|
||||
},
|
||||
methods: {
|
||||
resizeContainers() {
|
||||
this.isLoading = false;
|
||||
},
|
||||
},
|
||||
const store = useStore();
|
||||
|
||||
const isLoading = ref(false);
|
||||
const globalConfig = computed(() => store.getters['globalConfig/get']);
|
||||
const isAChatwootInstance = computed(
|
||||
() => globalConfig.value.installationName === 'Chatwoot'
|
||||
);
|
||||
|
||||
onBeforeMount(() => {
|
||||
isLoading.value = isAChatwootInstance.value;
|
||||
});
|
||||
|
||||
const resizeContainers = () => {
|
||||
isLoading.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="w-full h-full bg-n-background">
|
||||
<div v-show="!isLoading" class="flex h-full min-h-screen items-center">
|
||||
<div
|
||||
class="flex-1 min-h-[640px] inline-flex items-center h-full justify-center overflow-auto py-6"
|
||||
>
|
||||
<div class="px-8 max-w-[560px] w-full overflow-auto">
|
||||
<div class="mb-4">
|
||||
<div
|
||||
class="relative w-full h-full min-h-screen flex items-center justify-center bg-cover bg-center bg-no-repeat p-4"
|
||||
:style="{ backgroundImage: `url(${signupBg})` }"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 bg-n-gray-12/60 dark:bg-n-gray-1/80 backdrop-blur-sm"
|
||||
/>
|
||||
<div
|
||||
v-show="!isLoading"
|
||||
class="relative flex max-w-[960px] bg-white dark:bg-n-solid-2 rounded-lg outline outline-1 outline-n-container shadow-sm"
|
||||
:class="{ 'w-auto xl:w-full': isAChatwootInstance }"
|
||||
>
|
||||
<div class="flex-1 flex items-center justify-center py-10 px-10">
|
||||
<div class="max-w-[420px] w-full">
|
||||
<div class="mb-6">
|
||||
<img
|
||||
:src="globalConfig.logo"
|
||||
:alt="globalConfig.installationName"
|
||||
class="block w-auto h-8 dark:hidden"
|
||||
class="block w-auto h-7 dark:hidden"
|
||||
/>
|
||||
<img
|
||||
v-if="globalConfig.logoDark"
|
||||
:src="globalConfig.logoDark"
|
||||
:alt="globalConfig.installationName"
|
||||
class="hidden w-auto h-8 dark:block"
|
||||
class="hidden w-auto h-7 dark:block"
|
||||
/>
|
||||
<h2
|
||||
class="mt-6 text-3xl font-medium text-left mb-7 text-n-slate-12"
|
||||
>
|
||||
{{ $t('REGISTER.TRY_WOOT') }}
|
||||
<h2 class="mt-6 text-2xl font-semibold text-n-slate-12">
|
||||
{{
|
||||
isAChatwootInstance
|
||||
? $t('REGISTER.GET_STARTED')
|
||||
: $t('REGISTER.TRY_WOOT')
|
||||
}}
|
||||
</h2>
|
||||
<p class="mt-2 text-sm text-n-slate-11">
|
||||
{{ $t('REGISTER.HAVE_AN_ACCOUNT') }}{{ ' '
|
||||
}}<router-link
|
||||
class="text-n-blue-10 font-medium hover:text-n-blue-11"
|
||||
to="/app/login"
|
||||
>
|
||||
{{ $t('LOGIN.SUBMIT') }}
|
||||
</router-link>
|
||||
</p>
|
||||
</div>
|
||||
<SignupForm />
|
||||
<div class="px-1 text-sm text-n-slate-12">
|
||||
<span>{{ $t('REGISTER.HAVE_AN_ACCOUNT') }} </span>
|
||||
<router-link class="text-link text-n-brand" to="/app/login">
|
||||
{{ replaceInstallationName($t('LOGIN.TITLE')) }}
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Testimonials
|
||||
v-if="isAChatwootInstance"
|
||||
class="flex-1"
|
||||
class="flex-1 hidden xl:flex"
|
||||
@resize-containers="resizeContainers"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
v-show="isLoading"
|
||||
class="flex items-center min-h-screen justify-center w-full h-full"
|
||||
class="relative flex items-center justify-center w-full h-full"
|
||||
>
|
||||
<Spinner color-scheme="primary" size="" />
|
||||
</div>
|
||||
|
||||
@@ -1,224 +1,121 @@
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, computed, reactive } from 'vue';
|
||||
import { useVuelidate } from '@vuelidate/core';
|
||||
import { required, minLength, email, sameAs } from '@vuelidate/validators';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { required, minLength, email } from '@vuelidate/validators';
|
||||
import { useStore } from 'vuex';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import { DEFAULT_REDIRECT_URL } from 'dashboard/constants/globals';
|
||||
import VueHcaptcha from '@hcaptcha/vue3-hcaptcha';
|
||||
import SimpleDivider from '../../../../../components/Divider/SimpleDivider.vue';
|
||||
import FormInput from '../../../../../components/Form/Input.vue';
|
||||
import NextButton from 'dashboard/components-next/button/Button.vue';
|
||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
||||
import PasswordRequirements from './PasswordRequirements.vue';
|
||||
import { isValidPassword } from 'shared/helpers/Validators';
|
||||
import GoogleOAuthButton from '../../../../../components/GoogleOauth/Button.vue';
|
||||
import { register } from '../../../../../api/auth';
|
||||
import * as CompanyEmailValidator from 'company-email-validator';
|
||||
|
||||
const MIN_PASSWORD_LENGTH = 6;
|
||||
const SPECIAL_CHAR_REGEX = /[!@#$%^&*()_+\-=[\]{}|'"/\\.,`<>:;?~]/;
|
||||
|
||||
export default {
|
||||
components: {
|
||||
FormInput,
|
||||
GoogleOAuthButton,
|
||||
NextButton,
|
||||
SimpleDivider,
|
||||
Icon,
|
||||
VueHcaptcha,
|
||||
},
|
||||
setup() {
|
||||
return { v$: useVuelidate() };
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
credentials: {
|
||||
accountName: '',
|
||||
fullName: '',
|
||||
email: '',
|
||||
password: '',
|
||||
confirmPassword: '',
|
||||
hCaptchaClientResponse: '',
|
||||
const store = useStore();
|
||||
const { t } = useI18n();
|
||||
|
||||
const hCaptcha = ref(null);
|
||||
const isPasswordFocused = ref(false);
|
||||
const isSignupInProgress = ref(false);
|
||||
|
||||
const credentials = reactive({
|
||||
email: '',
|
||||
password: '',
|
||||
hCaptchaClientResponse: '',
|
||||
});
|
||||
|
||||
const rules = {
|
||||
credentials: {
|
||||
email: {
|
||||
required,
|
||||
email,
|
||||
businessEmailValidator(value) {
|
||||
return CompanyEmailValidator.isCompanyEmail(value);
|
||||
},
|
||||
didCaptchaReset: false,
|
||||
isSignupInProgress: false,
|
||||
error: '',
|
||||
};
|
||||
},
|
||||
validations() {
|
||||
return {
|
||||
credentials: {
|
||||
accountName: {
|
||||
required,
|
||||
minLength: minLength(2),
|
||||
},
|
||||
fullName: {
|
||||
required,
|
||||
minLength: minLength(2),
|
||||
},
|
||||
email: {
|
||||
required,
|
||||
email,
|
||||
businessEmailValidator(value) {
|
||||
return CompanyEmailValidator.isCompanyEmail(value);
|
||||
},
|
||||
},
|
||||
password: {
|
||||
required,
|
||||
isValidPassword,
|
||||
minLength: minLength(MIN_PASSWORD_LENGTH),
|
||||
},
|
||||
confirmPassword: {
|
||||
required,
|
||||
minLength: minLength(MIN_PASSWORD_LENGTH),
|
||||
sameAsPassword: sameAs(this.credentials.password),
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({ globalConfig: 'globalConfig/get' }),
|
||||
termsLink() {
|
||||
return this.$t('REGISTER.TERMS_ACCEPT')
|
||||
.replace('https://www.chatwoot.com/terms', this.globalConfig.termsURL)
|
||||
.replace(
|
||||
'https://www.chatwoot.com/privacy-policy',
|
||||
this.globalConfig.privacyURL
|
||||
);
|
||||
},
|
||||
hasAValidCaptcha() {
|
||||
if (this.globalConfig.hCaptchaSiteKey) {
|
||||
return !!this.credentials.hCaptchaClientResponse;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
confirmPasswordErrorText() {
|
||||
const { confirmPassword } = this.v$.credentials;
|
||||
if (!confirmPassword.$error) return '';
|
||||
if (confirmPassword.sameAsPassword.$invalid) {
|
||||
return this.$t('REGISTER.CONFIRM_PASSWORD.ERROR');
|
||||
}
|
||||
return '';
|
||||
},
|
||||
allowedLoginMethods() {
|
||||
return window.chatwootConfig.allowedLoginMethods || ['email'];
|
||||
},
|
||||
showGoogleOAuth() {
|
||||
return (
|
||||
this.allowedLoginMethods.includes('google_oauth') &&
|
||||
Boolean(window.chatwootConfig.googleOAuthClientId)
|
||||
);
|
||||
},
|
||||
isFormValid() {
|
||||
return !this.v$.$invalid && this.hasAValidCaptcha;
|
||||
},
|
||||
passwordRequirements() {
|
||||
const password = this.credentials.password || '';
|
||||
return {
|
||||
length: password.length >= MIN_PASSWORD_LENGTH,
|
||||
uppercase: /[A-Z]/.test(password),
|
||||
lowercase: /[a-z]/.test(password),
|
||||
number: /[0-9]/.test(password),
|
||||
special: SPECIAL_CHAR_REGEX.test(password),
|
||||
};
|
||||
},
|
||||
passwordRequirementItems() {
|
||||
const reqs = this.passwordRequirements;
|
||||
return [
|
||||
{
|
||||
id: 'length',
|
||||
met: reqs.length,
|
||||
label: this.$t('REGISTER.PASSWORD.REQUIREMENTS_LENGTH', {
|
||||
min: MIN_PASSWORD_LENGTH,
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: 'uppercase',
|
||||
met: reqs.uppercase,
|
||||
label: this.$t('REGISTER.PASSWORD.REQUIREMENTS_UPPERCASE'),
|
||||
},
|
||||
{
|
||||
id: 'lowercase',
|
||||
met: reqs.lowercase,
|
||||
label: this.$t('REGISTER.PASSWORD.REQUIREMENTS_LOWERCASE'),
|
||||
},
|
||||
{
|
||||
id: 'number',
|
||||
met: reqs.number,
|
||||
label: this.$t('REGISTER.PASSWORD.REQUIREMENTS_NUMBER'),
|
||||
},
|
||||
{
|
||||
id: 'special',
|
||||
met: reqs.special,
|
||||
label: this.$t('REGISTER.PASSWORD.REQUIREMENTS_SPECIAL'),
|
||||
},
|
||||
];
|
||||
},
|
||||
passwordRequirementsMet() {
|
||||
return Object.values(this.passwordRequirements).every(Boolean);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async submit() {
|
||||
this.v$.$touch();
|
||||
if (this.v$.$invalid) {
|
||||
this.resetCaptcha();
|
||||
return;
|
||||
}
|
||||
this.isSignupInProgress = true;
|
||||
try {
|
||||
await register(this.credentials);
|
||||
window.location = DEFAULT_REDIRECT_URL;
|
||||
} catch (error) {
|
||||
let errorMessage =
|
||||
error?.message || this.$t('REGISTER.API.ERROR_MESSAGE');
|
||||
this.resetCaptcha();
|
||||
useAlert(errorMessage);
|
||||
} finally {
|
||||
this.isSignupInProgress = false;
|
||||
}
|
||||
},
|
||||
onRecaptchaVerified(token) {
|
||||
this.credentials.hCaptchaClientResponse = token;
|
||||
this.didCaptchaReset = false;
|
||||
this.v$.$touch();
|
||||
},
|
||||
resetCaptcha() {
|
||||
if (!this.globalConfig.hCaptchaSiteKey) return;
|
||||
this.$refs.hCaptcha.reset();
|
||||
this.credentials.hCaptchaClientResponse = '';
|
||||
this.didCaptchaReset = true;
|
||||
password: {
|
||||
required,
|
||||
isValidPassword,
|
||||
minLength: minLength(MIN_PASSWORD_LENGTH),
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const v$ = useVuelidate(rules, { credentials });
|
||||
|
||||
const globalConfig = computed(() => store.getters['globalConfig/get']);
|
||||
|
||||
const termsLink = computed(() =>
|
||||
t('REGISTER.TERMS_ACCEPT')
|
||||
.replace('https://www.chatwoot.com/terms', globalConfig.value.termsURL)
|
||||
.replace(
|
||||
'https://www.chatwoot.com/privacy-policy',
|
||||
globalConfig.value.privacyURL
|
||||
)
|
||||
);
|
||||
|
||||
const allowedLoginMethods = computed(
|
||||
() => window.chatwootConfig.allowedLoginMethods || ['email']
|
||||
);
|
||||
|
||||
const showGoogleOAuth = computed(
|
||||
() =>
|
||||
allowedLoginMethods.value.includes('google_oauth') &&
|
||||
Boolean(window.chatwootConfig.googleOAuthClientId)
|
||||
);
|
||||
|
||||
const isFormValid = computed(() => !v$.value.$invalid);
|
||||
|
||||
const performRegistration = async () => {
|
||||
isSignupInProgress.value = true;
|
||||
try {
|
||||
await register(credentials);
|
||||
window.location = DEFAULT_REDIRECT_URL;
|
||||
} catch (error) {
|
||||
const errorMessage = error?.message || t('REGISTER.API.ERROR_MESSAGE');
|
||||
if (globalConfig.value.hCaptchaSiteKey) {
|
||||
hCaptcha.value.reset();
|
||||
credentials.hCaptchaClientResponse = '';
|
||||
}
|
||||
useAlert(errorMessage);
|
||||
} finally {
|
||||
isSignupInProgress.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const submit = () => {
|
||||
if (isSignupInProgress.value) return;
|
||||
v$.value.$touch();
|
||||
if (v$.value.$invalid) return;
|
||||
isSignupInProgress.value = true;
|
||||
if (globalConfig.value.hCaptchaSiteKey) {
|
||||
hCaptcha.value.execute();
|
||||
} else {
|
||||
performRegistration();
|
||||
}
|
||||
};
|
||||
|
||||
const onRecaptchaVerified = token => {
|
||||
credentials.hCaptchaClientResponse = token;
|
||||
performRegistration();
|
||||
};
|
||||
|
||||
const onCaptchaError = () => {
|
||||
isSignupInProgress.value = false;
|
||||
credentials.hCaptchaClientResponse = '';
|
||||
hCaptcha.value.reset();
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex-1 px-1 overflow-auto">
|
||||
<div class="flex-1">
|
||||
<form class="space-y-3" @submit.prevent="submit">
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<FormInput
|
||||
v-model="credentials.fullName"
|
||||
name="full_name"
|
||||
class="flex-1"
|
||||
:class="{ error: v$.credentials.fullName.$error }"
|
||||
:label="$t('REGISTER.FULL_NAME.LABEL')"
|
||||
:placeholder="$t('REGISTER.FULL_NAME.PLACEHOLDER')"
|
||||
:has-error="v$.credentials.fullName.$error"
|
||||
:error-message="$t('REGISTER.FULL_NAME.ERROR')"
|
||||
@blur="v$.credentials.fullName.$touch"
|
||||
/>
|
||||
<FormInput
|
||||
v-model="credentials.accountName"
|
||||
name="account_name"
|
||||
class="flex-1"
|
||||
:class="{ error: v$.credentials.accountName.$error }"
|
||||
:label="$t('REGISTER.COMPANY_NAME.LABEL')"
|
||||
:placeholder="$t('REGISTER.COMPANY_NAME.PLACEHOLDER')"
|
||||
:has-error="v$.credentials.accountName.$error"
|
||||
:error-message="$t('REGISTER.COMPANY_NAME.ERROR')"
|
||||
@blur="v$.credentials.accountName.$touch"
|
||||
/>
|
||||
</div>
|
||||
<FormInput
|
||||
v-model="credentials.email"
|
||||
type="email"
|
||||
@@ -230,100 +127,62 @@ export default {
|
||||
:error-message="$t('REGISTER.EMAIL.ERROR')"
|
||||
@blur="v$.credentials.email.$touch"
|
||||
/>
|
||||
<FormInput
|
||||
v-model="credentials.password"
|
||||
type="password"
|
||||
name="password"
|
||||
:class="{ error: v$.credentials.password.$error }"
|
||||
:label="$t('LOGIN.PASSWORD.LABEL')"
|
||||
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
|
||||
:has-error="v$.credentials.password.$error"
|
||||
aria-describedby="password-requirements"
|
||||
@blur="v$.credentials.password.$touch"
|
||||
/>
|
||||
<div
|
||||
id="password-requirements"
|
||||
class="text-xs rounded-md px-4 py-3 outline outline-1 outline-n-weak bg-n-alpha-black2"
|
||||
>
|
||||
<ul role="list" class="grid grid-cols-2 gap-1">
|
||||
<li
|
||||
v-for="item in passwordRequirementItems"
|
||||
:key="item.id"
|
||||
class="inline-flex gap-1 items-start"
|
||||
>
|
||||
<Icon
|
||||
class="flex-none flex-shrink-0 w-3 mt-0.5"
|
||||
:icon="item.met ? 'i-lucide-circle-check-big' : 'i-lucide-circle'"
|
||||
:class="item.met ? 'text-n-teal-10' : 'text-n-slate-10'"
|
||||
/>
|
||||
|
||||
<span :class="item.met ? 'text-n-slate-11' : 'text-n-slate-10'">
|
||||
{{ item.label }}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<FormInput
|
||||
v-model="credentials.confirmPassword"
|
||||
type="password"
|
||||
name="confirm_password"
|
||||
:class="{ error: v$.credentials.confirmPassword.$error }"
|
||||
:label="$t('REGISTER.CONFIRM_PASSWORD.LABEL')"
|
||||
:placeholder="$t('REGISTER.CONFIRM_PASSWORD.PLACEHOLDER')"
|
||||
:has-error="v$.credentials.confirmPassword.$error"
|
||||
:error-message="confirmPasswordErrorText"
|
||||
@blur="v$.credentials.confirmPassword.$touch"
|
||||
/>
|
||||
<div v-if="globalConfig.hCaptchaSiteKey" class="mb-3">
|
||||
<VueHcaptcha
|
||||
ref="hCaptcha"
|
||||
:class="{ error: !hasAValidCaptcha && didCaptchaReset }"
|
||||
:sitekey="globalConfig.hCaptchaSiteKey"
|
||||
@verify="onRecaptchaVerified"
|
||||
<div class="relative">
|
||||
<FormInput
|
||||
v-model="credentials.password"
|
||||
type="password"
|
||||
name="password"
|
||||
:class="{ error: v$.credentials.password.$error }"
|
||||
:label="$t('LOGIN.PASSWORD.LABEL')"
|
||||
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
|
||||
:has-error="v$.credentials.password.$error"
|
||||
@focus="isPasswordFocused = true"
|
||||
@blur="
|
||||
isPasswordFocused = false;
|
||||
v$.credentials.password.$touch();
|
||||
"
|
||||
/>
|
||||
<span
|
||||
v-if="!hasAValidCaptcha && didCaptchaReset"
|
||||
class="text-xs text-n-ruby-9"
|
||||
<Transition
|
||||
enter-active-class="transition duration-200 ease-out origin-left"
|
||||
enter-from-class="opacity-0 scale-90 translate-x-1"
|
||||
enter-to-class="opacity-100 scale-100 translate-x-0"
|
||||
leave-active-class="transition duration-150 ease-in origin-left"
|
||||
leave-from-class="opacity-100 scale-100 translate-x-0"
|
||||
leave-to-class="opacity-0 scale-90 translate-x-1"
|
||||
>
|
||||
{{ $t('SET_NEW_PASSWORD.CAPTCHA.ERROR') }}
|
||||
</span>
|
||||
<PasswordRequirements
|
||||
v-if="isPasswordFocused"
|
||||
:password="credentials.password"
|
||||
/>
|
||||
</Transition>
|
||||
</div>
|
||||
<VueHcaptcha
|
||||
v-if="globalConfig.hCaptchaSiteKey"
|
||||
ref="hCaptcha"
|
||||
size="invisible"
|
||||
:sitekey="globalConfig.hCaptchaSiteKey"
|
||||
@verify="onRecaptchaVerified"
|
||||
@error="onCaptchaError"
|
||||
@expired="onCaptchaError"
|
||||
@challenge-expired="onCaptchaError"
|
||||
@closed="onCaptchaError"
|
||||
/>
|
||||
<NextButton
|
||||
lg
|
||||
type="submit"
|
||||
data-testid="submit_button"
|
||||
class="w-full"
|
||||
icon="i-lucide-chevron-right"
|
||||
trailing-icon
|
||||
class="w-full font-medium"
|
||||
:label="$t('REGISTER.SUBMIT')"
|
||||
:disabled="isSignupInProgress || !isFormValid"
|
||||
:is-loading="isSignupInProgress"
|
||||
/>
|
||||
</form>
|
||||
<div class="flex flex-col">
|
||||
<SimpleDivider
|
||||
v-if="showGoogleOAuth"
|
||||
:label="$t('COMMON.OR')"
|
||||
bg="bg-n-background"
|
||||
class="uppercase"
|
||||
/>
|
||||
<GoogleOAuthButton v-if="showGoogleOAuth">
|
||||
{{ $t('REGISTER.OAUTH.GOOGLE_SIGNUP') }}
|
||||
</GoogleOAuthButton>
|
||||
</div>
|
||||
<GoogleOAuthButton v-if="showGoogleOAuth" class="mt-3">
|
||||
{{ $t('REGISTER.OAUTH.GOOGLE_SIGNUP') }}
|
||||
</GoogleOAuthButton>
|
||||
<p
|
||||
class="text-sm mb-1 mt-5 text-n-slate-12 [&>a]:text-n-brand [&>a]:font-medium [&>a]:hover:brightness-110"
|
||||
class="text-sm mt-5 mb-0 text-n-slate-11 [&>a]:text-n-blue-10 [&>a]:font-medium [&>a]:hover:text-n-blue-11"
|
||||
v-html="termsLink"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.h-captcha--box {
|
||||
&::v-deep .error {
|
||||
iframe {
|
||||
@apply rounded-md border border-n-ruby-8 dark:border-n-ruby-8;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,69 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
||||
|
||||
const props = defineProps({
|
||||
password: { type: String, default: '' },
|
||||
});
|
||||
const MIN_PASSWORD_LENGTH = 6;
|
||||
const SPECIAL_CHAR_REGEX = /[!@#$%^&*()_+\-=[\]{}|'"/\\.,`<>:;?~]/;
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const requirements = computed(() => {
|
||||
const password = props.password || '';
|
||||
return [
|
||||
{
|
||||
id: 'length',
|
||||
met: password.length >= MIN_PASSWORD_LENGTH,
|
||||
label: t('REGISTER.PASSWORD.REQUIREMENTS_LENGTH', {
|
||||
min: MIN_PASSWORD_LENGTH,
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: 'uppercase',
|
||||
met: /[A-Z]/.test(password),
|
||||
label: t('REGISTER.PASSWORD.REQUIREMENTS_UPPERCASE'),
|
||||
},
|
||||
{
|
||||
id: 'lowercase',
|
||||
met: /[a-z]/.test(password),
|
||||
label: t('REGISTER.PASSWORD.REQUIREMENTS_LOWERCASE'),
|
||||
},
|
||||
{
|
||||
id: 'number',
|
||||
met: /[0-9]/.test(password),
|
||||
label: t('REGISTER.PASSWORD.REQUIREMENTS_NUMBER'),
|
||||
},
|
||||
{
|
||||
id: 'special',
|
||||
met: SPECIAL_CHAR_REGEX.test(password),
|
||||
label: t('REGISTER.PASSWORD.REQUIREMENTS_SPECIAL'),
|
||||
},
|
||||
];
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="absolute top-0 z-50 w-64 text-xs rounded-lg px-4 py-3 bg-white dark:bg-n-solid-3 shadow-lg outline outline-1 outline-n-weak start-full ms-4"
|
||||
>
|
||||
<ul role="list" class="space-y-1.5">
|
||||
<li
|
||||
v-for="item in requirements"
|
||||
:key="item.id"
|
||||
class="inline-flex gap-1.5 items-start"
|
||||
>
|
||||
<Icon
|
||||
class="flex-none flex-shrink-0 w-3 mt-0.5"
|
||||
:icon="item.met ? 'i-lucide-circle-check-big' : 'i-lucide-circle'"
|
||||
:class="item.met ? 'text-n-teal-10' : 'text-n-slate-10'"
|
||||
/>
|
||||
<span :class="item.met ? 'text-n-slate-11' : 'text-n-slate-10'">
|
||||
{{ item.label }}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,66 +1,48 @@
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, onBeforeMount } from 'vue';
|
||||
import TestimonialCard from './TestimonialCard.vue';
|
||||
import { getTestimonialContent } from '../../../../../api/testimonials';
|
||||
export default {
|
||||
components: { TestimonialCard },
|
||||
emits: ['resizeContainers'],
|
||||
data() {
|
||||
return { testimonials: [] };
|
||||
},
|
||||
beforeMount() {
|
||||
this.fetchTestimonials();
|
||||
},
|
||||
methods: {
|
||||
async fetchTestimonials() {
|
||||
try {
|
||||
const { data } = await getTestimonialContent();
|
||||
this.testimonials = data;
|
||||
} catch (error) {
|
||||
// Ignoring the error as the UI wouldn't break
|
||||
} finally {
|
||||
this.$emit('resizeContainers', !!this.testimonials.length);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
const emit = defineEmits(['resizeContainers']);
|
||||
|
||||
const testimonial = ref(null);
|
||||
|
||||
const fetchTestimonials = async () => {
|
||||
try {
|
||||
const { data } = await getTestimonialContent();
|
||||
if (data.length) {
|
||||
testimonial.value = data[Math.floor(Math.random() * data.length)];
|
||||
}
|
||||
} catch {
|
||||
// Ignoring the error as the UI wouldn't break
|
||||
} finally {
|
||||
emit('resizeContainers', !!testimonial.value);
|
||||
}
|
||||
};
|
||||
|
||||
onBeforeMount(() => {
|
||||
fetchTestimonials();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-show="testimonials.length"
|
||||
class="relative flex-1 min-h-screen hidden overflow-hidden bg-n-blue-8 dark:bg-n-blue-5 xl:flex"
|
||||
class="relative flex-1 flex flex-col items-start justify-center bg-n-alpha-black2 dark:bg-n-solid-3 px-12 py-14 rounded-e-lg"
|
||||
>
|
||||
<img
|
||||
src="assets/images/auth/top-left.svg"
|
||||
class="absolute top-0 left-0 w-40 h-40"
|
||||
<TestimonialCard
|
||||
v-if="testimonial"
|
||||
:review-content="testimonial.authorReview"
|
||||
:author-image="testimonial.authorImage"
|
||||
:author-name="testimonial.authorName"
|
||||
:author-designation="testimonial.authorCompany"
|
||||
/>
|
||||
<img
|
||||
src="assets/images/auth/bottom-right.svg"
|
||||
class="absolute bottom-0 right-0 w-40 h-40"
|
||||
/>
|
||||
<img
|
||||
src="assets/images/auth/auth--bg.svg"
|
||||
class="h-[96%] left-[6%] top-[8%] w-[96%] absolute"
|
||||
/>
|
||||
<div
|
||||
class="z-50 flex flex-col items-center justify-center w-full h-full min-h-screen"
|
||||
>
|
||||
<div class="flex items-start justify-center p-6">
|
||||
<TestimonialCard
|
||||
v-for="(testimonial, index) in testimonials"
|
||||
:key="testimonial.id"
|
||||
:review-content="testimonial.authorReview"
|
||||
:author-image="testimonial.authorImage"
|
||||
:author-name="testimonial.authorName"
|
||||
:author-designation="testimonial.authorCompany"
|
||||
:class="!index ? 'mt-[20%] -mr-4 z-50' : ''"
|
||||
/>
|
||||
</div>
|
||||
<div class="absolute bottom-8 right-8 grid grid-cols-3 gap-1.5">
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
<span class="w-2 h-2 rounded-full bg-n-gray-5" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.center--img {
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,40 +1,39 @@
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
reviewContent: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
authorImage: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
authorName: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
authorDesignation: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
};
|
||||
<script setup>
|
||||
defineProps({
|
||||
reviewContent: { type: String, default: '' },
|
||||
authorImage: { type: String, default: '' },
|
||||
authorName: { type: String, default: '' },
|
||||
authorDesignation: { type: String, default: '' },
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="flex flex-col items-start justify-center p-6 w-80 bg-n-background rounded-lg drop-shadow-md"
|
||||
>
|
||||
<p class="text-sm text-n-slate-12 tracking-normal">
|
||||
<div class="flex flex-col items-start">
|
||||
<svg
|
||||
class="w-10 h-10 text-n-slate-7 mb-6"
|
||||
viewBox="0 0 40 40"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M10.7 28.3c-1.4-1.2-2.1-3-2.1-5.4 0-2.3.8-4.6 2.4-6.8 1.6-2.2 3.8-3.9 6.6-5.1l1.2 2.1c-2.2 1.2-3.7 2.4-4.6 3.6-.9 1.2-1.3 2.5-1.2 3.8.3-.1.7-.2 1.2-.2 1.3 0 2.4.4 3.3 1.3.9.9 1.3 2 1.3 3.3 0 1.4-.5 2.5-1.4 3.4-.9.9-2.1 1.4-3.5 1.4-1.5 0-2.7-.5-3.2-1.4zm15 0c-1.4-1.2-2.1-3-2.1-5.4 0-2.3.8-4.6 2.4-6.8 1.6-2.2 3.8-3.9 6.6-5.1l1.2 2.1c-2.2 1.2-3.7 2.4-4.6 3.6-.9 1.2-1.3 2.5-1.2 3.8.3-.1.7-.2 1.2-.2 1.3 0 2.4.4 3.3 1.3.9.9 1.3 2 1.3 3.3 0 1.4-.5 2.5-1.4 3.4-.9.9-2.1 1.4-3.5 1.4-1.5 0-2.7-.5-3.2-1.4z"
|
||||
/>
|
||||
</svg>
|
||||
<p
|
||||
class="text-lg text-n-slate-12 leading-relaxed whitespace-pre-line tracking-tight"
|
||||
>
|
||||
{{ reviewContent }}
|
||||
</p>
|
||||
<div class="flex items-center mt-4 text-n-slate-12">
|
||||
<div class="bg-white rounded-full p-1">
|
||||
<img :src="authorImage" class="h-8 w-8 rounded-full" />
|
||||
</div>
|
||||
<div class="ml-2">
|
||||
<div class="text-sm font-medium">{{ authorName }}</div>
|
||||
<div class="text-xs">{{ authorDesignation }}</div>
|
||||
<div class="flex items-center mt-8">
|
||||
<img
|
||||
:src="authorImage"
|
||||
:alt="authorName"
|
||||
class="w-11 h-11 rounded-full object-cover"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<div class="text-base font-medium text-n-slate-12">
|
||||
{{ authorName }}
|
||||
</div>
|
||||
<div class="text-sm text-n-slate-10">{{ authorDesignation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -85,7 +85,7 @@ class Account < ApplicationRecord
|
||||
|
||||
store_accessor :settings, :auto_resolve_after, :auto_resolve_message, :auto_resolve_ignore_waiting
|
||||
|
||||
store_accessor :settings, :audio_transcriptions, :auto_resolve_label, :conversation_required_attributes
|
||||
store_accessor :settings, :audio_transcriptions, :auto_resolve_label
|
||||
store_accessor :settings, :captain_models, :captain_features
|
||||
|
||||
has_many :account_users, dependent: :destroy_async
|
||||
|
||||
@@ -167,6 +167,10 @@ class Conversation < ApplicationRecord
|
||||
agent_last_seen_at.present? ? messages.created_since(agent_last_seen_at) : messages
|
||||
end
|
||||
|
||||
def assignee_unread_messages
|
||||
assignee_last_seen_at.present? ? messages.created_since(assignee_last_seen_at) : messages
|
||||
end
|
||||
|
||||
def unread_incoming_messages
|
||||
unread_messages.where(account_id: account_id).incoming.last(10)
|
||||
end
|
||||
|
||||
@@ -45,7 +45,6 @@ class CustomAttributeDefinition < ApplicationRecord
|
||||
belongs_to :account
|
||||
after_update :update_widget_pre_chat_custom_fields
|
||||
after_destroy :sync_widget_pre_chat_custom_fields
|
||||
after_destroy :cleanup_conversation_required_attributes
|
||||
|
||||
private
|
||||
|
||||
@@ -57,13 +56,6 @@ class CustomAttributeDefinition < ApplicationRecord
|
||||
::Inboxes::UpdateWidgetPreChatCustomFieldsJob.perform_later(account, self)
|
||||
end
|
||||
|
||||
def cleanup_conversation_required_attributes
|
||||
return unless conversation_attribute? && account.conversation_required_attributes&.include?(attribute_key)
|
||||
|
||||
account.conversation_required_attributes = account.conversation_required_attributes - [attribute_key]
|
||||
account.save!
|
||||
end
|
||||
|
||||
def attribute_must_not_conflict
|
||||
model_keys = attribute_model.to_sym == :conversation_attribute ? :conversation : :contact
|
||||
return unless attribute_key.in?(STANDARD_ATTRIBUTES[model_keys])
|
||||
@@ -71,3 +63,5 @@ class CustomAttributeDefinition < ApplicationRecord
|
||||
errors.add(:attribute_key, I18n.t('errors.custom_attribute_definition.key_conflict'))
|
||||
end
|
||||
end
|
||||
|
||||
CustomAttributeDefinition.include_mod_with('Concerns::CustomAttributeDefinition')
|
||||
|
||||
@@ -51,7 +51,6 @@ class Messages::SearchDataPresenter < SimpleDelegator
|
||||
|
||||
def additional_attributes_data
|
||||
{
|
||||
campaign_id: additional_attributes&.dig('campaign_id'),
|
||||
automation_rule_id: content_attributes&.dig('automation_rule_id')
|
||||
}
|
||||
end
|
||||
|
||||
@@ -1,4 +1,9 @@
|
||||
class Messages::MarkdownRenderers::WhatsAppRenderer < Messages::MarkdownRenderers::BaseMarkdownRenderer
|
||||
def initialize
|
||||
super
|
||||
@list_item_number = 0
|
||||
end
|
||||
|
||||
def strong(_node)
|
||||
out('*', :children, '*')
|
||||
end
|
||||
@@ -15,13 +20,20 @@ class Messages::MarkdownRenderers::WhatsAppRenderer < Messages::MarkdownRenderer
|
||||
out(node.url)
|
||||
end
|
||||
|
||||
def list(_node)
|
||||
def list(node)
|
||||
@list_type = node.list_type
|
||||
@list_item_number = @list_type == :ordered_list ? node.list_start : 0
|
||||
out(:children)
|
||||
cr
|
||||
end
|
||||
|
||||
def list_item(_node)
|
||||
out('- ', :children)
|
||||
if @list_type == :ordered_list
|
||||
out("#{@list_item_number}. ", :children)
|
||||
@list_item_number += 1
|
||||
else
|
||||
out('- ', :children)
|
||||
end
|
||||
cr
|
||||
end
|
||||
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<sitemapindex>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
<% @portal.articles.where(status: :published).each do |article| %>
|
||||
<sitemap>
|
||||
<url>
|
||||
<loc><%= @help_center_url %><%= generate_article_link(@portal.slug, article.slug, false, false) %></loc>
|
||||
<lastmod><%= article.updated_at.strftime("%Y-%m-%d") %></lastmod>
|
||||
</sitemap>
|
||||
<lastmod><%= article.updated_at.to_date.iso8601 %></lastmod>
|
||||
</url>
|
||||
<% end %>
|
||||
</sitemapindex>
|
||||
</urlset>
|
||||
|
||||
@@ -237,3 +237,7 @@
|
||||
- name: captain_tasks
|
||||
display_name: Captain Tasks
|
||||
enabled: true
|
||||
- name: conversation_required_attributes
|
||||
display_name: Required Conversation Attributes
|
||||
enabled: false
|
||||
premium: true
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
module Enterprise::Api::V1::AccountsSettings
|
||||
private
|
||||
|
||||
def permitted_settings_attributes
|
||||
super + [{ conversation_required_attributes: [] }]
|
||||
end
|
||||
end
|
||||
@@ -2,6 +2,8 @@ module Enterprise::Concerns::Account
|
||||
extend ActiveSupport::Concern
|
||||
|
||||
included do
|
||||
store_accessor :settings, :conversation_required_attributes
|
||||
|
||||
has_many :sla_policies, dependent: :destroy_async
|
||||
has_many :applied_slas, dependent: :destroy_async
|
||||
has_many :custom_roles, dependent: :destroy_async
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
module Enterprise::Concerns::CustomAttributeDefinition
|
||||
extend ActiveSupport::Concern
|
||||
|
||||
included do
|
||||
after_destroy :cleanup_conversation_required_attributes
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def cleanup_conversation_required_attributes
|
||||
return unless conversation_attribute? && account.conversation_required_attributes&.include?(attribute_key)
|
||||
|
||||
account.conversation_required_attributes = account.conversation_required_attributes - [attribute_key]
|
||||
account.save!
|
||||
end
|
||||
end
|
||||
@@ -22,7 +22,7 @@ class Enterprise::Billing::HandleStripeEventService
|
||||
].freeze
|
||||
|
||||
# Additional features available starting with the Business plan
|
||||
BUSINESS_PLAN_FEATURES = %w[sla custom_roles csat_review_notes].freeze
|
||||
BUSINESS_PLAN_FEATURES = %w[sla custom_roles csat_review_notes conversation_required_attributes].freeze
|
||||
|
||||
# Additional features available only in the Enterprise plan
|
||||
ENTERPRISE_PLAN_FEATURES = %w[audit_logs disable_branding saml].freeze
|
||||
|
||||
@@ -6,3 +6,4 @@
|
||||
- custom_roles
|
||||
- captain_integration
|
||||
- csat_review_notes
|
||||
- conversation_required_attributes
|
||||
|
||||
@@ -10,8 +10,9 @@ Important guidelines:
|
||||
- Ensure the output remains appropriate for customer support
|
||||
|
||||
Super Important:
|
||||
- If the message has some markdown formatting, keep the formatting as it is.
|
||||
- If the message has some markdown formatting, keep the formatting as it is.
|
||||
- Block quotes (lines starting with >) contain quoted text from the customer's previous message. Preserve this quoted text exactly as written (do not modify the customer's words inside the block quote), but DO improve the agent's reply that follows the block quote.
|
||||
- Ensure the output is in the user's original language
|
||||
- If the message contains a signature block (text after a `--` line), preserve the signature exactly as written without any modification. Do not add a signature if one is not already present.
|
||||
|
||||
Output only the corrected message, with no preamble, tags, or explanation.
|
||||
|
||||
@@ -38,6 +38,7 @@ Do NOT use the context to fill in gaps or add information the agent didn't inclu
|
||||
- Keep the improved message at a similar length to the draft (brief stays brief)
|
||||
- Preserve any markdown formatting
|
||||
- Block quotes (lines starting with `>`) contain quoted customer text—keep this unchanged, only improve the agent's reply
|
||||
- If the message contains a signature block (text after a `--` line), preserve the signature exactly as written without any modification. Do not add a signature if one is not already present.
|
||||
- Output in the same language as the draft
|
||||
- Output only the improved message, no commentary
|
||||
|
||||
|
||||
@@ -28,8 +28,9 @@ Important guidelines:
|
||||
- Do not remove critical details or instructions
|
||||
|
||||
Super Important:
|
||||
- If the message has some markdown formatting, keep the formatting as it is.
|
||||
- If the message has some markdown formatting, keep the formatting as it is.
|
||||
- Block quotes (lines starting with >) contain quoted text from the customer's previous message. Preserve this quoted text exactly as written (do not modify the customer's words inside the block quote), but DO improve the agent's reply that follows the block quote.
|
||||
- Ensure the output is in the user's original language
|
||||
- If the message contains a signature block (text after a `--` line), preserve the signature exactly as written without any modification. Do not add a signature if one is not already present.
|
||||
|
||||
Output only the rewritten message without any preamble, tags or explanation.
|
||||
|
||||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 8.2 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 8.2 KiB |
@@ -357,18 +357,6 @@ RSpec.describe 'Contacts API', type: :request do
|
||||
expect(response.body).not_to include(contact1.email)
|
||||
end
|
||||
|
||||
it 'searches contacts using company name' do
|
||||
contact2.update(additional_attributes: { company_name: 'acme.inc' })
|
||||
get "/api/v1/accounts/#{account.id}/contacts/search",
|
||||
params: { q: 'acme.inc' },
|
||||
headers: admin.create_new_auth_token,
|
||||
as: :json
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
expect(response.body).to include(contact2.email)
|
||||
expect(response.body).not_to include(contact1.email)
|
||||
end
|
||||
|
||||
it 'matches the resolved contact respecting the identifier character casing' do
|
||||
contact_normal = create(:contact, name: 'testcontact', account: account, identifier: 'testidentifer')
|
||||
contact_special = create(:contact, name: 'testcontact', account: account, identifier: 'TestIdentifier')
|
||||
|
||||
@@ -667,6 +667,8 @@ RSpec.describe 'Conversations API', type: :request do
|
||||
end
|
||||
|
||||
it 'updates last seen' do
|
||||
conversation.update!(agent_last_seen_at: nil)
|
||||
|
||||
post "/api/v1/accounts/#{account.id}/conversations/#{conversation.display_id}/update_last_seen",
|
||||
headers: agent.create_new_auth_token,
|
||||
as: :json
|
||||
@@ -676,7 +678,7 @@ RSpec.describe 'Conversations API', type: :request do
|
||||
end
|
||||
|
||||
it 'updates assignee last seen' do
|
||||
conversation.update!(assignee_id: agent.id)
|
||||
conversation.update!(assignee_id: agent.id, agent_last_seen_at: nil)
|
||||
|
||||
expect(conversation.reload.assignee_last_seen_at).to be_nil
|
||||
|
||||
@@ -687,6 +689,76 @@ RSpec.describe 'Conversations API', type: :request do
|
||||
expect(response).to have_http_status(:success)
|
||||
expect(conversation.reload.assignee_last_seen_at).not_to be_nil
|
||||
end
|
||||
|
||||
it 'throttles updates within an hour when there are no unread messages' do
|
||||
conversation.update!(agent_last_seen_at: 30.minutes.ago)
|
||||
# Ensure all messages are older than agent_last_seen_at (no unread messages)
|
||||
# rubocop:disable Rails/SkipsModelValidations
|
||||
conversation.messages.update_all(created_at: 1.hour.ago)
|
||||
# rubocop:enable Rails/SkipsModelValidations
|
||||
initial_last_seen = conversation.agent_last_seen_at
|
||||
|
||||
post "/api/v1/accounts/#{account.id}/conversations/#{conversation.display_id}/update_last_seen",
|
||||
headers: agent.create_new_auth_token,
|
||||
as: :json
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
expect(conversation.reload.agent_last_seen_at).to be_within(1.second).of(initial_last_seen)
|
||||
end
|
||||
|
||||
it 'updates even within an hour when there are unread messages' do
|
||||
conversation.update!(agent_last_seen_at: 30.minutes.ago)
|
||||
# Create a new message after agent_last_seen_at (unread message)
|
||||
create(:message, conversation: conversation, created_at: 5.minutes.ago)
|
||||
initial_last_seen = conversation.agent_last_seen_at
|
||||
|
||||
post "/api/v1/accounts/#{account.id}/conversations/#{conversation.display_id}/update_last_seen",
|
||||
headers: agent.create_new_auth_token,
|
||||
as: :json
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
expect(conversation.reload.agent_last_seen_at).not_to be_within(1.second).of(initial_last_seen)
|
||||
expect(conversation.reload.agent_last_seen_at).to be > initial_last_seen
|
||||
end
|
||||
|
||||
it 'updates both if one timestamp is old even when the other is recent' do
|
||||
conversation.update!(assignee_id: agent.id, agent_last_seen_at: 2.hours.ago, assignee_last_seen_at: 30.minutes.ago)
|
||||
# Ensure all messages are older than assignee_last_seen_at (no unread messages)
|
||||
# rubocop:disable Rails/SkipsModelValidations
|
||||
conversation.messages.update_all(created_at: 1.hour.ago)
|
||||
# rubocop:enable Rails/SkipsModelValidations
|
||||
|
||||
initial_agent_last_seen = conversation.agent_last_seen_at
|
||||
|
||||
post "/api/v1/accounts/#{account.id}/conversations/#{conversation.display_id}/update_last_seen",
|
||||
headers: agent.create_new_auth_token,
|
||||
as: :json
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
# Both should be updated because agent_last_seen_at is old
|
||||
expect(conversation.reload.agent_last_seen_at).to be > initial_agent_last_seen
|
||||
expect(conversation.reload.assignee_last_seen_at).to be > initial_agent_last_seen
|
||||
end
|
||||
|
||||
it 'throttles only when both timestamps are recent and no unread messages' do
|
||||
conversation.update!(assignee_id: agent.id, agent_last_seen_at: 30.minutes.ago, assignee_last_seen_at: 30.minutes.ago)
|
||||
# Ensure all messages are older (no unread messages)
|
||||
# rubocop:disable Rails/SkipsModelValidations
|
||||
conversation.messages.update_all(created_at: 1.hour.ago)
|
||||
# rubocop:enable Rails/SkipsModelValidations
|
||||
|
||||
initial_agent_last_seen = conversation.agent_last_seen_at
|
||||
initial_assignee_last_seen = conversation.assignee_last_seen_at
|
||||
|
||||
post "/api/v1/accounts/#{account.id}/conversations/#{conversation.display_id}/update_last_seen",
|
||||
headers: agent.create_new_auth_token,
|
||||
as: :json
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
# Both should remain unchanged (throttled)
|
||||
expect(conversation.reload.agent_last_seen_at).to be_within(1.second).of(initial_agent_last_seen)
|
||||
expect(conversation.reload.assignee_last_seen_at).to be_within(1.second).of(initial_assignee_last_seen)
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
|
||||
@@ -60,24 +60,35 @@ RSpec.describe Public::Api::V1::PortalsController, type: :request do
|
||||
|
||||
describe 'GET /public/api/v1/portals/{portal_slug}/sitemap' do
|
||||
context 'when custom_domain is present' do
|
||||
it 'gets a valid sitemap' do
|
||||
it 'returns a valid urlset sitemap with the correct namespace' do
|
||||
get "/hc/#{portal.slug}/sitemap.xml"
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
expect(response.body).to match(/<sitemap/)
|
||||
expect(Nokogiri::XML(response.body).errors).to be_empty
|
||||
|
||||
doc = Nokogiri::XML(response.body)
|
||||
expect(doc.errors).to be_empty
|
||||
|
||||
expect(doc.root.name).to eq('urlset')
|
||||
expect(doc.root.namespace&.href).to eq('http://www.sitemaps.org/schemas/sitemap/0.9')
|
||||
end
|
||||
|
||||
it 'has valid sitemap links' do
|
||||
it 'contains valid article URLs for the portal' do
|
||||
get "/hc/#{portal.slug}/sitemap.xml"
|
||||
|
||||
expect(response).to have_http_status(:success)
|
||||
parsed_xml = Nokogiri::XML(response.body)
|
||||
links = parsed_xml.css('loc')
|
||||
|
||||
links.each do |link|
|
||||
expect(link.text).to match(%r{https://www\.example\.com/hc/test-portal/articles/\d+})
|
||||
end
|
||||
doc = Nokogiri::XML(response.body)
|
||||
doc.remove_namespaces!
|
||||
|
||||
expect(links.length).to eq 3
|
||||
# ensure we are NOT returning a sitemapindex
|
||||
expect(doc.xpath('//sitemapindex')).to be_empty
|
||||
|
||||
links = doc.xpath('//url/loc').map(&:text)
|
||||
expect(links.length).to eq(3)
|
||||
|
||||
expect(links).to all(
|
||||
match(%r{\Ahttps://www\.example\.com/hc/#{Regexp.escape(portal.slug)}/articles/\d+})
|
||||
)
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
@@ -61,15 +61,10 @@ RSpec.describe Messages::SearchDataPresenter do
|
||||
context 'with campaign and automation data' do
|
||||
before do
|
||||
message.update(
|
||||
additional_attributes: { 'campaign_id' => '123' },
|
||||
content_attributes: { 'automation_rule_id' => '456' }
|
||||
)
|
||||
end
|
||||
|
||||
it 'includes campaign_id' do
|
||||
expect(presenter.search_data[:additional_attributes][:campaign_id]).to eq('123')
|
||||
end
|
||||
|
||||
it 'includes automation_rule_id' do
|
||||
expect(presenter.search_data[:additional_attributes][:automation_rule_id]).to eq('456')
|
||||
end
|
||||
|
||||
@@ -53,12 +53,28 @@ RSpec.describe Messages::MarkdownRendererService, type: :service do
|
||||
expect(result.strip).to eq('*bold _italic_*')
|
||||
end
|
||||
|
||||
it 'converts bullet lists' do
|
||||
content = "- item 1\n- item 2"
|
||||
it 'preserves unordered list with dash markers' do
|
||||
content = "- item 1\n- item 2\n- item 3"
|
||||
result = described_class.new(content, channel_type).render
|
||||
expect(result.strip).to include('- item 1')
|
||||
expect(result.strip).to include('- item 2')
|
||||
expect(result).to include("- item 1\n- item 2")
|
||||
expect(result).to include('- item 1')
|
||||
expect(result).to include('- item 2')
|
||||
expect(result).to include('- item 3')
|
||||
end
|
||||
|
||||
it 'converts asterisk unordered lists to dash markers' do
|
||||
content = "* item 1\n* item 2\n* item 3"
|
||||
result = described_class.new(content, channel_type).render
|
||||
expect(result).to include('- item 1')
|
||||
expect(result).to include('- item 2')
|
||||
expect(result).to include('- item 3')
|
||||
end
|
||||
|
||||
it 'preserves ordered list markers with numbering' do
|
||||
content = "1. first step\n2. second step\n3. third step"
|
||||
result = described_class.new(content, channel_type).render
|
||||
expect(result).to include('1. first step')
|
||||
expect(result).to include('2. second step')
|
||||
expect(result).to include('3. third step')
|
||||
end
|
||||
|
||||
it 'preserves newlines in plain text without list markers' do
|
||||
@@ -432,6 +448,24 @@ RSpec.describe Messages::MarkdownRendererService, type: :service do
|
||||
expect(result).to include("Line 1\nLine 2\nLine 3")
|
||||
end
|
||||
|
||||
it 'preserves ordered list markers with numbering in Twilio WhatsApp' do
|
||||
content = "1. first step\n2. second step\n3. third step"
|
||||
channel = instance_double(Channel::TwilioSms, whatsapp?: true)
|
||||
result = described_class.new(content, channel_type, channel).render
|
||||
expect(result).to include('1. first step')
|
||||
expect(result).to include('2. second step')
|
||||
expect(result).to include('3. third step')
|
||||
end
|
||||
|
||||
it 'preserves unordered list markers in Twilio WhatsApp' do
|
||||
content = "- item 1\n- item 2\n- item 3"
|
||||
channel = instance_double(Channel::TwilioSms, whatsapp?: true)
|
||||
result = described_class.new(content, channel_type, channel).render
|
||||
expect(result).to include('- item 1')
|
||||
expect(result).to include('- item 2')
|
||||
expect(result).to include('- item 3')
|
||||
end
|
||||
|
||||
it 'backwards compatible when channel is not provided' do
|
||||
content = '**bold** _italic_'
|
||||
result = described_class.new(content, channel_type).render
|
||||
@@ -483,12 +517,12 @@ RSpec.describe Messages::MarkdownRendererService, type: :service do
|
||||
context 'when testing all formatting types' do
|
||||
let(:channel_type) { 'Channel::Whatsapp' }
|
||||
|
||||
it 'handles ordered lists' do
|
||||
it 'handles ordered lists with proper numbering' do
|
||||
content = "1. first\n2. second\n3. third"
|
||||
result = described_class.new(content, channel_type).render
|
||||
expect(result).to include('first')
|
||||
expect(result).to include('second')
|
||||
expect(result).to include('third')
|
||||
expect(result).to include('1. first')
|
||||
expect(result).to include('2. second')
|
||||
expect(result).to include('3. third')
|
||||
end
|
||||
end
|
||||
|
||||
|
||||
Reference in New Issue
Block a user