Compare commits
5
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
4fd1a5c2ef | ||
|
|
7793e4645f | ||
|
|
53dc3f0b69 | ||
|
|
2349f1ecc5 | ||
|
|
d9519bb4ae |
@@ -1,21 +1,14 @@
|
|||||||
.bundle
|
.bundle
|
||||||
.codex
|
|
||||||
.env
|
.env
|
||||||
.env.*
|
.env.*
|
||||||
.git
|
|
||||||
.github
|
|
||||||
.agents
|
|
||||||
docker-compose.*
|
docker-compose.*
|
||||||
docker/Dockerfile
|
docker/Dockerfile
|
||||||
docker/dockerfiles
|
docker/dockerfiles
|
||||||
log
|
log
|
||||||
spec
|
|
||||||
storage
|
storage
|
||||||
tests
|
|
||||||
public/system
|
public/system
|
||||||
tmp
|
tmp
|
||||||
.codeclimate.yml
|
.codeclimate.yml
|
||||||
coverage
|
|
||||||
public/packs
|
public/packs
|
||||||
node_modules
|
node_modules
|
||||||
vendor/bundle
|
vendor/bundle
|
||||||
|
|||||||
+3
-3
@@ -272,9 +272,9 @@ AZURE_APP_SECRET=
|
|||||||
# ENABLE_SIDEKIQ_DEQUEUE_LOGGER=false
|
# ENABLE_SIDEKIQ_DEQUEUE_LOGGER=false
|
||||||
|
|
||||||
|
|
||||||
# AI powered features (Captain)
|
# AI powered features
|
||||||
# The OpenAI API key and endpoint for Captain are not configured via .env.
|
## OpenAI key
|
||||||
# Set them at Super Admin > App Configs > Captain (CAPTAIN_OPEN_AI_API_KEY, CAPTAIN_OPEN_AI_ENDPOINT).
|
# OPENAI_API_KEY=
|
||||||
|
|
||||||
# Housekeeping/Performance related configurations
|
# Housekeeping/Performance related configurations
|
||||||
# Set to true if you want to remove stale contact inboxes
|
# Set to true if you want to remove stale contact inboxes
|
||||||
|
|||||||
@@ -78,12 +78,6 @@ jobs:
|
|||||||
platforms: ${{ matrix.platform }}
|
platforms: ${{ matrix.platform }}
|
||||||
push: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
|
push: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
|
||||||
outputs: type=image,name=${{ env.DOCKER_REPO }},push-by-digest=true,name-canonical=true,push=true
|
outputs: type=image,name=${{ env.DOCKER_REPO }},push-by-digest=true,name-canonical=true,push=true
|
||||||
build-args: |
|
|
||||||
GIT_SHA=${{ github.sha }}
|
|
||||||
cache-from: |
|
|
||||||
type=gha,scope=${{ matrix.platform }}
|
|
||||||
type=gha,scope=${{ matrix.platform }}-ee
|
|
||||||
cache-to: type=gha,mode=max,scope=${{ matrix.platform }}-ee
|
|
||||||
|
|
||||||
- name: Export digest
|
- name: Export digest
|
||||||
run: |
|
run: |
|
||||||
@@ -131,7 +125,7 @@ jobs:
|
|||||||
else
|
else
|
||||||
TAG="${DOCKER_REPO}:${SANITIZED_REF}"
|
TAG="${DOCKER_REPO}:${SANITIZED_REF}"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
docker buildx imagetools create -t $TAG \
|
docker buildx imagetools create -t $TAG \
|
||||||
$(printf '${{ env.DOCKER_REPO }}@sha256:%s ' *)
|
$(printf '${{ env.DOCKER_REPO }}@sha256:%s ' *)
|
||||||
|
|
||||||
@@ -145,5 +139,5 @@ jobs:
|
|||||||
else
|
else
|
||||||
TAG="${DOCKER_REPO}:${SANITIZED_REF}"
|
TAG="${DOCKER_REPO}:${SANITIZED_REF}"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
docker buildx imagetools inspect $TAG
|
docker buildx imagetools inspect $TAG
|
||||||
|
|||||||
@@ -83,12 +83,6 @@ jobs:
|
|||||||
platforms: ${{ matrix.platform }}
|
platforms: ${{ matrix.platform }}
|
||||||
push: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
|
push: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
|
||||||
outputs: type=image,name=${{ env.DOCKER_REPO }},push-by-digest=true,name-canonical=true,push=true
|
outputs: type=image,name=${{ env.DOCKER_REPO }},push-by-digest=true,name-canonical=true,push=true
|
||||||
build-args: |
|
|
||||||
GIT_SHA=${{ github.sha }}
|
|
||||||
cache-from: |
|
|
||||||
type=gha,scope=${{ matrix.platform }}
|
|
||||||
type=gha,scope=${{ matrix.platform }}-ce
|
|
||||||
cache-to: type=gha,mode=max,scope=${{ matrix.platform }}-ce
|
|
||||||
|
|
||||||
- name: Export digest
|
- name: Export digest
|
||||||
run: |
|
run: |
|
||||||
@@ -136,7 +130,7 @@ jobs:
|
|||||||
else
|
else
|
||||||
TAG="${DOCKER_REPO}:${SANITIZED_REF}-ce"
|
TAG="${DOCKER_REPO}:${SANITIZED_REF}-ce"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
docker buildx imagetools create -t $TAG \
|
docker buildx imagetools create -t $TAG \
|
||||||
$(printf '${{ env.DOCKER_REPO }}@sha256:%s ' *)
|
$(printf '${{ env.DOCKER_REPO }}@sha256:%s ' *)
|
||||||
|
|
||||||
@@ -150,5 +144,5 @@ jobs:
|
|||||||
else
|
else
|
||||||
TAG="${DOCKER_REPO}:${SANITIZED_REF}-ce"
|
TAG="${DOCKER_REPO}:${SANITIZED_REF}-ce"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
docker buildx imagetools inspect $TAG
|
docker buildx imagetools inspect $TAG
|
||||||
|
|||||||
@@ -39,9 +39,5 @@ jobs:
|
|||||||
platforms: ${{ matrix.platform }}
|
platforms: ${{ matrix.platform }}
|
||||||
push: false
|
push: false
|
||||||
load: false
|
load: false
|
||||||
build-args: |
|
cache-from: type=gha,scope=${{ matrix.platform }}
|
||||||
GIT_SHA=${{ github.sha }}
|
cache-to: type=gha,mode=max,scope=${{ matrix.platform }}
|
||||||
cache-from: |
|
|
||||||
type=gha,scope=${{ matrix.platform }}
|
|
||||||
type=gha,scope=${{ matrix.platform }}-ce
|
|
||||||
type=gha,scope=${{ matrix.platform }}-ee
|
|
||||||
|
|||||||
@@ -195,7 +195,7 @@ gem 'reverse_markdown'
|
|||||||
|
|
||||||
gem 'iso-639'
|
gem 'iso-639'
|
||||||
gem 'ruby-openai'
|
gem 'ruby-openai'
|
||||||
gem 'ai-agents', '>= 0.12.0'
|
gem 'ai-agents', '>= 0.10.0'
|
||||||
|
|
||||||
# TODO: Move this gem as a dependency of ai-agents
|
# TODO: Move this gem as a dependency of ai-agents
|
||||||
gem 'ruby_llm', '>= 1.14.1'
|
gem 'ruby_llm', '>= 1.14.1'
|
||||||
|
|||||||
+4
-4
@@ -126,7 +126,7 @@ GEM
|
|||||||
jbuilder (~> 2)
|
jbuilder (~> 2)
|
||||||
rails (>= 4.2, < 7.2)
|
rails (>= 4.2, < 7.2)
|
||||||
selectize-rails (~> 0.6)
|
selectize-rails (~> 0.6)
|
||||||
ai-agents (0.12.0)
|
ai-agents (0.10.0)
|
||||||
ruby_llm (~> 1.14)
|
ruby_llm (~> 1.14)
|
||||||
annotaterb (4.20.0)
|
annotaterb (4.20.0)
|
||||||
activerecord (>= 6.0.0)
|
activerecord (>= 6.0.0)
|
||||||
@@ -198,7 +198,7 @@ GEM
|
|||||||
crack (1.0.0)
|
crack (1.0.0)
|
||||||
bigdecimal
|
bigdecimal
|
||||||
rexml
|
rexml
|
||||||
crass (1.0.7)
|
crass (1.0.6)
|
||||||
cronex (0.15.0)
|
cronex (0.15.0)
|
||||||
tzinfo
|
tzinfo
|
||||||
unicode (>= 0.4.4.5)
|
unicode (>= 0.4.4.5)
|
||||||
@@ -570,7 +570,7 @@ GEM
|
|||||||
minitest (5.25.5)
|
minitest (5.25.5)
|
||||||
mock_redis (0.36.0)
|
mock_redis (0.36.0)
|
||||||
ruby2_keywords
|
ruby2_keywords
|
||||||
msgpack (1.8.3)
|
msgpack (1.8.0)
|
||||||
multi_json (1.15.0)
|
multi_json (1.15.0)
|
||||||
multi_xml (0.9.1)
|
multi_xml (0.9.1)
|
||||||
bigdecimal (>= 3.1, < 5)
|
bigdecimal (>= 3.1, < 5)
|
||||||
@@ -1058,7 +1058,7 @@ DEPENDENCIES
|
|||||||
administrate (>= 0.20.1)
|
administrate (>= 0.20.1)
|
||||||
administrate-field-active_storage (>= 1.0.3)
|
administrate-field-active_storage (>= 1.0.3)
|
||||||
administrate-field-belongs_to_search (>= 0.9.0)
|
administrate-field-belongs_to_search (>= 0.9.0)
|
||||||
ai-agents (>= 0.12.0)
|
ai-agents (>= 0.10.0)
|
||||||
annotaterb
|
annotaterb
|
||||||
attr_extras
|
attr_extras
|
||||||
audited (~> 5.4, >= 5.4.1)
|
audited (~> 5.4, >= 5.4.1)
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
# Variables
|
# Variables
|
||||||
APP_NAME := chatwoot
|
APP_NAME := chatwoot
|
||||||
RAILS_ENV ?= development
|
RAILS_ENV ?= development
|
||||||
GIT_SHA ?= $(shell git rev-parse HEAD 2>/dev/null || echo unknown)
|
|
||||||
|
|
||||||
# Targets
|
# Targets
|
||||||
setup:
|
setup:
|
||||||
@@ -62,6 +61,6 @@ debug_worker:
|
|||||||
overmind connect worker
|
overmind connect worker
|
||||||
|
|
||||||
docker:
|
docker:
|
||||||
docker build --build-arg GIT_SHA=$(GIT_SHA) -t $(APP_NAME) -f ./docker/Dockerfile .
|
docker build -t $(APP_NAME) -f ./docker/Dockerfile .
|
||||||
|
|
||||||
.PHONY: setup db_create db_migrate db_seed db_reset db console server burn docker run force_run force_run_tunnel debug debug_worker
|
.PHONY: setup db_create db_migrate db_seed db_reset db console server burn docker run force_run force_run_tunnel debug debug_worker
|
||||||
|
|||||||
@@ -1,213 +0,0 @@
|
|||||||
class V2::Reports::DrilldownBuilder
|
|
||||||
include DateRangeHelper
|
|
||||||
include TimezoneHelper
|
|
||||||
|
|
||||||
DEFAULT_GROUP_BY = 'day'.freeze
|
|
||||||
DEFAULT_PAGE = 1
|
|
||||||
DEFAULT_PER_PAGE = 25
|
|
||||||
MAX_PER_PAGE = 100
|
|
||||||
SUPPORTED_GROUP_BY = %w[hour day week month year].freeze
|
|
||||||
SUPPORTED_DIMENSION_TYPES = %w[account inbox agent label team].freeze
|
|
||||||
MESSAGE_METRICS = {
|
|
||||||
'incoming_messages_count' => :incoming,
|
|
||||||
'outgoing_messages_count' => :outgoing
|
|
||||||
}.freeze
|
|
||||||
MESSAGE_EVENT_METRICS = %w[avg_first_response_time reply_time].freeze
|
|
||||||
|
|
||||||
pattr_initialize :account, :params
|
|
||||||
|
|
||||||
def self.supported_dimension_type?(type) = SUPPORTED_DIMENSION_TYPES.include?((type.presence || 'account').to_s)
|
|
||||||
|
|
||||||
def build
|
|
||||||
records = paginated_records.to_a
|
|
||||||
{ meta: meta, payload: records.map { |record| record_serializer(records).serialize(record) } }
|
|
||||||
end
|
|
||||||
|
|
||||||
private
|
|
||||||
|
|
||||||
def meta
|
|
||||||
{
|
|
||||||
metric: metric,
|
|
||||||
record_type: record_type,
|
|
||||||
bucket: {
|
|
||||||
since: bucket_range.begin.to_i,
|
|
||||||
until: bucket_range.end.to_i
|
|
||||||
},
|
|
||||||
current_page: current_page,
|
|
||||||
per_page: per_page,
|
|
||||||
total_count: paginated_records.total_count,
|
|
||||||
conversation_count: conversation_count
|
|
||||||
}
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_count
|
|
||||||
return paginated_records.total_count if conversation_metric?
|
|
||||||
|
|
||||||
drilldown_scope.except(:includes).reorder(nil).distinct.count(:conversation_id)
|
|
||||||
end
|
|
||||||
|
|
||||||
def paginated_records
|
|
||||||
@paginated_records ||= drilldown_scope.page(current_page).per(per_page)
|
|
||||||
end
|
|
||||||
|
|
||||||
def drilldown_scope
|
|
||||||
if message_metric?
|
|
||||||
message_scope
|
|
||||||
elsif conversation_metric?
|
|
||||||
conversation_scope
|
|
||||||
else
|
|
||||||
reporting_event_scope
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_scope
|
|
||||||
scope.messages
|
|
||||||
.where(account_id: account.id, created_at: bucket_range)
|
|
||||||
.public_send(MESSAGE_METRICS.fetch(metric))
|
|
||||||
.includes(:sender, conversation: [:assignee, :contact, :inbox])
|
|
||||||
.reorder(created_at: :desc)
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_scope
|
|
||||||
scope.conversations
|
|
||||||
.where(account_id: account.id, created_at: bucket_range)
|
|
||||||
.includes(:assignee, :contact, :inbox)
|
|
||||||
.order(created_at: :desc)
|
|
||||||
end
|
|
||||||
|
|
||||||
def reporting_event_scope
|
|
||||||
events = scope.reporting_events
|
|
||||||
.where(account_id: account.id, name: raw_event_name, created_at: bucket_range)
|
|
||||||
.includes(:user, :inbox, conversation: [:assignee, :contact, :inbox])
|
|
||||||
.order(created_at: :desc)
|
|
||||||
|
|
||||||
if raw_count_strategy == :exclude_bot_handoffs
|
|
||||||
events = events.where.not(conversation_id: bot_handoff_conversation_ids_subquery)
|
|
||||||
elsif raw_count_strategy == :distinct_conversation
|
|
||||||
events = events.where(id: distinct_conversation_event_ids(events))
|
|
||||||
end
|
|
||||||
|
|
||||||
events
|
|
||||||
end
|
|
||||||
|
|
||||||
def bot_handoff_conversation_ids_subquery
|
|
||||||
scope.reporting_events
|
|
||||||
.where(account_id: account.id, name: :conversation_bot_handoff, created_at: range)
|
|
||||||
.where.not(conversation_id: nil)
|
|
||||||
.select(:conversation_id)
|
|
||||||
end
|
|
||||||
|
|
||||||
def distinct_conversation_event_ids(events)
|
|
||||||
events.reorder(nil)
|
|
||||||
.where.not(conversation_id: nil)
|
|
||||||
.select('MAX(reporting_events.id)')
|
|
||||||
.group(:conversation_id)
|
|
||||||
end
|
|
||||||
|
|
||||||
def record_serializer(records)
|
|
||||||
@record_serializer ||= V2::Reports::DrilldownRecordSerializer.new(
|
|
||||||
account,
|
|
||||||
metric,
|
|
||||||
use_business_hours?,
|
|
||||||
records
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
def bucket_range
|
|
||||||
@bucket_range ||= begin
|
|
||||||
bucket_start = Time.zone.at(params[:bucket_timestamp].to_i).in_time_zone(timezone)
|
|
||||||
bucket_end = bucket_end_for(bucket_start)
|
|
||||||
requested_start = Time.zone.at(params[:since].to_i)
|
|
||||||
requested_end = Time.zone.at(params[:until].to_i)
|
|
||||||
|
|
||||||
[bucket_start, requested_start].max...[bucket_end, requested_end].min
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def bucket_end_for(bucket_start)
|
|
||||||
{
|
|
||||||
'hour' => bucket_start + 1.hour,
|
|
||||||
'day' => bucket_start + 1.day,
|
|
||||||
'week' => bucket_start + 1.week,
|
|
||||||
'month' => bucket_start + 1.month,
|
|
||||||
'year' => bucket_start + 1.year
|
|
||||||
}.fetch(group_by)
|
|
||||||
end
|
|
||||||
|
|
||||||
def scope
|
|
||||||
case dimension_type
|
|
||||||
when 'account' then account
|
|
||||||
when 'inbox' then inbox
|
|
||||||
when 'agent' then user
|
|
||||||
when 'label' then label
|
|
||||||
when 'team' then team
|
|
||||||
else
|
|
||||||
raise ArgumentError, "Unsupported drilldown dimension type: #{dimension_type}"
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def inbox = @inbox ||= account.inboxes.find(params[:id])
|
|
||||||
|
|
||||||
def user = @user ||= account.users.find(params[:id])
|
|
||||||
|
|
||||||
def label = @label ||= account.labels.find(params[:id])
|
|
||||||
|
|
||||||
def team = @team ||= account.teams.find(params[:id])
|
|
||||||
|
|
||||||
def metric
|
|
||||||
params[:metric].to_s
|
|
||||||
end
|
|
||||||
|
|
||||||
def report_metric
|
|
||||||
@report_metric ||= Reports::ReportMetricRegistry.fetch(metric)
|
|
||||||
end
|
|
||||||
|
|
||||||
def raw_event_name
|
|
||||||
report_metric&.raw_event_name
|
|
||||||
end
|
|
||||||
|
|
||||||
def raw_count_strategy
|
|
||||||
report_metric&.raw_count_strategy
|
|
||||||
end
|
|
||||||
|
|
||||||
def record_type
|
|
||||||
return 'message' if message_metric? || MESSAGE_EVENT_METRICS.include?(metric)
|
|
||||||
|
|
||||||
'conversation'
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_metric?
|
|
||||||
MESSAGE_METRICS.key?(metric)
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_metric?
|
|
||||||
metric == 'conversations_count'
|
|
||||||
end
|
|
||||||
|
|
||||||
def dimension_type
|
|
||||||
(params[:type].presence || 'account').to_s
|
|
||||||
end
|
|
||||||
|
|
||||||
def group_by
|
|
||||||
@group_by ||= SUPPORTED_GROUP_BY.include?(params[:group_by].to_s) ? params[:group_by].to_s : DEFAULT_GROUP_BY
|
|
||||||
end
|
|
||||||
|
|
||||||
def timezone
|
|
||||||
@timezone ||= timezone_name_from_offset(params[:timezone_offset])
|
|
||||||
end
|
|
||||||
|
|
||||||
def current_page
|
|
||||||
[params[:page].to_i, DEFAULT_PAGE].max
|
|
||||||
end
|
|
||||||
|
|
||||||
def per_page
|
|
||||||
requested_per_page = params[:per_page].to_i
|
|
||||||
requested_per_page = DEFAULT_PER_PAGE if requested_per_page <= 0
|
|
||||||
|
|
||||||
[requested_per_page, MAX_PER_PAGE].min
|
|
||||||
end
|
|
||||||
|
|
||||||
def use_business_hours?
|
|
||||||
ActiveModel::Type::Boolean.new.cast(params[:business_hours])
|
|
||||||
end
|
|
||||||
end
|
|
||||||
@@ -1,199 +0,0 @@
|
|||||||
class V2::Reports::DrilldownRecordSerializer
|
|
||||||
MESSAGE_EVENT_METRICS = %w[avg_first_response_time reply_time].freeze
|
|
||||||
|
|
||||||
attr_reader :account, :metric, :use_business_hours, :records
|
|
||||||
|
|
||||||
def initialize(account, metric, use_business_hours, records = [])
|
|
||||||
@account = account
|
|
||||||
@metric = metric
|
|
||||||
@use_business_hours = use_business_hours
|
|
||||||
@records = records
|
|
||||||
end
|
|
||||||
|
|
||||||
def serialize(record)
|
|
||||||
return serialize_message(record) if record.is_a?(Message)
|
|
||||||
return serialize_conversation_event(record) if record.is_a?(ReportingEvent)
|
|
||||||
|
|
||||||
serialize_conversation(record)
|
|
||||||
end
|
|
||||||
|
|
||||||
private
|
|
||||||
|
|
||||||
def serialize_message(message, metric_value: nil, occurred_at: nil)
|
|
||||||
{
|
|
||||||
record_type: 'message',
|
|
||||||
conversation: conversation_attributes(message.conversation),
|
|
||||||
message: message_attributes(message),
|
|
||||||
metric_value: metric_value,
|
|
||||||
occurred_at: (occurred_at || message.created_at).to_i
|
|
||||||
}
|
|
||||||
end
|
|
||||||
|
|
||||||
def serialize_conversation_event(event)
|
|
||||||
inferred_message = inferred_message_for(event)
|
|
||||||
if inferred_message.present?
|
|
||||||
return serialize_message(
|
|
||||||
inferred_message,
|
|
||||||
metric_value: event_metric_value(event),
|
|
||||||
occurred_at: event_timestamp(event)
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
serialize_conversation(
|
|
||||||
event.conversation,
|
|
||||||
metric_value: event_metric_value(event),
|
|
||||||
occurred_at: event_timestamp(event),
|
|
||||||
event_name: event.name
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
def serialize_conversation(conversation, metric_value: nil, occurred_at: nil, event_name: nil)
|
|
||||||
serialized_record = {
|
|
||||||
record_type: 'conversation',
|
|
||||||
conversation: conversation_attributes(conversation),
|
|
||||||
message: nil,
|
|
||||||
metric_value: metric_value,
|
|
||||||
occurred_at: (occurred_at || conversation&.created_at)&.to_i
|
|
||||||
}
|
|
||||||
serialized_record[:event_name] = event_name if event_name.present?
|
|
||||||
serialized_record
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_attributes(conversation)
|
|
||||||
return {} if conversation.blank?
|
|
||||||
|
|
||||||
{
|
|
||||||
id: conversation.id,
|
|
||||||
display_id: conversation.display_id,
|
|
||||||
contact_id: conversation.contact_id,
|
|
||||||
contact_name: conversation.contact&.name,
|
|
||||||
inbox_id: conversation.inbox_id,
|
|
||||||
inbox_name: conversation.inbox&.name,
|
|
||||||
assignee_id: conversation.assignee_id,
|
|
||||||
assignee_name: conversation.assignee&.name,
|
|
||||||
status: conversation.status,
|
|
||||||
created_at: conversation.created_at.to_i,
|
|
||||||
last_activity_at: conversation.last_activity_at.to_i,
|
|
||||||
last_message: last_message_attributes(conversation)
|
|
||||||
}
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_attributes(message)
|
|
||||||
{
|
|
||||||
id: message.id,
|
|
||||||
content: message.content,
|
|
||||||
message_type: message.message_type,
|
|
||||||
sender_name: message.sender&.try(:name),
|
|
||||||
created_at: message.created_at.to_i
|
|
||||||
}
|
|
||||||
end
|
|
||||||
|
|
||||||
def last_message_attributes(conversation)
|
|
||||||
message = latest_messages_by_conversation_id[conversation.id]
|
|
||||||
return if message.blank?
|
|
||||||
|
|
||||||
message_attributes(message)
|
|
||||||
end
|
|
||||||
|
|
||||||
def inferred_message_for(event)
|
|
||||||
return unless MESSAGE_EVENT_METRICS.include?(metric)
|
|
||||||
return if event.conversation.blank? || event.event_end_time.blank?
|
|
||||||
|
|
||||||
inferred_messages_by_event_id[event.id]
|
|
||||||
end
|
|
||||||
|
|
||||||
def first_response_event_with_user?(event)
|
|
||||||
metric == 'avg_first_response_time' && event.user_id.present?
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_inference_range(event)
|
|
||||||
(event.event_end_time - 1.second)..(event.event_end_time + 1.second)
|
|
||||||
end
|
|
||||||
|
|
||||||
def event_metric_value(event)
|
|
||||||
use_business_hours ? event.value_in_business_hours : event.value
|
|
||||||
end
|
|
||||||
|
|
||||||
def event_timestamp(event)
|
|
||||||
event.event_end_time || event.created_at
|
|
||||||
end
|
|
||||||
|
|
||||||
def latest_messages_by_conversation_id
|
|
||||||
@latest_messages_by_conversation_id ||= if conversation_ids.blank?
|
|
||||||
{}
|
|
||||||
else
|
|
||||||
latest_messages.index_by(&:conversation_id)
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def latest_messages
|
|
||||||
Message
|
|
||||||
.where(account_id: account.id, conversation_id: conversation_ids)
|
|
||||||
.where.not(message_type: :activity)
|
|
||||||
.select('DISTINCT ON (messages.conversation_id) messages.*')
|
|
||||||
.reorder(Arel.sql('messages.conversation_id, messages.created_at DESC, messages.id DESC'))
|
|
||||||
.includes(:sender)
|
|
||||||
end
|
|
||||||
|
|
||||||
def inferred_messages_by_event_id
|
|
||||||
@inferred_messages_by_event_id ||= inference_events.each_with_object({}) do |event, messages_by_event_id|
|
|
||||||
messages_by_event_id[event.id] = inferred_message_candidates.find do |message|
|
|
||||||
message_matches_event?(message, event)
|
|
||||||
end
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def inferred_message_candidates
|
|
||||||
@inferred_message_candidates ||= if inference_events.blank?
|
|
||||||
[]
|
|
||||||
else
|
|
||||||
inferred_messages.to_a
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def inferred_messages
|
|
||||||
Message
|
|
||||||
.where(account_id: account.id, conversation_id: inference_events.map(&:conversation_id).uniq)
|
|
||||||
.where(created_at: inference_time_range)
|
|
||||||
.where(message_type: %i[outgoing template])
|
|
||||||
.includes(:sender)
|
|
||||||
.reorder(created_at: :desc, id: :desc)
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_matches_event?(message, event)
|
|
||||||
message.conversation_id == event.conversation_id &&
|
|
||||||
message.created_at.between?(
|
|
||||||
message_inference_range(event).begin,
|
|
||||||
message_inference_range(event).end
|
|
||||||
) &&
|
|
||||||
message_sender_matches_event?(message, event)
|
|
||||||
end
|
|
||||||
|
|
||||||
def message_sender_matches_event?(message, event)
|
|
||||||
return true unless first_response_event_with_user?(event)
|
|
||||||
|
|
||||||
message.sender_id == event.user_id && message.sender_type == 'User'
|
|
||||||
end
|
|
||||||
|
|
||||||
def inference_time_range
|
|
||||||
event_end_times = inference_events.map(&:event_end_time)
|
|
||||||
|
|
||||||
(event_end_times.min - 1.second)..(event_end_times.max + 1.second)
|
|
||||||
end
|
|
||||||
|
|
||||||
def inference_events
|
|
||||||
@inference_events ||= records.select do |record|
|
|
||||||
record.is_a?(ReportingEvent) && record.conversation_id.present? && record.event_end_time.present?
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_ids
|
|
||||||
@conversation_ids ||= records.filter_map { |record| conversation_id_for(record) }.uniq
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_id_for(record)
|
|
||||||
return record.conversation_id if record.is_a?(Message) || record.is_a?(ReportingEvent)
|
|
||||||
|
|
||||||
record.id
|
|
||||||
end
|
|
||||||
end
|
|
||||||
@@ -40,8 +40,8 @@ class Api::V1::Accounts::ArticlesController < Api::V1::Accounts::BaseController
|
|||||||
end
|
end
|
||||||
|
|
||||||
def reorder
|
def reorder
|
||||||
positions = Article.update_positions(portal: @portal, positions_hash: params[:positions_hash])
|
Article.update_positions(portal: @portal, positions_hash: params[:positions_hash])
|
||||||
render json: { positions: positions }
|
head :ok
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
|
|||||||
@@ -2,8 +2,6 @@ class Api::V1::Accounts::AssignableAgentsController < Api::V1::Accounts::BaseCon
|
|||||||
before_action :fetch_inboxes
|
before_action :fetch_inboxes
|
||||||
|
|
||||||
def index
|
def index
|
||||||
# TODO: Remove this opt-in once mobile clients support AgentBot assignees in this payload.
|
|
||||||
@include_agent_bots = params[:include_agent_bots].present?
|
|
||||||
agent_ids = @inboxes.map do |inbox|
|
agent_ids = @inboxes.map do |inbox|
|
||||||
authorize inbox, :show?
|
authorize inbox, :show?
|
||||||
member_ids = inbox.members.pluck(:user_id)
|
member_ids = inbox.members.pluck(:user_id)
|
||||||
@@ -12,7 +10,6 @@ class Api::V1::Accounts::AssignableAgentsController < Api::V1::Accounts::BaseCon
|
|||||||
agent_ids = agent_ids.inject(:&)
|
agent_ids = agent_ids.inject(:&)
|
||||||
agents = Current.account.users.where(id: agent_ids)
|
agents = Current.account.users.where(id: agent_ids)
|
||||||
@assignable_agents = (agents + Current.account.administrators).uniq
|
@assignable_agents = (agents + Current.account.administrators).uniq
|
||||||
@agent_bots = @include_agent_bots ? AgentBot.accessible_to(Current.account) : []
|
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ class Api::V1::Accounts::CallbacksController < Api::V1::Accounts::BaseController
|
|||||||
page_access_token = params[:page_access_token]
|
page_access_token = params[:page_access_token]
|
||||||
page_id = params[:page_id]
|
page_id = params[:page_id]
|
||||||
inbox_name = params[:inbox_name]
|
inbox_name = params[:inbox_name]
|
||||||
|
|
||||||
ActiveRecord::Base.transaction do
|
ActiveRecord::Base.transaction do
|
||||||
facebook_channel = Current.account.facebook_pages.create!(
|
facebook_channel = Current.account.facebook_pages.create!(
|
||||||
page_id: page_id, user_access_token: user_access_token,
|
page_id: page_id, user_access_token: user_access_token,
|
||||||
@@ -16,8 +15,6 @@ class Api::V1::Accounts::CallbacksController < Api::V1::Accounts::BaseController
|
|||||||
set_instagram_id(page_access_token, facebook_channel)
|
set_instagram_id(page_access_token, facebook_channel)
|
||||||
set_avatar(@facebook_inbox, page_id)
|
set_avatar(@facebook_inbox, page_id)
|
||||||
end
|
end
|
||||||
rescue CustomExceptions::Inbox::LimitExceeded => e
|
|
||||||
render_error_response(e)
|
|
||||||
rescue StandardError => e
|
rescue StandardError => e
|
||||||
ChatwootExceptionTracker.new(e).capture_exception
|
ChatwootExceptionTracker.new(e).capture_exception
|
||||||
Rails.logger.error "Error in register_facebook_page: #{e.message}"
|
Rails.logger.error "Error in register_facebook_page: #{e.message}"
|
||||||
|
|||||||
@@ -66,7 +66,6 @@ class Api::V1::Accounts::Captain::PreferencesController < Api::V1::Accounts::Bas
|
|||||||
config = Llm::Models.feature_config(feature_key)
|
config = Llm::Models.feature_config(feature_key)
|
||||||
route = Llm::FeatureRouter.resolve(feature: feature_key, account: Current.account)
|
route = Llm::FeatureRouter.resolve(feature: feature_key, account: Current.account)
|
||||||
config.merge(
|
config.merge(
|
||||||
default: default_model_for(feature_key),
|
|
||||||
enabled: account_features[feature_key] == true,
|
enabled: account_features[feature_key] == true,
|
||||||
model: route[:model],
|
model: route[:model],
|
||||||
selected: route[:model],
|
selected: route[:model],
|
||||||
@@ -75,10 +74,4 @@ class Api::V1::Accounts::Captain::PreferencesController < Api::V1::Accounts::Bas
|
|||||||
)
|
)
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
def default_model_for(feature_key)
|
|
||||||
return Llm::FeatureRouter::CAPTAIN_V2_ASSISTANT_MODEL if feature_key == 'assistant' && Current.account.feature_enabled?('captain_integration_v2')
|
|
||||||
|
|
||||||
Llm::Models.default_model_for(feature_key)
|
|
||||||
end
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -6,8 +6,6 @@ class Api::V1::Accounts::Channels::TwilioChannelsController < Api::V1::Accounts:
|
|||||||
|
|
||||||
def create
|
def create
|
||||||
process_create
|
process_create
|
||||||
rescue CustomExceptions::Inbox::LimitExceeded => e
|
|
||||||
render_error_response(e)
|
|
||||||
rescue StandardError => e
|
rescue StandardError => e
|
||||||
render_could_not_create_error(e.message)
|
render_could_not_create_error(e.message)
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -52,9 +52,6 @@ class Api::V1::Accounts::Conversations::MessagesController < Api::V1::Accounts::
|
|||||||
end
|
end
|
||||||
|
|
||||||
render json: { content: translated_content }
|
render json: { content: translated_content }
|
||||||
rescue Google::Cloud::Error => e
|
|
||||||
# `details` carries the clean human message; `message` includes gRPC debug noise
|
|
||||||
render_could_not_create_error(e.details.presence || e.message)
|
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
|
|||||||
@@ -1,40 +1,27 @@
|
|||||||
class Api::V1::Accounts::Conversations::ParticipantsController < Api::V1::Accounts::Conversations::BaseController
|
class Api::V1::Accounts::Conversations::ParticipantsController < Api::V1::Accounts::Conversations::BaseController
|
||||||
include Events::Types
|
|
||||||
|
|
||||||
def show
|
def show
|
||||||
@participants = @conversation.conversation_participants
|
@participants = @conversation.conversation_participants
|
||||||
end
|
end
|
||||||
|
|
||||||
def create
|
def create
|
||||||
participant_ids_to_add = participants_to_be_added_ids
|
|
||||||
|
|
||||||
ActiveRecord::Base.transaction do
|
ActiveRecord::Base.transaction do
|
||||||
@participants = participant_ids_to_add.map { |user_id| @conversation.conversation_participants.find_or_create_by(user_id: user_id) }
|
@participants = participants_to_be_added_ids.map { |user_id| @conversation.conversation_participants.find_or_create_by(user_id: user_id) }
|
||||||
end
|
end
|
||||||
notify_unread_count_change if participant_ids_to_add.any?
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def update
|
def update
|
||||||
participant_ids_to_add = participants_to_be_added_ids
|
|
||||||
participant_ids_to_remove = participants_to_be_removed_ids
|
|
||||||
changed_participant_ids = participant_ids_to_add + participant_ids_to_remove
|
|
||||||
|
|
||||||
ActiveRecord::Base.transaction do
|
ActiveRecord::Base.transaction do
|
||||||
participant_ids_to_add.each { |user_id| @conversation.conversation_participants.find_or_create_by(user_id: user_id) }
|
participants_to_be_added_ids.each { |user_id| @conversation.conversation_participants.find_or_create_by(user_id: user_id) }
|
||||||
participant_ids_to_remove.each { |user_id| @conversation.conversation_participants.find_by(user_id: user_id)&.destroy }
|
participants_to_be_removed_ids.each { |user_id| @conversation.conversation_participants.find_by(user_id: user_id)&.destroy }
|
||||||
end
|
end
|
||||||
notify_unread_count_change if changed_participant_ids.any?
|
|
||||||
@participants = @conversation.conversation_participants
|
@participants = @conversation.conversation_participants
|
||||||
render action: 'show'
|
render action: 'show'
|
||||||
end
|
end
|
||||||
|
|
||||||
def destroy
|
def destroy
|
||||||
participant_ids_to_remove = current_participant_ids & params[:user_ids]
|
|
||||||
|
|
||||||
ActiveRecord::Base.transaction do
|
ActiveRecord::Base.transaction do
|
||||||
params[:user_ids].map { |user_id| @conversation.conversation_participants.find_by(user_id: user_id)&.destroy }
|
params[:user_ids].map { |user_id| @conversation.conversation_participants.find_by(user_id: user_id)&.destroy }
|
||||||
end
|
end
|
||||||
notify_unread_count_change if participant_ids_to_remove.any?
|
|
||||||
head :ok
|
head :ok
|
||||||
end
|
end
|
||||||
|
|
||||||
@@ -51,11 +38,4 @@ class Api::V1::Accounts::Conversations::ParticipantsController < Api::V1::Accoun
|
|||||||
def current_participant_ids
|
def current_participant_ids
|
||||||
@current_participant_ids ||= @conversation.conversation_participants.pluck(:user_id)
|
@current_participant_ids ||= @conversation.conversation_participants.pluck(:user_id)
|
||||||
end
|
end
|
||||||
|
|
||||||
def notify_unread_count_change
|
|
||||||
return unless Current.account.feature_enabled?('conversation_unread_counts')
|
|
||||||
return unless Current.account.feature_enabled?('unread_count_for_filters')
|
|
||||||
|
|
||||||
Rails.configuration.dispatcher.dispatch(CONVERSATION_UNREAD_COUNT_CHANGED, Time.zone.now, conversation: @conversation)
|
|
||||||
end
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -2,28 +2,12 @@ class Api::V1::Accounts::Conversations::UnreadCountsController < Api::V1::Accoun
|
|||||||
before_action :ensure_unread_counts_enabled
|
before_action :ensure_unread_counts_enabled
|
||||||
|
|
||||||
def index
|
def index
|
||||||
counts = if filtered_unread_counts_enabled?
|
counts = ::Conversations::UnreadCounts::Counter.new(account: Current.account, user: Current.user).perform
|
||||||
instrumentation.summarize_request(account_id: Current.account.id) { unread_counts }
|
|
||||||
else
|
|
||||||
unread_counts
|
|
||||||
end
|
|
||||||
render json: { payload: counts }
|
render json: { payload: counts }
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
|
|
||||||
def unread_counts
|
|
||||||
::Conversations::UnreadCounts::Counter.new(account: Current.account, user: Current.user).perform
|
|
||||||
end
|
|
||||||
|
|
||||||
def filtered_unread_counts_enabled?
|
|
||||||
Current.account.feature_enabled?(::Conversations::UnreadCounts::FilteredCounter::FEATURE_FLAG)
|
|
||||||
end
|
|
||||||
|
|
||||||
def instrumentation
|
|
||||||
::Conversations::UnreadCounts::FilteredCountInstrumentation
|
|
||||||
end
|
|
||||||
|
|
||||||
def ensure_unread_counts_enabled
|
def ensure_unread_counts_enabled
|
||||||
return if Current.account.feature_enabled?('conversation_unread_counts')
|
return if Current.account.feature_enabled?('conversation_unread_counts')
|
||||||
|
|
||||||
|
|||||||
@@ -164,7 +164,6 @@ class Api::V1::Accounts::ConversationsController < Api::V1::Accounts::BaseContro
|
|||||||
# rubocop:enable Rails/SkipsModelValidations
|
# rubocop:enable Rails/SkipsModelValidations
|
||||||
|
|
||||||
::Conversations::UnreadCounts::Notifier.new(@conversation).perform
|
::Conversations::UnreadCounts::Notifier.new(@conversation).perform
|
||||||
::Conversations::UnreadCounts::FilteredCountInvalidator.new(Current.account).conversation_changed!
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def should_update_last_seen?
|
def should_update_last_seen?
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ class Api::V1::Accounts::InboxesController < Api::V1::Accounts::BaseController
|
|||||||
include Api::V1::InboxesHelper
|
include Api::V1::InboxesHelper
|
||||||
before_action :fetch_inbox, except: [:index, :create]
|
before_action :fetch_inbox, except: [:index, :create]
|
||||||
before_action :fetch_agent_bot, only: [:set_agent_bot]
|
before_action :fetch_agent_bot, only: [:set_agent_bot]
|
||||||
|
before_action :validate_limit, only: [:create]
|
||||||
# we are already handling the authorization in fetch inbox
|
# we are already handling the authorization in fetch inbox
|
||||||
before_action :check_authorization, except: [:show]
|
before_action :check_authorization, except: [:show]
|
||||||
|
|
||||||
|
|||||||
@@ -8,10 +8,8 @@ class Api::V1::Accounts::Whatsapp::AuthorizationsController < Api::V1::Accounts:
|
|||||||
validate_embedded_signup_params!
|
validate_embedded_signup_params!
|
||||||
channel = process_embedded_signup
|
channel = process_embedded_signup
|
||||||
render_success_response(channel.inbox)
|
render_success_response(channel.inbox)
|
||||||
rescue CustomExceptions::Inbox::LimitExceeded => e
|
|
||||||
render_error_response(e)
|
|
||||||
rescue StandardError => e
|
rescue StandardError => e
|
||||||
render_embedded_signup_error(e)
|
render_error_response(e)
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
@@ -57,7 +55,7 @@ class Api::V1::Accounts::Whatsapp::AuthorizationsController < Api::V1::Accounts:
|
|||||||
render json: response
|
render json: response
|
||||||
end
|
end
|
||||||
|
|
||||||
def render_embedded_signup_error(error)
|
def render_error_response(error)
|
||||||
Rails.logger.error "[WHATSAPP AUTHORIZATION] Embedded signup error: #{error.message}"
|
Rails.logger.error "[WHATSAPP AUTHORIZATION] Embedded signup error: #{error.message}"
|
||||||
Rails.logger.error error.backtrace.join("\n")
|
Rails.logger.error error.backtrace.join("\n")
|
||||||
render json: {
|
render json: {
|
||||||
|
|||||||
@@ -2,7 +2,6 @@ class Api::V1::Widget::ContactsController < Api::V1::Widget::BaseController
|
|||||||
include WidgetHelper
|
include WidgetHelper
|
||||||
|
|
||||||
before_action :validate_hmac, only: [:set_user]
|
before_action :validate_hmac, only: [:set_user]
|
||||||
before_action :validate_hmac_for_identified_update, only: [:update]
|
|
||||||
|
|
||||||
def show; end
|
def show; end
|
||||||
|
|
||||||
@@ -47,16 +46,6 @@ class Api::V1::Widget::ContactsController < Api::V1::Widget::BaseController
|
|||||||
@contact.identifier.present? && @contact.identifier != permitted_params[:identifier]
|
@contact.identifier.present? && @contact.identifier != permitted_params[:identifier]
|
||||||
end
|
end
|
||||||
|
|
||||||
# The plain update endpoint is also used for anonymous prechat updates
|
|
||||||
# (name/email/phone/custom_attributes with no identifier), which must keep
|
|
||||||
# working on hmac_mandatory inboxes. Only the identity-binding path, where an
|
|
||||||
# identifier is supplied and the contact can be rebound, requires HMAC.
|
|
||||||
def validate_hmac_for_identified_update
|
|
||||||
return if params[:identifier].blank?
|
|
||||||
|
|
||||||
validate_hmac
|
|
||||||
end
|
|
||||||
|
|
||||||
def validate_hmac
|
def validate_hmac
|
||||||
return unless should_verify_hmac?
|
return unless should_verify_hmac?
|
||||||
|
|
||||||
@@ -73,15 +62,11 @@ class Api::V1::Widget::ContactsController < Api::V1::Widget::BaseController
|
|||||||
end
|
end
|
||||||
|
|
||||||
def valid_hmac?
|
def valid_hmac?
|
||||||
expected_hash = OpenSSL::HMAC.hexdigest(
|
params[:identifier_hash] == OpenSSL::HMAC.hexdigest(
|
||||||
'sha256',
|
'sha256',
|
||||||
@web_widget.hmac_token,
|
@web_widget.hmac_token,
|
||||||
params[:identifier].to_s
|
params[:identifier].to_s
|
||||||
)
|
)
|
||||||
identifier_hash = params[:identifier_hash].to_s
|
|
||||||
return false unless identifier_hash.bytesize == expected_hash.bytesize
|
|
||||||
|
|
||||||
ActiveSupport::SecurityUtils.secure_compare(identifier_hash, expected_hash)
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def permitted_params
|
def permitted_params
|
||||||
|
|||||||
@@ -51,13 +51,6 @@ class Api::V2::Accounts::ReportsController < Api::V1::Accounts::BaseController
|
|||||||
generate_csv('conversation_traffic_reports', 'api/v2/accounts/reports/conversation_traffic')
|
generate_csv('conversation_traffic_reports', 'api/v2/accounts/reports/conversation_traffic')
|
||||||
end
|
end
|
||||||
|
|
||||||
def drilldown
|
|
||||||
return head :unauthorized unless Current.account_user.administrator?
|
|
||||||
return head :unprocessable_entity unless valid_drilldown_params?
|
|
||||||
|
|
||||||
render json: V2::Reports::DrilldownBuilder.new(Current.account, drilldown_params).build
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversations
|
def conversations
|
||||||
return head :unprocessable_entity if params[:type].blank?
|
return head :unprocessable_entity if params[:type].blank?
|
||||||
|
|
||||||
@@ -140,22 +133,6 @@ class Api::V2::Accounts::ReportsController < Api::V1::Accounts::BaseController
|
|||||||
})
|
})
|
||||||
end
|
end
|
||||||
|
|
||||||
def drilldown_params
|
|
||||||
permitted_params = params.permit(
|
|
||||||
:metric, :id, :since, :until, :group_by, :timezone_offset, :bucket_timestamp, :page, :per_page
|
|
||||||
).to_h.symbolize_keys
|
|
||||||
permitted_params.merge(
|
|
||||||
type: (params[:type].presence || 'account').to_sym,
|
|
||||||
business_hours: ActiveModel::Type::Boolean.new.cast(params[:business_hours])
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
def valid_drilldown_params?
|
|
||||||
%i[metric bucket_timestamp since until].all? { |param| params[param].present? } &&
|
|
||||||
Reports::ReportMetricRegistry.supported?(params[:metric]) &&
|
|
||||||
V2::Reports::DrilldownBuilder.supported_dimension_type?(params[:type]) && Reports::DrilldownTimestampValidator.valid?(params)
|
|
||||||
end
|
|
||||||
|
|
||||||
def conversation_params
|
def conversation_params
|
||||||
{
|
{
|
||||||
type: params[:type].to_sym,
|
type: params[:type].to_sym,
|
||||||
|
|||||||
@@ -1,15 +1,8 @@
|
|||||||
module RequestExceptionHandler
|
module RequestExceptionHandler
|
||||||
extend ActiveSupport::Concern
|
extend ActiveSupport::Concern
|
||||||
|
|
||||||
QUERY_CANCELED_ERROR_MESSAGE_PATTERNS = [
|
|
||||||
'ActiveRecord::QueryCanceled',
|
|
||||||
'PG::QueryCanceled',
|
|
||||||
'canceling statement due to statement timeout'
|
|
||||||
].freeze
|
|
||||||
|
|
||||||
included do
|
included do
|
||||||
rescue_from ActiveRecord::RecordInvalid, with: :render_record_invalid
|
rescue_from ActiveRecord::RecordInvalid, with: :render_record_invalid
|
||||||
rescue_from CustomExceptions::Inbox::LimitExceeded, with: :render_error_response
|
|
||||||
end
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
@@ -25,9 +18,6 @@ module RequestExceptionHandler
|
|||||||
rescue ActionController::ParameterMissing => e
|
rescue ActionController::ParameterMissing => e
|
||||||
log_handled_error(e)
|
log_handled_error(e)
|
||||||
render_could_not_create_error(e.message)
|
render_could_not_create_error(e.message)
|
||||||
rescue ActiveRecord::QueryCanceled => e
|
|
||||||
log_handled_error(e)
|
|
||||||
render_could_not_create_error(database_query_canceled_message)
|
|
||||||
ensure
|
ensure
|
||||||
# to address the thread variable leak issues in Puma/Thin webserver
|
# to address the thread variable leak issues in Puma/Thin webserver
|
||||||
Current.reset
|
Current.reset
|
||||||
@@ -41,8 +31,8 @@ module RequestExceptionHandler
|
|||||||
render json: { error: message }, status: :not_found
|
render json: { error: message }, status: :not_found
|
||||||
end
|
end
|
||||||
|
|
||||||
def render_could_not_create_error(error)
|
def render_could_not_create_error(message)
|
||||||
render json: { error: sanitized_error_message(error) }, status: :unprocessable_entity
|
render json: { error: message }, status: :unprocessable_entity
|
||||||
end
|
end
|
||||||
|
|
||||||
def render_payment_required(message)
|
def render_payment_required(message)
|
||||||
@@ -69,19 +59,4 @@ module RequestExceptionHandler
|
|||||||
def log_handled_error(exception)
|
def log_handled_error(exception)
|
||||||
logger.info("Handled error: #{exception.inspect}")
|
logger.info("Handled error: #{exception.inspect}")
|
||||||
end
|
end
|
||||||
|
|
||||||
def sanitized_error_message(message)
|
|
||||||
return database_query_canceled_message if database_query_canceled_message?(message)
|
|
||||||
|
|
||||||
message
|
|
||||||
end
|
|
||||||
|
|
||||||
def database_query_canceled_message?(message)
|
|
||||||
error_message = message.to_s
|
|
||||||
QUERY_CANCELED_ERROR_MESSAGE_PATTERNS.any? { |pattern| error_message.include?(pattern) }
|
|
||||||
end
|
|
||||||
|
|
||||||
def database_query_canceled_message
|
|
||||||
I18n.t('errors.database.query_canceled')
|
|
||||||
end
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -11,8 +11,6 @@ class Instagram::CallbacksController < ApplicationController
|
|||||||
end
|
end
|
||||||
|
|
||||||
process_successful_authorization
|
process_successful_authorization
|
||||||
rescue CustomExceptions::Inbox::LimitExceeded => e
|
|
||||||
handle_limit_error(e)
|
|
||||||
rescue StandardError => e
|
rescue StandardError => e
|
||||||
handle_error(e)
|
handle_error(e)
|
||||||
end
|
end
|
||||||
@@ -49,14 +47,6 @@ class Instagram::CallbacksController < ApplicationController
|
|||||||
redirect_to_error_page(error_info)
|
redirect_to_error_page(error_info)
|
||||||
end
|
end
|
||||||
|
|
||||||
def handle_limit_error(error)
|
|
||||||
redirect_to_error_page(
|
|
||||||
'error_type' => error.class.name,
|
|
||||||
'code' => Rack::Utils.status_code(error.http_status),
|
|
||||||
'error_message' => error.message
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
# Extract error details from the exception
|
# Extract error details from the exception
|
||||||
def extract_error_info(error)
|
def extract_error_info(error)
|
||||||
if error.is_a?(OAuth2::Error)
|
if error.is_a?(OAuth2::Error)
|
||||||
|
|||||||
@@ -35,15 +35,11 @@ class Public::Api::V1::Inboxes::ContactsController < Public::Api::V1::InboxesCon
|
|||||||
end
|
end
|
||||||
|
|
||||||
def valid_hmac?
|
def valid_hmac?
|
||||||
expected_hash = OpenSSL::HMAC.hexdigest(
|
params[:identifier_hash] == OpenSSL::HMAC.hexdigest(
|
||||||
'sha256',
|
'sha256',
|
||||||
@inbox_channel.hmac_token,
|
@inbox_channel.hmac_token,
|
||||||
params[:identifier].to_s
|
params[:identifier].to_s
|
||||||
)
|
)
|
||||||
identifier_hash = params[:identifier_hash].to_s
|
|
||||||
return false unless identifier_hash.bytesize == expected_hash.bytesize
|
|
||||||
|
|
||||||
ActiveSupport::SecurityUtils.secure_compare(identifier_hash, expected_hash)
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def permitted_params
|
def permitted_params
|
||||||
|
|||||||
@@ -12,6 +12,7 @@ class SuperAdmin::AppConfigsController < SuperAdmin::ApplicationController
|
|||||||
@installation_configs = ConfigLoader.new.general_configs.each_with_object({}) do |config_hash, result|
|
@installation_configs = ConfigLoader.new.general_configs.each_with_object({}) do |config_hash, result|
|
||||||
result[config_hash['name']] = config_hash.except('name')
|
result[config_hash['name']] = config_hash.except('name')
|
||||||
end
|
end
|
||||||
|
populate_captain_config_metadata if @config == 'captain'
|
||||||
end
|
end
|
||||||
|
|
||||||
def create
|
def create
|
||||||
@@ -20,7 +21,7 @@ class SuperAdmin::AppConfigsController < SuperAdmin::ApplicationController
|
|||||||
next unless @allowed_configs.include?(key)
|
next unless @allowed_configs.include?(key)
|
||||||
|
|
||||||
i = InstallationConfig.where(name: key).first_or_create(value: value, locked: false)
|
i = InstallationConfig.where(name: key).first_or_create(value: value, locked: false)
|
||||||
i.value = value
|
i.value = app_config_value(key, value)
|
||||||
errors.concat(i.errors.full_messages) unless i.save
|
errors.concat(i.errors.full_messages) unless i.save
|
||||||
end
|
end
|
||||||
|
|
||||||
@@ -50,7 +51,7 @@ class SuperAdmin::AppConfigsController < SuperAdmin::ApplicationController
|
|||||||
'whatsapp_embedded' => %w[WHATSAPP_APP_ID WHATSAPP_APP_SECRET WHATSAPP_CONFIGURATION_ID WHATSAPP_API_VERSION],
|
'whatsapp_embedded' => %w[WHATSAPP_APP_ID WHATSAPP_APP_SECRET WHATSAPP_CONFIGURATION_ID WHATSAPP_API_VERSION],
|
||||||
'notion' => %w[NOTION_CLIENT_ID NOTION_CLIENT_SECRET],
|
'notion' => %w[NOTION_CLIENT_ID NOTION_CLIENT_SECRET],
|
||||||
'google' => %w[GOOGLE_OAUTH_CLIENT_ID GOOGLE_OAUTH_CLIENT_SECRET GOOGLE_OAUTH_REDIRECT_URI ENABLE_GOOGLE_OAUTH_LOGIN],
|
'google' => %w[GOOGLE_OAUTH_CLIENT_ID GOOGLE_OAUTH_CLIENT_SECRET GOOGLE_OAUTH_REDIRECT_URI ENABLE_GOOGLE_OAUTH_LOGIN],
|
||||||
'captain' => %w[CAPTAIN_OPEN_AI_API_KEY CAPTAIN_OPEN_AI_MODEL CAPTAIN_OPEN_AI_ENDPOINT]
|
'captain' => captain_config_options
|
||||||
}
|
}
|
||||||
|
|
||||||
@allowed_configs = mapping.fetch(
|
@allowed_configs = mapping.fetch(
|
||||||
@@ -71,7 +72,62 @@ class SuperAdmin::AppConfigsController < SuperAdmin::ApplicationController
|
|||||||
end
|
end
|
||||||
|
|
||||||
def restart_required_config_saved?
|
def restart_required_config_saved?
|
||||||
params.fetch('app_config', {}).keys.intersect?(InstallationConfig::RESTART_REQUIRED_CONFIG_KEYS)
|
saved_keys = params.fetch('app_config', {}).keys
|
||||||
|
saved_keys.intersect?(InstallationConfig::RESTART_REQUIRED_CONFIG_KEYS) ||
|
||||||
|
saved_keys.intersect?(Llm::Config.provider_config_keys(captain_provider))
|
||||||
|
end
|
||||||
|
|
||||||
|
def captain_config_options
|
||||||
|
Llm::Config.provider_config_keys(captain_provider)
|
||||||
|
end
|
||||||
|
|
||||||
|
def populate_captain_config_metadata
|
||||||
|
@app_config[Llm::ProviderConfig::PROVIDER_CONFIG_KEY] = captain_provider
|
||||||
|
|
||||||
|
populate_provider_metadata
|
||||||
|
populate_model_metadata
|
||||||
|
populate_provider_field_metadata
|
||||||
|
end
|
||||||
|
|
||||||
|
def populate_provider_metadata
|
||||||
|
@installation_configs[Llm::ProviderConfig::PROVIDER_CONFIG_KEY] = {
|
||||||
|
'display_title' => 'LLM Provider',
|
||||||
|
'description' => 'Provider used by Captain AI for chat and generation features.',
|
||||||
|
'type' => 'select',
|
||||||
|
'options' => Llm::Config.provider_options
|
||||||
|
}
|
||||||
|
end
|
||||||
|
|
||||||
|
def populate_model_metadata
|
||||||
|
@installation_configs[Llm::ProviderConfig::MODEL_CONFIG_KEY] = {
|
||||||
|
'display_title' => 'LLM Model',
|
||||||
|
'description' => "Default #{Llm::Config.provider_options[captain_provider]} model used by Captain AI.",
|
||||||
|
'type' => 'select',
|
||||||
|
'options' => Llm::Models.provider_default_model_options(captain_provider)
|
||||||
|
}
|
||||||
|
end
|
||||||
|
|
||||||
|
def populate_provider_field_metadata
|
||||||
|
Llm::Config.provider_config_options(captain_provider).each do |option, config_key|
|
||||||
|
@installation_configs[config_key] ||= {
|
||||||
|
'display_title' => option.to_s.humanize.titleize,
|
||||||
|
'description' => "RubyLLM #{option} configuration.",
|
||||||
|
'type' => option.to_s.end_with?('api_key', 'secret_key', 'session_token', 'service_account_key', 'auth_token') ? 'secret' : 'text',
|
||||||
|
'provider' => captain_provider
|
||||||
|
}
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
def captain_provider
|
||||||
|
requested_provider = params.dig(:app_config, Llm::ProviderConfig::PROVIDER_CONFIG_KEY).presence || params[:provider].presence
|
||||||
|
return requested_provider if Llm::Config.provider_options.key?(requested_provider)
|
||||||
|
|
||||||
|
Llm::Config.current_provider
|
||||||
|
end
|
||||||
|
|
||||||
|
def app_config_value(key, value)
|
||||||
|
return value unless @config == 'captain' && key == Llm::ProviderConfig::MODEL_CONFIG_KEY
|
||||||
|
return value if Llm::Models.provider_default_model_options(captain_provider).key?(value)
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|||||||
@@ -6,8 +6,6 @@ class Tiktok::CallbacksController < ApplicationController
|
|||||||
return handle_ungranted_scopes_error unless all_scopes_granted?
|
return handle_ungranted_scopes_error unless all_scopes_granted?
|
||||||
|
|
||||||
process_successful_authorization
|
process_successful_authorization
|
||||||
rescue CustomExceptions::Inbox::LimitExceeded => e
|
|
||||||
handle_limit_error(e)
|
|
||||||
rescue StandardError => e
|
rescue StandardError => e
|
||||||
handle_error(e)
|
handle_error(e)
|
||||||
end
|
end
|
||||||
@@ -38,14 +36,6 @@ class Tiktok::CallbacksController < ApplicationController
|
|||||||
redirect_to_error_page(error_type: error.class.name, code: 500, error_message: error.message)
|
redirect_to_error_page(error_type: error.class.name, code: 500, error_message: error.message)
|
||||||
end
|
end
|
||||||
|
|
||||||
def handle_limit_error(error)
|
|
||||||
redirect_to_error_page(
|
|
||||||
error_type: error.class.name,
|
|
||||||
code: Rack::Utils.status_code(error.http_status),
|
|
||||||
error_message: error.message
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
# Handles the case when a user denies permissions or cancels the authorization flow
|
# Handles the case when a user denies permissions or cancels the authorization flow
|
||||||
def handle_authorization_error
|
def handle_authorization_error
|
||||||
redirect_to_error_page(
|
redirect_to_error_page(
|
||||||
|
|||||||
@@ -114,4 +114,10 @@ module Api::V1::InboxesHelper
|
|||||||
'sms' => Current.account.sms_channels
|
'sms' => Current.account.sms_channels
|
||||||
}[permitted_params[:channel][:type]]
|
}[permitted_params[:channel][:type]]
|
||||||
end
|
end
|
||||||
|
|
||||||
|
def validate_limit
|
||||||
|
return unless Current.account.inboxes.count >= Current.account.usage_limits[:inboxes]
|
||||||
|
|
||||||
|
render_payment_required('Account limit exceeded. Upgrade to a higher plan')
|
||||||
|
end
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -22,16 +22,4 @@ module BillingHelper
|
|||||||
def agents(account)
|
def agents(account)
|
||||||
account.users.count
|
account.users.count
|
||||||
end
|
end
|
||||||
|
|
||||||
# current_period_end moved to the subscription item in newer Stripe API versions; read both.
|
|
||||||
def subscription_period_end(subscription)
|
|
||||||
subscription['current_period_end'] || subscription['items']['data'].first&.[]('current_period_end')
|
|
||||||
end
|
|
||||||
|
|
||||||
def subscription_ends_on(subscription)
|
|
||||||
period_end = subscription_period_end(subscription)
|
|
||||||
return if period_end.blank?
|
|
||||||
|
|
||||||
Time.zone.at(period_end)
|
|
||||||
end
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -68,8 +68,6 @@ module Filters::FilterHelper
|
|||||||
when 'text_case_insensitive'
|
when 'text_case_insensitive'
|
||||||
text_case_insensitive_filter(query_hash, filter_operator_value)
|
text_case_insensitive_filter(query_hash, filter_operator_value)
|
||||||
else
|
else
|
||||||
return text_cast_filter(query_hash, filter_operator_value) if text_search_on_display_id?(query_hash)
|
|
||||||
|
|
||||||
default_filter(query_hash, filter_operator_value)
|
default_filter(query_hash, filter_operator_value)
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
@@ -84,18 +82,10 @@ module Filters::FilterHelper
|
|||||||
"#{filter_operator_value} #{query_hash[:query_operator]}"
|
"#{filter_operator_value} #{query_hash[:query_operator]}"
|
||||||
end
|
end
|
||||||
|
|
||||||
def text_cast_filter(query_hash, filter_operator_value)
|
|
||||||
"(#{filter_config[:table_name]}.#{query_hash[:attribute_key]})::text #{filter_operator_value} #{query_hash[:query_operator]}"
|
|
||||||
end
|
|
||||||
|
|
||||||
def default_filter(query_hash, filter_operator_value)
|
def default_filter(query_hash, filter_operator_value)
|
||||||
"#{filter_config[:table_name]}.#{query_hash[:attribute_key]} #{filter_operator_value} #{query_hash[:query_operator]}"
|
"#{filter_config[:table_name]}.#{query_hash[:attribute_key]} #{filter_operator_value} #{query_hash[:query_operator]}"
|
||||||
end
|
end
|
||||||
|
|
||||||
def text_search_on_display_id?(query_hash)
|
|
||||||
query_hash[:attribute_key] == 'display_id' && %w[contains does_not_contain].include?(query_hash[:filter_operator])
|
|
||||||
end
|
|
||||||
|
|
||||||
def validate_single_condition(condition)
|
def validate_single_condition(condition)
|
||||||
return if condition['query_operator'].nil?
|
return if condition['query_operator'].nil?
|
||||||
return if condition['query_operator'].empty?
|
return if condition['query_operator'].empty?
|
||||||
|
|||||||
@@ -6,12 +6,9 @@ class AssignableAgents extends ApiClient {
|
|||||||
super('assignable_agents', { accountScoped: true });
|
super('assignable_agents', { accountScoped: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
get(inboxIds, { includeAgentBots = false } = {}) {
|
get(inboxIds) {
|
||||||
return axios.get(this.url, {
|
return axios.get(this.url, {
|
||||||
params: {
|
params: { inbox_ids: inboxIds },
|
||||||
inbox_ids: inboxIds,
|
|
||||||
...(includeAgentBots ? { include_agent_bots: true } : {}),
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +1,6 @@
|
|||||||
/* global axios */
|
/* global axios */
|
||||||
import ApiClient from '../ApiClient';
|
import ApiClient from '../ApiClient';
|
||||||
|
|
||||||
// Viewer's UTC offset in hours, matching the reports API convention so the
|
|
||||||
// backend can anchor calendar ranges to the viewer's day.
|
|
||||||
const getTimezoneOffset = () => -new Date().getTimezoneOffset() / 60;
|
|
||||||
|
|
||||||
class CaptainAssistant extends ApiClient {
|
class CaptainAssistant extends ApiClient {
|
||||||
constructor() {
|
constructor() {
|
||||||
super('captain/assistants', { accountScoped: true });
|
super('captain/assistants', { accountScoped: true });
|
||||||
@@ -25,18 +21,6 @@ class CaptainAssistant extends ApiClient {
|
|||||||
message_history: messageHistory,
|
message_history: messageHistory,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getStats({ assistantId, range }) {
|
|
||||||
return axios.get(`${this.url}/${assistantId}/stats`, {
|
|
||||||
params: { range, timezone_offset: getTimezoneOffset() },
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
getSummary({ assistantId, range }) {
|
|
||||||
return axios.get(`${this.url}/${assistantId}/summary`, {
|
|
||||||
params: { range, timezone_offset: getTimezoneOffset() },
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default new CaptainAssistant();
|
export default new CaptainAssistant();
|
||||||
|
|||||||
@@ -14,10 +14,6 @@ class EnterpriseAccountAPI extends ApiClient {
|
|||||||
return axios.post(`${this.url}subscription`);
|
return axios.post(`${this.url}subscription`);
|
||||||
}
|
}
|
||||||
|
|
||||||
selectBillingCurrency(currency) {
|
|
||||||
return axios.post(`${this.url}select_billing_currency`, { currency });
|
|
||||||
}
|
|
||||||
|
|
||||||
getLimits() {
|
getLimits() {
|
||||||
return axios.get(`${this.url}limits`);
|
return axios.get(`${this.url}limits`);
|
||||||
}
|
}
|
||||||
@@ -31,11 +27,6 @@ class EnterpriseAccountAPI extends ApiClient {
|
|||||||
createTopupCheckout(credits) {
|
createTopupCheckout(credits) {
|
||||||
return axios.post(`${this.url}topup_checkout`, { credits });
|
return axios.post(`${this.url}topup_checkout`, { credits });
|
||||||
}
|
}
|
||||||
|
|
||||||
// Topup packages for the account's billing currency.
|
|
||||||
getTopupOptions() {
|
|
||||||
return axios.get(`${this.url}topup_options`);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default new EnterpriseAccountAPI();
|
export default new EnterpriseAccountAPI();
|
||||||
|
|||||||
@@ -62,10 +62,9 @@ class ConversationApi extends ApiClient {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
assignAgent({ conversationId, agentId, assigneeType }) {
|
assignAgent({ conversationId, agentId }) {
|
||||||
return axios.post(`${this.url}/${conversationId}/assignments`, {
|
return axios.post(`${this.url}/${conversationId}/assignments`, {
|
||||||
assignee_id: agentId,
|
assignee_id: agentId,
|
||||||
assignee_type: assigneeType,
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -31,42 +31,6 @@ class ReportsAPI extends ApiClient {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getDrilldown({
|
|
||||||
metric,
|
|
||||||
bucketTimestamp,
|
|
||||||
from,
|
|
||||||
to,
|
|
||||||
type = 'account',
|
|
||||||
id,
|
|
||||||
groupBy,
|
|
||||||
businessHours,
|
|
||||||
page,
|
|
||||||
perPage,
|
|
||||||
signal,
|
|
||||||
}) {
|
|
||||||
const requestConfig = {
|
|
||||||
params: {
|
|
||||||
metric,
|
|
||||||
bucket_timestamp: bucketTimestamp,
|
|
||||||
since: from,
|
|
||||||
until: to,
|
|
||||||
type,
|
|
||||||
id,
|
|
||||||
group_by: groupBy,
|
|
||||||
business_hours: businessHours,
|
|
||||||
timezone_offset: getTimeOffset(),
|
|
||||||
page,
|
|
||||||
per_page: perPage,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
if (signal) {
|
|
||||||
requestConfig.signal = signal;
|
|
||||||
}
|
|
||||||
|
|
||||||
return axios.get(`${this.url}/drilldown`, requestConfig);
|
|
||||||
}
|
|
||||||
|
|
||||||
// eslint-disable-next-line default-param-last
|
// eslint-disable-next-line default-param-last
|
||||||
getSummary(since, until, type = 'account', id, groupBy, businessHours) {
|
getSummary(since, until, type = 'account', id, groupBy, businessHours) {
|
||||||
return axios.get(`${this.url}/summary`, {
|
return axios.get(`${this.url}/summary`, {
|
||||||
|
|||||||
@@ -26,15 +26,5 @@ describe('#AssignableAgentsAPI', () => {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('#getAssignableAgents with agent bots', () => {
|
|
||||||
assignableAgentsAPI.get([1], { includeAgentBots: true });
|
|
||||||
expect(axiosMock.get).toHaveBeenCalledWith('/api/v1/assignable_agents', {
|
|
||||||
params: {
|
|
||||||
inbox_ids: [1],
|
|
||||||
include_agent_bots: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -90,16 +90,11 @@ describe('#ConversationAPI', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('#assignAgent', () => {
|
it('#assignAgent', () => {
|
||||||
conversationAPI.assignAgent({
|
conversationAPI.assignAgent({ conversationId: 12, agentId: 34 });
|
||||||
conversationId: 12,
|
|
||||||
agentId: 34,
|
|
||||||
assigneeType: 'AgentBot',
|
|
||||||
});
|
|
||||||
expect(axiosMock.post).toHaveBeenCalledWith(
|
expect(axiosMock.post).toHaveBeenCalledWith(
|
||||||
`/api/v1/conversations/12/assignments`,
|
`/api/v1/conversations/12/assignments`,
|
||||||
{
|
{
|
||||||
assignee_id: 34,
|
assignee_id: 34,
|
||||||
assignee_type: 'AgentBot',
|
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,8 +1,6 @@
|
|||||||
import reportsAPI from '../reports';
|
import reportsAPI from '../reports';
|
||||||
import ApiClient from '../ApiClient';
|
import ApiClient from '../ApiClient';
|
||||||
|
|
||||||
const timezoneOffset = () => -new Date().getTimezoneOffset() / 60;
|
|
||||||
|
|
||||||
describe('#Reports API', () => {
|
describe('#Reports API', () => {
|
||||||
it('creates correct instance', () => {
|
it('creates correct instance', () => {
|
||||||
expect(reportsAPI).toBeInstanceOf(ApiClient);
|
expect(reportsAPI).toBeInstanceOf(ApiClient);
|
||||||
@@ -13,7 +11,6 @@ describe('#Reports API', () => {
|
|||||||
expect(reportsAPI).toHaveProperty('update');
|
expect(reportsAPI).toHaveProperty('update');
|
||||||
expect(reportsAPI).toHaveProperty('delete');
|
expect(reportsAPI).toHaveProperty('delete');
|
||||||
expect(reportsAPI).toHaveProperty('getReports');
|
expect(reportsAPI).toHaveProperty('getReports');
|
||||||
expect(reportsAPI).toHaveProperty('getDrilldown');
|
|
||||||
expect(reportsAPI).toHaveProperty('getSummary');
|
expect(reportsAPI).toHaveProperty('getSummary');
|
||||||
expect(reportsAPI).toHaveProperty('getAgentReports');
|
expect(reportsAPI).toHaveProperty('getAgentReports');
|
||||||
expect(reportsAPI).toHaveProperty('getLabelReports');
|
expect(reportsAPI).toHaveProperty('getLabelReports');
|
||||||
@@ -45,14 +42,11 @@ describe('#Reports API', () => {
|
|||||||
});
|
});
|
||||||
expect(axiosMock.get).toHaveBeenCalledWith('/api/v2/reports', {
|
expect(axiosMock.get).toHaveBeenCalledWith('/api/v2/reports', {
|
||||||
params: {
|
params: {
|
||||||
business_hours: undefined,
|
|
||||||
group_by: undefined,
|
|
||||||
id: undefined,
|
|
||||||
metric: 'conversations_count',
|
metric: 'conversations_count',
|
||||||
since: 1621103400,
|
since: 1621103400,
|
||||||
until: 1621621800,
|
until: 1621621800,
|
||||||
type: 'account',
|
type: 'account',
|
||||||
timezone_offset: timezoneOffset(),
|
timezone_offset: -0,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@@ -65,70 +59,13 @@ describe('#Reports API', () => {
|
|||||||
group_by: undefined,
|
group_by: undefined,
|
||||||
id: undefined,
|
id: undefined,
|
||||||
since: 1621103400,
|
since: 1621103400,
|
||||||
timezone_offset: timezoneOffset(),
|
timezone_offset: -0,
|
||||||
type: 'account',
|
type: 'account',
|
||||||
until: 1621621800,
|
until: 1621621800,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('#getDrilldown', () => {
|
|
||||||
reportsAPI.getDrilldown({
|
|
||||||
metric: 'incoming_messages_count',
|
|
||||||
bucketTimestamp: 1621103400,
|
|
||||||
from: 1621103400,
|
|
||||||
to: 1621621800,
|
|
||||||
type: 'inbox',
|
|
||||||
id: 1,
|
|
||||||
groupBy: 'day',
|
|
||||||
businessHours: false,
|
|
||||||
page: 2,
|
|
||||||
perPage: 25,
|
|
||||||
});
|
|
||||||
expect(axiosMock.get).toHaveBeenCalledWith('/api/v2/reports/drilldown', {
|
|
||||||
params: {
|
|
||||||
metric: 'incoming_messages_count',
|
|
||||||
bucket_timestamp: 1621103400,
|
|
||||||
since: 1621103400,
|
|
||||||
until: 1621621800,
|
|
||||||
type: 'inbox',
|
|
||||||
id: 1,
|
|
||||||
group_by: 'day',
|
|
||||||
business_hours: false,
|
|
||||||
timezone_offset: timezoneOffset(),
|
|
||||||
page: 2,
|
|
||||||
per_page: 25,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('#getDrilldown with abort signal', () => {
|
|
||||||
const controller = new AbortController();
|
|
||||||
|
|
||||||
reportsAPI.getDrilldown({
|
|
||||||
metric: 'incoming_messages_count',
|
|
||||||
bucketTimestamp: 1621103400,
|
|
||||||
signal: controller.signal,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(axiosMock.get).toHaveBeenCalledWith('/api/v2/reports/drilldown', {
|
|
||||||
params: {
|
|
||||||
metric: 'incoming_messages_count',
|
|
||||||
bucket_timestamp: 1621103400,
|
|
||||||
since: undefined,
|
|
||||||
until: undefined,
|
|
||||||
type: 'account',
|
|
||||||
id: undefined,
|
|
||||||
group_by: undefined,
|
|
||||||
business_hours: undefined,
|
|
||||||
timezone_offset: timezoneOffset(),
|
|
||||||
page: undefined,
|
|
||||||
per_page: undefined,
|
|
||||||
},
|
|
||||||
signal: controller.signal,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('#getAgentReports', () => {
|
it('#getAgentReports', () => {
|
||||||
reportsAPI.getAgentReports({
|
reportsAPI.getAgentReports({
|
||||||
from: 1621103400,
|
from: 1621103400,
|
||||||
|
|||||||
+1
-7
@@ -16,10 +16,6 @@ const props = defineProps({
|
|||||||
type: Array,
|
type: Array,
|
||||||
required: true,
|
required: true,
|
||||||
},
|
},
|
||||||
contact: {
|
|
||||||
type: Object,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
@@ -53,9 +49,7 @@ const unreadMessagesCount = computed(() => {
|
|||||||
|
|
||||||
const hasSlaThreshold = computed(() => {
|
const hasSlaThreshold = computed(() => {
|
||||||
return (
|
return (
|
||||||
!props.contact?.blocked &&
|
slaCardLabelRef.value?.hasSlaThreshold && props.conversation?.slaPolicyId
|
||||||
slaCardLabelRef.value?.hasSlaThreshold &&
|
|
||||||
props.conversation?.appliedSla?.id
|
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
-1
@@ -126,7 +126,6 @@ const onCardClick = e => {
|
|||||||
v-show="!showMessagePreviewWithoutMeta"
|
v-show="!showMessagePreviewWithoutMeta"
|
||||||
ref="cardMessagePreviewWithMetaRef"
|
ref="cardMessagePreviewWithMetaRef"
|
||||||
:conversation="conversation"
|
:conversation="conversation"
|
||||||
:contact="contact"
|
|
||||||
:account-labels="accountLabels"
|
:account-labels="accountLabels"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
+1
-3
@@ -51,9 +51,7 @@ const unreadCount = computed(() => props.chat.unread_count);
|
|||||||
const slaCardLabel = useTemplateRef('slaCardLabel');
|
const slaCardLabel = useTemplateRef('slaCardLabel');
|
||||||
|
|
||||||
const hasSlaPolicyId = computed(
|
const hasSlaPolicyId = computed(
|
||||||
() =>
|
() => props.chat?.sla_policy_id || slaCardLabel.value?.hasSlaThreshold
|
||||||
!props.currentContact?.blocked &&
|
|
||||||
(props.chat?.applied_sla?.id || slaCardLabel.value?.hasSlaThreshold)
|
|
||||||
);
|
);
|
||||||
|
|
||||||
const selectedModel = computed({
|
const selectedModel = computed({
|
||||||
|
|||||||
+11
-4
@@ -1,6 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
||||||
import { evaluateSLAStatus } from 'dashboard/helper/slaHelper';
|
import { evaluateSLAStatus } from '@chatwoot/utils';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
conversation: {
|
conversation: {
|
||||||
@@ -19,8 +19,16 @@ const slaStatus = ref({
|
|||||||
icon: null,
|
icon: null,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// TODO: Remove this once we update the helper from utils
|
||||||
|
// https://github.com/chatwoot/utils/blob/main/src/sla.ts#L73
|
||||||
|
const convertObjectCamelCaseToSnakeCase = object => {
|
||||||
|
return Object.keys(object).reduce((acc, key) => {
|
||||||
|
acc[key.replace(/([A-Z])/g, '_$1').toLowerCase()] = object[key];
|
||||||
|
return acc;
|
||||||
|
}, {});
|
||||||
|
};
|
||||||
|
|
||||||
const appliedSLA = computed(() => props.conversation?.appliedSla);
|
const appliedSLA = computed(() => props.conversation?.appliedSla);
|
||||||
const slaEvents = computed(() => props.conversation?.slaEvents);
|
|
||||||
const isSlaMissed = computed(() => slaStatus.value?.isSlaMissed);
|
const isSlaMissed = computed(() => slaStatus.value?.isSlaMissed);
|
||||||
|
|
||||||
const hasSlaThreshold = computed(() => {
|
const hasSlaThreshold = computed(() => {
|
||||||
@@ -33,9 +41,8 @@ const slaStatusText = computed(() => {
|
|||||||
|
|
||||||
const updateSlaStatus = () => {
|
const updateSlaStatus = () => {
|
||||||
slaStatus.value = evaluateSLAStatus({
|
slaStatus.value = evaluateSLAStatus({
|
||||||
appliedSla: appliedSLA.value || {},
|
appliedSla: convertObjectCamelCaseToSnakeCase(appliedSLA.value || {}),
|
||||||
chat: props.conversation,
|
chat: props.conversation,
|
||||||
slaEvents: slaEvents.value || [],
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
||||||
import { evaluateSLAStatus } from 'dashboard/helper/slaHelper';
|
import { evaluateSLAStatus } from '@chatwoot/utils';
|
||||||
|
|
||||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
||||||
import Label from 'dashboard/components-next/label/Label.vue';
|
import Label from 'dashboard/components-next/label/Label.vue';
|
||||||
@@ -27,7 +27,6 @@ defineOptions({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const appliedSLA = computed(() => props.chat?.applied_sla);
|
const appliedSLA = computed(() => props.chat?.applied_sla);
|
||||||
const slaEvents = computed(() => props.chat?.sla_events);
|
|
||||||
const hasSlaThreshold = computed(() => slaStatus.value?.threshold);
|
const hasSlaThreshold = computed(() => slaStatus.value?.threshold);
|
||||||
const isSlaMissed = computed(() => slaStatus.value?.isSlaMissed);
|
const isSlaMissed = computed(() => slaStatus.value?.isSlaMissed);
|
||||||
|
|
||||||
@@ -35,7 +34,6 @@ const updateSlaStatus = () => {
|
|||||||
slaStatus.value = evaluateSLAStatus({
|
slaStatus.value = evaluateSLAStatus({
|
||||||
appliedSla: appliedSLA.value || {},
|
appliedSla: appliedSLA.value || {},
|
||||||
chat: props.chat,
|
chat: props.chat,
|
||||||
slaEvents: slaEvents.value || [],
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
-378
@@ -1,378 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed, ref, watch, nextTick, onBeforeUnmount } from 'vue';
|
|
||||||
import { useEventListener, onKeyStroke, useRafFn } from '@vueuse/core';
|
|
||||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
|
||||||
|
|
||||||
// Reorderable list with cross-page drag. It must stay mounted during a page
|
|
||||||
// fetch — hide the list spinner while `dragging`, or the held item is lost.
|
|
||||||
const props = defineProps({
|
|
||||||
items: { type: Array, required: true },
|
|
||||||
itemKey: { type: String, default: 'id' },
|
|
||||||
disabled: { type: Boolean, default: false },
|
|
||||||
currentPage: { type: Number, default: 1 },
|
|
||||||
totalPages: { type: Number, default: 1 },
|
|
||||||
});
|
|
||||||
const emit = defineEmits(['reorder', 'navigatePage', 'dragging']);
|
|
||||||
|
|
||||||
const DRAG_THRESHOLD = 5;
|
|
||||||
const EDGE_BAND = 72; // px from a side that arms a page turn
|
|
||||||
const AUTO_PAGE_DELAY = 600; // ms hovering an edge before it flips
|
|
||||||
const SCROLL_BAND = 60; // px from top/bottom that autoscrolls the list
|
|
||||||
const SCROLL_STEP = 10; // px scrolled per frame while parked at an edge
|
|
||||||
const PILL = 36; // px, the page-turn arrow button on each edge
|
|
||||||
|
|
||||||
const root = ref(null);
|
|
||||||
const isDragging = ref(false);
|
|
||||||
const dragged = ref(null);
|
|
||||||
const pointer = ref({ x: 0, y: 0 });
|
|
||||||
const insertBefore = ref(null); // key the gap sits before, null = end of list
|
|
||||||
const activeEdge = ref(null);
|
|
||||||
const bounds = ref({ left: 0, right: 0, top: 0, bottom: 0 }); // visible list rect
|
|
||||||
const grab = ref({ dx: 0, dy: 0 }); // cursor offset inside the grabbed card
|
|
||||||
const dragHeight = ref(0);
|
|
||||||
|
|
||||||
let press = null; // pending press, before it becomes a drag
|
|
||||||
let dwell = null; // timer that flips the page after hovering an edge
|
|
||||||
let paging = false; // waiting for a flipped page to load
|
|
||||||
let scroller = null; // scrollable ancestor, found when a drag begins
|
|
||||||
let scrollDir = 0; // -1 up, +1 down, 0 idle
|
|
||||||
let sourcePage = 1; // page the drag started on, to resolve cross-page end-drops
|
|
||||||
|
|
||||||
const keyOf = item => String(item?.[props.itemKey]);
|
|
||||||
const others = item => props.items.filter(o => keyOf(o) !== keyOf(item));
|
|
||||||
const isRTL = () =>
|
|
||||||
document.querySelector('#app[dir]')?.getAttribute('dir') === 'rtl';
|
|
||||||
const canPage = dir =>
|
|
||||||
dir === 'next' ? props.currentPage < props.totalPages : props.currentPage > 1;
|
|
||||||
|
|
||||||
// Key of the item after `key` in `list`, or null when it is the last one.
|
|
||||||
const keyAfter = (list, key) => {
|
|
||||||
const next = list[list.findIndex(o => keyOf(o) === key) + 1];
|
|
||||||
return next ? keyOf(next) : null;
|
|
||||||
};
|
|
||||||
|
|
||||||
const edges = computed(() =>
|
|
||||||
['prev', 'next'].filter(canPage).map(dir => {
|
|
||||||
const onLeft = isRTL() ? dir === 'next' : dir === 'prev';
|
|
||||||
return {
|
|
||||||
dir,
|
|
||||||
onLeft,
|
|
||||||
icon: onLeft ? 'i-lucide-chevrons-left' : 'i-lucide-chevrons-right',
|
|
||||||
};
|
|
||||||
})
|
|
||||||
);
|
|
||||||
|
|
||||||
// Cursor overlay: an edge glow band, a page-turn arrow per edge, and a ghost of
|
|
||||||
// the dragged row that follows the cursor and shrinks when aimed at an edge.
|
|
||||||
const EDGE_BAND_W = 80; // px width of the glow band on each pageable edge
|
|
||||||
const bandStyle = onLeft => {
|
|
||||||
const x = onLeft ? bounds.value.left : bounds.value.right - EDGE_BAND_W;
|
|
||||||
return {
|
|
||||||
width: `${EDGE_BAND_W}px`,
|
|
||||||
height: `${bounds.value.bottom - bounds.value.top}px`,
|
|
||||||
transform: `translate(${x}px, ${bounds.value.top}px)`,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
const pillStyle = onLeft => {
|
|
||||||
const x = onLeft ? bounds.value.left + 12 : bounds.value.right - PILL - 12;
|
|
||||||
return { transform: `translate(${x}px, ${pointer.value.y - PILL / 2}px)` };
|
|
||||||
};
|
|
||||||
const ghostStyle = computed(() => ({
|
|
||||||
width: `${bounds.value.right - bounds.value.left}px`,
|
|
||||||
transform: `translate(${pointer.value.x - grab.value.dx}px, ${pointer.value.y - grab.value.dy}px)`,
|
|
||||||
}));
|
|
||||||
const scaleStyle = computed(() => ({
|
|
||||||
transformOrigin: `${grab.value.dx}px ${grab.value.dy}px`,
|
|
||||||
}));
|
|
||||||
|
|
||||||
// The list as shown mid-drag: the dragged row slotted into the gap at `insertBefore`.
|
|
||||||
const displayItems = computed(() => {
|
|
||||||
if (!isDragging.value || !dragged.value) return props.items;
|
|
||||||
const rest = others(dragged.value);
|
|
||||||
const at = rest.findIndex(o => keyOf(o) === insertBefore.value);
|
|
||||||
rest.splice(at === -1 ? rest.length : at, 0, dragged.value);
|
|
||||||
return rest;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Move the gap when the cursor crosses the midpoint of the card it is over.
|
|
||||||
const aim = () => {
|
|
||||||
const card = document
|
|
||||||
.elementFromPoint(pointer.value.x, pointer.value.y)
|
|
||||||
?.closest('[data-drag-id]');
|
|
||||||
const key = card?.dataset.dragId;
|
|
||||||
if (!key || key === keyOf(dragged.value)) return;
|
|
||||||
|
|
||||||
const { top, height } = card.getBoundingClientRect();
|
|
||||||
const above = pointer.value.y < top + height / 2;
|
|
||||||
insertBefore.value = above ? key : keyAfter(others(dragged.value), key);
|
|
||||||
};
|
|
||||||
|
|
||||||
const flip = dir => {
|
|
||||||
if (paging || !isDragging.value) return;
|
|
||||||
paging = true;
|
|
||||||
emit('navigatePage', props.currentPage + (dir === 'next' ? 1 : -1));
|
|
||||||
};
|
|
||||||
|
|
||||||
const aimEdge = x => {
|
|
||||||
const rect = root.value?.getBoundingClientRect();
|
|
||||||
if (!rect) return;
|
|
||||||
// Clip the list rect to the scroll viewport so the glow band and its top/bottom
|
|
||||||
// fade always sit on the visible edges, not the far ends of the full content.
|
|
||||||
const view = scroller?.getBoundingClientRect();
|
|
||||||
const viewTop = Math.max(view?.top ?? 0, 0);
|
|
||||||
const viewBottom = Math.min(
|
|
||||||
view?.bottom ?? window.innerHeight,
|
|
||||||
window.innerHeight
|
|
||||||
);
|
|
||||||
bounds.value = {
|
|
||||||
left: rect.left,
|
|
||||||
right: rect.right,
|
|
||||||
top: Math.max(rect.top, viewTop),
|
|
||||||
bottom: Math.min(rect.bottom, viewBottom),
|
|
||||||
};
|
|
||||||
|
|
||||||
let dir = null;
|
|
||||||
if (x <= rect.left + EDGE_BAND) dir = isRTL() ? 'next' : 'prev';
|
|
||||||
else if (x >= rect.right - EDGE_BAND) dir = isRTL() ? 'prev' : 'next';
|
|
||||||
if (dir && !canPage(dir)) dir = null;
|
|
||||||
if (dir === activeEdge.value) return;
|
|
||||||
|
|
||||||
activeEdge.value = dir;
|
|
||||||
clearTimeout(dwell);
|
|
||||||
if (dir) dwell = setTimeout(() => flip(dir), AUTO_PAGE_DELAY);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Nearest scrollable ancestor, so a drag can reach rows that are off-screen.
|
|
||||||
const scrollParent = () => {
|
|
||||||
let el = root.value?.parentElement;
|
|
||||||
while (el) {
|
|
||||||
const { overflowY } = getComputedStyle(el);
|
|
||||||
if (overflowY === 'auto' || overflowY === 'scroll') return el;
|
|
||||||
el = el.parentElement;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
};
|
|
||||||
|
|
||||||
// While parked at the top/bottom edge, keep scrolling and re-aim as rows slide by.
|
|
||||||
const { pause: pauseScroll, resume: resumeScroll } = useRafFn(
|
|
||||||
() => {
|
|
||||||
if (!scroller || !scrollDir) return;
|
|
||||||
scroller.scrollTop += scrollDir * SCROLL_STEP;
|
|
||||||
aim();
|
|
||||||
aimEdge(pointer.value.x);
|
|
||||||
},
|
|
||||||
{ immediate: false }
|
|
||||||
);
|
|
||||||
|
|
||||||
const updateAutoScroll = y => {
|
|
||||||
if (!scroller) return;
|
|
||||||
const rect = scroller.getBoundingClientRect();
|
|
||||||
const atTop = scroller.scrollTop <= 0;
|
|
||||||
const atBottom =
|
|
||||||
scroller.scrollTop >= scroller.scrollHeight - scroller.clientHeight;
|
|
||||||
if (y < rect.top + SCROLL_BAND && !atTop) scrollDir = -1;
|
|
||||||
else if (y > rect.bottom - SCROLL_BAND && !atBottom) scrollDir = 1;
|
|
||||||
else scrollDir = 0;
|
|
||||||
if (scrollDir) resumeScroll();
|
|
||||||
else pauseScroll();
|
|
||||||
};
|
|
||||||
|
|
||||||
const reset = () => {
|
|
||||||
isDragging.value = false;
|
|
||||||
dragged.value = null;
|
|
||||||
insertBefore.value = null;
|
|
||||||
activeEdge.value = null;
|
|
||||||
clearTimeout(dwell);
|
|
||||||
paging = false;
|
|
||||||
scrollDir = 0;
|
|
||||||
scroller = null;
|
|
||||||
pauseScroll();
|
|
||||||
document.body.classList.remove('select-none');
|
|
||||||
emit('dragging', false);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Positions sit on a gap-of-10 grid; a midpoint (±5 at the ends) slots between two rows.
|
|
||||||
// Cross-page end-drops are the tricky case: moving an item off its source page pulls the
|
|
||||||
// target page's boundary row into the vacated slot. So at the leading edge after moving
|
|
||||||
// DOWN (or the trailing edge after moving UP) we land between the two boundary rows, or
|
|
||||||
// the item sorts onto the adjacent page and vanishes from view.
|
|
||||||
const drop = (item, rawBefore) => {
|
|
||||||
const pos = o => o?.position || 0;
|
|
||||||
const mid = (a, b) => Math.floor((pos(a) + pos(b)) / 2);
|
|
||||||
const rest = others(item);
|
|
||||||
// No other rows to position against — e.g. the lone article on a page dropped
|
|
||||||
// without crossing to another page. Leave the order untouched.
|
|
||||||
if (!rest.length) return;
|
|
||||||
// A page flip can leave the aimed key pointing at a row that is no longer on
|
|
||||||
// this page. Like displayItems, resolve an unknown key to null (end of list),
|
|
||||||
// so what the user sees and what we save agree.
|
|
||||||
const before = rest.some(o => keyOf(o) === rawBefore) ? rawBefore : null;
|
|
||||||
const movedDown = props.currentPage > sourcePage;
|
|
||||||
const movedUp = props.currentPage < sourcePage;
|
|
||||||
|
|
||||||
let position;
|
|
||||||
if (before === null) {
|
|
||||||
position =
|
|
||||||
movedUp && rest.length >= 2
|
|
||||||
? mid(rest.at(-2), rest.at(-1))
|
|
||||||
: pos(rest.at(-1)) + 5;
|
|
||||||
} else {
|
|
||||||
const i = rest.findIndex(o => keyOf(o) === before);
|
|
||||||
if (i > 0) {
|
|
||||||
position = mid(rest[i - 1], rest[i]);
|
|
||||||
} else if (movedDown) {
|
|
||||||
// Top-of-page after moving down: the old first row slid up into the source
|
|
||||||
// page's gap, so land just after it to stay this page's first.
|
|
||||||
position = rest.length >= 2 ? mid(rest[0], rest[1]) : pos(rest[0]) + 5;
|
|
||||||
} else {
|
|
||||||
position = pos(rest[0]) - 5;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
emit('reorder', { [item[props.itemKey]]: position });
|
|
||||||
};
|
|
||||||
|
|
||||||
const startDrag = () => {
|
|
||||||
isDragging.value = true;
|
|
||||||
dragged.value = press.item;
|
|
||||||
grab.value = { dx: press.dx, dy: press.dy };
|
|
||||||
dragHeight.value = press.h;
|
|
||||||
insertBefore.value = keyAfter(props.items, keyOf(press.item));
|
|
||||||
sourcePage = props.currentPage;
|
|
||||||
scroller = scrollParent();
|
|
||||||
document.body.classList.add('select-none');
|
|
||||||
emit('dragging', true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const onPointerDown = (item, e) => {
|
|
||||||
if (e.button !== 0 || props.disabled) return;
|
|
||||||
if (e.target.closest('button, a, input, [role="button"]')) return;
|
|
||||||
const rect = e.currentTarget.getBoundingClientRect();
|
|
||||||
press = {
|
|
||||||
item,
|
|
||||||
x: e.clientX,
|
|
||||||
y: e.clientY,
|
|
||||||
dx: e.clientX - rect.left,
|
|
||||||
dy: e.clientY - rect.top,
|
|
||||||
h: rect.height,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
useEventListener(window, 'pointermove', e => {
|
|
||||||
if (!press) return;
|
|
||||||
if (!isDragging.value) {
|
|
||||||
const moved = Math.hypot(e.clientX - press.x, e.clientY - press.y);
|
|
||||||
if (moved < DRAG_THRESHOLD) return;
|
|
||||||
startDrag();
|
|
||||||
}
|
|
||||||
e.preventDefault();
|
|
||||||
pointer.value = { x: e.clientX, y: e.clientY };
|
|
||||||
aim();
|
|
||||||
aimEdge(e.clientX);
|
|
||||||
updateAutoScroll(e.clientY);
|
|
||||||
});
|
|
||||||
|
|
||||||
useEventListener(window, 'pointerup', () => {
|
|
||||||
if (!press) return;
|
|
||||||
press = null;
|
|
||||||
if (!isDragging.value) return; // a press without movement is a click
|
|
||||||
const item = dragged.value;
|
|
||||||
const before = insertBefore.value;
|
|
||||||
const flipping = paging;
|
|
||||||
reset();
|
|
||||||
if (!flipping) drop(item, before);
|
|
||||||
});
|
|
||||||
|
|
||||||
// When the flipped page loads, re-aim under the held cursor so a parked edge keeps flipping.
|
|
||||||
watch(
|
|
||||||
() => props.items,
|
|
||||||
() => {
|
|
||||||
if (!isDragging.value || !paging) return;
|
|
||||||
paging = false;
|
|
||||||
nextTick(() => {
|
|
||||||
if (!isDragging.value) return;
|
|
||||||
aim();
|
|
||||||
activeEdge.value = null;
|
|
||||||
aimEdge(pointer.value.x);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
onKeyStroke('Escape', () => {
|
|
||||||
if (!isDragging.value) return;
|
|
||||||
press = null;
|
|
||||||
reset();
|
|
||||||
});
|
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
|
||||||
clearTimeout(dwell);
|
|
||||||
document.body.classList.remove('select-none');
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div ref="root" class="relative w-full h-full">
|
|
||||||
<ul class="w-full h-full space-y-4">
|
|
||||||
<li
|
|
||||||
v-for="(item, index) in displayItems"
|
|
||||||
:key="keyOf(item)"
|
|
||||||
:data-drag-id="keyOf(item)"
|
|
||||||
class="relative list-none"
|
|
||||||
:class="{ 'cursor-grab': !disabled && !isDragging }"
|
|
||||||
@pointerdown="onPointerDown(item, $event)"
|
|
||||||
@dragstart.prevent
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
v-if="isDragging && keyOf(item) === keyOf(dragged)"
|
|
||||||
:style="{ height: `${dragHeight}px` }"
|
|
||||||
class="border-2 border-dashed rounded-2xl border-n-brand/50 bg-n-brand/5"
|
|
||||||
/>
|
|
||||||
<slot v-else name="item" :item="item" :index="index" />
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<Teleport v-if="isDragging" to="body">
|
|
||||||
<div
|
|
||||||
v-for="edge in edges"
|
|
||||||
:key="`band-${edge.dir}`"
|
|
||||||
:style="bandStyle(edge.onLeft)"
|
|
||||||
class="fixed top-0 left-0 z-40 pointer-events-none from-n-brand/15 to-transparent transition-opacity duration-200 [mask-image:linear-gradient(to_bottom,transparent,#000_56px,#000_calc(100%_-_56px),transparent)] [-webkit-mask-image:linear-gradient(to_bottom,transparent,#000_56px,#000_calc(100%_-_56px),transparent)]"
|
|
||||||
:class="[
|
|
||||||
edge.onLeft ? 'bg-gradient-to-r' : 'bg-gradient-to-l',
|
|
||||||
activeEdge === edge.dir ? 'opacity-100' : 'opacity-0',
|
|
||||||
]"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div
|
|
||||||
v-for="edge in edges"
|
|
||||||
:key="edge.dir"
|
|
||||||
:style="pillStyle(edge.onLeft)"
|
|
||||||
class="fixed top-0 left-0 z-50 flex items-center justify-center transition-all duration-150 border rounded-full pointer-events-none size-9 backdrop-blur-sm"
|
|
||||||
:class="
|
|
||||||
activeEdge === edge.dir
|
|
||||||
? 'scale-110 border-n-brand bg-n-brand/20 text-n-brand shadow-md'
|
|
||||||
: 'opacity-70 border-n-weak/60 bg-n-solid-1/70 text-n-slate-10'
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
:icon="edge.icon"
|
|
||||||
class="size-4"
|
|
||||||
:class="activeEdge === edge.dir && 'animate-pulse'"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
v-if="dragged"
|
|
||||||
:style="ghostStyle"
|
|
||||||
class="fixed top-0 left-0 z-50 pointer-events-none select-none"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
:style="scaleStyle"
|
|
||||||
class="transition-transform duration-150 shadow-2xl rounded-2xl"
|
|
||||||
:class="{ 'scale-50': activeEdge }"
|
|
||||||
>
|
|
||||||
<slot name="ghost" :item="dragged" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Teleport>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-222
@@ -1,222 +0,0 @@
|
|||||||
import { mount } from '@vue/test-utils';
|
|
||||||
import { h, nextTick } from 'vue';
|
|
||||||
import DraggableReorderList from '../DraggableReorderList.vue';
|
|
||||||
|
|
||||||
// The component is pointer-driven, so we drive it through real pointer events on
|
|
||||||
// window while mocking the layout APIs jsdom does not implement: elementFromPoint
|
|
||||||
// (which card is under the cursor) and getBoundingClientRect (its geometry).
|
|
||||||
const elementAtPoint = { current: null };
|
|
||||||
|
|
||||||
const move = (clientX, clientY) =>
|
|
||||||
window.dispatchEvent(new MouseEvent('pointermove', { clientX, clientY }));
|
|
||||||
const release = () => window.dispatchEvent(new MouseEvent('pointerup'));
|
|
||||||
|
|
||||||
// Stack the rows 50px apart, each 40px tall, inside a 500px-wide list.
|
|
||||||
const stubGeometry = wrapper => {
|
|
||||||
wrapper.element.getBoundingClientRect = () => ({
|
|
||||||
left: 0,
|
|
||||||
right: 500,
|
|
||||||
top: 0,
|
|
||||||
bottom: 600,
|
|
||||||
});
|
|
||||||
wrapper.findAll('[data-drag-id]').forEach((li, index) => {
|
|
||||||
const top = index * 50;
|
|
||||||
li.element.getBoundingClientRect = () => ({
|
|
||||||
top,
|
|
||||||
height: 40,
|
|
||||||
bottom: top + 40,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const mountList = (props = {}) =>
|
|
||||||
mount(DraggableReorderList, {
|
|
||||||
props: { items: [], ...props },
|
|
||||||
slots: {
|
|
||||||
item: scope => h('div', { class: 'card' }, scope.item.title),
|
|
||||||
ghost: scope => h('div', { class: 'ghost' }, scope.item.title),
|
|
||||||
},
|
|
||||||
global: { stubs: { Icon: true, teleport: true } },
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('DraggableReorderList', () => {
|
|
||||||
let wrapper;
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
elementAtPoint.current = null;
|
|
||||||
document.elementFromPoint = vi.fn(() => elementAtPoint.current);
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(() => {
|
|
||||||
wrapper?.unmount();
|
|
||||||
vi.useRealTimers();
|
|
||||||
});
|
|
||||||
|
|
||||||
const startDragging = async id => {
|
|
||||||
stubGeometry(wrapper);
|
|
||||||
wrapper.find(`[data-drag-id="${id}"]`).element.dispatchEvent(
|
|
||||||
new MouseEvent('pointerdown', {
|
|
||||||
button: 0,
|
|
||||||
clientX: 250,
|
|
||||||
clientY: 20,
|
|
||||||
bubbles: true,
|
|
||||||
})
|
|
||||||
);
|
|
||||||
await nextTick();
|
|
||||||
};
|
|
||||||
|
|
||||||
it('renders each item through the item slot', () => {
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha' },
|
|
||||||
{ id: 2, title: 'Beta' },
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
const cards = wrapper.findAll('.card');
|
|
||||||
expect(cards).toHaveLength(2);
|
|
||||||
expect(cards[0].text()).toBe('Alpha');
|
|
||||||
expect(wrapper.find('[data-drag-id="1"]').exists()).toBe(true);
|
|
||||||
expect(wrapper.find('[data-drag-id="2"]').exists()).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('shows a grab affordance only when enabled', () => {
|
|
||||||
wrapper = mountList({ items: [{ id: 1, title: 'Alpha' }] });
|
|
||||||
expect(wrapper.find('[data-drag-id="1"]').classes()).toContain(
|
|
||||||
'cursor-grab'
|
|
||||||
);
|
|
||||||
|
|
||||||
wrapper.unmount();
|
|
||||||
wrapper = mountList({ items: [{ id: 1, title: 'Alpha' }], disabled: true });
|
|
||||||
expect(wrapper.find('[data-drag-id="1"]').classes()).not.toContain(
|
|
||||||
'cursor-grab'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not start a drag when disabled', async () => {
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha' },
|
|
||||||
{ id: 2, title: 'Beta' },
|
|
||||||
],
|
|
||||||
disabled: true,
|
|
||||||
});
|
|
||||||
await startDragging(1);
|
|
||||||
move(250, 200);
|
|
||||||
await nextTick();
|
|
||||||
|
|
||||||
expect(wrapper.emitted('dragging')).toBeUndefined();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('emits dragging true then false across a drag', async () => {
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha' },
|
|
||||||
{ id: 2, title: 'Beta' },
|
|
||||||
],
|
|
||||||
});
|
|
||||||
await startDragging(1);
|
|
||||||
elementAtPoint.current = wrapper.find('[data-drag-id="2"]').element;
|
|
||||||
move(250, 60);
|
|
||||||
await nextTick();
|
|
||||||
|
|
||||||
expect(wrapper.emitted('dragging')[0]).toEqual([true]);
|
|
||||||
|
|
||||||
release();
|
|
||||||
await nextTick();
|
|
||||||
expect(wrapper.emitted('dragging')[1]).toEqual([false]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('emits the midpoint position when dropped between two rows', async () => {
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha', position: 10 },
|
|
||||||
{ id: 2, title: 'Beta', position: 20 },
|
|
||||||
{ id: 3, title: 'Gamma', position: 30 },
|
|
||||||
],
|
|
||||||
});
|
|
||||||
await startDragging(1);
|
|
||||||
|
|
||||||
// Hover the lower half of Beta (top 50, height 40 → midpoint 70) so the gap
|
|
||||||
// sits before Gamma; dropping there lands halfway between Beta and Gamma.
|
|
||||||
elementAtPoint.current = wrapper.find('[data-drag-id="2"]').element;
|
|
||||||
move(250, 85);
|
|
||||||
await nextTick();
|
|
||||||
release();
|
|
||||||
await nextTick();
|
|
||||||
|
|
||||||
expect(wrapper.emitted('reorder')[0][0]).toEqual({ 1: 25 });
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not reorder when the only row on a page is dropped in place', async () => {
|
|
||||||
// P1: dragging the lone article on a later page and releasing without
|
|
||||||
// crossing to another page must be a no-op, not move it to the top.
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [{ id: 5, title: 'Solo', position: 260 }],
|
|
||||||
currentPage: 2,
|
|
||||||
totalPages: 2,
|
|
||||||
});
|
|
||||||
await startDragging(5);
|
|
||||||
move(250, 300);
|
|
||||||
await nextTick();
|
|
||||||
release();
|
|
||||||
await nextTick();
|
|
||||||
|
|
||||||
expect(wrapper.emitted('dragging')).toEqual([[true], [false]]);
|
|
||||||
expect(wrapper.emitted('reorder')).toBeUndefined();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('turns the page after dwelling on a pageable edge', async () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha', position: 10 },
|
|
||||||
{ id: 2, title: 'Beta', position: 20 },
|
|
||||||
],
|
|
||||||
currentPage: 1,
|
|
||||||
totalPages: 2,
|
|
||||||
});
|
|
||||||
await startDragging(1);
|
|
||||||
|
|
||||||
// Drag to the right edge over blank space (no card) and hold.
|
|
||||||
elementAtPoint.current = null;
|
|
||||||
move(490, 20);
|
|
||||||
await nextTick();
|
|
||||||
vi.advanceTimersByTime(600);
|
|
||||||
|
|
||||||
expect(wrapper.emitted('navigatePage')[0]).toEqual([2]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('can still turn pages after releasing during a pending flip', async () => {
|
|
||||||
// Releasing while a flip fetch is in flight must clear paging state, or every
|
|
||||||
// later drag would be stuck unable to navigate.
|
|
||||||
vi.useFakeTimers();
|
|
||||||
wrapper = mountList({
|
|
||||||
items: [
|
|
||||||
{ id: 1, title: 'Alpha', position: 10 },
|
|
||||||
{ id: 2, title: 'Beta', position: 20 },
|
|
||||||
],
|
|
||||||
currentPage: 1,
|
|
||||||
totalPages: 2,
|
|
||||||
});
|
|
||||||
|
|
||||||
// First drag: park at the edge to start a flip, then release before the new
|
|
||||||
// page arrives (items never change here).
|
|
||||||
await startDragging(1);
|
|
||||||
elementAtPoint.current = null;
|
|
||||||
move(490, 20);
|
|
||||||
await nextTick();
|
|
||||||
vi.advanceTimersByTime(600);
|
|
||||||
release();
|
|
||||||
await nextTick();
|
|
||||||
|
|
||||||
// Second drag must be able to flip again.
|
|
||||||
await startDragging(1);
|
|
||||||
elementAtPoint.current = null;
|
|
||||||
move(490, 20);
|
|
||||||
await nextTick();
|
|
||||||
vi.advanceTimersByTime(600);
|
|
||||||
|
|
||||||
expect(wrapper.emitted('navigatePage')).toEqual([[2], [2]]);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
+72
-68
@@ -1,5 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { computed, ref } from 'vue';
|
import { ref, computed, watch } from 'vue';
|
||||||
|
import Draggable from 'vuedraggable';
|
||||||
import { useMapGetter, useStore } from 'dashboard/composables/store.js';
|
import { useMapGetter, useStore } from 'dashboard/composables/store.js';
|
||||||
import { useRouter, useRoute } from 'vue-router';
|
import { useRouter, useRoute } from 'vue-router';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
@@ -9,7 +10,6 @@ import { getArticleStatus } from 'dashboard/helper/portalHelper.js';
|
|||||||
import wootConstants from 'dashboard/constants/globals';
|
import wootConstants from 'dashboard/constants/globals';
|
||||||
|
|
||||||
import ArticleCard from 'dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.vue';
|
import ArticleCard from 'dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.vue';
|
||||||
import DraggableReorderList from 'dashboard/components-next/DraggableReorderList/DraggableReorderList.vue';
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
articles: {
|
articles: {
|
||||||
@@ -28,22 +28,9 @@ const props = defineProps({
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
currentPage: {
|
|
||||||
type: Number,
|
|
||||||
default: 1,
|
|
||||||
},
|
|
||||||
totalPages: {
|
|
||||||
type: Number,
|
|
||||||
default: 1,
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const emit = defineEmits([
|
const emit = defineEmits(['translateArticle', 'toggleSelect']);
|
||||||
'translateArticle',
|
|
||||||
'toggleSelect',
|
|
||||||
'navigatePage',
|
|
||||||
'dragging',
|
|
||||||
]);
|
|
||||||
|
|
||||||
const { ARTICLE_STATUS_TYPES } = wootConstants;
|
const { ARTICLE_STATUS_TYPES } = wootConstants;
|
||||||
|
|
||||||
@@ -52,14 +39,14 @@ const route = useRoute();
|
|||||||
const store = useStore();
|
const store = useStore();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
const localArticles = ref(props.articles);
|
||||||
const hoveredArticleId = ref(null);
|
const hoveredArticleId = ref(null);
|
||||||
|
|
||||||
const dragEnabled = computed(() => {
|
const dragEnabled = computed(() => {
|
||||||
const canReorder = props.articles?.length > 1 || props.totalPages > 1;
|
|
||||||
return (
|
return (
|
||||||
props.isCategoryArticles &&
|
props.isCategoryArticles &&
|
||||||
!props.isSearching &&
|
!props.isSearching &&
|
||||||
canReorder &&
|
localArticles.value?.length > 1 &&
|
||||||
props.selectedArticleIds.size === 0
|
props.selectedArticleIds.size === 0
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@@ -76,10 +63,6 @@ const handleCardHover = (isHovered, id) => {
|
|||||||
|
|
||||||
const getCategoryById = useMapGetter('categories/categoryById');
|
const getCategoryById = useMapGetter('categories/categoryById');
|
||||||
|
|
||||||
const getCategory = categoryId => {
|
|
||||||
return getCategoryById.value(categoryId) || { name: '', icon: '' };
|
|
||||||
};
|
|
||||||
|
|
||||||
const openArticle = id => {
|
const openArticle = id => {
|
||||||
const { tab, categorySlug, locale } = route.params;
|
const { tab, categorySlug, locale } = route.params;
|
||||||
if (props.isCategoryArticles) {
|
if (props.isCategoryArticles) {
|
||||||
@@ -100,25 +83,38 @@ const openArticle = id => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const onReorder = async positionsHash => {
|
const onReorder = async reorderedGroup => {
|
||||||
const [movedId] = Object.keys(positionsHash);
|
|
||||||
// A same-page reorder updates optimistically in the store, so it needs no
|
|
||||||
// refetch. Only a cross-page drop must refresh, to pull the moved article
|
|
||||||
// onto this page in its new spot.
|
|
||||||
const isCrossPage = !props.articles.some(
|
|
||||||
article => String(article.id) === movedId
|
|
||||||
);
|
|
||||||
try {
|
try {
|
||||||
await store.dispatch('articles/reorder', {
|
await store.dispatch('articles/reorder', {
|
||||||
reorderedGroup: positionsHash,
|
reorderedGroup,
|
||||||
portalSlug: route.params.portalSlug,
|
portalSlug: route.params.portalSlug,
|
||||||
});
|
});
|
||||||
if (isCrossPage) emit('navigatePage', props.currentPage);
|
|
||||||
} catch {
|
} catch {
|
||||||
useAlert(t('HELP_CENTER.REORDER_ARTICLE.API.ERROR_MESSAGE'));
|
useAlert(t('HELP_CENTER.REORDER_ARTICLE.API.ERROR_MESSAGE'));
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const onDragEnd = () => {
|
||||||
|
// Collect and sort existing positions, falling back to index+1 for null/0 values
|
||||||
|
const sortedArticlePositions = localArticles.value
|
||||||
|
.map((article, index) => article.position || index + 1)
|
||||||
|
.sort((a, b) => a - b);
|
||||||
|
|
||||||
|
const orderedArticles = localArticles.value.map(article => article.id);
|
||||||
|
|
||||||
|
// Create a map of article IDs to their new positions
|
||||||
|
const reorderedGroup = orderedArticles.reduce((obj, key, index) => {
|
||||||
|
obj[key] = sortedArticlePositions[index];
|
||||||
|
return obj;
|
||||||
|
}, {});
|
||||||
|
|
||||||
|
onReorder(reorderedGroup);
|
||||||
|
};
|
||||||
|
|
||||||
|
const getCategory = categoryId => {
|
||||||
|
return getCategoryById.value(categoryId) || { name: '', icon: '' };
|
||||||
|
};
|
||||||
|
|
||||||
const getStatusMessage = (status, isSuccess) => {
|
const getStatusMessage = (status, isSuccess) => {
|
||||||
const messageType = isSuccess ? 'SUCCESS' : 'ERROR';
|
const messageType = isSuccess ? 'SUCCESS' : 'ERROR';
|
||||||
const statusMap = {
|
const statusMap = {
|
||||||
@@ -188,46 +184,54 @@ const updateArticle = ({ action, value, id }) => {
|
|||||||
const status = action !== 'delete' ? getArticleStatus(value) : null;
|
const status = action !== 'delete' ? getArticleStatus(value) : null;
|
||||||
handleArticleAction(action, { status, id });
|
handleArticleAction(action, { status, id });
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Watch for changes in the articles prop and update the localArticles ref
|
||||||
|
watch(
|
||||||
|
() => props.articles,
|
||||||
|
newArticles => {
|
||||||
|
localArticles.value = newArticles;
|
||||||
|
},
|
||||||
|
{ deep: true }
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<DraggableReorderList
|
<Draggable
|
||||||
:items="articles"
|
v-model="localArticles"
|
||||||
:disabled="!dragEnabled"
|
:disabled="!dragEnabled"
|
||||||
:current-page="currentPage"
|
item-key="id"
|
||||||
:total-pages="totalPages"
|
tag="ul"
|
||||||
@reorder="onReorder"
|
ghost-class="article-ghost-class"
|
||||||
@navigate-page="page => emit('navigatePage', page)"
|
class="w-full h-full space-y-4"
|
||||||
@dragging="value => emit('dragging', value)"
|
@end="onDragEnd"
|
||||||
>
|
>
|
||||||
<template #item="{ item }">
|
<template #item="{ element }">
|
||||||
<ArticleCard
|
<li class="list-none rounded-2xl">
|
||||||
:id="item.id"
|
<ArticleCard
|
||||||
:title="item.title"
|
:id="element.id"
|
||||||
:status="item.status"
|
:key="element.id"
|
||||||
:author="item.author"
|
:title="element.title"
|
||||||
:category="getCategory(item.category.id)"
|
:status="element.status"
|
||||||
:views="item.views || 0"
|
:author="element.author"
|
||||||
:updated-at="item.updatedAt"
|
:category="getCategory(element.category.id)"
|
||||||
:is-selected="selectedArticleIds.has(item.id)"
|
:views="element.views || 0"
|
||||||
selectable
|
:updated-at="element.updatedAt"
|
||||||
:show-selection-control="shouldShowSelectionControl(item.id)"
|
:is-selected="selectedArticleIds.has(element.id)"
|
||||||
@open-article="openArticle"
|
selectable
|
||||||
@article-action="updateArticle"
|
:show-selection-control="shouldShowSelectionControl(element.id)"
|
||||||
@toggle-select="emit('toggleSelect', $event)"
|
:class="{ 'cursor-grab': dragEnabled }"
|
||||||
@hover="isHovered => handleCardHover(isHovered, item.id)"
|
@open-article="openArticle"
|
||||||
/>
|
@article-action="updateArticle"
|
||||||
|
@toggle-select="emit('toggleSelect', $event)"
|
||||||
|
@hover="isHovered => handleCardHover(isHovered, element.id)"
|
||||||
|
/>
|
||||||
|
</li>
|
||||||
</template>
|
</template>
|
||||||
<template #ghost="{ item }">
|
</Draggable>
|
||||||
<ArticleCard
|
|
||||||
:id="item.id"
|
|
||||||
:title="item.title"
|
|
||||||
:status="item.status"
|
|
||||||
:author="item.author"
|
|
||||||
:category="getCategory(item.category.id)"
|
|
||||||
:views="item.views || 0"
|
|
||||||
:updated-at="item.updatedAt"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</DraggableReorderList>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.article-ghost-class {
|
||||||
|
@apply opacity-50 bg-n-solid-1;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
+1
-8
@@ -70,7 +70,6 @@ const isFeatureEnabledonAccount = useMapGetter(
|
|||||||
);
|
);
|
||||||
|
|
||||||
const selectedArticleIds = ref(new Set());
|
const selectedArticleIds = ref(new Set());
|
||||||
const isArticleDragging = ref(false);
|
|
||||||
const deleteConfirmDialogRef = ref(null);
|
const deleteConfirmDialogRef = ref(null);
|
||||||
const isCategoryMenuOpen = ref(false);
|
const isCategoryMenuOpen = ref(false);
|
||||||
const searchQuery = ref(route.query.search || '');
|
const searchQuery = ref(route.query.search || '');
|
||||||
@@ -149,8 +148,6 @@ const articlesCount = computed(() => {
|
|||||||
return Number(countMap[tab] || countMap['']);
|
return Number(countMap[tab] || countMap['']);
|
||||||
});
|
});
|
||||||
|
|
||||||
const totalPages = computed(() => Math.ceil(articlesCount.value / 25) || 1);
|
|
||||||
|
|
||||||
const showArticleHeaderControls = computed(
|
const showArticleHeaderControls = computed(
|
||||||
() => !props.isCategoryArticles && !isSwitchingPortal.value
|
() => !props.isCategoryArticles && !isSwitchingPortal.value
|
||||||
);
|
);
|
||||||
@@ -346,7 +343,7 @@ watch(
|
|||||||
</template>
|
</template>
|
||||||
<template #content>
|
<template #content>
|
||||||
<div
|
<div
|
||||||
v-if="isLoading && !isArticleDragging"
|
v-if="isLoading"
|
||||||
class="flex items-center justify-center py-10 text-n-slate-11"
|
class="flex items-center justify-center py-10 text-n-slate-11"
|
||||||
>
|
>
|
||||||
<Spinner />
|
<Spinner />
|
||||||
@@ -456,13 +453,9 @@ watch(
|
|||||||
:is-category-articles="isCategoryArticles"
|
:is-category-articles="isCategoryArticles"
|
||||||
:is-searching="isSearching"
|
:is-searching="isSearching"
|
||||||
:selected-article-ids="selectedArticleIds"
|
:selected-article-ids="selectedArticleIds"
|
||||||
:current-page="Number(meta.currentPage)"
|
|
||||||
:total-pages="totalPages"
|
|
||||||
class="relative z-0"
|
class="relative z-0"
|
||||||
@translate-article="handleTranslateArticle"
|
@translate-article="handleTranslateArticle"
|
||||||
@toggle-select="handleToggleSelect"
|
@toggle-select="handleToggleSelect"
|
||||||
@navigate-page="handlePageChange"
|
|
||||||
@dragging="isArticleDragging = $event"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<ArticleEmptyState
|
<ArticleEmptyState
|
||||||
|
|||||||
@@ -182,8 +182,7 @@ const handleCreateAssistant = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex gap-2">
|
||||||
<slot name="headerActions" />
|
|
||||||
<slot name="search" />
|
<slot name="search" />
|
||||||
<div
|
<div
|
||||||
v-if="!showPaywall && buttonLabel"
|
v-if="!showPaywall && buttonLabel"
|
||||||
|
|||||||
+23
@@ -29,6 +29,7 @@ const initialState = {
|
|||||||
handoffMessage: '',
|
handoffMessage: '',
|
||||||
resolutionMessage: '',
|
resolutionMessage: '',
|
||||||
instructions: '',
|
instructions: '',
|
||||||
|
temperature: 1,
|
||||||
};
|
};
|
||||||
|
|
||||||
const state = reactive({ ...initialState });
|
const state = reactive({ ...initialState });
|
||||||
@@ -56,6 +57,7 @@ const updateStateFromAssistant = assistant => {
|
|||||||
state.handoffMessage = config.handoff_message;
|
state.handoffMessage = config.handoff_message;
|
||||||
state.resolutionMessage = config.resolution_message;
|
state.resolutionMessage = config.resolution_message;
|
||||||
state.instructions = config.instructions;
|
state.instructions = config.instructions;
|
||||||
|
state.temperature = config.temperature || 1;
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleSystemMessagesUpdate = async () => {
|
const handleSystemMessagesUpdate = async () => {
|
||||||
@@ -78,6 +80,7 @@ const handleSystemMessagesUpdate = async () => {
|
|||||||
...props.assistant.config,
|
...props.assistant.config,
|
||||||
handoff_message: state.handoffMessage,
|
handoff_message: state.handoffMessage,
|
||||||
resolution_message: state.resolutionMessage,
|
resolution_message: state.resolutionMessage,
|
||||||
|
temperature: state.temperature || 1,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -128,6 +131,26 @@ watch(
|
|||||||
class="z-0"
|
class="z-0"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<div class="flex flex-col gap-2">
|
||||||
|
<label class="text-sm font-medium text-n-slate-12">
|
||||||
|
{{ t('CAPTAIN.ASSISTANTS.FORM.TEMPERATURE.LABEL') }}
|
||||||
|
</label>
|
||||||
|
<div class="flex items-center gap-4">
|
||||||
|
<input
|
||||||
|
v-model="state.temperature"
|
||||||
|
type="range"
|
||||||
|
min="0"
|
||||||
|
max="1"
|
||||||
|
step="0.1"
|
||||||
|
class="w-full"
|
||||||
|
/>
|
||||||
|
<span class="text-sm text-n-slate-12">{{ state.temperature }}</span>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm text-n-slate-11 italic">
|
||||||
|
{{ t('CAPTAIN.ASSISTANTS.FORM.TEMPERATURE.DESCRIPTION') }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<Button
|
<Button
|
||||||
:label="t('CAPTAIN.ASSISTANTS.FORM.UPDATE')"
|
:label="t('CAPTAIN.ASSISTANTS.FORM.UPDATE')"
|
||||||
|
|||||||
-96
@@ -1,96 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed, ref, watch } from 'vue';
|
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
|
||||||
import { LocalStorage } from 'shared/helpers/localStorage';
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
knowledge: {
|
|
||||||
type: Object,
|
|
||||||
default: () => ({ approved: 0, pending: 0, documents: 0, coverage: 0 }),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
// Dismissal is remembered per assistant for 24 hours (setFlag's default expiry).
|
|
||||||
const DISMISS_STORE = 'captain_overview_coverage_banner';
|
|
||||||
|
|
||||||
const accountId = computed(() => route.params.accountId);
|
|
||||||
const assistantId = computed(() => route.params.assistantId);
|
|
||||||
|
|
||||||
// Re-read the stored flag whenever the assistant changes, otherwise the banner
|
|
||||||
// would keep the first assistant's dismissed state after switching.
|
|
||||||
const dismissed = ref(false);
|
|
||||||
|
|
||||||
watch(
|
|
||||||
[accountId, assistantId],
|
|
||||||
([account, assistant]) => {
|
|
||||||
dismissed.value = LocalStorage.getFlag(DISMISS_STORE, account, assistant);
|
|
||||||
},
|
|
||||||
{ immediate: true }
|
|
||||||
);
|
|
||||||
|
|
||||||
// Thin coverage paired with a large review backlog: approving the pending FAQs
|
|
||||||
// is the quickest lever to lift auto-resolution, so nudge the team to act.
|
|
||||||
const COVERAGE_THRESHOLD = 85;
|
|
||||||
const PENDING_THRESHOLD = 100;
|
|
||||||
|
|
||||||
const showBanner = computed(
|
|
||||||
() =>
|
|
||||||
!dismissed.value &&
|
|
||||||
(props.knowledge?.coverage ?? 0) < COVERAGE_THRESHOLD &&
|
|
||||||
(props.knowledge?.pending ?? 0) > PENDING_THRESHOLD
|
|
||||||
);
|
|
||||||
|
|
||||||
const dismiss = () => {
|
|
||||||
LocalStorage.setFlag(DISMISS_STORE, accountId.value, assistantId.value);
|
|
||||||
dismissed.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToPending = () => {
|
|
||||||
router.push({
|
|
||||||
name: 'captain_assistants_responses_pending',
|
|
||||||
params: {
|
|
||||||
accountId: route.params.accountId,
|
|
||||||
assistantId: route.params.assistantId,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div
|
|
||||||
v-if="showBanner"
|
|
||||||
class="flex items-center justify-between gap-3 px-3 py-2 text-sm border rounded-xl bg-n-amber-3 border-n-amber-4 text-n-amber-11"
|
|
||||||
>
|
|
||||||
<div class="flex items-center gap-2 min-w-0">
|
|
||||||
<span class="shrink-0 i-lucide-triangle-alert size-4" />
|
|
||||||
<span class="truncate">
|
|
||||||
{{
|
|
||||||
$t('CAPTAIN.OVERVIEW.COVERAGE_BANNER.TEXT', {
|
|
||||||
count: knowledge.pending,
|
|
||||||
coverage: knowledge.coverage,
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex items-center gap-1 shrink-0">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="px-3 py-1 rounded-lg bg-n-amber-4 hover:bg-n-amber-5"
|
|
||||||
@click="goToPending"
|
|
||||||
>
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.COVERAGE_BANNER.ACTION') }}
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="grid rounded-lg size-7 place-content-center hover:bg-n-amber-4"
|
|
||||||
:aria-label="$t('CAPTAIN.OVERVIEW.COVERAGE_BANNER.DISMISS')"
|
|
||||||
@click="dismiss"
|
|
||||||
>
|
|
||||||
<span class="i-lucide-x size-4" />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-73
@@ -1,73 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed, ref, watch } from 'vue';
|
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
|
||||||
import { useStore, useMapGetter } from 'dashboard/composables/store';
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const store = useStore();
|
|
||||||
|
|
||||||
const dismissed = ref(false);
|
|
||||||
|
|
||||||
const assistantId = computed(() => route.params.assistantId);
|
|
||||||
const inboxes = useMapGetter('captainInboxes/getRecords');
|
|
||||||
const uiFlags = useMapGetter('captainInboxes/getUIFlags');
|
|
||||||
|
|
||||||
// Only surface once we know the assistant has no connected inboxes.
|
|
||||||
const showBanner = computed(
|
|
||||||
() =>
|
|
||||||
!dismissed.value &&
|
|
||||||
!uiFlags.value.fetchingList &&
|
|
||||||
inboxes.value.length === 0
|
|
||||||
);
|
|
||||||
|
|
||||||
watch(
|
|
||||||
assistantId,
|
|
||||||
id => {
|
|
||||||
dismissed.value = false;
|
|
||||||
if (id) store.dispatch('captainInboxes/get', { assistantId: id });
|
|
||||||
},
|
|
||||||
{ immediate: true }
|
|
||||||
);
|
|
||||||
|
|
||||||
const goToInboxes = () => {
|
|
||||||
router.push({
|
|
||||||
name: 'captain_assistants_inboxes_index',
|
|
||||||
params: {
|
|
||||||
accountId: route.params.accountId,
|
|
||||||
assistantId: assistantId.value,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div
|
|
||||||
v-if="showBanner"
|
|
||||||
class="flex items-center justify-between gap-3 px-3 py-2 text-sm border rounded-xl bg-n-amber-3 border-n-amber-4 text-n-amber-11"
|
|
||||||
>
|
|
||||||
<div class="flex items-center gap-2 min-w-0">
|
|
||||||
<span class="shrink-0 i-lucide-triangle-alert size-4" />
|
|
||||||
<span class="truncate">
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.INBOX_BANNER.TEXT') }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex items-center gap-1 shrink-0">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="px-3 py-1 rounded-lg bg-n-amber-4 hover:bg-n-amber-5"
|
|
||||||
@click="goToInboxes"
|
|
||||||
>
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.INBOX_BANNER.ACTION') }}
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="grid rounded-lg size-7 place-content-center hover:bg-n-amber-4"
|
|
||||||
:aria-label="$t('CAPTAIN.OVERVIEW.INBOX_BANNER.DISMISS')"
|
|
||||||
@click="dismissed = true"
|
|
||||||
>
|
|
||||||
<span class="i-lucide-x size-4" />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-87
@@ -1,87 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed } from 'vue';
|
|
||||||
import { useRoute } from 'vue-router';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
knowledge: {
|
|
||||||
type: Object,
|
|
||||||
default: () => ({ approved: 0, pending: 0, documents: 0, coverage: 0 }),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
const route = useRoute();
|
|
||||||
|
|
||||||
const approvedPct = computed(() => props.knowledge.coverage ?? 0);
|
|
||||||
|
|
||||||
const linkTo = routeName => ({
|
|
||||||
name: routeName,
|
|
||||||
params: {
|
|
||||||
accountId: route.params.accountId,
|
|
||||||
assistantId: route.params.assistantId,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const stats = computed(() => [
|
|
||||||
{
|
|
||||||
key: 'approved',
|
|
||||||
value: props.knowledge.approved,
|
|
||||||
label: t('CAPTAIN.OVERVIEW.KNOWLEDGE.APPROVED'),
|
|
||||||
to: linkTo('captain_assistants_responses_index'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'pending',
|
|
||||||
value: props.knowledge.pending,
|
|
||||||
label: t('CAPTAIN.OVERVIEW.KNOWLEDGE.PENDING'),
|
|
||||||
to: linkTo('captain_assistants_responses_pending'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'documents',
|
|
||||||
value: props.knowledge.documents,
|
|
||||||
label: t('CAPTAIN.OVERVIEW.KNOWLEDGE.DOCUMENTS'),
|
|
||||||
to: linkTo('captain_assistants_documents_index'),
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div
|
|
||||||
class="flex flex-col gap-4 p-5 border rounded-xl bg-n-solid-1 border-n-weak"
|
|
||||||
>
|
|
||||||
<div class="flex items-center justify-between">
|
|
||||||
<span class="text-sm font-medium text-n-slate-12">
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.KNOWLEDGE.TITLE') }}
|
|
||||||
</span>
|
|
||||||
<span class="text-sm tabular-nums text-n-slate-11">
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.KNOWLEDGE.COVERAGE', { pct: approvedPct }) }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="w-full h-2 overflow-hidden rounded-full bg-n-alpha-2">
|
|
||||||
<div
|
|
||||||
class="h-full rounded-full bg-n-brand"
|
|
||||||
:style="{ width: `${approvedPct}%` }"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="grid grid-cols-3 gap-3">
|
|
||||||
<RouterLink
|
|
||||||
v-for="stat in stats"
|
|
||||||
:key="stat.key"
|
|
||||||
:to="stat.to"
|
|
||||||
class="flex flex-col gap-1 group/stat"
|
|
||||||
>
|
|
||||||
<span class="text-xl font-semibold tabular-nums text-n-slate-12">
|
|
||||||
{{ stat.value }}
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
class="inline-flex items-center gap-1 text-xs transition-colors text-n-slate-11 group-hover/stat:text-n-slate-12"
|
|
||||||
>
|
|
||||||
{{ stat.label }}
|
|
||||||
<span
|
|
||||||
class="transition-opacity opacity-0 i-lucide-arrow-up-right size-3 group-hover/stat:opacity-100"
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</RouterLink>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-40
@@ -1,40 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed } from 'vue';
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
label: { type: String, required: true },
|
|
||||||
value: { type: String, required: true },
|
|
||||||
trend: { type: String, default: '' },
|
|
||||||
hint: { type: String, default: '' },
|
|
||||||
// null = neutral, true = good direction, false = bad direction
|
|
||||||
trendGood: { type: Boolean, default: null },
|
|
||||||
});
|
|
||||||
|
|
||||||
const trendClass = computed(() => {
|
|
||||||
if (props.trendGood === null) return 'text-n-slate-11';
|
|
||||||
return props.trendGood ? 'text-n-teal-11' : 'text-n-ruby-11';
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="flex flex-col gap-3 p-5 group bg-n-solid-1">
|
|
||||||
<div class="flex items-center gap-1.5">
|
|
||||||
<span class="text-sm font-medium text-n-slate-11">{{ label }}</span>
|
|
||||||
<span
|
|
||||||
v-if="hint"
|
|
||||||
v-tooltip="hint"
|
|
||||||
class="transition-opacity opacity-0 cursor-help i-lucide-info size-3.5 text-n-slate-10 group-hover:opacity-100"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex items-end justify-between gap-2">
|
|
||||||
<span
|
|
||||||
class="text-3xl font-semibold tracking-tight tabular-nums text-n-slate-12"
|
|
||||||
>
|
|
||||||
{{ value }}
|
|
||||||
</span>
|
|
||||||
<span class="text-sm font-medium tabular-nums" :class="trendClass">
|
|
||||||
{{ trend }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-81
@@ -1,81 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed } from 'vue';
|
|
||||||
import { useRoute, RouterLink } from 'vue-router';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
import { useAccount } from 'dashboard/composables/useAccount';
|
|
||||||
import { getHelpUrlForFeature } from 'dashboard/helper/featureHelper';
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
const route = useRoute();
|
|
||||||
const { isOnChatwootCloud } = useAccount();
|
|
||||||
|
|
||||||
const assistantParams = computed(() => ({
|
|
||||||
accountId: route.params.accountId,
|
|
||||||
assistantId: route.params.assistantId,
|
|
||||||
}));
|
|
||||||
|
|
||||||
const links = computed(() => [
|
|
||||||
{
|
|
||||||
key: 'docs',
|
|
||||||
title: t('CAPTAIN.OVERVIEW.LINKS.DOCS.TITLE'),
|
|
||||||
description: t('CAPTAIN.OVERVIEW.LINKS.DOCS.DESCRIPTION'),
|
|
||||||
icon: 'i-lucide-book-open',
|
|
||||||
href: getHelpUrlForFeature('captain'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'playground',
|
|
||||||
title: t('CAPTAIN.OVERVIEW.LINKS.PLAYGROUND.TITLE'),
|
|
||||||
description: t('CAPTAIN.OVERVIEW.LINKS.PLAYGROUND.DESCRIPTION'),
|
|
||||||
icon: 'i-lucide-flask-conical',
|
|
||||||
to: {
|
|
||||||
name: 'captain_assistants_playground_index',
|
|
||||||
params: assistantParams.value,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'billing',
|
|
||||||
title: t('CAPTAIN.OVERVIEW.LINKS.BILLING.TITLE'),
|
|
||||||
description: t('CAPTAIN.OVERVIEW.LINKS.BILLING.DESCRIPTION'),
|
|
||||||
icon: 'i-lucide-credit-card',
|
|
||||||
to: {
|
|
||||||
name: 'billing_settings_index',
|
|
||||||
params: { accountId: route.params.accountId },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div v-if="isOnChatwootCloud" class="grid grid-cols-1 gap-4 sm:grid-cols-3">
|
|
||||||
<component
|
|
||||||
:is="link.href ? 'a' : RouterLink"
|
|
||||||
v-for="link in links"
|
|
||||||
:key="link.key"
|
|
||||||
:href="link.href"
|
|
||||||
:to="link.to"
|
|
||||||
:target="link.href ? '_blank' : undefined"
|
|
||||||
:rel="link.href ? 'noopener noreferrer' : undefined"
|
|
||||||
class="flex items-center gap-3 p-4 transition-colors border rounded-xl bg-n-solid-1 border-n-weak hover:bg-n-alpha-1 group/link"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="grid rounded-lg size-9 shrink-0 place-content-center bg-n-alpha-2 text-n-slate-11"
|
|
||||||
>
|
|
||||||
<span :class="link.icon" class="size-4" />
|
|
||||||
</span>
|
|
||||||
<div class="flex flex-col min-w-0">
|
|
||||||
<span class="text-sm font-medium text-n-slate-12">
|
|
||||||
{{ link.title }}
|
|
||||||
</span>
|
|
||||||
<span class="text-xs truncate text-n-slate-11">
|
|
||||||
{{ link.description }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<span
|
|
||||||
:class="
|
|
||||||
link.href ? 'i-lucide-arrow-up-right' : 'i-lucide-chevron-right'
|
|
||||||
"
|
|
||||||
class="ml-auto transition-opacity opacity-0 size-4 text-n-slate-10 group-hover/link:opacity-100"
|
|
||||||
/>
|
|
||||||
</component>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-78
@@ -1,78 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed } from 'vue';
|
|
||||||
import { useToggle } from '@vueuse/core';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
import { vOnClickOutside } from '@vueuse/components';
|
|
||||||
import Button from 'dashboard/components-next/button/Button.vue';
|
|
||||||
import DropdownMenu from 'dashboard/components-next/dropdown-menu/DropdownMenu.vue';
|
|
||||||
|
|
||||||
const modelValue = defineModel({ type: String, default: '30' });
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
const [showDropdown, toggleDropdown] = useToggle();
|
|
||||||
|
|
||||||
const DAY_RANGES = ['7', '30', '90'];
|
|
||||||
|
|
||||||
const decorate = item => ({
|
|
||||||
...item,
|
|
||||||
action: 'select',
|
|
||||||
isSelected: item.value === modelValue.value,
|
|
||||||
});
|
|
||||||
|
|
||||||
const menuSections = computed(() => {
|
|
||||||
const dayItems = DAY_RANGES.map(value =>
|
|
||||||
decorate({
|
|
||||||
value,
|
|
||||||
label: t('CAPTAIN.OVERVIEW.RANGES.LAST_DAYS', { count: value }),
|
|
||||||
})
|
|
||||||
);
|
|
||||||
const monthItems = [
|
|
||||||
decorate({
|
|
||||||
value: 'this_month',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.RANGES.THIS_MONTH'),
|
|
||||||
}),
|
|
||||||
decorate({
|
|
||||||
value: 'last_month',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.RANGES.LAST_MONTH'),
|
|
||||||
}),
|
|
||||||
];
|
|
||||||
return [{ items: dayItems }, { items: monthItems }];
|
|
||||||
});
|
|
||||||
|
|
||||||
const menuItems = computed(() =>
|
|
||||||
menuSections.value.flatMap(section => section.items)
|
|
||||||
);
|
|
||||||
|
|
||||||
const selectedLabel = computed(
|
|
||||||
() => menuItems.value.find(item => item.isSelected)?.label || ''
|
|
||||||
);
|
|
||||||
|
|
||||||
const handleAction = ({ value }) => {
|
|
||||||
toggleDropdown(false);
|
|
||||||
modelValue.value = value;
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div
|
|
||||||
v-on-click-outside="() => toggleDropdown(false)"
|
|
||||||
class="relative flex items-center group"
|
|
||||||
>
|
|
||||||
<Button
|
|
||||||
sm
|
|
||||||
slate
|
|
||||||
faded
|
|
||||||
trailing-icon
|
|
||||||
icon="i-lucide-chevron-down"
|
|
||||||
:label="selectedLabel"
|
|
||||||
class="rounded-md group-hover:bg-n-alpha-2"
|
|
||||||
@click="toggleDropdown()"
|
|
||||||
/>
|
|
||||||
<DropdownMenu
|
|
||||||
v-if="showDropdown"
|
|
||||||
:menu-sections="menuSections"
|
|
||||||
class="mt-1 ltr:right-0 rtl:left-0 top-full"
|
|
||||||
@action="handleAction($event)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
-75
@@ -1,75 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed, ref, watch } from 'vue';
|
|
||||||
import { useRoute } from 'vue-router';
|
|
||||||
import CaptainAssistant from 'dashboard/api/captain/assistant';
|
|
||||||
import MessageFormatter from 'shared/helpers/MessageFormatter.js';
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
range: {
|
|
||||||
type: String,
|
|
||||||
default: '30',
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const assistantId = computed(() => route.params.assistantId);
|
|
||||||
|
|
||||||
// Markdown summary generated by the model from the assistant's stats (served by
|
|
||||||
// the captain/assistants/:id/summary endpoint). Numbers are emphasised with
|
|
||||||
// **bold** so we can highlight them (see prose-strong styling below).
|
|
||||||
const welcomeMarkdown = ref('');
|
|
||||||
const isLoading = ref(false);
|
|
||||||
|
|
||||||
const fetchSummary = async () => {
|
|
||||||
isLoading.value = true;
|
|
||||||
try {
|
|
||||||
const { data } = await CaptainAssistant.getSummary({
|
|
||||||
assistantId: assistantId.value,
|
|
||||||
range: props.range,
|
|
||||||
});
|
|
||||||
welcomeMarkdown.value = data.message ?? '';
|
|
||||||
} catch {
|
|
||||||
welcomeMarkdown.value = '';
|
|
||||||
} finally {
|
|
||||||
isLoading.value = false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
watch([() => props.range, assistantId], fetchSummary, { immediate: true });
|
|
||||||
|
|
||||||
// Render through the shared markdown formatter (html disabled, so it is safe)
|
|
||||||
// used everywhere else for Captain output, instead of a bespoke parser. It
|
|
||||||
// handles paragraphs, line breaks, links, lists and emphasis consistently.
|
|
||||||
const formattedSummary = computed(
|
|
||||||
() => new MessageFormatter(welcomeMarkdown.value).formattedMessage
|
|
||||||
);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- eslint-disable-next-line vue/no-root-v-if -->
|
|
||||||
<template>
|
|
||||||
<div v-if="isLoading || welcomeMarkdown" class="flex flex-col gap-3">
|
|
||||||
<div class="flex items-center gap-1.5 text-n-slate-10">
|
|
||||||
<span class="i-lucide-sparkles size-3.5" />
|
|
||||||
<span class="text-xs">
|
|
||||||
{{ $t('CAPTAIN.OVERVIEW.WELCOME.LABEL') }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-if="isLoading"
|
|
||||||
class="flex flex-col gap-5"
|
|
||||||
:aria-label="$t('CAPTAIN.OVERVIEW.WELCOME.LOADING')"
|
|
||||||
>
|
|
||||||
<div class="flex flex-col gap-2.5">
|
|
||||||
<div class="w-full h-5 rounded bg-n-slate-3 animate-pulse" />
|
|
||||||
<div class="w-11/12 h-5 rounded bg-n-slate-3 animate-pulse" />
|
|
||||||
<div class="w-4/6 h-5 rounded bg-n-slate-3 animate-pulse" />
|
|
||||||
</div>
|
|
||||||
<div class="w-5/6 h-5 rounded bg-n-slate-3 animate-pulse" />
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else
|
|
||||||
v-dompurify-html="formattedSummary"
|
|
||||||
class="max-w-none prose prose-p:text-lg prose-p:leading-relaxed prose-p:mt-0 prose-p:mb-3 last:prose-p:mb-0 prose-strong:font-bold prose-strong:tabular-nums prose-strong:text-n-brand text-n-slate-12"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
+1
-1
@@ -65,7 +65,7 @@ const handleAssistantChange = async assistant => {
|
|||||||
|
|
||||||
const currentRouteName = route.name;
|
const currentRouteName = route.name;
|
||||||
const targetRouteName =
|
const targetRouteName =
|
||||||
currentRouteName || 'captain_assistants_overview_index';
|
currentRouteName || 'captain_assistants_responses_index';
|
||||||
|
|
||||||
await fetchDataForRoute(targetRouteName, assistant.id);
|
await fetchDataForRoute(targetRouteName, assistant.id);
|
||||||
|
|
||||||
|
|||||||
@@ -75,16 +75,6 @@ const hasConversationUnreadCounts = computed(() => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
const hasFilteredUnreadCounts = computed(() => {
|
|
||||||
return (
|
|
||||||
hasConversationUnreadCounts.value &&
|
|
||||||
isFeatureEnabledonAccount.value(
|
|
||||||
accountId.value,
|
|
||||||
FEATURE_FLAGS.UNREAD_COUNT_FOR_FILTERS
|
|
||||||
)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
const fetchConversationUnreadCounts = ([currentAccountId, isEnabled]) => {
|
const fetchConversationUnreadCounts = ([currentAccountId, isEnabled]) => {
|
||||||
if (!currentAccountId) return;
|
if (!currentAccountId) return;
|
||||||
|
|
||||||
@@ -209,18 +199,6 @@ const getLabelUnreadCount = useMapGetter(
|
|||||||
const getTeamUnreadCount = useMapGetter(
|
const getTeamUnreadCount = useMapGetter(
|
||||||
'conversationUnreadCounts/getTeamUnreadCount'
|
'conversationUnreadCounts/getTeamUnreadCount'
|
||||||
);
|
);
|
||||||
const mentionsUnreadCount = useMapGetter(
|
|
||||||
'conversationUnreadCounts/getMentionsUnreadCount'
|
|
||||||
);
|
|
||||||
const participatingUnreadCount = useMapGetter(
|
|
||||||
'conversationUnreadCounts/getParticipatingUnreadCount'
|
|
||||||
);
|
|
||||||
const unattendedUnreadCount = useMapGetter(
|
|
||||||
'conversationUnreadCounts/getUnattendedUnreadCount'
|
|
||||||
);
|
|
||||||
const getFolderUnreadCount = useMapGetter(
|
|
||||||
'conversationUnreadCounts/getFolderUnreadCount'
|
|
||||||
);
|
|
||||||
const teams = useMapGetter('teams/getMyTeams');
|
const teams = useMapGetter('teams/getMyTeams');
|
||||||
const contactCustomViews = useMapGetter('customViews/getContactCustomViews');
|
const contactCustomViews = useMapGetter('customViews/getContactCustomViews');
|
||||||
const conversationCustomViews = useMapGetter(
|
const conversationCustomViews = useMapGetter(
|
||||||
@@ -248,22 +226,14 @@ watch([accountId, currentUserId], fetchSidebarSortPreferences, {
|
|||||||
immediate: true,
|
immediate: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
const hasUnreadCountsForSection = section => {
|
|
||||||
if (section === SIDEBAR_SORT_SECTIONS.FOLDERS) {
|
|
||||||
return hasFilteredUnreadCounts.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
return hasConversationUnreadCounts.value;
|
|
||||||
};
|
|
||||||
|
|
||||||
const getSortOptionsForSection = section =>
|
const getSortOptionsForSection = section =>
|
||||||
getSidebarSortOptions(section, {
|
getSidebarSortOptions(section, {
|
||||||
hasUnreadCounts: hasUnreadCountsForSection(section),
|
hasUnreadCounts: hasConversationUnreadCounts.value,
|
||||||
});
|
});
|
||||||
|
|
||||||
const getSortForSection = section =>
|
const getSortForSection = section =>
|
||||||
resolveSidebarSort(section, getSidebarSectionSort.value(section), {
|
resolveSidebarSort(section, getSidebarSectionSort.value(section), {
|
||||||
hasUnreadCounts: hasUnreadCountsForSection(section),
|
hasUnreadCounts: hasConversationUnreadCounts.value,
|
||||||
});
|
});
|
||||||
|
|
||||||
const updateSortPreference = (section, sortBy) => {
|
const updateSortPreference = (section, sortBy) => {
|
||||||
@@ -283,7 +253,6 @@ const sortedFolders = computed(() =>
|
|||||||
sortSidebarItems(conversationCustomViews.value, {
|
sortSidebarItems(conversationCustomViews.value, {
|
||||||
sortBy: getSortForSection(SIDEBAR_SORT_SECTIONS.FOLDERS),
|
sortBy: getSortForSection(SIDEBAR_SORT_SECTIONS.FOLDERS),
|
||||||
labelKey: view => view.name,
|
labelKey: view => view.name,
|
||||||
unreadCountKey: view => getFolderUnreadCount.value(view.id),
|
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -373,9 +342,6 @@ const menuItems = computed(() => {
|
|||||||
name: 'Mentions',
|
name: 'Mentions',
|
||||||
label: t('SIDEBAR.MENTIONED_CONVERSATIONS'),
|
label: t('SIDEBAR.MENTIONED_CONVERSATIONS'),
|
||||||
icon: 'i-lucide-at-sign',
|
icon: 'i-lucide-at-sign',
|
||||||
badgeCount: hasFilteredUnreadCounts.value
|
|
||||||
? mentionsUnreadCount.value
|
|
||||||
: 0,
|
|
||||||
activeOn: ['conversation_through_mentions'],
|
activeOn: ['conversation_through_mentions'],
|
||||||
to: accountScopedRoute('conversation_mentions'),
|
to: accountScopedRoute('conversation_mentions'),
|
||||||
},
|
},
|
||||||
@@ -383,9 +349,6 @@ const menuItems = computed(() => {
|
|||||||
name: 'Participating',
|
name: 'Participating',
|
||||||
label: t('SIDEBAR.PARTICIPATING_CONVERSATIONS'),
|
label: t('SIDEBAR.PARTICIPATING_CONVERSATIONS'),
|
||||||
icon: 'i-lucide-user-round-check',
|
icon: 'i-lucide-user-round-check',
|
||||||
badgeCount: hasFilteredUnreadCounts.value
|
|
||||||
? participatingUnreadCount.value
|
|
||||||
: 0,
|
|
||||||
activeOn: ['conversation_through_participating'],
|
activeOn: ['conversation_through_participating'],
|
||||||
to: accountScopedRoute('conversation_participating'),
|
to: accountScopedRoute('conversation_participating'),
|
||||||
},
|
},
|
||||||
@@ -394,9 +357,6 @@ const menuItems = computed(() => {
|
|||||||
activeOn: ['conversation_through_unattended'],
|
activeOn: ['conversation_through_unattended'],
|
||||||
label: t('SIDEBAR.UNATTENDED_CONVERSATIONS'),
|
label: t('SIDEBAR.UNATTENDED_CONVERSATIONS'),
|
||||||
icon: 'i-lucide-clock-alert',
|
icon: 'i-lucide-clock-alert',
|
||||||
badgeCount: hasFilteredUnreadCounts.value
|
|
||||||
? unattendedUnreadCount.value
|
|
||||||
: 0,
|
|
||||||
to: accountScopedRoute('conversation_unattended'),
|
to: accountScopedRoute('conversation_unattended'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -410,9 +370,6 @@ const menuItems = computed(() => {
|
|||||||
children: sortedFolders.value.map(view => ({
|
children: sortedFolders.value.map(view => ({
|
||||||
name: `${view.name}-${view.id}`,
|
name: `${view.name}-${view.id}`,
|
||||||
label: view.name,
|
label: view.name,
|
||||||
badgeCount: hasFilteredUnreadCounts.value
|
|
||||||
? getFolderUnreadCount.value(view.id)
|
|
||||||
: 0,
|
|
||||||
to: accountScopedRoute('folder_conversations', { id: view.id }),
|
to: accountScopedRoute('folder_conversations', { id: view.id }),
|
||||||
})),
|
})),
|
||||||
},
|
},
|
||||||
@@ -483,14 +440,6 @@ const menuItems = computed(() => {
|
|||||||
label: t('SIDEBAR.CAPTAIN'),
|
label: t('SIDEBAR.CAPTAIN'),
|
||||||
activeOn: ['captain_assistants_create_index'],
|
activeOn: ['captain_assistants_create_index'],
|
||||||
children: [
|
children: [
|
||||||
{
|
|
||||||
name: 'Overview',
|
|
||||||
label: t('SIDEBAR.CAPTAIN_OVERVIEW'),
|
|
||||||
activeOn: ['captain_assistants_overview_index'],
|
|
||||||
to: accountScopedRoute('captain_assistants_index', {
|
|
||||||
navigationPath: 'captain_assistants_overview_index',
|
|
||||||
}),
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: 'FAQs',
|
name: 'FAQs',
|
||||||
label: t('SIDEBAR.CAPTAIN_RESPONSES'),
|
label: t('SIDEBAR.CAPTAIN_RESPONSES'),
|
||||||
|
|||||||
@@ -123,10 +123,6 @@ onMounted(() => {
|
|||||||
a {
|
a {
|
||||||
@apply p-4;
|
@apply p-4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ProseMirror a {
|
|
||||||
@apply p-0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import ChannelSelector from '../ChannelSelector.vue';
|
import ChannelSelector from '../ChannelSelector.vue';
|
||||||
import { IS_WHATSAPP_INBOX_CREATION_DISABLED } from 'dashboard/constants/globals';
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
channel: {
|
channel: {
|
||||||
@@ -59,7 +58,6 @@ const isActive = computed(() => {
|
|||||||
|
|
||||||
if (key === 'whatsapp_call') {
|
if (key === 'whatsapp_call') {
|
||||||
return (
|
return (
|
||||||
!IS_WHATSAPP_INBOX_CREATION_DISABLED &&
|
|
||||||
props.enabledFeatures.channel_voice &&
|
props.enabledFeatures.channel_voice &&
|
||||||
!!window.chatwootConfig?.whatsappAppId &&
|
!!window.chatwootConfig?.whatsappAppId &&
|
||||||
window.chatwootConfig.whatsappAppId !== 'none'
|
window.chatwootConfig.whatsappAppId !== 'none'
|
||||||
|
|||||||
@@ -62,10 +62,7 @@ export default {
|
|||||||
immediate: true,
|
immediate: true,
|
||||||
handler(inboxId) {
|
handler(inboxId) {
|
||||||
if (inboxId) {
|
if (inboxId) {
|
||||||
this.$store.dispatch('inboxAssignableAgents/fetch', {
|
this.$store.dispatch('inboxAssignableAgents/fetch', [inboxId]);
|
||||||
inboxIds: [inboxId],
|
|
||||||
includeAgentBots: true,
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -2,7 +2,6 @@
|
|||||||
import { computed, ref, watch } from 'vue';
|
import { computed, ref, watch } from 'vue';
|
||||||
import { getLastMessage } from 'dashboard/helper/conversationHelper';
|
import { getLastMessage } from 'dashboard/helper/conversationHelper';
|
||||||
import Avatar from 'next/avatar/Avatar.vue';
|
import Avatar from 'next/avatar/Avatar.vue';
|
||||||
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
|
||||||
import MessagePreview from './MessagePreview.vue';
|
import MessagePreview from './MessagePreview.vue';
|
||||||
import InboxName from '../InboxName.vue';
|
import InboxName from '../InboxName.vue';
|
||||||
import TimeAgo from 'dashboard/components/ui/TimeAgo.vue';
|
import TimeAgo from 'dashboard/components/ui/TimeAgo.vue';
|
||||||
@@ -58,13 +57,7 @@ const showMetaSection = computed(() => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
const isAgentBotAssignee = computed(
|
const hasSlaPolicyId = computed(() => props.chat?.sla_policy_id);
|
||||||
() => props.chat?.meta?.assignee_type === 'AgentBot'
|
|
||||||
);
|
|
||||||
|
|
||||||
const hasSlaPolicyId = computed(
|
|
||||||
() => props.chat?.applied_sla?.id && !props.currentContact?.blocked
|
|
||||||
);
|
|
||||||
|
|
||||||
const showLabelsSection = computed(() => {
|
const showLabelsSection = computed(() => {
|
||||||
return props.chat.labels?.length > 0 || hasSlaPolicyId.value;
|
return props.chat.labels?.length > 0 || hasSlaPolicyId.value;
|
||||||
@@ -164,15 +157,10 @@ watch(
|
|||||||
>
|
>
|
||||||
<span
|
<span
|
||||||
v-if="showAssignee && assignee.name"
|
v-if="showAssignee && assignee.name"
|
||||||
class="text-n-slate-11 text-xs font-medium leading-3 py-0.5 px-0 inline-flex items-center gap-px truncate"
|
class="text-n-slate-11 text-xs font-medium leading-3 py-0.5 px-0 inline-flex items-center truncate"
|
||||||
>
|
>
|
||||||
<Icon
|
<fluent-icon icon="person" size="12" class="text-n-slate-11" />
|
||||||
:icon="
|
{{ assignee.name }}
|
||||||
isAgentBotAssignee ? 'i-lucide-bot' : 'i-lucide-user-round'
|
|
||||||
"
|
|
||||||
class="size-3 text-n-slate-11 flex-shrink-0"
|
|
||||||
/>
|
|
||||||
<span class="truncate">{{ assignee.name }}</span>
|
|
||||||
</span>
|
</span>
|
||||||
<CardPriorityIcon
|
<CardPriorityIcon
|
||||||
:priority="chat.priority"
|
:priority="chat.priority"
|
||||||
|
|||||||
@@ -93,9 +93,7 @@ const hasMultipleInboxes = computed(
|
|||||||
() => store.getters['inboxes/getInboxes'].length > 1
|
() => store.getters['inboxes/getInboxes'].length > 1
|
||||||
);
|
);
|
||||||
|
|
||||||
const hasSlaPolicyId = computed(
|
const hasSlaPolicyId = computed(() => props.chat?.sla_policy_id);
|
||||||
() => props.chat?.applied_sla?.id && !currentContact.value?.blocked
|
|
||||||
);
|
|
||||||
|
|
||||||
const copyConversationId = async () => {
|
const copyConversationId = async () => {
|
||||||
try {
|
try {
|
||||||
|
|||||||
@@ -123,13 +123,7 @@ export default {
|
|||||||
$t('EMAIL_TRANSCRIPT.FORM.SEND_TO_CONTACT')
|
$t('EMAIL_TRANSCRIPT.FORM.SEND_TO_CONTACT')
|
||||||
}}</label>
|
}}</label>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div v-if="currentChat.meta.assignee" class="flex items-center gap-2">
|
||||||
v-if="
|
|
||||||
currentChat.meta.assignee &&
|
|
||||||
currentChat.meta.assignee_type !== 'AgentBot'
|
|
||||||
"
|
|
||||||
class="flex items-center gap-2"
|
|
||||||
>
|
|
||||||
<input
|
<input
|
||||||
id="assignee"
|
id="assignee"
|
||||||
v-model="selectedType"
|
v-model="selectedType"
|
||||||
|
|||||||
+1
-2
@@ -1,7 +1,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { evaluateSLAStatus } from 'dashboard/helper/slaHelper';
|
import { evaluateSLAStatus } from '@chatwoot/utils';
|
||||||
import SLAPopoverCard from './SLAPopoverCard.vue';
|
import SLAPopoverCard from './SLAPopoverCard.vue';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@@ -61,7 +61,6 @@ const updateSlaStatus = () => {
|
|||||||
slaStatus.value = evaluateSLAStatus({
|
slaStatus.value = evaluateSLAStatus({
|
||||||
appliedSla: appliedSLA.value,
|
appliedSla: appliedSLA.value,
|
||||||
chat: props.chat,
|
chat: props.chat,
|
||||||
slaEvents: slaEvents.value || [],
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -33,19 +33,10 @@ defineProps({
|
|||||||
v-if="variant === 'agent'"
|
v-if="variant === 'agent'"
|
||||||
:name="option.label"
|
:name="option.label"
|
||||||
:src="option.thumbnail"
|
:src="option.thumbnail"
|
||||||
:icon-name="option.iconName"
|
|
||||||
:status="option.status === 'online' ? option.status : null"
|
:status="option.status === 'online' ? option.status : null"
|
||||||
:size="20"
|
:size="20"
|
||||||
class="flex-shrink-0"
|
class="flex-shrink-0"
|
||||||
>
|
/>
|
||||||
<template v-if="option.iconName && option.thumbnail" #badge>
|
|
||||||
<div
|
|
||||||
class="absolute z-20 flex items-center justify-center rounded-full outline outline-1 outline-n-weak bg-n-solid-1 -bottom-0.5 ltr:-right-0.5 rtl:-left-0.5 size-3"
|
|
||||||
>
|
|
||||||
<Icon icon="i-lucide-bot" class="text-n-slate-11 size-2" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</Avatar>
|
|
||||||
<p class="menu-label truncate min-w-0 flex-1">
|
<p class="menu-label truncate min-w-0 flex-1">
|
||||||
{{ option.label }}
|
{{ option.label }}
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
-60
@@ -1,60 +0,0 @@
|
|||||||
import { shallowMount } from '@vue/test-utils';
|
|
||||||
import ConversationCard from '../ConversationCard.vue';
|
|
||||||
|
|
||||||
const defaultChat = {
|
|
||||||
id: 1,
|
|
||||||
labels: [],
|
|
||||||
messages: [],
|
|
||||||
priority: null,
|
|
||||||
unread_count: 0,
|
|
||||||
timestamp: 1700000000,
|
|
||||||
created_at: 1700000000,
|
|
||||||
};
|
|
||||||
|
|
||||||
const mountComponent = (chat, currentContact = {}) =>
|
|
||||||
shallowMount(ConversationCard, {
|
|
||||||
props: {
|
|
||||||
chat: { ...defaultChat, ...chat },
|
|
||||||
currentContact: {
|
|
||||||
name: 'Jane Doe',
|
|
||||||
thumbnail: '',
|
|
||||||
availability_status: 'offline',
|
|
||||||
...currentContact,
|
|
||||||
},
|
|
||||||
inbox: { id: 1 },
|
|
||||||
},
|
|
||||||
global: {
|
|
||||||
stubs: {
|
|
||||||
'fluent-icon': true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('ConversationCard', () => {
|
|
||||||
it('does not reserve the labels row when only a persisted SLA policy id is present', () => {
|
|
||||||
const wrapper = mountComponent({ sla_policy_id: 1, applied_sla: null });
|
|
||||||
|
|
||||||
expect(wrapper.findComponent({ name: 'CardLabels' }).exists()).toBe(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('shows the labels row when an active applied SLA is present', () => {
|
|
||||||
const wrapper = mountComponent({
|
|
||||||
sla_policy_id: 1,
|
|
||||||
applied_sla: { id: 1 },
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(wrapper.findComponent({ name: 'CardLabels' }).exists()).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not reserve the labels row when the contact is blocked', () => {
|
|
||||||
const wrapper = mountComponent(
|
|
||||||
{
|
|
||||||
sla_policy_id: 1,
|
|
||||||
applied_sla: { id: 1 },
|
|
||||||
},
|
|
||||||
{ blocked: true }
|
|
||||||
);
|
|
||||||
|
|
||||||
expect(wrapper.findComponent({ name: 'CardLabels' }).exists()).toBe(false);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@@ -26,12 +26,11 @@ const mockNoneAgent = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const mockUseMapGetter = (overrides = {}) => {
|
const mockUseMapGetter = (overrides = {}) => {
|
||||||
const getAssignableAgents = vi.fn(() => allAgentsData);
|
|
||||||
const defaultGetters = {
|
const defaultGetters = {
|
||||||
getCurrentUser: ref(allAgentsData[0]),
|
getCurrentUser: ref(allAgentsData[0]),
|
||||||
getSelectedChat: ref({ inbox_id: 1, meta: { assignee: true } }),
|
getSelectedChat: ref({ inbox_id: 1, meta: { assignee: true } }),
|
||||||
getCurrentAccountId: ref(1),
|
getCurrentAccountId: ref(1),
|
||||||
'inboxAssignableAgents/getAssignableAgents': ref(getAssignableAgents),
|
'inboxAssignableAgents/getAssignableAgents': ref(() => allAgentsData),
|
||||||
};
|
};
|
||||||
|
|
||||||
const mergedGetters = { ...defaultGetters, ...overrides };
|
const mergedGetters = { ...defaultGetters, ...overrides };
|
||||||
@@ -54,24 +53,6 @@ describe('useAgentsList', () => {
|
|||||||
const { agentsList, assignableAgents } = useAgentsList();
|
const { agentsList, assignableAgents } = useAgentsList();
|
||||||
|
|
||||||
expect(assignableAgents.value).toEqual(allAgentsData);
|
expect(assignableAgents.value).toEqual(allAgentsData);
|
||||||
expect(
|
|
||||||
useMapGetter('inboxAssignableAgents/getAssignableAgents').value
|
|
||||||
).toHaveBeenCalledWith(1, { includeAgentBots: false });
|
|
||||||
expect(agentsList.value[0]).toEqual(mockNoneAgent);
|
|
||||||
expect(agentsList.value.length).toBe(
|
|
||||||
formattedAgentsData.slice(1).length + 1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('requests agent bots when explicitly included', () => {
|
|
||||||
const { agentsList, assignableAgents } = useAgentsList(true, {
|
|
||||||
includeAgentBots: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(assignableAgents.value).toEqual(allAgentsData);
|
|
||||||
expect(
|
|
||||||
useMapGetter('inboxAssignableAgents/getAssignableAgents').value
|
|
||||||
).toHaveBeenCalledWith(1, { includeAgentBots: true });
|
|
||||||
expect(agentsList.value[0]).toEqual(mockNoneAgent);
|
expect(agentsList.value[0]).toEqual(mockNoneAgent);
|
||||||
expect(agentsList.value.length).toBe(
|
expect(agentsList.value.length).toBe(
|
||||||
formattedAgentsData.slice(1).length + 1
|
formattedAgentsData.slice(1).length + 1
|
||||||
|
|||||||
@@ -10,14 +10,9 @@ import {
|
|||||||
* A composable function that provides a list of agents for assignment.
|
* A composable function that provides a list of agents for assignment.
|
||||||
*
|
*
|
||||||
* @param {boolean} [includeNoneAgent=true] - Whether to include a 'None' agent option.
|
* @param {boolean} [includeNoneAgent=true] - Whether to include a 'None' agent option.
|
||||||
* @param {Object} [options] - Options for the assignable agents list.
|
|
||||||
* @param {boolean} [options.includeAgentBots=false] - Whether to include AgentBot assignees. Only pass this from surfaces that thread `assignee_type` through the assignment request.
|
|
||||||
* @returns {Object} An object containing the agents list and assignable agents.
|
* @returns {Object} An object containing the agents list and assignable agents.
|
||||||
*/
|
*/
|
||||||
export function useAgentsList(
|
export function useAgentsList(includeNoneAgent = true) {
|
||||||
includeNoneAgent = true,
|
|
||||||
{ includeAgentBots = false } = {}
|
|
||||||
) {
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const currentUser = useMapGetter('getCurrentUser');
|
const currentUser = useMapGetter('getCurrentUser');
|
||||||
const currentChat = useMapGetter('getSelectedChat');
|
const currentChat = useMapGetter('getSelectedChat');
|
||||||
@@ -44,9 +39,7 @@ export function useAgentsList(
|
|||||||
* @type {import('vue').ComputedRef<Array>}
|
* @type {import('vue').ComputedRef<Array>}
|
||||||
*/
|
*/
|
||||||
const assignableAgents = computed(() => {
|
const assignableAgents = computed(() => {
|
||||||
return inboxId.value
|
return inboxId.value ? assignable.value(inboxId.value) : [];
|
||||||
? assignable.value(inboxId.value, { includeAgentBots })
|
|
||||||
: [];
|
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -161,7 +161,6 @@ const buildCallActions = ({ callsStore, whatsappSession, t }) => {
|
|||||||
return { conferenceSid: joinResponse?.conference_sid };
|
return { conferenceSid: joinResponse?.conference_sid };
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
useAlert(error?.response?.data?.error || t('CONTACT_PANEL.CALL_FAILED'));
|
useAlert(error?.response?.data?.error || t('CONTACT_PANEL.CALL_FAILED'));
|
||||||
// 409 = the call already ended before accept landed (e.g. caller hung up mid-ring).
|
|
||||||
if (error?.response?.status === 409) {
|
if (error?.response?.status === 409) {
|
||||||
TwilioVoiceClient.endClientCall();
|
TwilioVoiceClient.endClientCall();
|
||||||
markDismissed(callSid);
|
markDismissed(callSid);
|
||||||
|
|||||||
@@ -1,35 +0,0 @@
|
|||||||
// Single source of truth for billing currencies on the frontend.
|
|
||||||
// Adding a currency = one entry in BILLING_CURRENCY_CONFIG, add the code to
|
|
||||||
// SUPPORTED_BILLING_CURRENCIES, and add its label key under
|
|
||||||
// BILLING_SETTINGS.CURRENCY.OPTIONS in the locale files.
|
|
||||||
|
|
||||||
export const DEFAULT_BILLING_CURRENCY = 'usd';
|
|
||||||
|
|
||||||
// Order here drives the order of the currency toggle in the UI.
|
|
||||||
export const SUPPORTED_BILLING_CURRENCIES = ['usd', 'brl'];
|
|
||||||
|
|
||||||
export const BILLING_CURRENCY_CONFIG = {
|
|
||||||
usd: {
|
|
||||||
code: 'usd',
|
|
||||||
intlLocale: 'en-US',
|
|
||||||
i18nLabelKey: 'BILLING_SETTINGS.CURRENCY.OPTIONS.USD',
|
|
||||||
},
|
|
||||||
brl: {
|
|
||||||
code: 'brl',
|
|
||||||
intlLocale: 'pt-BR',
|
|
||||||
i18nLabelKey: 'BILLING_SETTINGS.CURRENCY.OPTIONS.BRL',
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
export const getCurrencyConfig = code =>
|
|
||||||
BILLING_CURRENCY_CONFIG[(code || DEFAULT_BILLING_CURRENCY).toLowerCase()] ||
|
|
||||||
BILLING_CURRENCY_CONFIG[DEFAULT_BILLING_CURRENCY];
|
|
||||||
|
|
||||||
export const formatCurrencyAmount = (amount, code, options = {}) => {
|
|
||||||
const { intlLocale, code: currencyCode } = getCurrencyConfig(code);
|
|
||||||
return new Intl.NumberFormat(intlLocale, {
|
|
||||||
style: 'currency',
|
|
||||||
currency: currencyCode.toUpperCase(),
|
|
||||||
...options,
|
|
||||||
}).format(amount);
|
|
||||||
};
|
|
||||||
@@ -188,16 +188,6 @@ export const ARTICLE_EDITOR_MENU_OPTIONS = [
|
|||||||
'insertTable',
|
'insertTable',
|
||||||
];
|
];
|
||||||
|
|
||||||
// [text](url) -> "text: url" (drop label if it equals the URL). Keep serializer
|
|
||||||
// escapes; the re-parse renders them literally, unescaping would crash it.
|
|
||||||
const flattenLink = (_match, text, url) => {
|
|
||||||
const cleanUrl = url
|
|
||||||
.trim()
|
|
||||||
.replace(/\s+["'(].*$/, '')
|
|
||||||
.replace(/^<|>$/g, '');
|
|
||||||
return text === cleanUrl ? cleanUrl : `${text}: ${cleanUrl}`;
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Markdown formatting patterns for stripping unsupported formatting.
|
* Markdown formatting patterns for stripping unsupported formatting.
|
||||||
*
|
*
|
||||||
@@ -274,12 +264,7 @@ export const MARKDOWN_PATTERNS = [
|
|||||||
{
|
{
|
||||||
type: 'link', // PM: link
|
type: 'link', // PM: link
|
||||||
patterns: [
|
patterns: [
|
||||||
// Escape-aware label + URL captures so a \] or \) can't cut the match
|
{ pattern: /\[([^\]]+)\]\([^)]+\)/g, replacement: '$1' }, // [text](url) -> text
|
||||||
// short and leave link markup that crashes the re-parse.
|
|
||||||
{
|
|
||||||
pattern: /\[((?:\\.|[^\]\\])*)\]\(((?:\\.|[^)\\])*)\)/g,
|
|
||||||
replacement: flattenLink,
|
|
||||||
},
|
|
||||||
{ pattern: /<([a-zA-Z][a-zA-Z0-9+.-]*:[^\s>]+)>/g, replacement: '$1' }, // <https://...>, <mailto:...>, <tel:...>, <ftp://...>, etc
|
{ pattern: /<([a-zA-Z][a-zA-Z0-9+.-]*:[^\s>]+)>/g, replacement: '$1' }, // <https://...>, <mailto:...>, <tel:...>, <ftp://...>, etc
|
||||||
{ pattern: /<([^\s@]+@[^\s@>]+)>/g, replacement: '$1' }, // <user@example.com> -> user@example.com
|
{ pattern: /<([^\s@]+@[^\s@>]+)>/g, replacement: '$1' }, // <user@example.com> -> user@example.com
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -78,7 +78,3 @@ export default {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
export const DEFAULT_REDIRECT_URL = '/app/';
|
export const DEFAULT_REDIRECT_URL = '/app/';
|
||||||
|
|
||||||
// Temporarily disables WhatsApp embedded signup and WhatsApp Call inbox
|
|
||||||
// creation. Flip to false when the channel is brought back.
|
|
||||||
export const IS_WHATSAPP_INBOX_CREATION_DISABLED = true;
|
|
||||||
|
|||||||
@@ -47,7 +47,6 @@ export const FEATURE_FLAGS = {
|
|||||||
ADVANCED_SEARCH: 'advanced_search',
|
ADVANCED_SEARCH: 'advanced_search',
|
||||||
CONVERSATION_REQUIRED_ATTRIBUTES: 'conversation_required_attributes',
|
CONVERSATION_REQUIRED_ATTRIBUTES: 'conversation_required_attributes',
|
||||||
CONVERSATION_UNREAD_COUNTS: 'conversation_unread_counts',
|
CONVERSATION_UNREAD_COUNTS: 'conversation_unread_counts',
|
||||||
UNREAD_COUNT_FOR_FILTERS: 'unread_count_for_filters',
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export const PREMIUM_FEATURES = [
|
export const PREMIUM_FEATURES = [
|
||||||
|
|||||||
@@ -17,13 +17,6 @@ import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
|||||||
|
|
||||||
const { isImpersonating } = useImpersonation();
|
const { isImpersonating } = useImpersonation();
|
||||||
const UNREAD_COUNTS_REFETCH_THROTTLE_MS = 5000;
|
const UNREAD_COUNTS_REFETCH_THROTTLE_MS = 5000;
|
||||||
const FILTERED_UNREAD_COUNTS_REFRESH_RETRY_MS = 30000;
|
|
||||||
const FILTERED_UNREAD_COUNTS_REFRESH_RETRY_JITTER_MS = 15000;
|
|
||||||
const MENTION_UNREAD_COUNTS_REFETCH_DELAY_MS =
|
|
||||||
UNREAD_COUNTS_REFETCH_THROTTLE_MS;
|
|
||||||
const getFilteredUnreadCountsRefreshRetryDelay = () =>
|
|
||||||
FILTERED_UNREAD_COUNTS_REFRESH_RETRY_MS +
|
|
||||||
Math.random() * FILTERED_UNREAD_COUNTS_REFRESH_RETRY_JITTER_MS;
|
|
||||||
|
|
||||||
class ActionCableConnector extends BaseActionCableConnector {
|
class ActionCableConnector extends BaseActionCableConnector {
|
||||||
constructor(app, pubsubToken) {
|
constructor(app, pubsubToken) {
|
||||||
@@ -32,9 +25,6 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
this.CancelTyping = [];
|
this.CancelTyping = [];
|
||||||
this.lastUnreadCountsFetchAt = null;
|
this.lastUnreadCountsFetchAt = null;
|
||||||
this.unreadCountsFetchTimer = null;
|
this.unreadCountsFetchTimer = null;
|
||||||
this.mentionUnreadCountsFetchTimer = null;
|
|
||||||
this.mentionUnreadCountsRetryTimer = null;
|
|
||||||
this.filteredUnreadCountsRetryTimer = null;
|
|
||||||
this.events = {
|
this.events = {
|
||||||
'message.created': this.onMessageCreated,
|
'message.created': this.onMessageCreated,
|
||||||
'message.updated': this.onMessageUpdated,
|
'message.updated': this.onMessageUpdated,
|
||||||
@@ -150,12 +140,7 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
};
|
};
|
||||||
|
|
||||||
onConversationUnreadCountChanged = () => {
|
onConversationUnreadCountChanged = () => {
|
||||||
this.refreshConversationUnreadCountsWithFilteredRetry();
|
|
||||||
};
|
|
||||||
|
|
||||||
refreshConversationUnreadCountsWithFilteredRetry = () => {
|
|
||||||
this.throttledFetchConversationUnreadCounts();
|
this.throttledFetchConversationUnreadCounts();
|
||||||
this.scheduleFilteredUnreadCountsRetry();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
throttledFetchConversationUnreadCounts = () => {
|
throttledFetchConversationUnreadCounts = () => {
|
||||||
@@ -186,51 +171,6 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
this.unreadCountsFetchTimer = null;
|
this.unreadCountsFetchTimer = null;
|
||||||
};
|
};
|
||||||
|
|
||||||
scheduleMentionUnreadCountsFetch = () => {
|
|
||||||
if (!this.isFilteredUnreadCountsEnabled()) return;
|
|
||||||
|
|
||||||
// Mention invalidation runs through the async dispatcher, and stale snapshots
|
|
||||||
// can be served until the filtered-count backend refresh window opens.
|
|
||||||
this.scheduleUnreadCountsFetchAfter(
|
|
||||||
'mentionUnreadCountsFetchTimer',
|
|
||||||
MENTION_UNREAD_COUNTS_REFETCH_DELAY_MS
|
|
||||||
);
|
|
||||||
this.scheduleUnreadCountsFetchAfter(
|
|
||||||
'mentionUnreadCountsRetryTimer',
|
|
||||||
getFilteredUnreadCountsRefreshRetryDelay(),
|
|
||||||
{ reset: true }
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
scheduleFilteredUnreadCountsRetry = () => {
|
|
||||||
if (!this.isFilteredUnreadCountsEnabled()) return;
|
|
||||||
|
|
||||||
// Filtered snapshots can intentionally stay stale until the backend
|
|
||||||
// refresh window opens.
|
|
||||||
this.scheduleUnreadCountsFetchAfter(
|
|
||||||
'filteredUnreadCountsRetryTimer',
|
|
||||||
getFilteredUnreadCountsRefreshRetryDelay(),
|
|
||||||
{ reset: true }
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
scheduleUnreadCountsFetchAfter = (
|
|
||||||
timerName,
|
|
||||||
delay,
|
|
||||||
{ reset = false } = {}
|
|
||||||
) => {
|
|
||||||
if (this[timerName]) {
|
|
||||||
if (!reset) return;
|
|
||||||
|
|
||||||
clearTimeout(this[timerName]);
|
|
||||||
}
|
|
||||||
|
|
||||||
this[timerName] = setTimeout(() => {
|
|
||||||
this[timerName] = null;
|
|
||||||
this.throttledFetchConversationUnreadCounts();
|
|
||||||
}, delay);
|
|
||||||
};
|
|
||||||
|
|
||||||
fetchConversationUnreadCounts = () => {
|
fetchConversationUnreadCounts = () => {
|
||||||
if (!this.isConversationUnreadCountsEnabled()) return;
|
if (!this.isConversationUnreadCountsEnabled()) return;
|
||||||
|
|
||||||
@@ -249,17 +189,6 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
isFilteredUnreadCountsEnabled = () => {
|
|
||||||
const accountId = this.app.$store.getters.getCurrentAccountId;
|
|
||||||
const isFeatureEnabled =
|
|
||||||
this.app.$store.getters['accounts/isFeatureEnabledonAccount'];
|
|
||||||
|
|
||||||
return (
|
|
||||||
isFeatureEnabled?.(accountId, FEATURE_FLAGS.CONVERSATION_UNREAD_COUNTS) &&
|
|
||||||
isFeatureEnabled?.(accountId, FEATURE_FLAGS.UNREAD_COUNT_FOR_FILTERS)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
onTypingOn = ({ conversation, user }) => {
|
onTypingOn = ({ conversation, user }) => {
|
||||||
const conversationId = conversation.id;
|
const conversationId = conversation.id;
|
||||||
|
|
||||||
@@ -283,7 +212,6 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
|
|
||||||
onConversationMentioned = data => {
|
onConversationMentioned = data => {
|
||||||
this.app.$store.dispatch('addMentions', data);
|
this.app.$store.dispatch('addMentions', data);
|
||||||
this.scheduleMentionUnreadCountsFetch();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
clearTimer = conversationId => {
|
clearTimer = conversationId => {
|
||||||
@@ -345,12 +273,6 @@ class ActionCableConnector extends BaseActionCableConnector {
|
|||||||
this.app.$store.dispatch('labels/revalidate', { newKey: keys.label });
|
this.app.$store.dispatch('labels/revalidate', { newKey: keys.label });
|
||||||
this.app.$store.dispatch('inboxes/revalidate', { newKey: keys.inbox });
|
this.app.$store.dispatch('inboxes/revalidate', { newKey: keys.inbox });
|
||||||
this.app.$store.dispatch('teams/revalidate', { newKey: keys.team });
|
this.app.$store.dispatch('teams/revalidate', { newKey: keys.team });
|
||||||
|
|
||||||
if (this.isFilteredUnreadCountsEnabled()) {
|
|
||||||
// Inbox/team/label visibility changes can change the accessible set used
|
|
||||||
// by filtered unread counts even when no conversation row changes.
|
|
||||||
this.refreshConversationUnreadCountsWithFilteredRetry();
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
onVoiceCallIncoming = data => {
|
onVoiceCallIncoming = data => {
|
||||||
|
|||||||
@@ -38,7 +38,7 @@ export const getAgentsByUpdatedPresence = (
|
|||||||
currentAccountId
|
currentAccountId
|
||||||
) => {
|
) => {
|
||||||
const agentsWithDynamicPresenceUpdate = agents.map(item =>
|
const agentsWithDynamicPresenceUpdate = agents.map(item =>
|
||||||
item.id === currentUser.id && (item.assignee_type || 'User') === 'User'
|
item.id === currentUser.id
|
||||||
? {
|
? {
|
||||||
...item,
|
...item,
|
||||||
availability_status: currentUser.accounts.find(
|
availability_status: currentUser.accounts.find(
|
||||||
|
|||||||
@@ -19,7 +19,6 @@ const FEATURE_HELP_URLS = {
|
|||||||
webhook: 'https://chwt.app/hc/webhooks',
|
webhook: 'https://chwt.app/hc/webhooks',
|
||||||
billing: 'https://chwt.app/pricing',
|
billing: 'https://chwt.app/pricing',
|
||||||
saml: 'https://chwt.app/hc/saml',
|
saml: 'https://chwt.app/hc/saml',
|
||||||
captain: 'https://chwt.app/captain-docs',
|
|
||||||
captain_billing: 'https://chwt.app/hc/captain_billing',
|
captain_billing: 'https://chwt.app/hc/captain_billing',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -20,8 +20,6 @@ export const SIDEBAR_SORT_OPTIONS_BY_SECTION = Object.freeze({
|
|||||||
SIDEBAR_SORT_KEYS.CREATED_ASC,
|
SIDEBAR_SORT_KEYS.CREATED_ASC,
|
||||||
SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC,
|
SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC,
|
||||||
SIDEBAR_SORT_KEYS.ALPHABETICAL_DESC,
|
SIDEBAR_SORT_KEYS.ALPHABETICAL_DESC,
|
||||||
SIDEBAR_SORT_KEYS.UNREAD_COUNT_DESC,
|
|
||||||
SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC,
|
|
||||||
],
|
],
|
||||||
[SIDEBAR_SORT_SECTIONS.TEAMS]: [
|
[SIDEBAR_SORT_SECTIONS.TEAMS]: [
|
||||||
SIDEBAR_SORT_KEYS.CREATED_DESC,
|
SIDEBAR_SORT_KEYS.CREATED_DESC,
|
||||||
|
|||||||
@@ -1,150 +0,0 @@
|
|||||||
import { useCamelCase } from 'dashboard/composables/useTransformKeys';
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Formats seconds into a human-readable time string
|
|
||||||
* @param {number} seconds - The time in seconds (can be negative for overdue)
|
|
||||||
* @returns {string} Formatted time string like "2h 30m" or "1d 4h"
|
|
||||||
*/
|
|
||||||
const formatSLATime = seconds => {
|
|
||||||
const absSeconds = Math.abs(seconds);
|
|
||||||
|
|
||||||
const units = {
|
|
||||||
y: 31536000,
|
|
||||||
mo: 2592000,
|
|
||||||
d: 86400,
|
|
||||||
h: 3600,
|
|
||||||
m: 60,
|
|
||||||
};
|
|
||||||
|
|
||||||
if (absSeconds < 60) {
|
|
||||||
return '1m';
|
|
||||||
}
|
|
||||||
|
|
||||||
const parts = [];
|
|
||||||
let remaining = absSeconds;
|
|
||||||
|
|
||||||
Object.entries(units).forEach(([unit, value]) => {
|
|
||||||
if (parts.length >= 2) return;
|
|
||||||
const count = Math.floor(remaining / value);
|
|
||||||
if (count > 0) {
|
|
||||||
parts.push(`${count}${unit}`);
|
|
||||||
remaining -= count * value;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return parts.join(' ');
|
|
||||||
};
|
|
||||||
|
|
||||||
const toUnixTimestamp = value => {
|
|
||||||
if (!value || typeof value === 'number') return value;
|
|
||||||
|
|
||||||
const numericValue = Number(value);
|
|
||||||
if (!Number.isNaN(numericValue)) return numericValue;
|
|
||||||
|
|
||||||
const parsedTimestamp = Date.parse(value);
|
|
||||||
return Number.isNaN(parsedTimestamp)
|
|
||||||
? value
|
|
||||||
: Math.floor(parsedTimestamp / 1000);
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Evaluates SLA status using backend-computed due times
|
|
||||||
* @param {Object} params - Parameters object
|
|
||||||
* @param {Object} params.appliedSla - The applied SLA with due_at timestamps
|
|
||||||
* @param {Object} params.chat - The conversation object
|
|
||||||
* @param {Array} params.slaEvents - Recorded SLA miss events for this conversation
|
|
||||||
* @returns {Object} SLA status with type, threshold, icon, and isSlaMissed
|
|
||||||
*/
|
|
||||||
export const evaluateSLAStatus = ({ appliedSla, chat, slaEvents = [] }) => {
|
|
||||||
const emptyStatus = { type: '', threshold: '', icon: '', isSlaMissed: false };
|
|
||||||
|
|
||||||
if (!appliedSla || !chat) {
|
|
||||||
return emptyStatus;
|
|
||||||
}
|
|
||||||
|
|
||||||
const sla = useCamelCase(appliedSla);
|
|
||||||
const conversation = useCamelCase(chat);
|
|
||||||
const events = useCamelCase(slaEvents || []);
|
|
||||||
const currentTime = Math.floor(Date.now() / 1000);
|
|
||||||
const slaStatuses = [];
|
|
||||||
|
|
||||||
const dueAtByType = {
|
|
||||||
FRT: sla.slaFrtDueAt,
|
|
||||||
RT: sla.slaRtDueAt,
|
|
||||||
};
|
|
||||||
const slaTypes = ['FRT', 'NRT', 'RT'];
|
|
||||||
|
|
||||||
events.forEach(event => {
|
|
||||||
const type = event.eventType?.toUpperCase();
|
|
||||||
if (!slaTypes.includes(type)) return;
|
|
||||||
|
|
||||||
const missedAt =
|
|
||||||
type === 'NRT' ? event.createdAt : dueAtByType[type] || event.createdAt;
|
|
||||||
if (!missedAt) return;
|
|
||||||
|
|
||||||
slaStatuses.push({
|
|
||||||
type,
|
|
||||||
threshold: missedAt - currentTime,
|
|
||||||
icon: 'flame',
|
|
||||||
isSlaMissed: true,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const firstReplyCreatedAt = toUnixTimestamp(conversation.firstReplyCreatedAt);
|
|
||||||
const shouldCheckFirstResponse =
|
|
||||||
!firstReplyCreatedAt || firstReplyCreatedAt > sla.slaFrtDueAt;
|
|
||||||
|
|
||||||
// Check FRT - until first reply is made on time
|
|
||||||
if (sla.slaFrtDueAt && shouldCheckFirstResponse) {
|
|
||||||
const threshold = sla.slaFrtDueAt - currentTime;
|
|
||||||
slaStatuses.push({
|
|
||||||
type: 'FRT',
|
|
||||||
threshold,
|
|
||||||
icon: threshold <= 0 ? 'flame' : 'alarm',
|
|
||||||
isSlaMissed: threshold <= 0,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check NRT - only if first reply made and waiting for response
|
|
||||||
if (sla.slaNrtDueAt && firstReplyCreatedAt && conversation.waitingSince) {
|
|
||||||
const threshold = sla.slaNrtDueAt - currentTime;
|
|
||||||
slaStatuses.push({
|
|
||||||
type: 'NRT',
|
|
||||||
threshold,
|
|
||||||
icon: threshold <= 0 ? 'flame' : 'alarm',
|
|
||||||
isSlaMissed: threshold <= 0,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check RT - only if conversation is unresolved
|
|
||||||
if (sla.slaRtDueAt && conversation.status !== 'resolved') {
|
|
||||||
const threshold = sla.slaRtDueAt - currentTime;
|
|
||||||
slaStatuses.push({
|
|
||||||
type: 'RT',
|
|
||||||
threshold,
|
|
||||||
icon: threshold <= 0 ? 'flame' : 'alarm',
|
|
||||||
isSlaMissed: threshold <= 0,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (slaStatuses.length === 0) {
|
|
||||||
return emptyStatus;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show existing breaches before upcoming deadlines, then pick the closest timer.
|
|
||||||
slaStatuses.sort((a, b) => {
|
|
||||||
if (a.isSlaMissed !== b.isSlaMissed) {
|
|
||||||
return a.isSlaMissed ? -1 : 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
return Math.abs(a.threshold) - Math.abs(b.threshold);
|
|
||||||
});
|
|
||||||
const mostUrgent = slaStatuses[0];
|
|
||||||
|
|
||||||
return {
|
|
||||||
type: mostUrgent.type,
|
|
||||||
threshold: formatSLATime(mostUrgent.threshold),
|
|
||||||
icon: mostUrgent.icon,
|
|
||||||
isSlaMissed: mostUrgent.isSlaMissed,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
@@ -1,6 +1,5 @@
|
|||||||
import { describe, it, beforeEach, afterEach, expect, vi } from 'vitest';
|
import { describe, it, beforeEach, afterEach, expect, vi } from 'vitest';
|
||||||
import ActionCableConnector from '../actionCable';
|
import ActionCableConnector from '../actionCable';
|
||||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
|
||||||
|
|
||||||
vi.mock('shared/helpers/mitt', () => ({
|
vi.mock('shared/helpers/mitt', () => ({
|
||||||
emitter: {
|
emitter: {
|
||||||
@@ -18,9 +17,6 @@ global.chatwootConfig = {
|
|||||||
websocketURL: 'wss://test.chatwoot.com',
|
websocketURL: 'wss://test.chatwoot.com',
|
||||||
};
|
};
|
||||||
|
|
||||||
const mockRetryJitter = value =>
|
|
||||||
vi.spyOn(Math, 'random').mockReturnValue(value);
|
|
||||||
|
|
||||||
describe('ActionCableConnector - Copilot Tests', () => {
|
describe('ActionCableConnector - Copilot Tests', () => {
|
||||||
let store;
|
let store;
|
||||||
let actionCable;
|
let actionCable;
|
||||||
@@ -43,8 +39,6 @@ describe('ActionCableConnector - Copilot Tests', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
vi.restoreAllMocks();
|
|
||||||
vi.clearAllTimers();
|
|
||||||
vi.useRealTimers();
|
vi.useRealTimers();
|
||||||
});
|
});
|
||||||
describe('copilot event handlers', () => {
|
describe('copilot event handlers', () => {
|
||||||
@@ -87,223 +81,12 @@ describe('ActionCableConnector - Copilot Tests', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('should refetch unread counts when unread count changes', () => {
|
it('should refetch unread counts when unread count changes', () => {
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
mockRetryJitter(0.5);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
actionCable.onReceived({
|
||||||
event: 'conversation.unread_count_changed',
|
event: 'conversation.unread_count_changed',
|
||||||
data: { account_id: 1 },
|
data: { account_id: 1 },
|
||||||
});
|
});
|
||||||
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('conversationUnreadCounts/get');
|
expect(mockDispatch).toHaveBeenCalledWith('conversationUnreadCounts/get');
|
||||||
|
|
||||||
vi.advanceTimersByTime(37499);
|
|
||||||
expect(mockDispatch).toHaveBeenCalledTimes(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(1);
|
|
||||||
expect(mockDispatch).toHaveBeenCalledTimes(2);
|
|
||||||
expect(mockDispatch).toHaveBeenLastCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not retry unread count changes when filtered counts are disabled', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
store.$store.getters[
|
|
||||||
'accounts/isFeatureEnabledonAccount'
|
|
||||||
].mockImplementation(
|
|
||||||
(_, featureFlag) =>
|
|
||||||
featureFlag === FEATURE_FLAGS.CONVERSATION_UNREAD_COUNTS
|
|
||||||
);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.unread_count_changed',
|
|
||||||
data: { account_id: 1 },
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(mockDispatch).toHaveBeenCalledTimes(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(45000);
|
|
||||||
expect(mockDispatch).toHaveBeenCalledTimes(1);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('delays unread count refetch when a conversation is mentioned', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
|
|
||||||
const conversation = { id: 1, account_id: 1 };
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.mentioned',
|
|
||||||
data: conversation,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('addMentions', conversation);
|
|
||||||
expect(mockDispatch).not.toHaveBeenCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(4999);
|
|
||||||
expect(mockDispatch).not.toHaveBeenCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(1);
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('conversationUnreadCounts/get');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not schedule mention unread count fetches when filtered counts are disabled', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
store.$store.getters[
|
|
||||||
'accounts/isFeatureEnabledonAccount'
|
|
||||||
].mockImplementation(
|
|
||||||
(_, featureFlag) =>
|
|
||||||
featureFlag === FEATURE_FLAGS.CONVERSATION_UNREAD_COUNTS
|
|
||||||
);
|
|
||||||
|
|
||||||
const conversation = { id: 1, account_id: 1 };
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.mentioned',
|
|
||||||
data: conversation,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('addMentions', conversation);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(45000);
|
|
||||||
expect(mockDispatch).not.toHaveBeenCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('retries mentioned unread counts after the backend refresh window', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
mockRetryJitter(0.5);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.mentioned',
|
|
||||||
data: { id: 1, account_id: 1 },
|
|
||||||
});
|
|
||||||
|
|
||||||
const unreadCountFetches = () =>
|
|
||||||
mockDispatch.mock.calls.filter(
|
|
||||||
([action]) => action === 'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(5000);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(32499);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(1);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(2);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('reschedules mentioned unread count retries for later invalidations', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
mockRetryJitter(0);
|
|
||||||
|
|
||||||
const unreadCountFetches = () =>
|
|
||||||
mockDispatch.mock.calls.filter(
|
|
||||||
([action]) => action === 'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.mentioned',
|
|
||||||
data: { id: 1, account_id: 1 },
|
|
||||||
});
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(5000);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(10000);
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'conversation.mentioned',
|
|
||||||
data: { id: 1, account_id: 1 },
|
|
||||||
});
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(5000);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(2);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(10000);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(2);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(15000);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(3);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('refetches filtered unread counts after account cache invalidation', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(new Date('2026-01-01T00:00:00Z'));
|
|
||||||
mockRetryJitter(0.5);
|
|
||||||
|
|
||||||
const cacheKeys = {
|
|
||||||
label: 'label-key',
|
|
||||||
inbox: 'inbox-key',
|
|
||||||
team: 'team-key',
|
|
||||||
};
|
|
||||||
const unreadCountFetches = () =>
|
|
||||||
mockDispatch.mock.calls.filter(
|
|
||||||
([action]) => action === 'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'account.cache_invalidated',
|
|
||||||
data: { account_id: 1, cache_keys: cacheKeys },
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('labels/revalidate', {
|
|
||||||
newKey: cacheKeys.label,
|
|
||||||
});
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('inboxes/revalidate', {
|
|
||||||
newKey: cacheKeys.inbox,
|
|
||||||
});
|
|
||||||
expect(mockDispatch).toHaveBeenCalledWith('teams/revalidate', {
|
|
||||||
newKey: cacheKeys.team,
|
|
||||||
});
|
|
||||||
expect(unreadCountFetches()).toHaveLength(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(37499);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(1);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(1);
|
|
||||||
expect(unreadCountFetches()).toHaveLength(2);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not refetch unread counts after cache invalidation when filtered counts are disabled', () => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
store.$store.getters[
|
|
||||||
'accounts/isFeatureEnabledonAccount'
|
|
||||||
].mockImplementation(
|
|
||||||
(_, featureFlag) =>
|
|
||||||
featureFlag === FEATURE_FLAGS.CONVERSATION_UNREAD_COUNTS
|
|
||||||
);
|
|
||||||
|
|
||||||
actionCable.onReceived({
|
|
||||||
event: 'account.cache_invalidated',
|
|
||||||
data: {
|
|
||||||
account_id: 1,
|
|
||||||
cache_keys: {
|
|
||||||
label: 'label-key',
|
|
||||||
inbox: 'inbox-key',
|
|
||||||
team: 'team-key',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(mockDispatch).not.toHaveBeenCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
|
|
||||||
vi.advanceTimersByTime(45000);
|
|
||||||
expect(mockDispatch).not.toHaveBeenCalledWith(
|
|
||||||
'conversationUnreadCounts/get'
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it('does not refetch unread counts when unread count feature is disabled', () => {
|
it('does not refetch unread counts when unread count feature is disabled', () => {
|
||||||
|
|||||||
@@ -1,9 +1,4 @@
|
|||||||
import {
|
import { EditorState, EditorView } from '@chatwoot/prosemirror-schema';
|
||||||
EditorState,
|
|
||||||
EditorView,
|
|
||||||
buildMessageSchema,
|
|
||||||
MessageMarkdownTransformer,
|
|
||||||
} from '@chatwoot/prosemirror-schema';
|
|
||||||
import { FORMATTING } from 'dashboard/constants/editor';
|
import { FORMATTING } from 'dashboard/constants/editor';
|
||||||
import { Schema } from 'prosemirror-model';
|
import { Schema } from 'prosemirror-model';
|
||||||
import {
|
import {
|
||||||
@@ -983,77 +978,13 @@ describe('stripUnsupportedFormatting', () => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('keeps link text and URL when schema does not support links', () => {
|
it('strips links but keeps text', () => {
|
||||||
expect(
|
expect(
|
||||||
stripUnsupportedFormatting(
|
stripUnsupportedFormatting(
|
||||||
'Check [this link](https://example.com)',
|
'Check [this link](https://example.com)',
|
||||||
emptySchema
|
emptySchema
|
||||||
)
|
)
|
||||||
).toBe('Check this link: https://example.com');
|
).toBe('Check this link');
|
||||||
});
|
|
||||||
|
|
||||||
it('drops the hidden link title when preserving the URL', () => {
|
|
||||||
expect(
|
|
||||||
stripUnsupportedFormatting(
|
|
||||||
'Check [docs](https://example.com "Docs")',
|
|
||||||
emptySchema
|
|
||||||
)
|
|
||||||
).toBe('Check docs: https://example.com');
|
|
||||||
|
|
||||||
expect(
|
|
||||||
stripUnsupportedFormatting(
|
|
||||||
'Check [docs](<https://example.com> "Docs")',
|
|
||||||
emptySchema
|
|
||||||
)
|
|
||||||
).toBe('Check docs: https://example.com');
|
|
||||||
});
|
|
||||||
|
|
||||||
// Output is re-parsed before sending, so assert the final text
|
|
||||||
// (strip + re-parse); the re-parse turns serializer escapes into literals.
|
|
||||||
describe('links round-trip through re-parse without crashing', () => {
|
|
||||||
const smsSchema = buildMessageSchema([], []); // no marks, no nodes
|
|
||||||
const sendAs = md =>
|
|
||||||
new MessageMarkdownTransformer(smsSchema).parse(
|
|
||||||
stripUnsupportedFormatting(md, smsSchema)
|
|
||||||
).textContent;
|
|
||||||
|
|
||||||
it('keeps escaped parens/underscores anywhere in the URL', () => {
|
|
||||||
expect(
|
|
||||||
sendAs('See [wiki](https://en.wikipedia.org/wiki/Foo\\_\\(bar\\))')
|
|
||||||
).toBe('See wiki: https://en.wikipedia.org/wiki/Foo_(bar)');
|
|
||||||
expect(sendAs('See [wiki](https://host/a\\_\\(b\\)c)')).toBe(
|
|
||||||
'See wiki: https://host/a_(b)c'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('drops the label when it equals the URL even when escaped', () => {
|
|
||||||
expect(
|
|
||||||
sendAs(
|
|
||||||
'[www.example.com/Foo\\_\\(bar\\)](www.example.com/Foo\\_\\(bar\\))'
|
|
||||||
)
|
|
||||||
).toBe('www.example.com/Foo_(bar)');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not reintroduce emphasis from an escaped label', () => {
|
|
||||||
expect(sendAs('[Use \\_id\\_](https://example.com)')).toBe(
|
|
||||||
'Use _id_: https://example.com'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('flattens a label containing an escaped closing bracket', () => {
|
|
||||||
expect(sendAs('[FAQ \\[v2\\]](https://example.com)')).toBe(
|
|
||||||
'FAQ [v2]: https://example.com'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('leaves bare URLs untouched so channels can auto-link them', () => {
|
|
||||||
expect(
|
|
||||||
stripUnsupportedFormatting('Visit www.example.com now', emptySchema)
|
|
||||||
).toBe('Visit www.example.com now');
|
|
||||||
expect(
|
|
||||||
stripUnsupportedFormatting('Visit <https://example.com>', emptySchema)
|
|
||||||
).toBe('Visit https://example.com');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it('converts autolinks to plain URLs when schema does not support links', () => {
|
it('converts autolinks to plain URLs when schema does not support links', () => {
|
||||||
@@ -1118,7 +1049,7 @@ describe('stripUnsupportedFormatting', () => {
|
|||||||
it('handles complex content with multiple formatting types', () => {
|
it('handles complex content with multiple formatting types', () => {
|
||||||
const content =
|
const content =
|
||||||
'**Bold** and *italic* with `code` and [link](url)\n- list item';
|
'**Bold** and *italic* with `code` and [link](url)\n- list item';
|
||||||
const expected = 'Bold and italic with code and link: url\nlist item';
|
const expected = 'Bold and italic with code and link\nlist item';
|
||||||
expect(stripUnsupportedFormatting(content, emptySchema)).toBe(expected);
|
expect(stripUnsupportedFormatting(content, emptySchema)).toBe(expected);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -148,7 +148,7 @@ describe('#normalizeSidebarSortPreferences', () => {
|
|||||||
|
|
||||||
it('falls back to defaults for unsupported preferences', () => {
|
it('falls back to defaults for unsupported preferences', () => {
|
||||||
const preferences = normalizeSidebarSortPreferences({
|
const preferences = normalizeSidebarSortPreferences({
|
||||||
[SIDEBAR_SORT_SECTIONS.FOLDERS]: 'unsupported_sort',
|
[SIDEBAR_SORT_SECTIONS.FOLDERS]: SIDEBAR_SORT_KEYS.UNREAD_COUNT_DESC,
|
||||||
});
|
});
|
||||||
|
|
||||||
expect(preferences).toEqual(DEFAULT_SIDEBAR_SORT_PREFERENCES);
|
expect(preferences).toEqual(DEFAULT_SIDEBAR_SORT_PREFERENCES);
|
||||||
@@ -171,15 +171,6 @@ describe('#getSidebarSortOptions', () => {
|
|||||||
expect(options).toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
expect(options).toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('keeps folder unread count options when filtered unread counts are enabled', () => {
|
|
||||||
const options = getSidebarSortOptions(SIDEBAR_SORT_SECTIONS.FOLDERS, {
|
|
||||||
hasUnreadCounts: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(options).toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_DESC);
|
|
||||||
expect(options).toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('removes unread count options when unread counts are disabled', () => {
|
it('removes unread count options when unread counts are disabled', () => {
|
||||||
const options = getSidebarSortOptions(SIDEBAR_SORT_SECTIONS.TEAMS, {
|
const options = getSidebarSortOptions(SIDEBAR_SORT_SECTIONS.TEAMS, {
|
||||||
hasUnreadCounts: false,
|
hasUnreadCounts: false,
|
||||||
@@ -189,16 +180,6 @@ describe('#getSidebarSortOptions', () => {
|
|||||||
expect(options).not.toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
expect(options).not.toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
||||||
expect(options).toContain(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
expect(options).toContain(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('removes folder unread count options when filtered unread counts are disabled', () => {
|
|
||||||
const options = getSidebarSortOptions(SIDEBAR_SORT_SECTIONS.FOLDERS, {
|
|
||||||
hasUnreadCounts: false,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(options).not.toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_DESC);
|
|
||||||
expect(options).not.toContain(SIDEBAR_SORT_KEYS.UNREAD_COUNT_ASC);
|
|
||||||
expect(options).toContain(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('#resolveSidebarSort', () => {
|
describe('#resolveSidebarSort', () => {
|
||||||
@@ -221,14 +202,4 @@ describe('#resolveSidebarSort', () => {
|
|||||||
|
|
||||||
expect(sortBy).toBe(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
expect(sortBy).toBe(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('falls back to alphabetical sort for folders when filtered unread counts are disabled', () => {
|
|
||||||
const sortBy = resolveSidebarSort(
|
|
||||||
SIDEBAR_SORT_SECTIONS.FOLDERS,
|
|
||||||
SIDEBAR_SORT_KEYS.UNREAD_COUNT_DESC,
|
|
||||||
{ hasUnreadCounts: false }
|
|
||||||
);
|
|
||||||
|
|
||||||
expect(sortBy).toBe(SIDEBAR_SORT_KEYS.ALPHABETICAL_ASC);
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,450 +0,0 @@
|
|||||||
import { evaluateSLAStatus } from '../slaHelper';
|
|
||||||
|
|
||||||
describe('#SLA Helpers', () => {
|
|
||||||
const currentTimestamp = 1700000000; // Fixed timestamp for testing
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
vi.useFakeTimers();
|
|
||||||
vi.setSystemTime(currentTimestamp * 1000);
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(() => {
|
|
||||||
vi.useRealTimers();
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('evaluateSLAStatus', () => {
|
|
||||||
describe('when inputs are invalid', () => {
|
|
||||||
it('returns empty status when appliedSla is null', () => {
|
|
||||||
const result = evaluateSLAStatus({ appliedSla: null, chat: {} });
|
|
||||||
expect(result).toEqual({
|
|
||||||
type: '',
|
|
||||||
threshold: '',
|
|
||||||
icon: '',
|
|
||||||
isSlaMissed: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns empty status when chat is null', () => {
|
|
||||||
const result = evaluateSLAStatus({ appliedSla: {}, chat: null });
|
|
||||||
expect(result).toEqual({
|
|
||||||
type: '',
|
|
||||||
threshold: '',
|
|
||||||
icon: '',
|
|
||||||
isSlaMissed: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('FRT (First Response Time)', () => {
|
|
||||||
it('returns FRT status when first reply not made and within threshold', () => {
|
|
||||||
const appliedSla = { sla_frt_due_at: currentTimestamp + 3600 }; // 1 hour from now
|
|
||||||
const chat = { first_reply_created_at: null, status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('1h');
|
|
||||||
expect(result.icon).toBe('alarm');
|
|
||||||
expect(result.isSlaMissed).toBe(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns missed FRT status when threshold is exceeded', () => {
|
|
||||||
const appliedSla = { sla_frt_due_at: currentTimestamp - 1800 }; // 30 min ago
|
|
||||||
const chat = { first_reply_created_at: null, status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('30m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not return FRT when first reply was made before due time', () => {
|
|
||||||
const appliedSla = { sla_frt_due_at: currentTimestamp + 3600 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 1000,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).not.toBe('FRT');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not return FRT when first reply was made at due time', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp - 600,
|
|
||||||
sla_rt_due_at: currentTimestamp + 1800,
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 600,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns missed FRT when first reply was made after due time', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp - 600,
|
|
||||||
sla_rt_due_at: currentTimestamp + 1800,
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 300,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('10m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns missed FRT when live first reply timestamp is an ISO string after due time', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp - 600,
|
|
||||||
sla_rt_due_at: currentTimestamp + 1800,
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: new Date(
|
|
||||||
(currentTimestamp - 300) * 1000
|
|
||||||
).toISOString(),
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('10m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('uses the due time for a missed FRT event created after the deadline', () => {
|
|
||||||
const appliedSla = { sla_frt_due_at: currentTimestamp - 3600 };
|
|
||||||
const chat = { first_reply_created_at: null, status: 'open' };
|
|
||||||
const slaEvents = [
|
|
||||||
{ event_type: 'frt', created_at: currentTimestamp - 1800 },
|
|
||||||
];
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat, slaEvents });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('1h');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('NRT (Next Response Time)', () => {
|
|
||||||
it('returns NRT status when waiting for response and within threshold', () => {
|
|
||||||
const appliedSla = { sla_nrt_due_at: currentTimestamp + 1800 }; // 30 min from now
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: currentTimestamp - 600,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('NRT');
|
|
||||||
expect(result.threshold).toBe('30m');
|
|
||||||
expect(result.icon).toBe('alarm');
|
|
||||||
expect(result.isSlaMissed).toBe(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns missed NRT status when threshold is exceeded', () => {
|
|
||||||
const appliedSla = { sla_nrt_due_at: currentTimestamp - 900 }; // 15 min ago
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: currentTimestamp - 2700,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('NRT');
|
|
||||||
expect(result.threshold).toBe('15m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not return NRT when not waiting for response', () => {
|
|
||||||
const appliedSla = { sla_nrt_due_at: currentTimestamp + 1800 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: null,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).not.toBe('NRT');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns missed NRT when a recorded NRT miss exists after response', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp + 1800 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: null,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
const slaEvents = [
|
|
||||||
{ event_type: 'nrt', created_at: currentTimestamp - 900 },
|
|
||||||
];
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat, slaEvents });
|
|
||||||
|
|
||||||
expect(result.type).toBe('NRT');
|
|
||||||
expect(result.threshold).toBe('15m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('uses the recorded event time for a missed NRT with a new active NRT timer', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_nrt_due_at: currentTimestamp + 300,
|
|
||||||
sla_rt_due_at: currentTimestamp + 1800,
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: currentTimestamp - 60,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
const slaEvents = [
|
|
||||||
{ event_type: 'nrt', created_at: currentTimestamp - 1800 },
|
|
||||||
];
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat, slaEvents });
|
|
||||||
|
|
||||||
expect(result.type).toBe('NRT');
|
|
||||||
expect(result.threshold).toBe('30m');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not return NRT when first reply not made', () => {
|
|
||||||
const appliedSla = { sla_nrt_due_at: currentTimestamp + 1800 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: null,
|
|
||||||
waiting_since: currentTimestamp - 600,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).not.toBe('NRT');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('RT (Resolution Time)', () => {
|
|
||||||
it('returns RT status when conversation is open and within threshold', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp + 7200 }; // 2 hours from now
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 3600,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
expect(result.threshold).toBe('2h');
|
|
||||||
expect(result.icon).toBe('alarm');
|
|
||||||
expect(result.isSlaMissed).toBe(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
it.each(['pending', 'snoozed'])(
|
|
||||||
'returns RT status when conversation is %s and within threshold',
|
|
||||||
status => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp + 7200 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 3600,
|
|
||||||
status,
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
expect(result.threshold).toBe('2h');
|
|
||||||
expect(result.icon).toBe('alarm');
|
|
||||||
expect(result.isSlaMissed).toBe(false);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
it('returns missed RT status when threshold is exceeded', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp - 3600 }; // 1 hour ago
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
expect(result.threshold).toBe('1h');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('uses the due time for a missed RT event created after the deadline', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp - 3600 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
const slaEvents = [
|
|
||||||
{ event_type: 'rt', created_at: currentTimestamp - 1800 },
|
|
||||||
];
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat, slaEvents });
|
|
||||||
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
expect(result.threshold).toBe('1h');
|
|
||||||
expect(result.icon).toBe('flame');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('does not return RT when conversation is resolved', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp + 7200 };
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 3600,
|
|
||||||
status: 'resolved',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('priority selection', () => {
|
|
||||||
it('returns most urgent SLA when multiple are active', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp + 7200, // 2h - less urgent
|
|
||||||
sla_nrt_due_at: currentTimestamp + 1800, // 30m - most urgent
|
|
||||||
sla_rt_due_at: currentTimestamp + 3600, // 1h
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: null,
|
|
||||||
waiting_since: currentTimestamp - 600,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
// FRT is selected because first_reply_created_at is null
|
|
||||||
// NRT is not checked when first_reply_created_at is null
|
|
||||||
expect(result.type).toBe('RT');
|
|
||||||
expect(result.threshold).toBe('1h');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns most urgent missed SLA over upcoming SLA', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_nrt_due_at: currentTimestamp - 300, // 5m overdue - most urgent by absolute value
|
|
||||||
sla_rt_due_at: currentTimestamp + 3600, // 1h remaining
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 7200,
|
|
||||||
waiting_since: currentTimestamp - 2100,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('NRT');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns an existing missed SLA over a closer upcoming SLA', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp - 7200, // 2h overdue
|
|
||||||
sla_rt_due_at: currentTimestamp + 300, // 5m remaining
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: null,
|
|
||||||
status: 'open',
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.type).toBe('FRT');
|
|
||||||
expect(result.threshold).toBe('2h');
|
|
||||||
expect(result.isSlaMissed).toBe(true);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('time formatting', () => {
|
|
||||||
it('formats time in days and hours', () => {
|
|
||||||
const appliedSla = { sla_rt_due_at: currentTimestamp + 90000 }; // 25 hours
|
|
||||||
const chat = { status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.threshold).toBe('1d 1h');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('formats time less than a minute as 1m', () => {
|
|
||||||
const appliedSla = { sla_frt_due_at: currentTimestamp + 30 }; // 30 seconds
|
|
||||||
const chat = { first_reply_created_at: null, status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.threshold).toBe('1m');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('formats months correctly', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_rt_due_at: currentTimestamp + 2592000 + 86400,
|
|
||||||
}; // 1 month + 1 day
|
|
||||||
const chat = { status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result.threshold).toBe('1mo 1d');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('empty status scenarios', () => {
|
|
||||||
it('returns empty when no SLA thresholds are set', () => {
|
|
||||||
const appliedSla = {};
|
|
||||||
const chat = { status: 'open' };
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result).toEqual({
|
|
||||||
type: '',
|
|
||||||
threshold: '',
|
|
||||||
icon: '',
|
|
||||||
isSlaMissed: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('returns empty when all conditions are met', () => {
|
|
||||||
const appliedSla = {
|
|
||||||
sla_frt_due_at: currentTimestamp + 3600,
|
|
||||||
sla_nrt_due_at: currentTimestamp + 1800,
|
|
||||||
sla_rt_due_at: currentTimestamp + 7200,
|
|
||||||
};
|
|
||||||
const chat = {
|
|
||||||
first_reply_created_at: currentTimestamp - 3600, // FRT already hit
|
|
||||||
waiting_since: null, // Not waiting, so NRT not applicable
|
|
||||||
status: 'resolved', // RT not applicable
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = evaluateSLAStatus({ appliedSla, chat });
|
|
||||||
|
|
||||||
expect(result).toEqual({
|
|
||||||
type: '',
|
|
||||||
threshold: '',
|
|
||||||
icon: '',
|
|
||||||
isSlaMissed: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@@ -1,7 +1,4 @@
|
|||||||
import {
|
import { CONTENT_TYPES } from 'dashboard/components-next/message/constants';
|
||||||
CONTENT_TYPES,
|
|
||||||
VOICE_CALL_STATUS,
|
|
||||||
} from 'dashboard/components-next/message/constants';
|
|
||||||
import { MESSAGE_TYPE } from 'shared/constants/messages';
|
import { MESSAGE_TYPE } from 'shared/constants/messages';
|
||||||
import { useCallsStore } from 'dashboard/stores/calls';
|
import { useCallsStore } from 'dashboard/stores/calls';
|
||||||
import types from 'dashboard/store/mutation-types';
|
import types from 'dashboard/store/mutation-types';
|
||||||
@@ -104,7 +101,6 @@ export function handleVoiceCallCreated(
|
|||||||
callSid,
|
callSid,
|
||||||
callId,
|
callId,
|
||||||
provider,
|
provider,
|
||||||
status,
|
|
||||||
callDirection,
|
callDirection,
|
||||||
conversationId,
|
conversationId,
|
||||||
inboxId,
|
inboxId,
|
||||||
@@ -112,11 +108,6 @@ export function handleVoiceCallCreated(
|
|||||||
senderId,
|
senderId,
|
||||||
} = extractCallData(message);
|
} = extractCallData(message);
|
||||||
|
|
||||||
// A voice_call message can be created already terminal when the caller hangs
|
|
||||||
// up before connect. Only ring while the call is actually ringing; mirrors the
|
|
||||||
// guard in seedCallsFromHydratedMessages.
|
|
||||||
if (status !== VOICE_CALL_STATUS.RINGING) return;
|
|
||||||
|
|
||||||
if (
|
if (
|
||||||
!shouldShowCall({
|
!shouldShowCall({
|
||||||
callDirection,
|
callDirection,
|
||||||
|
|||||||
@@ -392,93 +392,6 @@
|
|||||||
"CAPTAIN": {
|
"CAPTAIN": {
|
||||||
"NAME": "Captain",
|
"NAME": "Captain",
|
||||||
"HEADER_KNOW_MORE": "Know more",
|
"HEADER_KNOW_MORE": "Know more",
|
||||||
"OVERVIEW": {
|
|
||||||
"HEADER": "Overview",
|
|
||||||
"WELCOME": {
|
|
||||||
"LABEL": "Captain summary",
|
|
||||||
"LOADING": "Generating summary…"
|
|
||||||
},
|
|
||||||
"INBOX_BANNER": {
|
|
||||||
"TEXT": "This assistant isn't connected to any inbox yet, so it won't respond to conversations.",
|
|
||||||
"ACTION": "Connect inbox",
|
|
||||||
"DISMISS": "Dismiss"
|
|
||||||
},
|
|
||||||
"COVERAGE_BANNER": {
|
|
||||||
"TEXT": "{count} FAQs are pending review, keeping coverage at {coverage}%. Approve them so your assistant can resolve more on its own.",
|
|
||||||
"ACTION": "Review FAQs",
|
|
||||||
"DISMISS": "Dismiss"
|
|
||||||
},
|
|
||||||
"RANGES": {
|
|
||||||
"LAST_DAYS": "Last {count} days",
|
|
||||||
"THIS_MONTH": "This month",
|
|
||||||
"LAST_MONTH": "Last month"
|
|
||||||
},
|
|
||||||
"METRICS": {
|
|
||||||
"HANDLED": {
|
|
||||||
"LABEL": "Conversations handled",
|
|
||||||
"HINT": "Distinct conversations this assistant replied in."
|
|
||||||
},
|
|
||||||
"AUTO_RESOLUTION": {
|
|
||||||
"LABEL": "Auto-resolution rate",
|
|
||||||
"HINT": "Share of handled conversations closed without a human reply."
|
|
||||||
},
|
|
||||||
"HANDOFF": {
|
|
||||||
"LABEL": "Handoff rate",
|
|
||||||
"HINT": "Share of handled conversations escalated to a human agent."
|
|
||||||
},
|
|
||||||
"HOURS_SAVED": {
|
|
||||||
"LABEL": "Time saved",
|
|
||||||
"HINT": "Estimate: Captain replies times ~2 minutes of assumed agent effort per reply. Directional, not measured labor."
|
|
||||||
},
|
|
||||||
"REOPEN": {
|
|
||||||
"LABEL": "Reopen rate",
|
|
||||||
"HINT": "Auto-resolved conversations that were reopened afterwards."
|
|
||||||
},
|
|
||||||
"DEPTH": {
|
|
||||||
"LABEL": "Messages / conversation",
|
|
||||||
"HINT": "Average replies the assistant sends per conversation."
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"KNOWLEDGE": {
|
|
||||||
"TITLE": "Knowledge coverage",
|
|
||||||
"COVERAGE": "{pct}% approved",
|
|
||||||
"APPROVED": "Approved FAQs",
|
|
||||||
"PENDING": "Pending FAQs",
|
|
||||||
"DOCUMENTS": "Documents"
|
|
||||||
},
|
|
||||||
"FLAGGED": {
|
|
||||||
"TITLE": "Response quality",
|
|
||||||
"TOTAL": "{count} flagged · {rate}"
|
|
||||||
},
|
|
||||||
"CREDITS": {
|
|
||||||
"TITLE": "Credit usage",
|
|
||||||
"UNIT": "credits",
|
|
||||||
"LEGEND": "Daily credits used",
|
|
||||||
"AXIS_START": "{count}d ago",
|
|
||||||
"AXIS_END": "Today"
|
|
||||||
},
|
|
||||||
"LINKS": {
|
|
||||||
"DOCS": {
|
|
||||||
"TITLE": "Captain docs",
|
|
||||||
"DESCRIPTION": "Guides and how-tos for Captain"
|
|
||||||
},
|
|
||||||
"PLAYGROUND": {
|
|
||||||
"TITLE": "Playground",
|
|
||||||
"DESCRIPTION": "Test this assistant's replies"
|
|
||||||
},
|
|
||||||
"BILLING": {
|
|
||||||
"TITLE": "Billing",
|
|
||||||
"DESCRIPTION": "Manage credits and plan"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"FLAG_REASONS": {
|
|
||||||
"INCORRECT": "Incorrect info",
|
|
||||||
"INCOMPLETE": "Incomplete",
|
|
||||||
"OUTDATED": "Outdated",
|
|
||||||
"INAPPROPRIATE": "Inappropriate",
|
|
||||||
"OTHER": "Other"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"ASSISTANT_SWITCHER": {
|
"ASSISTANT_SWITCHER": {
|
||||||
"ASSISTANTS": "Assistants",
|
"ASSISTANTS": "Assistants",
|
||||||
"SWITCH_ASSISTANT": "Switch between assistants",
|
"SWITCH_ASSISTANT": "Switch between assistants",
|
||||||
@@ -581,6 +494,10 @@
|
|||||||
"PLACEHOLDER": "Enter assistant name",
|
"PLACEHOLDER": "Enter assistant name",
|
||||||
"ERROR": "The name is required"
|
"ERROR": "The name is required"
|
||||||
},
|
},
|
||||||
|
"TEMPERATURE": {
|
||||||
|
"LABEL": "Response Temperature",
|
||||||
|
"DESCRIPTION": "Adjust how creative or restrictive the assistant's responses should be. Lower values produce more focused and deterministic responses, while higher values allow for more creative and varied outputs."
|
||||||
|
},
|
||||||
"DESCRIPTION": {
|
"DESCRIPTION": {
|
||||||
"LABEL": "Description",
|
"LABEL": "Description",
|
||||||
"PLACEHOLDER": "Enter assistant description",
|
"PLACEHOLDER": "Enter assistant description",
|
||||||
|
|||||||
@@ -121,26 +121,6 @@
|
|||||||
"CLEAR_FILTER": "Clear filter",
|
"CLEAR_FILTER": "Clear filter",
|
||||||
"EMPTY_LIST": "No results found"
|
"EMPTY_LIST": "No results found"
|
||||||
},
|
},
|
||||||
"DRILLDOWN": {
|
|
||||||
"TITLE": "{metric} details",
|
|
||||||
"RESULT_COUNT_CONVERSATION": "{count} conversation | {count} conversations",
|
|
||||||
"RESULT_COUNT_MESSAGE": "{count} message | {count} messages",
|
|
||||||
"EMPTY": "No records found for this bar.",
|
|
||||||
"ERROR": "Could not load records. Please try again.",
|
|
||||||
"ADMIN_ONLY": "Only administrators can drill down into report records.",
|
|
||||||
"LOAD_MORE": "Load more",
|
|
||||||
"CLOSE": "Close details",
|
|
||||||
"PREVIOUS_BUCKET": "Previous bar",
|
|
||||||
"NEXT_BUCKET": "Next bar",
|
|
||||||
"UNKNOWN_CONTACT": "Unknown contact",
|
|
||||||
"UNKNOWN_INBOX": "Unknown inbox",
|
|
||||||
"UNASSIGNED_AGENT": "Unassigned",
|
|
||||||
"NO_MESSAGE_CONTENT": "No message content",
|
|
||||||
"MESSAGE_CREATED_AT": "Message created at {time}",
|
|
||||||
"EVENT_OCCURRED_AT": "Event occurred at {time}",
|
|
||||||
"INCOMING_MESSAGE": "Incoming message",
|
|
||||||
"OUTGOING_MESSAGE": "Outgoing message"
|
|
||||||
},
|
|
||||||
"PAGINATION": {
|
"PAGINATION": {
|
||||||
"RESULTS": "Showing {start} to {end} of {total} results",
|
"RESULTS": "Showing {start} to {end} of {total} results",
|
||||||
"PER_PAGE_TEMPLATE": "{size} / page"
|
"PER_PAGE_TEMPLATE": "{size} / page"
|
||||||
|
|||||||
@@ -324,7 +324,6 @@
|
|||||||
"ALL_COMPANIES": "All Companies",
|
"ALL_COMPANIES": "All Companies",
|
||||||
"CAPTAIN": "Captain",
|
"CAPTAIN": "Captain",
|
||||||
"CAPTAIN_ASSISTANTS": "Assistants",
|
"CAPTAIN_ASSISTANTS": "Assistants",
|
||||||
"CAPTAIN_OVERVIEW": "Overview",
|
|
||||||
"CAPTAIN_DOCUMENTS": "Documents",
|
"CAPTAIN_DOCUMENTS": "Documents",
|
||||||
"CAPTAIN_RESPONSES": "FAQs",
|
"CAPTAIN_RESPONSES": "FAQs",
|
||||||
"CAPTAIN_TOOLS": "Tools",
|
"CAPTAIN_TOOLS": "Tools",
|
||||||
@@ -468,18 +467,7 @@
|
|||||||
"TITLE": "Current Plan",
|
"TITLE": "Current Plan",
|
||||||
"PLAN_NOTE": "You are currently subscribed to the **{plan}** plan with **{quantity}** licenses",
|
"PLAN_NOTE": "You are currently subscribed to the **{plan}** plan with **{quantity}** licenses",
|
||||||
"SEAT_COUNT": "Number of seats",
|
"SEAT_COUNT": "Number of seats",
|
||||||
"RENEWS_ON": "Renews on",
|
"RENEWS_ON": "Renews on"
|
||||||
"CURRENCY": "Currency"
|
|
||||||
},
|
|
||||||
"CURRENCY": {
|
|
||||||
"SELECT": {
|
|
||||||
"TITLE": "Choose your billing currency",
|
|
||||||
"DESCRIPTION": "Select the currency you'd like to be billed in. This can't be changed once your subscription is created."
|
|
||||||
},
|
|
||||||
"OPTIONS": {
|
|
||||||
"USD": "US Dollar (USD)",
|
|
||||||
"BRL": "Brazilian Real (BRL)"
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
"VIEW_PRICING": "View Pricing",
|
"VIEW_PRICING": "View Pricing",
|
||||||
"MANAGE_SUBSCRIPTION": {
|
"MANAGE_SUBSCRIPTION": {
|
||||||
@@ -515,7 +503,6 @@
|
|||||||
"PURCHASE": "Purchase Credits",
|
"PURCHASE": "Purchase Credits",
|
||||||
"LOADING": "Loading options...",
|
"LOADING": "Loading options...",
|
||||||
"FETCH_ERROR": "Failed to load credit options. Please try again.",
|
"FETCH_ERROR": "Failed to load credit options. Please try again.",
|
||||||
"RETRY": "Retry",
|
|
||||||
"PURCHASE_ERROR": "Failed to process purchase. Please try again.",
|
"PURCHASE_ERROR": "Failed to process purchase. Please try again.",
|
||||||
"PURCHASE_SUCCESS": "Successfully added {credits} credits to your account",
|
"PURCHASE_SUCCESS": "Successfully added {credits} credits to your account",
|
||||||
"CONFIRM": {
|
"CONFIRM": {
|
||||||
@@ -542,7 +529,7 @@
|
|||||||
"SSO_URL": {
|
"SSO_URL": {
|
||||||
"LABEL": "SSO URL",
|
"LABEL": "SSO URL",
|
||||||
"HELP": "The URL where SAML authentication requests will be sent",
|
"HELP": "The URL where SAML authentication requests will be sent",
|
||||||
"PLACEHOLDER": "https://sso.example.com/saml/sso"
|
"PLACEHOLDER": "https://your-idp.com/saml/sso"
|
||||||
},
|
},
|
||||||
"CERTIFICATE": {
|
"CERTIFICATE": {
|
||||||
"LABEL": "Signing certificate in PEM format",
|
"LABEL": "Signing certificate in PEM format",
|
||||||
@@ -562,7 +549,7 @@
|
|||||||
"IDP_ENTITY_ID": {
|
"IDP_ENTITY_ID": {
|
||||||
"LABEL": "Identity Provider Entity ID",
|
"LABEL": "Identity Provider Entity ID",
|
||||||
"HELP": "Unique identifier for your identity provider (usually found in IdP configuration)",
|
"HELP": "Unique identifier for your identity provider (usually found in IdP configuration)",
|
||||||
"PLACEHOLDER": "https://sso.example.com/saml"
|
"PLACEHOLDER": "https://your-idp.com/saml"
|
||||||
},
|
},
|
||||||
"UPDATE_BUTTON": "Update SAML Settings",
|
"UPDATE_BUTTON": "Update SAML Settings",
|
||||||
"API": {
|
"API": {
|
||||||
|
|||||||
@@ -501,7 +501,7 @@
|
|||||||
"SSO_URL": {
|
"SSO_URL": {
|
||||||
"LABEL": "SSO URL",
|
"LABEL": "SSO URL",
|
||||||
"HELP": "A URL para onde as solicitações de autenticação SAML serão enviadas",
|
"HELP": "A URL para onde as solicitações de autenticação SAML serão enviadas",
|
||||||
"PLACEHOLDER": "https://sso.example.com/saml/sso"
|
"PLACEHOLDER": "https://your-idp.com/saml/sso"
|
||||||
},
|
},
|
||||||
"CERTIFICATE": {
|
"CERTIFICATE": {
|
||||||
"LABEL": "Certificado de assinatura no formato PEM",
|
"LABEL": "Certificado de assinatura no formato PEM",
|
||||||
@@ -521,7 +521,7 @@
|
|||||||
"IDP_ENTITY_ID": {
|
"IDP_ENTITY_ID": {
|
||||||
"LABEL": "ID da Entidade do Provedor de Identidade",
|
"LABEL": "ID da Entidade do Provedor de Identidade",
|
||||||
"HELP": "Identificador exclusivo do seu provedor de identidade (geralmente encontrado na configuração do IdP)",
|
"HELP": "Identificador exclusivo do seu provedor de identidade (geralmente encontrado na configuração do IdP)",
|
||||||
"PLACEHOLDER": "https://sso.example.com/saml"
|
"PLACEHOLDER": "https://seu-idp.com/saml"
|
||||||
},
|
},
|
||||||
"UPDATE_BUTTON": "Atualizar configurações de SAML",
|
"UPDATE_BUTTON": "Atualizar configurações de SAML",
|
||||||
"API": {
|
"API": {
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ import ContextMenu from 'dashboard/components/ui/ContextMenu.vue';
|
|||||||
import AddCannedModal from 'dashboard/routes/dashboard/settings/canned/AddCanned.vue';
|
import AddCannedModal from 'dashboard/routes/dashboard/settings/canned/AddCanned.vue';
|
||||||
import { useSnakeCase } from 'dashboard/composables/useTransformKeys';
|
import { useSnakeCase } from 'dashboard/composables/useTransformKeys';
|
||||||
import { copyTextToClipboard } from 'shared/helpers/clipboard';
|
import { copyTextToClipboard } from 'shared/helpers/clipboard';
|
||||||
import { parseAPIErrorResponse } from 'dashboard/store/utils/api';
|
|
||||||
import { conversationUrl, frontendURL } from '../../../helper/URLHelper';
|
import { conversationUrl, frontendURL } from '../../../helper/URLHelper';
|
||||||
import {
|
import {
|
||||||
ACCOUNT_EVENTS,
|
ACCOUNT_EVENTS,
|
||||||
@@ -120,20 +119,16 @@ export default {
|
|||||||
handleClose(e) {
|
handleClose(e) {
|
||||||
this.$emit('close', e);
|
this.$emit('close', e);
|
||||||
},
|
},
|
||||||
async handleTranslate() {
|
handleTranslate() {
|
||||||
const { locale: accountLocale } = this.getAccount(this.currentAccountId);
|
const { locale: accountLocale } = this.getAccount(this.currentAccountId);
|
||||||
const agentLocale = this.getUISettings?.locale;
|
const agentLocale = this.getUISettings?.locale;
|
||||||
const targetLanguage = agentLocale || accountLocale || 'en';
|
const targetLanguage = agentLocale || accountLocale || 'en';
|
||||||
try {
|
this.$store.dispatch('translateMessage', {
|
||||||
await this.$store.dispatch('translateMessage', {
|
conversationId: this.conversationId,
|
||||||
conversationId: this.conversationId,
|
messageId: this.messageId,
|
||||||
messageId: this.messageId,
|
targetLanguage,
|
||||||
targetLanguage,
|
});
|
||||||
});
|
useTrack(CONVERSATION_EVENTS.TRANSLATE_A_MESSAGE);
|
||||||
useTrack(CONVERSATION_EVENTS.TRANSLATE_A_MESSAGE);
|
|
||||||
} catch (error) {
|
|
||||||
useAlert(parseAPIErrorResponse(error));
|
|
||||||
}
|
|
||||||
this.handleClose();
|
this.handleClose();
|
||||||
},
|
},
|
||||||
handleReplyTo() {
|
handleReplyTo() {
|
||||||
|
|||||||
@@ -1,156 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed, ref, watch } from 'vue';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
import { useRoute } from 'vue-router';
|
|
||||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
|
||||||
import CaptainAssistant from 'dashboard/api/captain/assistant';
|
|
||||||
|
|
||||||
import PageLayout from 'dashboard/components-next/captain/PageLayout.vue';
|
|
||||||
import CaptainPaywall from 'dashboard/components-next/captain/pageComponents/Paywall.vue';
|
|
||||||
import RangeSelector from 'dashboard/components-next/captain/pageComponents/overview/RangeSelector.vue';
|
|
||||||
import WelcomeCard from 'dashboard/components-next/captain/pageComponents/overview/WelcomeCard.vue';
|
|
||||||
import MetricCard from 'dashboard/components-next/captain/pageComponents/overview/MetricCard.vue';
|
|
||||||
import KnowledgeCard from 'dashboard/components-next/captain/pageComponents/overview/KnowledgeCard.vue';
|
|
||||||
import QuickLinks from 'dashboard/components-next/captain/pageComponents/overview/QuickLinks.vue';
|
|
||||||
import InboxBanner from 'dashboard/components-next/captain/pageComponents/overview/InboxBanner.vue';
|
|
||||||
import CoverageBanner from 'dashboard/components-next/captain/pageComponents/overview/CoverageBanner.vue';
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
const route = useRoute();
|
|
||||||
|
|
||||||
const selectedRange = ref('this_month');
|
|
||||||
|
|
||||||
const assistantId = computed(() => route.params.assistantId);
|
|
||||||
const stats = ref(null);
|
|
||||||
|
|
||||||
const fetchStats = async () => {
|
|
||||||
try {
|
|
||||||
const { data } = await CaptainAssistant.getStats({
|
|
||||||
assistantId: assistantId.value,
|
|
||||||
range: selectedRange.value,
|
|
||||||
});
|
|
||||||
stats.value = data;
|
|
||||||
} catch {
|
|
||||||
stats.value = null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
watch([selectedRange, assistantId], fetchStats, { immediate: true });
|
|
||||||
|
|
||||||
// `direction` says whether a rising trend is good ('up'), bad ('down'), or
|
|
||||||
// neutral, so we can colour the delta independently of its sign.
|
|
||||||
const resolveTrendGood = (trendValue, direction) => {
|
|
||||||
if (direction === 'neutral' || trendValue === 0) return null;
|
|
||||||
return direction === 'up' ? trendValue > 0 : trendValue < 0;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Trend units mirror the backend pack mode: a relative percent change ('%') for
|
|
||||||
// :percent metrics, a percentage-point delta (' pts') for rate metrics packed as
|
|
||||||
// :point, and a plain number for :absolute counts like conversation depth.
|
|
||||||
const TREND_SUFFIX = { percent: '%', point: ' pts', absolute: '' };
|
|
||||||
|
|
||||||
// Hours-saved is reported in hours, but large values read better as days. Past
|
|
||||||
// 100h we switch the unit so the card stays legible.
|
|
||||||
const formatDuration = hours =>
|
|
||||||
hours >= 100 ? `${Math.round(hours / 24)}d` : `${hours}h`;
|
|
||||||
|
|
||||||
const metricFor = (statKey, formatValue, direction, trendKind = 'percent') => {
|
|
||||||
const data = stats.value?.[statKey];
|
|
||||||
if (!data) return { value: '—', trend: '', trendGood: null };
|
|
||||||
|
|
||||||
const sign = data.trend > 0 ? '+' : '';
|
|
||||||
return {
|
|
||||||
value: formatValue(data.current),
|
|
||||||
trend: `${sign}${data.trend}${TREND_SUFFIX[trendKind]}`,
|
|
||||||
trendGood: resolveTrendGood(data.trend, direction),
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
const metrics = computed(() => [
|
|
||||||
{
|
|
||||||
key: 'handled',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.HANDLED.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.HANDLED.HINT'),
|
|
||||||
...metricFor('conversations_handled', v => v.toLocaleString(), 'up'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'autoResolution',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.AUTO_RESOLUTION.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.AUTO_RESOLUTION.HINT'),
|
|
||||||
...metricFor('auto_resolution_rate', v => `${v}%`, 'up', 'point'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'handoff',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.HANDOFF.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.HANDOFF.HINT'),
|
|
||||||
...metricFor('handoff_rate', v => `${v}%`, 'down', 'point'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'hoursSaved',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.HOURS_SAVED.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.HOURS_SAVED.HINT'),
|
|
||||||
...metricFor('hours_saved', formatDuration, 'up'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'reopen',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.REOPEN.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.REOPEN.HINT'),
|
|
||||||
...metricFor('reopen_rate', v => `${v}%`, 'down', 'point'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'depth',
|
|
||||||
label: t('CAPTAIN.OVERVIEW.METRICS.DEPTH.LABEL'),
|
|
||||||
hint: t('CAPTAIN.OVERVIEW.METRICS.DEPTH.HINT'),
|
|
||||||
...metricFor(
|
|
||||||
'conversation_depth',
|
|
||||||
v => v.toFixed(1),
|
|
||||||
'neutral',
|
|
||||||
'absolute'
|
|
||||||
),
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<PageLayout
|
|
||||||
:header-title="$t('CAPTAIN.OVERVIEW.HEADER')"
|
|
||||||
:is-empty="false"
|
|
||||||
:show-pagination-footer="false"
|
|
||||||
:show-know-more="false"
|
|
||||||
:feature-flag="FEATURE_FLAGS.CAPTAIN"
|
|
||||||
>
|
|
||||||
<template #headerActions>
|
|
||||||
<RangeSelector v-model="selectedRange" />
|
|
||||||
</template>
|
|
||||||
<template #paywall>
|
|
||||||
<CaptainPaywall />
|
|
||||||
</template>
|
|
||||||
<template #body>
|
|
||||||
<div class="flex flex-col gap-6 pb-8">
|
|
||||||
<InboxBanner />
|
|
||||||
|
|
||||||
<CoverageBanner :knowledge="stats?.knowledge" />
|
|
||||||
|
|
||||||
<WelcomeCard :range="selectedRange" />
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="grid grid-cols-1 gap-px overflow-hidden border rounded-xl sm:grid-cols-2 lg:grid-cols-3 bg-n-weak border-n-weak"
|
|
||||||
>
|
|
||||||
<MetricCard
|
|
||||||
v-for="metric in metrics"
|
|
||||||
:key="metric.key"
|
|
||||||
:label="metric.label"
|
|
||||||
:value="metric.value"
|
|
||||||
:trend="metric.trend"
|
|
||||||
:hint="metric.hint"
|
|
||||||
:trend-good="metric.trendGood"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<KnowledgeCard :knowledge="stats?.knowledge" />
|
|
||||||
|
|
||||||
<QuickLinks />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</PageLayout>
|
|
||||||
</template>
|
|
||||||
@@ -6,7 +6,6 @@ import CaptainPageRouteView from './pages/CaptainPageRouteView.vue';
|
|||||||
import AssistantsIndexPage from './pages/AssistantsIndexPage.vue';
|
import AssistantsIndexPage from './pages/AssistantsIndexPage.vue';
|
||||||
import AssistantEmptyStateIndex from './assistants/Index.vue';
|
import AssistantEmptyStateIndex from './assistants/Index.vue';
|
||||||
|
|
||||||
import AssistantOverviewIndex from './assistants/overview/Index.vue';
|
|
||||||
import AssistantSettingsIndex from './assistants/settings/Settings.vue';
|
import AssistantSettingsIndex from './assistants/settings/Settings.vue';
|
||||||
import AssistantInboxesIndex from './assistants/inboxes/Index.vue';
|
import AssistantInboxesIndex from './assistants/inboxes/Index.vue';
|
||||||
import AssistantPlaygroundIndex from './assistants/playground/Index.vue';
|
import AssistantPlaygroundIndex from './assistants/playground/Index.vue';
|
||||||
@@ -37,12 +36,6 @@ const metaV2 = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const assistantRoutes = [
|
const assistantRoutes = [
|
||||||
{
|
|
||||||
path: frontendURL('accounts/:accountId/captain/:assistantId/overview'),
|
|
||||||
component: AssistantOverviewIndex,
|
|
||||||
name: 'captain_assistants_overview_index',
|
|
||||||
meta,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
path: frontendURL('accounts/:accountId/captain/:assistantId/faqs'),
|
path: frontendURL('accounts/:accountId/captain/:assistantId/faqs'),
|
||||||
component: ResponsesIndex,
|
component: ResponsesIndex,
|
||||||
@@ -136,7 +129,7 @@ export const routes = [
|
|||||||
return {
|
return {
|
||||||
name: 'captain_assistants_index',
|
name: 'captain_assistants_index',
|
||||||
params: {
|
params: {
|
||||||
navigationPath: 'captain_assistants_overview_index',
|
navigationPath: 'captain_assistants_responses_index',
|
||||||
...to.params,
|
...to.params,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -53,7 +53,6 @@ const routeToLastActiveAssistant = () => {
|
|||||||
|
|
||||||
const { navigationPath } = route.params;
|
const { navigationPath } = route.params;
|
||||||
const isAValidRoute = [
|
const isAValidRoute = [
|
||||||
'captain_assistants_overview_index', // Overview page
|
|
||||||
'captain_assistants_responses_index', // Faq page
|
'captain_assistants_responses_index', // Faq page
|
||||||
'captain_assistants_documents_index', // Document page
|
'captain_assistants_documents_index', // Document page
|
||||||
'captain_assistants_scenarios_index', // Scenario page
|
'captain_assistants_scenarios_index', // Scenario page
|
||||||
@@ -65,7 +64,7 @@ const routeToLastActiveAssistant = () => {
|
|||||||
|
|
||||||
const navigateTo = isAValidRoute
|
const navigateTo = isAValidRoute
|
||||||
? navigationPath
|
? navigationPath
|
||||||
: 'captain_assistants_overview_index';
|
: 'captain_assistants_responses_index';
|
||||||
|
|
||||||
return routeToView(navigateTo, {
|
return routeToView(navigateTo, {
|
||||||
accountId: route.params.accountId,
|
accountId: route.params.accountId,
|
||||||
|
|||||||
@@ -25,7 +25,7 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
const { agentsList } = useAgentsList(true, { includeAgentBots: true });
|
const { agentsList } = useAgentsList();
|
||||||
return {
|
return {
|
||||||
agentsList,
|
agentsList,
|
||||||
};
|
};
|
||||||
@@ -81,27 +81,18 @@ export default {
|
|||||||
},
|
},
|
||||||
assignedAgent: {
|
assignedAgent: {
|
||||||
get() {
|
get() {
|
||||||
const assignee = this.currentChat.meta.assignee;
|
return this.currentChat.meta.assignee;
|
||||||
return (
|
|
||||||
assignee && {
|
|
||||||
...assignee,
|
|
||||||
assignee_type: this.currentChat.meta.assignee_type || 'User',
|
|
||||||
}
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
set(agent) {
|
set(agent) {
|
||||||
const agentId = agent ? agent.id : null;
|
const agentId = agent ? agent.id : null;
|
||||||
const assigneeType = agent ? agent.assignee_type || 'User' : null;
|
|
||||||
this.$store.dispatch('setCurrentChatAssignee', {
|
this.$store.dispatch('setCurrentChatAssignee', {
|
||||||
conversationId: this.currentChat.id,
|
conversationId: this.currentChat.id,
|
||||||
assignee: agent,
|
assignee: agent,
|
||||||
assigneeType,
|
|
||||||
});
|
});
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch('assignAgent', {
|
.dispatch('assignAgent', {
|
||||||
conversationId: this.currentChat.id,
|
conversationId: this.currentChat.id,
|
||||||
agentId,
|
agentId,
|
||||||
assigneeType,
|
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
useAlert(this.$t('CONVERSATION.CHANGE_AGENT'));
|
useAlert(this.$t('CONVERSATION.CHANGE_AGENT'));
|
||||||
@@ -161,10 +152,7 @@ export default {
|
|||||||
if (!this.assignedAgent) {
|
if (!this.assignedAgent) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if (
|
if (this.assignedAgent.id !== this.currentUser.id) {
|
||||||
this.assignedAgent.id !== this.currentUser.id ||
|
|
||||||
(this.assignedAgent.assignee_type || 'User') !== 'User'
|
|
||||||
) {
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
@@ -195,11 +183,7 @@ export default {
|
|||||||
this.assignedAgent = selfAssign;
|
this.assignedAgent = selfAssign;
|
||||||
},
|
},
|
||||||
onClickAssignAgent(selectedItem) {
|
onClickAssignAgent(selectedItem) {
|
||||||
if (
|
if (this.assignedAgent && this.assignedAgent.id === selectedItem.id) {
|
||||||
this.assignedAgent?.id === selectedItem.id &&
|
|
||||||
(this.assignedAgent?.assignee_type || 'User') ===
|
|
||||||
(selectedItem.assignee_type || 'User')
|
|
||||||
) {
|
|
||||||
this.assignedAgent = null;
|
this.assignedAgent = null;
|
||||||
} else {
|
} else {
|
||||||
this.assignedAgent = selectedItem;
|
this.assignedAgent = selectedItem;
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import { useMapGetter } from 'dashboard/composables/store';
|
import { useMapGetter } from 'dashboard/composables/store';
|
||||||
import { IS_WHATSAPP_INBOX_CREATION_DISABLED } from 'dashboard/constants/globals';
|
|
||||||
|
|
||||||
// OAuth/SDK channels need installation-level app credentials to be usable. When
|
// OAuth/SDK channels need installation-level app credentials to be usable. When
|
||||||
// the credential is missing the channel is "not configured" and is hidden from
|
// the credential is missing the channel is "not configured" and is hidden from
|
||||||
@@ -14,7 +13,6 @@ export function useChannelConfig() {
|
|||||||
// WhatsApp is onboarded only via Meta embedded signup, which needs both the
|
// WhatsApp is onboarded only via Meta embedded signup, which needs both the
|
||||||
// app id (not the 'none' sentinel) and the signup configuration id.
|
// app id (not the 'none' sentinel) and the signup configuration id.
|
||||||
whatsapp: () =>
|
whatsapp: () =>
|
||||||
!IS_WHATSAPP_INBOX_CREATION_DISABLED &&
|
|
||||||
Boolean(installationConfig.whatsappAppId) &&
|
Boolean(installationConfig.whatsappAppId) &&
|
||||||
installationConfig.whatsappAppId !== 'none' &&
|
installationConfig.whatsappAppId !== 'none' &&
|
||||||
Boolean(installationConfig.whatsappConfigurationId),
|
Boolean(installationConfig.whatsappConfigurationId),
|
||||||
|
|||||||
-7
@@ -6,13 +6,6 @@ import { useDetectedChannels } from '../../inbox-setup/useDetectedChannels';
|
|||||||
|
|
||||||
vi.mock('vue-router');
|
vi.mock('vue-router');
|
||||||
|
|
||||||
// Neutralize the temporary WhatsApp kill switch so these specs keep covering
|
|
||||||
// the credential-based gating it short-circuits.
|
|
||||||
vi.mock('dashboard/constants/globals', async importOriginal => ({
|
|
||||||
...(await importOriginal()),
|
|
||||||
IS_WHATSAPP_INBOX_CREATION_DISABLED: false,
|
|
||||||
}));
|
|
||||||
|
|
||||||
// Mounts the composable against a real store and the real useAccount (only
|
// Mounts the composable against a real store and the real useAccount (only
|
||||||
// useRoute and the underlying getters are faked), so a change to how useAccount
|
// useRoute and the underlying getters are faked), so a change to how useAccount
|
||||||
// resolves the current account is exercised here too. The real ./constants are
|
// resolves the current account is exercised here too. The real ./constants are
|
||||||
|
|||||||
@@ -15,8 +15,6 @@ import PurchaseCreditsModal from './components/PurchaseCreditsModal.vue';
|
|||||||
import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
|
import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
|
||||||
import SettingsLayout from '../SettingsLayout.vue';
|
import SettingsLayout from '../SettingsLayout.vue';
|
||||||
import ButtonV4 from 'next/button/Button.vue';
|
import ButtonV4 from 'next/button/Button.vue';
|
||||||
import { getCurrencyConfig } from 'dashboard/constants/billing';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const { currentAccount, isOnChatwootCloud } = useAccount();
|
const { currentAccount, isOnChatwootCloud } = useAccount();
|
||||||
@@ -31,7 +29,6 @@ const {
|
|||||||
|
|
||||||
const uiFlags = useMapGetter('accounts/getUIFlags');
|
const uiFlags = useMapGetter('accounts/getUIFlags');
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
const { t } = useI18n();
|
|
||||||
|
|
||||||
const BILLING_REFRESH_ATTEMPTED = 'billing_refresh_attempted';
|
const BILLING_REFRESH_ATTEMPTED = 'billing_refresh_attempted';
|
||||||
|
|
||||||
@@ -39,10 +36,6 @@ const BILLING_REFRESH_ATTEMPTED = 'billing_refresh_attempted';
|
|||||||
const isWaitingForBilling = ref(false);
|
const isWaitingForBilling = ref(false);
|
||||||
const purchaseCreditsModalRef = ref(null);
|
const purchaseCreditsModalRef = ref(null);
|
||||||
|
|
||||||
// Currency selection shown to new accounts whose locale supports a non-USD currency.
|
|
||||||
const currencySelectionRequired = ref(false);
|
|
||||||
const currencyOptions = ref([]);
|
|
||||||
|
|
||||||
const customAttributes = computed(() => {
|
const customAttributes = computed(() => {
|
||||||
return currentAccount.value.custom_attributes || {};
|
return currentAccount.value.custom_attributes || {};
|
||||||
});
|
});
|
||||||
@@ -68,13 +61,6 @@ const subscribedQuantity = computed(() => {
|
|||||||
return customAttributes.value.subscribed_quantity;
|
return customAttributes.value.subscribed_quantity;
|
||||||
});
|
});
|
||||||
|
|
||||||
const billingCurrency = computed(() => {
|
|
||||||
if (!customAttributes.value.billing_currency) return '';
|
|
||||||
return t(
|
|
||||||
getCurrencyConfig(customAttributes.value.billing_currency).i18nLabelKey
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
const subscriptionRenewsOn = computed(() => {
|
const subscriptionRenewsOn = computed(() => {
|
||||||
if (!customAttributes.value.subscription_ends_on) return '';
|
if (!customAttributes.value.subscription_ends_on) return '';
|
||||||
const endDate = new Date(customAttributes.value.subscription_ends_on);
|
const endDate = new Date(customAttributes.value.subscription_ends_on);
|
||||||
@@ -92,9 +78,7 @@ const hasABillingPlan = computed(() => {
|
|||||||
|
|
||||||
const fetchAccountDetails = async () => {
|
const fetchAccountDetails = async () => {
|
||||||
if (!hasABillingPlan.value) {
|
if (!hasABillingPlan.value) {
|
||||||
const data = await store.dispatch('accounts/subscription');
|
await store.dispatch('accounts/subscription');
|
||||||
currencySelectionRequired.value = !!data?.currency_selection_required;
|
|
||||||
currencyOptions.value = data?.currency_options || [];
|
|
||||||
}
|
}
|
||||||
// Always fetch limits for billing page to show credit usage
|
// Always fetch limits for billing page to show credit usage
|
||||||
fetchLimits();
|
fetchLimits();
|
||||||
@@ -113,9 +97,6 @@ const handleBillingPageLogic = async () => {
|
|||||||
// If cloud user, fetch account details first
|
// If cloud user, fetch account details first
|
||||||
await fetchAccountDetails();
|
await fetchAccountDetails();
|
||||||
|
|
||||||
// Waiting on the user to pick a billing currency — don't auto-refresh.
|
|
||||||
if (currencySelectionRequired.value) return;
|
|
||||||
|
|
||||||
// If still no billing plan after fetch
|
// If still no billing plan after fetch
|
||||||
if (!hasABillingPlan.value) {
|
if (!hasABillingPlan.value) {
|
||||||
// If we haven't attempted refresh yet, do it once
|
// If we haven't attempted refresh yet, do it once
|
||||||
@@ -137,13 +118,6 @@ const handleBillingPageLogic = async () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const onSelectCurrency = async code => {
|
|
||||||
await store.dispatch('accounts/selectBillingCurrency', code);
|
|
||||||
currencySelectionRequired.value = false;
|
|
||||||
// Currency stored and customer creation kicked off — resume the standard wait flow.
|
|
||||||
await handleBillingPageLogic();
|
|
||||||
};
|
|
||||||
|
|
||||||
const onClickBillingPortal = () => {
|
const onClickBillingPortal = () => {
|
||||||
store.dispatch('accounts/checkout');
|
store.dispatch('accounts/checkout');
|
||||||
};
|
};
|
||||||
@@ -174,9 +148,7 @@ onMounted(handleBillingPageLogic);
|
|||||||
? $t('BILLING_SETTINGS.NO_BILLING_USER')
|
? $t('BILLING_SETTINGS.NO_BILLING_USER')
|
||||||
: $t('ATTRIBUTES_MGMT.LOADING')
|
: $t('ATTRIBUTES_MGMT.LOADING')
|
||||||
"
|
"
|
||||||
:no-records-found="
|
:no-records-found="!hasABillingPlan && !isWaitingForBilling"
|
||||||
!hasABillingPlan && !isWaitingForBilling && !currencySelectionRequired
|
|
||||||
"
|
|
||||||
:no-records-message="$t('BILLING_SETTINGS.NO_BILLING_USER')"
|
:no-records-message="$t('BILLING_SETTINGS.NO_BILLING_USER')"
|
||||||
>
|
>
|
||||||
<template #header>
|
<template #header>
|
||||||
@@ -188,30 +160,7 @@ onMounted(handleBillingPageLogic);
|
|||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<template #body>
|
<template #body>
|
||||||
<section v-if="currencySelectionRequired" class="grid gap-4">
|
<section class="grid gap-4">
|
||||||
<BillingCard
|
|
||||||
:title="$t('BILLING_SETTINGS.CURRENCY.SELECT.TITLE')"
|
|
||||||
:description="$t('BILLING_SETTINGS.CURRENCY.SELECT.DESCRIPTION')"
|
|
||||||
>
|
|
||||||
<template #action>
|
|
||||||
<div class="flex gap-2">
|
|
||||||
<ButtonV4
|
|
||||||
v-for="code in currencyOptions"
|
|
||||||
:key="code"
|
|
||||||
sm
|
|
||||||
solid
|
|
||||||
blue
|
|
||||||
:is-loading="uiFlags.isCheckoutInProcess"
|
|
||||||
:disabled="uiFlags.isCheckoutInProcess"
|
|
||||||
@click="onSelectCurrency(code)"
|
|
||||||
>
|
|
||||||
{{ $t(getCurrencyConfig(code).i18nLabelKey) }}
|
|
||||||
</ButtonV4>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</BillingCard>
|
|
||||||
</section>
|
|
||||||
<section v-else class="grid gap-4">
|
|
||||||
<BillingCard
|
<BillingCard
|
||||||
:title="$t('BILLING_SETTINGS.MANAGE_SUBSCRIPTION.TITLE')"
|
:title="$t('BILLING_SETTINGS.MANAGE_SUBSCRIPTION.TITLE')"
|
||||||
:description="$t('BILLING_SETTINGS.MANAGE_SUBSCRIPTION.DESCRIPTION')"
|
:description="$t('BILLING_SETTINGS.MANAGE_SUBSCRIPTION.DESCRIPTION')"
|
||||||
@@ -239,11 +188,6 @@ onMounted(handleBillingPageLogic);
|
|||||||
:label="$t('BILLING_SETTINGS.CURRENT_PLAN.RENEWS_ON')"
|
:label="$t('BILLING_SETTINGS.CURRENT_PLAN.RENEWS_ON')"
|
||||||
:value="subscriptionRenewsOn"
|
:value="subscriptionRenewsOn"
|
||||||
/>
|
/>
|
||||||
<DetailItem
|
|
||||||
v-if="billingCurrency"
|
|
||||||
:label="$t('BILLING_SETTINGS.CURRENT_PLAN.CURRENCY')"
|
|
||||||
:value="billingCurrency"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</BillingCard>
|
</BillingCard>
|
||||||
<BillingCard
|
<BillingCard
|
||||||
|
|||||||
+5
-3
@@ -1,6 +1,4 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { formatCurrencyAmount } from 'dashboard/constants/billing';
|
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
credits: {
|
credits: {
|
||||||
type: Number,
|
type: Number,
|
||||||
@@ -35,7 +33,11 @@ const formatCredits = credits => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const formatAmount = (amount, currency) => {
|
const formatAmount = (amount, currency) => {
|
||||||
return formatCurrencyAmount(amount, currency, { minimumFractionDigits: 0 });
|
return new Intl.NumberFormat('en-US', {
|
||||||
|
style: 'currency',
|
||||||
|
currency: currency.toUpperCase(),
|
||||||
|
minimumFractionDigits: 0,
|
||||||
|
}).format(amount);
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
+43
-91
@@ -4,18 +4,20 @@ import { useI18n } from 'vue-i18n';
|
|||||||
import { useAlert } from 'dashboard/composables';
|
import { useAlert } from 'dashboard/composables';
|
||||||
import Dialog from 'dashboard/components-next/dialog/Dialog.vue';
|
import Dialog from 'dashboard/components-next/dialog/Dialog.vue';
|
||||||
import Button from 'dashboard/components-next/button/Button.vue';
|
import Button from 'dashboard/components-next/button/Button.vue';
|
||||||
import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
|
|
||||||
import CreditPackageCard from './CreditPackageCard.vue';
|
import CreditPackageCard from './CreditPackageCard.vue';
|
||||||
import EnterpriseAccountAPI from 'dashboard/api/enterprise/account';
|
import EnterpriseAccountAPI from 'dashboard/api/enterprise/account';
|
||||||
import {
|
|
||||||
formatCurrencyAmount,
|
|
||||||
DEFAULT_BILLING_CURRENCY,
|
|
||||||
} from 'dashboard/constants/billing';
|
|
||||||
|
|
||||||
const emit = defineEmits(['success']);
|
const emit = defineEmits(['close', 'success']);
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
const TOPUP_OPTIONS = [
|
||||||
|
{ credits: 1000, amount: 20.0, currency: 'usd' },
|
||||||
|
{ credits: 2500, amount: 50.0, currency: 'usd' },
|
||||||
|
{ credits: 6000, amount: 100.0, currency: 'usd' },
|
||||||
|
{ credits: 12000, amount: 200.0, currency: 'usd' },
|
||||||
|
];
|
||||||
|
|
||||||
const POPULAR_CREDITS_AMOUNT = 6000;
|
const POPULAR_CREDITS_AMOUNT = 6000;
|
||||||
const STEP_SELECT = 'select';
|
const STEP_SELECT = 'select';
|
||||||
const STEP_CONFIRM = 'confirm';
|
const STEP_CONFIRM = 'confirm';
|
||||||
@@ -25,20 +27,16 @@ const selectedCredits = ref(null);
|
|||||||
const isLoading = ref(false);
|
const isLoading = ref(false);
|
||||||
const currentStep = ref(STEP_SELECT);
|
const currentStep = ref(STEP_SELECT);
|
||||||
|
|
||||||
// Topup packages come from the backend for the account's billing currency.
|
|
||||||
const topupOptions = ref([]);
|
|
||||||
const optionsCurrency = ref(DEFAULT_BILLING_CURRENCY);
|
|
||||||
const isFetchingOptions = ref(false);
|
|
||||||
const fetchError = ref(false);
|
|
||||||
|
|
||||||
const selectedOption = computed(() => {
|
const selectedOption = computed(() => {
|
||||||
return topupOptions.value.find(o => o.credits === selectedCredits.value);
|
return TOPUP_OPTIONS.find(o => o.credits === selectedCredits.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
const formattedAmount = computed(() => {
|
const formattedAmount = computed(() => {
|
||||||
if (!selectedOption.value) return '';
|
if (!selectedOption.value) return '';
|
||||||
const { amount, currency } = selectedOption.value;
|
return new Intl.NumberFormat('en-US', {
|
||||||
return formatCurrencyAmount(amount, currency || optionsCurrency.value);
|
style: 'currency',
|
||||||
|
currency: selectedOption.value.currency.toUpperCase(),
|
||||||
|
}).format(selectedOption.value.amount);
|
||||||
});
|
});
|
||||||
|
|
||||||
const formattedCredits = computed(() => {
|
const formattedCredits = computed(() => {
|
||||||
@@ -66,44 +64,24 @@ const handlePackageSelect = credits => {
|
|||||||
selectedCredits.value = credits;
|
selectedCredits.value = credits;
|
||||||
};
|
};
|
||||||
|
|
||||||
const selectDefaultOption = () => {
|
const open = () => {
|
||||||
const popularOption = topupOptions.value.find(
|
const popularOption = TOPUP_OPTIONS.find(
|
||||||
o => o.credits === POPULAR_CREDITS_AMOUNT
|
o => o.credits === POPULAR_CREDITS_AMOUNT
|
||||||
);
|
);
|
||||||
selectedCredits.value =
|
selectedCredits.value = popularOption?.credits || TOPUP_OPTIONS[0]?.credits;
|
||||||
popularOption?.credits || topupOptions.value[0]?.credits || null;
|
|
||||||
};
|
|
||||||
|
|
||||||
const fetchOptions = async () => {
|
|
||||||
isFetchingOptions.value = true;
|
|
||||||
fetchError.value = false;
|
|
||||||
try {
|
|
||||||
const { data } = await EnterpriseAccountAPI.getTopupOptions();
|
|
||||||
topupOptions.value = data.options ?? [];
|
|
||||||
optionsCurrency.value = (
|
|
||||||
data.currency || DEFAULT_BILLING_CURRENCY
|
|
||||||
).toLowerCase();
|
|
||||||
selectDefaultOption();
|
|
||||||
} catch {
|
|
||||||
fetchError.value = true;
|
|
||||||
topupOptions.value = [];
|
|
||||||
} finally {
|
|
||||||
isFetchingOptions.value = false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const open = () => {
|
|
||||||
currentStep.value = STEP_SELECT;
|
currentStep.value = STEP_SELECT;
|
||||||
isLoading.value = false;
|
isLoading.value = false;
|
||||||
selectedCredits.value = null;
|
|
||||||
dialogRef.value?.open();
|
dialogRef.value?.open();
|
||||||
fetchOptions();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const close = () => {
|
const close = () => {
|
||||||
dialogRef.value?.close();
|
dialogRef.value?.close();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handleClose = () => {
|
||||||
|
emit('close');
|
||||||
|
};
|
||||||
|
|
||||||
const goToConfirmStep = () => {
|
const goToConfirmStep = () => {
|
||||||
if (!selectedOption.value) return;
|
if (!selectedOption.value) return;
|
||||||
currentStep.value = STEP_CONFIRM;
|
currentStep.value = STEP_CONFIRM;
|
||||||
@@ -149,58 +127,32 @@ defineExpose({ open, close });
|
|||||||
:width="dialogWidth"
|
:width="dialogWidth"
|
||||||
:show-confirm-button="false"
|
:show-confirm-button="false"
|
||||||
:show-cancel-button="false"
|
:show-cancel-button="false"
|
||||||
|
@close="handleClose"
|
||||||
>
|
>
|
||||||
<!-- Step 1: Select Credits Package -->
|
<!-- Step 1: Select Credits Package -->
|
||||||
<template v-if="currentStep === STEP_SELECT">
|
<template v-if="currentStep === 'select'">
|
||||||
<div
|
<div class="grid grid-cols-2 gap-4">
|
||||||
v-if="isFetchingOptions"
|
<CreditPackageCard
|
||||||
class="flex items-center justify-center gap-2 py-10"
|
v-for="option in TOPUP_OPTIONS"
|
||||||
>
|
:key="option.credits"
|
||||||
<Spinner />
|
name="credit-package"
|
||||||
<span class="text-sm text-n-slate-11">{{
|
:credits="option.credits"
|
||||||
$t('BILLING_SETTINGS.TOPUP.LOADING')
|
:amount="option.amount"
|
||||||
}}</span>
|
:currency="option.currency"
|
||||||
</div>
|
:is-popular="option.credits === POPULAR_CREDITS_AMOUNT"
|
||||||
|
:is-selected="selectedCredits === option.credits"
|
||||||
<div
|
@select="handlePackageSelect(option.credits)"
|
||||||
v-else-if="fetchError"
|
|
||||||
class="flex flex-col items-center justify-center gap-3 py-10"
|
|
||||||
>
|
|
||||||
<p class="text-sm text-n-slate-11">
|
|
||||||
{{ $t('BILLING_SETTINGS.TOPUP.FETCH_ERROR') }}
|
|
||||||
</p>
|
|
||||||
<Button
|
|
||||||
variant="faded"
|
|
||||||
color="slate"
|
|
||||||
:label="$t('BILLING_SETTINGS.TOPUP.RETRY')"
|
|
||||||
@click="fetchOptions"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template v-else>
|
<div class="p-4 mt-6 rounded-lg bg-n-solid-2 border border-n-weak">
|
||||||
<div class="grid grid-cols-2 gap-4">
|
<p class="text-sm text-n-slate-11">
|
||||||
<CreditPackageCard
|
<span class="font-semibold text-n-slate-12">{{
|
||||||
v-for="option in topupOptions"
|
$t('BILLING_SETTINGS.TOPUP.NOTE_TITLE')
|
||||||
:key="option.credits"
|
}}</span>
|
||||||
name="credit-package"
|
{{ $t('BILLING_SETTINGS.TOPUP.NOTE_DESCRIPTION') }}
|
||||||
:credits="option.credits"
|
</p>
|
||||||
:amount="option.amount"
|
</div>
|
||||||
:currency="option.currency"
|
|
||||||
:is-popular="option.credits === POPULAR_CREDITS_AMOUNT"
|
|
||||||
:is-selected="selectedCredits === option.credits"
|
|
||||||
@select="handlePackageSelect(option.credits)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="p-4 mt-6 rounded-lg bg-n-solid-2 border border-n-weak">
|
|
||||||
<p class="text-sm text-n-slate-11">
|
|
||||||
<span class="font-semibold text-n-slate-12">{{
|
|
||||||
$t('BILLING_SETTINGS.TOPUP.NOTE_TITLE')
|
|
||||||
}}</span>
|
|
||||||
{{ $t('BILLING_SETTINGS.TOPUP.NOTE_DESCRIPTION') }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- Step 2: Confirm Purchase -->
|
<!-- Step 2: Confirm Purchase -->
|
||||||
@@ -226,7 +178,7 @@ defineExpose({ open, close });
|
|||||||
<template #footer>
|
<template #footer>
|
||||||
<!-- Step 1 Footer -->
|
<!-- Step 1 Footer -->
|
||||||
<div
|
<div
|
||||||
v-if="currentStep === STEP_SELECT"
|
v-if="currentStep === 'select'"
|
||||||
class="flex items-center justify-between w-full gap-3"
|
class="flex items-center justify-between w-full gap-3"
|
||||||
>
|
>
|
||||||
<Button
|
<Button
|
||||||
@@ -240,7 +192,7 @@ defineExpose({ open, close });
|
|||||||
color="blue"
|
color="blue"
|
||||||
:label="$t('BILLING_SETTINGS.TOPUP.PURCHASE')"
|
:label="$t('BILLING_SETTINGS.TOPUP.PURCHASE')"
|
||||||
class="w-full"
|
class="w-full"
|
||||||
:disabled="!selectedCredits || isFetchingOptions || fetchError"
|
:disabled="!selectedCredits"
|
||||||
@click="goToConfirmStep"
|
@click="goToConfirmStep"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -149,5 +149,9 @@ export default {
|
|||||||
|
|
||||||
:deep(.ProseMirror-woot-style) {
|
:deep(.ProseMirror-woot-style) {
|
||||||
@apply min-h-[12.5rem];
|
@apply min-h-[12.5rem];
|
||||||
|
|
||||||
|
p {
|
||||||
|
@apply text-base;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user