diff --git a/app/livechat/client/route.js b/app/livechat/client/route.js index f440147a9fa..d0bdd9bcac1 100644 --- a/app/livechat/client/route.js +++ b/app/livechat/client/route.js @@ -71,6 +71,7 @@ AccountBox.addRoute({ sideNav: 'livechatFlex', i18nPageTitle: 'Edit_Department', pageTemplate: 'livechatDepartmentForm', + customContainer: true, }, livechatManagerRoutes, load); AccountBox.addRoute({ @@ -79,6 +80,7 @@ AccountBox.addRoute({ sideNav: 'livechatFlex', i18nPageTitle: 'New_Department', pageTemplate: 'livechatDepartmentForm', + customContainer: true, }, livechatManagerRoutes, load); AccountBox.addRoute({ diff --git a/app/livechat/client/stylesheets/livechat.less b/app/livechat/client/stylesheets/livechat.less index 0e664940a2f..507984d4492 100644 --- a/app/livechat/client/stylesheets/livechat.less +++ b/app/livechat/client/stylesheets/livechat.less @@ -548,12 +548,10 @@ flex: 0 0 auto; margin-top: 26px; padding-left: 30px; - border-left: 1px solid #cccccc; & > .rc-button__group { margin: 0 5px; } - } .livechat-current-chats-tag-filter-wrapper { diff --git a/app/livechat/client/views/app/livechatCurrentChats.html b/app/livechat/client/views/app/livechatCurrentChats.html index 5c65baace00..dc931db674b 100644 --- a/app/livechat/client/views/app/livechatCurrentChats.html +++ b/app/livechat/client/views/app/livechatCurrentChats.html @@ -75,7 +75,7 @@
- +
diff --git a/app/livechat/client/views/app/livechatDepartmentForm.html b/app/livechat/client/views/app/livechatDepartmentForm.html index 8afe8a233f2..75f2623e332 100644 --- a/app/livechat/client/views/app/livechatDepartmentForm.html +++ b/app/livechat/client/views/app/livechatDepartmentForm.html @@ -1,148 +1,160 @@ diff --git a/app/livechat/client/views/app/livechatDepartmentForm.js b/app/livechat/client/views/app/livechatDepartmentForm.js index a5415796212..55ff2346d62 100644 --- a/app/livechat/client/views/app/livechatDepartmentForm.js +++ b/app/livechat/client/views/app/livechatDepartmentForm.js @@ -5,6 +5,7 @@ import { Template } from 'meteor/templating'; import _ from 'underscore'; import toastr from 'toastr'; +import { TabBar, RocketChatTabBar } from '../../../../ui-utils'; import { t, handleError } from '../../../../utils'; import { hasPermission } from '../../../../authorization'; import { getCustomFormTemplate } from './customTemplates/register'; @@ -67,6 +68,17 @@ Template.livechatDepartmentForm.helpers({ onClickTagAgents() { return Template.instance().onClickTagAgents; }, + flexData() { + return { + tabBar: Template.instance().tabBar, + data: Template.instance().tabBarData.get(), + }; + }, + tabBarVisible() { + return Object.values(TabBar.buttons.get()) + .some((button) => button.groups + .some((group) => group.startsWith('livechat-department'))); + }, }); Template.livechatDepartmentForm.events({ @@ -184,6 +196,9 @@ Template.livechatDepartmentForm.onCreated(async function() { this.department = new ReactiveVar({ enabled: true }); this.departmentAgents = new ReactiveVar([]); this.selectedAgents = new ReactiveVar([]); + this.tabBar = new RocketChatTabBar(); + this.tabBar.showGroup(FlowRouter.current().route.name); + this.tabBarData = new ReactiveVar(); this.onSelectAgents = ({ item: agent }) => { this.selectedAgents.set([agent]); diff --git a/app/livechat/client/views/app/livechatRoomTagSelector.html b/app/livechat/client/views/app/livechatRoomTagSelector.html index e69fc1cd8a7..bd10b3cc1d8 100644 --- a/app/livechat/client/views/app/livechatRoomTagSelector.html +++ b/app/livechat/client/views/app/livechatRoomTagSelector.html @@ -1,5 +1,17 @@ \ No newline at end of file + {{#if hasAvailableTags}} +
+ + {{> icon block="rc-select__arrow" icon="arrow-down" }} +
+ {{else}} +
+ +
+ {{/if}} + diff --git a/app/livechat/client/views/app/livechatRoomTagSelector.js b/app/livechat/client/views/app/livechatRoomTagSelector.js index 18769d7281b..a0da4d94820 100644 --- a/app/livechat/client/views/app/livechatRoomTagSelector.js +++ b/app/livechat/client/views/app/livechatRoomTagSelector.js @@ -1,12 +1,24 @@ +import { Meteor } from 'meteor/meteor'; import { Template } from 'meteor/templating'; +import { ReactiveVar } from 'meteor/reactive-var'; import './livechatRoomTagSelector.html'; Template.livechatRoomTagSelector.helpers({ -}); + availableTags() { + return Template.instance().availableTags.get(); + }, -Template.livechatRoomTagSelector.events({ + hasAvailableTags() { + const tags = Template.instance().availableTags.get(); + return tags && tags.length > 0; + }, }); Template.livechatRoomTagSelector.onCreated(function() { + this.availableTags = new ReactiveVar([]); + + Meteor.call('livechat:getTagsList', (err, tagsList) => { + this.availableTags.set(tagsList); + }); }); diff --git a/app/livechat/client/views/regular.js b/app/livechat/client/views/regular.js index e1e1a26cd8d..1fc7ddf9441 100644 --- a/app/livechat/client/views/regular.js +++ b/app/livechat/client/views/regular.js @@ -2,7 +2,7 @@ import './app/livechatAutocompleteUser'; import './app/livechatQueue'; import './app/livechatReadOnly'; import './app/livechatNotSubscribed.html'; -import './app/livechatRoomTagSelector.html'; +import './app/livechatRoomTagSelector'; import './app/tabbar/agentEdit'; import './app/tabbar/agentInfo'; import './app/tabbar/externalSearch';