From 30a79fdde1edafddb4e2d84fca68e2ef1cc35fba Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Fri, 22 Mar 2024 22:19:56 +0200
Subject: [PATCH 1/8] feature: new tab in teams in progress [WTEL-4246]

---
 .../modules/teams/components/opened-team.vue  |   6 +
 .../teams/modules/hooks/api/teamHooks.js      | 167 ++++++++++++++++++
 .../components/opened-team-hooks-popup.vue    | 105 +++++++++++
 .../hooks/components/opened-team-hooks.vue    | 112 ++++++++++++
 .../modules/hooks/enum/HookEvent.enum.js      |  10 ++
 .../modules/hooks/store/_internals/headers.js |  23 +++
 .../teams/modules/hooks/store/team-hooks.js   |  20 +++
 .../modules/teams/store/teams.js              |   3 +-
 8 files changed, 445 insertions(+), 1 deletion(-)
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
 create mode 100644 src/modules/contact-center/modules/teams/modules/hooks/store/team-hooks.js

diff --git a/src/modules/contact-center/modules/teams/components/opened-team.vue b/src/modules/contact-center/modules/teams/components/opened-team.vue
index b6d438017..668b1654e 100644
--- a/src/modules/contact-center/modules/teams/components/opened-team.vue
+++ b/src/modules/contact-center/modules/teams/components/opened-team.vue
@@ -42,6 +42,7 @@ import Agents from '../modules/agents/components/opened-team-agents.vue';
 import Supervisors from '../modules/supervisors/components/opened-team-supervisors.vue';
 import General from './opened-team-general.vue';
 import Parameters from './opened-team-parameters.vue';
+import Hooks from '../modules/hooks/components/opened-team-hooks.vue';
 
 export default {
   name: 'OpenedTeam',
@@ -50,6 +51,7 @@ export default {
     Supervisors,
     Agents,
     Parameters,
+    Hooks,
   },
   mixins: [openedObjectMixin],
 
@@ -88,6 +90,10 @@ export default {
           text: this.$tc('objects.ccenter.agents.agents', 2),
           value: 'agents',
         },
+        {
+          text: this.$tc('objects.ccenter.queues.hooks.hooks', 2),
+          value: 'hooks',
+        }
       ];
 
       if (this.id) tabs.push(this.permissionsTab);
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
new file mode 100644
index 000000000..5e1f15a1a
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
@@ -0,0 +1,167 @@
+import {
+  getDefaultGetListResponse,
+  getDefaultGetParams,
+} from '@webitel/ui-sdk/src/api/defaults';
+import applyTransform, {
+  camelToSnake,
+  merge,
+  mergeEach,
+  notify,
+  sanitize,
+  snakeToCamel,
+  starToSearch,
+} from '@webitel/ui-sdk/src/api/transformers';
+import { TeamHookServiceApi } from 'webitel-sdk';
+import instance from '../../../../../../../app/api/instance';
+import configuration from '../../../../../../../app/api/openAPIConfig';
+
+const teamHookService = new TeamHookServiceApi(configuration, '', instance);
+
+const fieldsToSend = ['event', 'properties', 'schema', 'enabled'];
+
+const preRequestHandler = (parentId) => (item) => ({
+  ...item,
+  teamId: parentId,
+});
+
+const getTeamHooksList = async (params) => {
+  const defaultObject = {
+    enabled: false,
+  };
+
+  const {
+    page,
+    size,
+    search,
+    sort,
+    fields,
+    id,
+    parentId,
+  } = applyTransform(params, [
+    merge(getDefaultGetParams()),
+    starToSearch('search'),
+  ]);
+
+  try {
+    const response = await teamHookService.searchTeamHook(
+      parentId,
+      page,
+      size,
+      search,
+      sort,
+      fields,
+      id,
+    );
+    const { items, next } = applyTransform(response.data, [
+      snakeToCamel(),
+      merge(getDefaultGetListResponse()),
+    ]);
+    return {
+      items: applyTransform(items, [
+        mergeEach(defaultObject),
+      ]),
+      next,
+    };
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const getTeamHook = async ({ parentId, itemId: id }) => {
+  const defaultObject = {
+    event: '',
+    properties: [],
+    schema: {},
+    enabled: false,
+  };
+
+  try {
+    const response = await teamHookService.readTeamHook(parentId, id);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+      merge(defaultObject),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const addTeamHook = async ({ parentId, itemInstance }) => {
+  const item = applyTransform(itemInstance, [
+    preRequestHandler(parentId),
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+  try {
+    const response = await teamHookService.createTeamHook(parentId, item);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const patchTeamHook = async ({ changes, id, parentId }) => {
+  const body = applyTransform(changes, [
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+
+  try {
+    const response = await teamHookService.patchTeamHook(parentId, id, body);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const updateTeamHook = async ({ itemInstance, itemId: id, parentId }) => {
+  const item = applyTransform(itemInstance, [
+    preRequestHandler(parentId),
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+  try {
+    const response = await teamHookService.updateTeamHook(parentId, id, item);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const deleteTeamHook = async ({ parentId, id }) => {
+  try {
+    const response = await teamHookService.deleteTeamHook(parentId, id);
+    return applyTransform(response.data, []);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const TeamHooksAPI = {
+  getList: getTeamHooksList,
+  get: getTeamHook,
+  add: addTeamHook,
+  patch: patchTeamHook,
+  update: updateTeamHook,
+  delete: deleteTeamHook,
+};
+
+export default TeamHooksAPI;
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
new file mode 100644
index 000000000..79683888c
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -0,0 +1,105 @@
+<template>
+  <wt-popup
+    min-width="480"
+    overflow
+    @close="close"
+  >
+    <template #title>
+<!--      {{ $tc('objects.ccenter.queues.hooks.hooks', 1) }}-->
+    </template>
+    <template #main>
+      <form>
+        <wt-select
+          v-model="event"
+          :clearable="false"
+          :label="$t('objects.ccenter.queues.hooks.event')"
+          :options="eventOptions"
+          :v="v$.itemInstance.event"
+          required
+          track-by="value"
+        />
+        <wt-select
+          :clearable="false"
+          :label="$tc('objects.routing.flow.flow', 1)"
+          :search-method="loadFlowOptions"
+          :v="v$.itemInstance.schema"
+          :value="itemInstance.schema"
+          required
+          @input="setItemProp({ prop: 'schema', value: $event })"
+        />
+      </form>
+    </template>
+    <template #actions>
+      <wt-button
+        :disabled="disabledSave"
+        @click="save"
+      >
+        {{ $t('objects.save') }}
+      </wt-button>
+      <wt-button
+        color="secondary"
+        @click="close"
+      >
+        {{ $t('objects.close') }}
+      </wt-button>
+    </template>
+  </wt-popup>
+</template>
+
+<script>
+import { EngineRoutingSchemaType } from 'webitel-sdk';
+import { useVuelidate } from '@vuelidate/core';
+import { required } from '@vuelidate/validators';
+import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
+import FlowsAPI from '../../../../../../routing/modules/flow/api/flow';
+import HookEvent from '../enum/HookEvent.enum';
+
+export default {
+  name: 'OpenedQueueHooksPopup',
+  mixins: [nestedObjectMixin],
+
+  setup: () => ({
+    v$: useVuelidate(),
+  }),
+  data: () => ({
+    namespace: 'ccenter/teams/hooks',
+  }),
+  validations: {
+    itemInstance: {
+      event: { required },
+      schema: { required },
+    },
+  },
+
+  computed: {
+    eventOptions() {
+      return Object.values(HookEvent).map((event) => ({
+        // name: this.$t(`objects.ccenter.queues.hooks.eventTypes.${event}`),
+        value: event,
+      }));
+    },
+    event: {
+      get() {
+        const { event } = this.itemInstance;
+        return event ? {
+          // name: this.$t(`objects.ccenter.queues.hooks.eventTypes.${event}`),
+          value: event,
+        } : {};
+      },
+      set(value) {
+        this.setItemProp({ prop: 'event', value: value.value });
+      },
+    },
+  },
+
+  methods: {
+    loadFlowOptions(params) {
+      return FlowsAPI.getLookup({ ...params, type: [EngineRoutingSchemaType.Service] });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+
+</style>
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
new file mode 100644
index 000000000..d608b018d
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
@@ -0,0 +1,112 @@
+<template>
+  <section>
+    <hook-popup
+      v-if="isHookPopup"
+      @close="closePopup"
+    />
+
+    <header class="content-header">
+      <h3 class="content-title">
+        <!--        {{ $tc('objects.ccenter.queues.hooks.hooks', 2) }}-->
+      </h3>
+      <div class="content-header__actions-wrap">
+        <wt-table-actions
+          :icons="['refresh']"
+          @input="tableActionsHandler"
+        >
+          <delete-all-action
+            v-if="!disableUserInput"
+            :class="{'hidden': anySelected}"
+            :selected-count="selectedRows.length"
+            @click="deleteData(selectedRows)"
+          />
+          <wt-icon-btn
+            v-if="!disableUserInput"
+            class="icon-action"
+            icon="plus"
+            @click="openPopup"
+          />
+        </wt-table-actions>
+      </div>
+    </header>
+
+    <wt-loader v-show="!isLoaded" />
+    <div
+      v-show="isLoaded"
+      class="table-wrapper"
+    >
+      <wt-table
+        :data="dataList"
+        :grid-actions="!disableUserInput"
+        :headers="headers"
+        sortable
+        @sort="sort"
+      >
+        <template #event="{ item }">
+          <!--          {{ $t(objects.ccenter.queues.hooks.eventTypes.${item.event}) }}-->
+        </template>
+        <template #schema="{ item }">
+          {{ item.schema.name }}
+        </template>
+        <template #state="{ item, index }">
+          <wt-switcher
+            :disabled="!hasEditAccess"
+            :value="item.enabled"
+            @change="patchItem({ item, index, prop: 'enabled', value: $event })"
+          />
+        </template>
+        <template #actions="{ item }">
+          <wt-icon-action
+            action="edit"
+            @click="edit(item)"
+          />
+          <wt-icon-action
+            action="delete"
+            class="table-action"
+            @click="deleteData(item)"
+          />
+        </template>
+      </wt-table>
+      <wt-pagination
+        :next="isNext"
+        :prev="page > 1"
+        :size="size"
+        debounce
+        @change="loadList"
+        @input="setSize"
+        @next="nextPage"
+        @prev="prevPage"
+      />
+    </div>
+  </section>
+</template>
+
+<script>
+import openedObjectTableTabMixin
+  from '../../../../../../../app/mixins/objectPagesMixins/openedObjectTableTabMixin/openedObjectTableTabMixin';
+import HookPopup from './opened-team-hooks-popup.vue';
+
+export default {
+  name: 'OpenedTeamHooks',
+  components: { HookPopup },
+  mixins: [openedObjectTableTabMixin],
+  data: () => ({
+    subNamespace: 'hooks',
+    isHookPopup: false,
+
+    isDeleteConfirmation: false,
+  }),
+
+  methods: {
+    openPopup() {
+      this.isHookPopup = true;
+    },
+    closePopup() {
+      this.isHookPopup = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js b/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
new file mode 100644
index 000000000..ef068b580
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
@@ -0,0 +1,10 @@
+export default Object.freeze({
+  JOINED: 'joined',
+  ANSWERED: 'answered',
+  OFFERING: 'offering',
+  BRIDGED: 'bridged',
+  MISSED: 'missed',
+  LEAVING: 'leaving',
+  PROCESSING: 'processing',
+  ACTIVE: 'active',
+});
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js b/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
new file mode 100644
index 000000000..72ce3f8aa
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
@@ -0,0 +1,23 @@
+import { SortSymbols } from '@webitel/ui-sdk/src/scripts/sortQueryAdapters';
+
+export default [
+  {
+    value: 'event',
+    locale: 'objects.ccenter.queues.hooks.event',
+    field: 'event',
+    sort: SortSymbols.NONE,
+  },
+  {
+    value: 'schema',
+    locale: ['objects.routing.flow.flow', 1],
+    field: 'schema',
+    sort: SortSymbols.NONE,
+  },
+  {
+    value: 'state',
+    locale: 'reusable.state',
+    field: 'enabled',
+    width: '100px',
+    sort: SortSymbols.NONE,
+  },
+];
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/store/team-hooks.js b/src/modules/contact-center/modules/teams/modules/hooks/store/team-hooks.js
new file mode 100644
index 000000000..d0f455a59
--- /dev/null
+++ b/src/modules/contact-center/modules/teams/modules/hooks/store/team-hooks.js
@@ -0,0 +1,20 @@
+import NestedObjectStoreModule
+  from '../../../../../../../app/store/BaseStoreModules/StoreModules/NestedObjectStoreModule';
+import TeamHooksAPI from '../api/teamHooks';
+import headers from './_internals/headers';
+
+const resettableItemState = {
+  itemInstance: {
+    event: '',
+    properties: [],
+    schema: {},
+    enabled: true,
+  },
+};
+
+const teamHooks = new NestedObjectStoreModule({ resettableItemState, headers })
+  .attachAPIModule(TeamHooksAPI)
+  .generateAPIActions()
+  .getModule();
+
+export default teamHooks;
diff --git a/src/modules/contact-center/modules/teams/store/teams.js b/src/modules/contact-center/modules/teams/store/teams.js
index 4135da601..59af9fc11 100644
--- a/src/modules/contact-center/modules/teams/store/teams.js
+++ b/src/modules/contact-center/modules/teams/store/teams.js
@@ -5,6 +5,7 @@ import PermissionsStoreModule
 import TeamsAPI from '../api/teams';
 import agents from '../modules/agents/store/team-agents';
 import supervisors from '../modules/supervisors/store/team-supervisors';
+import hooks from '../modules/hooks/store/team-hooks';
 import headers from './_internals/headers';
 
 const resettableState = {
@@ -38,7 +39,7 @@ const permissions = new PermissionsStoreModule()
 const teams = new ObjectStoreModule({ resettableState, headers })
 .attachAPIModule(TeamsAPI)
 .generateAPIActions()
-.setChildModules({ supervisors, agents, permissions })
+.setChildModules({ supervisors, agents, hooks, permissions })
 .getModule({ actions });
 
 export default teams;

From 34dbe3e898e3b3113203c00b8ac3afabef839918 Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Tue, 26 Mar 2024 15:15:36 +0200
Subject: [PATCH 2/8] feature: added tab hook in teams [WTEL-4246]

---
 .../modules/teams/components/opened-team.vue             | 3 +--
 .../modules/teams/modules/hooks/api/teamHooks.js         | 6 ++++--
 .../modules/hooks/components/opened-team-hooks-popup.vue | 6 +++---
 .../teams/modules/hooks/components/opened-team-hooks.vue | 6 +++---
 .../modules/teams/modules/hooks/enum/HookEvent.enum.js   | 9 +--------
 .../teams/modules/supervisors/api/teamSupervisors.js     | 3 ++-
 src/modules/contact-center/modules/teams/store/teams.js  | 3 ++-
 7 files changed, 16 insertions(+), 20 deletions(-)

diff --git a/src/modules/contact-center/modules/teams/components/opened-team.vue b/src/modules/contact-center/modules/teams/components/opened-team.vue
index 668b1654e..961f7b596 100644
--- a/src/modules/contact-center/modules/teams/components/opened-team.vue
+++ b/src/modules/contact-center/modules/teams/components/opened-team.vue
@@ -89,8 +89,7 @@ export default {
         }, {
           text: this.$tc('objects.ccenter.agents.agents', 2),
           value: 'agents',
-        },
-        {
+        }, {
           text: this.$tc('objects.ccenter.queues.hooks.hooks', 2),
           value: 'hooks',
         }
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
index 5e1f15a1a..f47a44c36 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
+++ b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
@@ -11,11 +11,11 @@ import applyTransform, {
   snakeToCamel,
   starToSearch,
 } from '@webitel/ui-sdk/src/api/transformers';
-import { TeamHookServiceApi } from 'webitel-sdk';
+import { TeamHookServiceApiFactory } from 'webitel-sdk';
 import instance from '../../../../../../../app/api/instance';
 import configuration from '../../../../../../../app/api/openAPIConfig';
 
-const teamHookService = new TeamHookServiceApi(configuration, '', instance);
+const teamHookService = new TeamHookServiceApiFactory(configuration, '', instance);
 
 const fieldsToSend = ['event', 'properties', 'schema', 'enabled'];
 
@@ -52,6 +52,7 @@ const getTeamHooksList = async (params) => {
       fields,
       id,
     );
+    console.log('getTeamHooksList');
     const { items, next } = applyTransform(response.data, [
       snakeToCamel(),
       merge(getDefaultGetListResponse()),
@@ -97,6 +98,7 @@ const addTeamHook = async ({ parentId, itemInstance }) => {
     camelToSnake(),
   ]);
   try {
+    console.log('addTeamHook item', item);
     const response = await teamHookService.createTeamHook(parentId, item);
     return applyTransform(response.data, [
       snakeToCamel(),
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index 79683888c..de855a92e 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -5,7 +5,7 @@
     @close="close"
   >
     <template #title>
-<!--      {{ $tc('objects.ccenter.queues.hooks.hooks', 1) }}-->
+      {{ $tc('objects.ccenter.queues.hooks.hooks', 1) }}
     </template>
     <template #main>
       <form>
@@ -74,7 +74,7 @@ export default {
   computed: {
     eventOptions() {
       return Object.values(HookEvent).map((event) => ({
-        // name: this.$t(`objects.ccenter.queues.hooks.eventTypes.${event}`),
+        name: event,
         value: event,
       }));
     },
@@ -82,7 +82,7 @@ export default {
       get() {
         const { event } = this.itemInstance;
         return event ? {
-          // name: this.$t(`objects.ccenter.queues.hooks.eventTypes.${event}`),
+          name: event,
           value: event,
         } : {};
       },
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
index d608b018d..d374d81b9 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
@@ -7,7 +7,7 @@
 
     <header class="content-header">
       <h3 class="content-title">
-        <!--        {{ $tc('objects.ccenter.queues.hooks.hooks', 2) }}-->
+                {{ $tc('objects.ccenter.queues.hooks.hooks', 2) }}
       </h3>
       <div class="content-header__actions-wrap">
         <wt-table-actions
@@ -24,7 +24,7 @@
             v-if="!disableUserInput"
             class="icon-action"
             icon="plus"
-            @click="openPopup"
+            @click="create"
           />
         </wt-table-actions>
       </div>
@@ -43,7 +43,7 @@
         @sort="sort"
       >
         <template #event="{ item }">
-          <!--          {{ $t(objects.ccenter.queues.hooks.eventTypes.${item.event}) }}-->
+          {{ item.event }}
         </template>
         <template #schema="{ item }">
           {{ item.schema.name }}
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js b/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
index ef068b580..3eb9a7101 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
+++ b/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
@@ -1,10 +1,3 @@
 export default Object.freeze({
-  JOINED: 'joined',
-  ANSWERED: 'answered',
-  OFFERING: 'offering',
-  BRIDGED: 'bridged',
-  MISSED: 'missed',
-  LEAVING: 'leaving',
-  PROCESSING: 'processing',
-  ACTIVE: 'active',
+  AGENT_STATUS: 'agent_status',
 });
diff --git a/src/modules/contact-center/modules/teams/modules/supervisors/api/teamSupervisors.js b/src/modules/contact-center/modules/teams/modules/supervisors/api/teamSupervisors.js
index 122df7312..d3b5b662e 100644
--- a/src/modules/contact-center/modules/teams/modules/supervisors/api/teamSupervisors.js
+++ b/src/modules/contact-center/modules/teams/modules/supervisors/api/teamSupervisors.js
@@ -1,4 +1,5 @@
-import { AgentServiceApiFactory } from 'webitel-sdk';import {
+import { AgentServiceApiFactory } from 'webitel-sdk';
+import {
   getDefaultGetListResponse,
   getDefaultGetParams,
 } from '@webitel/ui-sdk/src/api/defaults';
diff --git a/src/modules/contact-center/modules/teams/store/teams.js b/src/modules/contact-center/modules/teams/store/teams.js
index 59af9fc11..01a9c4916 100644
--- a/src/modules/contact-center/modules/teams/store/teams.js
+++ b/src/modules/contact-center/modules/teams/store/teams.js
@@ -28,6 +28,7 @@ const actions = {
     context.commit('RESET_ITEM_STATE');
     context.dispatch('ccenter/teams/supervisors/RESET_STATE', {}, { root: true });
     context.dispatch('ccenter/teams/agents/RESET_STATE', {}, { root: true });
+    context.dispatch('ccenter/teams/hooks/RESET_STATE', {}, { root: true });
   },
 };
 
@@ -39,7 +40,7 @@ const permissions = new PermissionsStoreModule()
 const teams = new ObjectStoreModule({ resettableState, headers })
 .attachAPIModule(TeamsAPI)
 .generateAPIActions()
-.setChildModules({ supervisors, agents, hooks, permissions })
+.setChildModules({ supervisors, agents, permissions, hooks })
 .getModule({ actions });
 
 export default teams;

From b51dead577e8b3308af2365af679cec9168777a6 Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Tue, 26 Mar 2024 15:34:01 +0200
Subject: [PATCH 3/8] feature: fixes after review [WTEL-4246]

---
 .../modules/teams/modules/hooks/api/teamHooks.js               | 2 --
 .../teams/modules/hooks/components/opened-team-hooks-popup.vue | 3 ++-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
index f47a44c36..79eba7875 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
+++ b/src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js
@@ -52,7 +52,6 @@ const getTeamHooksList = async (params) => {
       fields,
       id,
     );
-    console.log('getTeamHooksList');
     const { items, next } = applyTransform(response.data, [
       snakeToCamel(),
       merge(getDefaultGetListResponse()),
@@ -98,7 +97,6 @@ const addTeamHook = async ({ parentId, itemInstance }) => {
     camelToSnake(),
   ]);
   try {
-    console.log('addTeamHook item', item);
     const response = await teamHookService.createTeamHook(parentId, item);
     return applyTransform(response.data, [
       snakeToCamel(),
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index de855a92e..1e709ce90 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -10,13 +10,14 @@
     <template #main>
       <form>
         <wt-select
-          v-model="event"
+          :value="event"
           :clearable="false"
           :label="$t('objects.ccenter.queues.hooks.event')"
           :options="eventOptions"
           :v="v$.itemInstance.event"
           required
           track-by="value"
+          @input="setItemProp({ prop: 'event', value: $event.value })"
         />
         <wt-select
           :clearable="false"

From f9206e038e3735883f65f5c217fd3b50f34b6264 Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Wed, 27 Mar 2024 15:23:35 +0200
Subject: [PATCH 4/8] feature: fixes after review [WTEL-4246]

---
 src/app/locale/en/en.js                                |  5 +++++
 src/app/locale/ru/ru.js                                |  5 +++++
 src/app/locale/ua/ua.js                                |  5 +++++
 .../queues/modules/hooks/store/_internals/headers.js   |  1 -
 .../hooks/components/opened-team-hooks-popup.vue       | 10 ++++++----
 .../modules/hooks/components/opened-team-hooks.vue     |  4 +---
 .../teams/modules/hooks/store/_internals/headers.js    |  1 -
 webitel-ui-sdk/src/scripts/caseConverters.js           |  0
 8 files changed, 22 insertions(+), 9 deletions(-)
 create mode 100644 webitel-ui-sdk/src/scripts/caseConverters.js

diff --git a/src/app/locale/en/en.js b/src/app/locale/en/en.js
index 42d2c27f2..6df642a6c 100644
--- a/src/app/locale/en/en.js
+++ b/src/app/locale/en/en.js
@@ -703,6 +703,11 @@ export default {
           longestIdleAgent: 'Agent with longest idle time',
           skillCapacity: 'By skill level',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Agent status changed',
+          }
+        },
       },
 
       members: {
diff --git a/src/app/locale/ru/ru.js b/src/app/locale/ru/ru.js
index 6695dcb35..a018bdeb0 100644
--- a/src/app/locale/ru/ru.js
+++ b/src/app/locale/ru/ru.js
@@ -701,6 +701,11 @@ export default {
           longestIdleAgent: 'Агент с наибольшим временем простоя',
           skillCapacity: 'По уровню навыка',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Изменение статуса оператора',
+          }
+        },
       },
 
       members: {
diff --git a/src/app/locale/ua/ua.js b/src/app/locale/ua/ua.js
index a34801a87..13f39255e 100644
--- a/src/app/locale/ua/ua.js
+++ b/src/app/locale/ua/ua.js
@@ -703,6 +703,11 @@ export default {
           longestIdleAgent: 'Оператор з найбільшим часом простою',
           skillCapacity: 'По рівню навички',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Зміна статуту оператора',
+          }
+        },
       },
 
       members: {
diff --git a/src/modules/contact-center/modules/queues/modules/hooks/store/_internals/headers.js b/src/modules/contact-center/modules/queues/modules/hooks/store/_internals/headers.js
index 72ce3f8aa..41988077b 100644
--- a/src/modules/contact-center/modules/queues/modules/hooks/store/_internals/headers.js
+++ b/src/modules/contact-center/modules/queues/modules/hooks/store/_internals/headers.js
@@ -17,7 +17,6 @@ export default [
     value: 'state',
     locale: 'reusable.state',
     field: 'enabled',
-    width: '100px',
     sort: SortSymbols.NONE,
   },
 ];
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index 1e709ce90..90940a150 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -49,6 +49,7 @@
 
 <script>
 import { EngineRoutingSchemaType } from 'webitel-sdk';
+import { snakeToCamel } from '@webitel/ui-sdk/src/scripts/caseConverters';
 import { useVuelidate } from '@vuelidate/core';
 import { required } from '@vuelidate/validators';
 import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
@@ -75,7 +76,7 @@ export default {
   computed: {
     eventOptions() {
       return Object.values(HookEvent).map((event) => ({
-        name: event,
+        name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
         value: event,
       }));
     },
@@ -83,12 +84,12 @@ export default {
       get() {
         const { event } = this.itemInstance;
         return event ? {
-          name: event,
+          name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
           value: event,
         } : {};
       },
-      set(value) {
-        this.setItemProp({ prop: 'event', value: value.value });
+      set({ value }) {
+        this.setItemProp({ prop: 'event', value: value });
       },
     },
   },
@@ -97,6 +98,7 @@ export default {
     loadFlowOptions(params) {
       return FlowsAPI.getLookup({ ...params, type: [EngineRoutingSchemaType.Service] });
     },
+    snakeToCamel,
   },
 };
 </script>
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
index d374d81b9..f7dd739b2 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks.vue
@@ -7,7 +7,7 @@
 
     <header class="content-header">
       <h3 class="content-title">
-                {{ $tc('objects.ccenter.queues.hooks.hooks', 2) }}
+        {{ $tc('objects.ccenter.queues.hooks.hooks', 2) }}
       </h3>
       <div class="content-header__actions-wrap">
         <wt-table-actions
@@ -93,8 +93,6 @@ export default {
   data: () => ({
     subNamespace: 'hooks',
     isHookPopup: false,
-
-    isDeleteConfirmation: false,
   }),
 
   methods: {
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js b/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
index 72ce3f8aa..41988077b 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
+++ b/src/modules/contact-center/modules/teams/modules/hooks/store/_internals/headers.js
@@ -17,7 +17,6 @@ export default [
     value: 'state',
     locale: 'reusable.state',
     field: 'enabled',
-    width: '100px',
     sort: SortSymbols.NONE,
   },
 ];
diff --git a/webitel-ui-sdk/src/scripts/caseConverters.js b/webitel-ui-sdk/src/scripts/caseConverters.js
new file mode 100644
index 000000000..e69de29bb

From b10d1e8d8a2d18fd262f81307db66b2fa186debc Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Wed, 27 Mar 2024 15:30:17 +0200
Subject: [PATCH 5/8] feature: fixes after review [WTEL-4246]

---
 .../modules/hooks/components/opened-queue-hooks-popup.vue       | 2 +-
 .../queues/modules/hooks/components/opened-queue-hooks.vue      | 2 --
 .../hooks/enum/{HookEvent.enum.js => HookQueueEvent.enum.js}    | 0
 .../teams/modules/hooks/components/opened-team-hooks-popup.vue  | 2 +-
 .../hooks/enum/{HookEvent.enum.js => HookTeamEvent.enum.js}     | 0
 5 files changed, 2 insertions(+), 4 deletions(-)
 rename src/modules/contact-center/modules/queues/modules/hooks/enum/{HookEvent.enum.js => HookQueueEvent.enum.js} (100%)
 rename src/modules/contact-center/modules/teams/modules/hooks/enum/{HookEvent.enum.js => HookTeamEvent.enum.js} (100%)

diff --git a/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks-popup.vue b/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks-popup.vue
index 6f263e9cf..1ead94daf 100644
--- a/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks-popup.vue
+++ b/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks-popup.vue
@@ -52,7 +52,7 @@ import { useVuelidate } from '@vuelidate/core';
 import { required } from '@vuelidate/validators';
 import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
 import FlowsAPI from '../../../../../../routing/modules/flow/api/flow';
-import HookEvent from '../enum/HookEvent.enum';
+import HookEvent from '../enum/HookQueueEvent.enum';
 
 export default {
   name: 'OpenedQueueHooksPopup',
diff --git a/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks.vue b/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks.vue
index 2620162b7..d419d6690 100644
--- a/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks.vue
+++ b/src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks.vue
@@ -93,8 +93,6 @@ export default {
   data: () => ({
     subNamespace: 'hooks',
     isHookPopup: false,
-
-    isDeleteConfirmation: false,
   }),
 
   methods: {
diff --git a/src/modules/contact-center/modules/queues/modules/hooks/enum/HookEvent.enum.js b/src/modules/contact-center/modules/queues/modules/hooks/enum/HookQueueEvent.enum.js
similarity index 100%
rename from src/modules/contact-center/modules/queues/modules/hooks/enum/HookEvent.enum.js
rename to src/modules/contact-center/modules/queues/modules/hooks/enum/HookQueueEvent.enum.js
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index 90940a150..5f1d6776e 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -54,7 +54,7 @@ import { useVuelidate } from '@vuelidate/core';
 import { required } from '@vuelidate/validators';
 import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
 import FlowsAPI from '../../../../../../routing/modules/flow/api/flow';
-import HookEvent from '../enum/HookEvent.enum';
+import HookEvent from '../enum/HookTeamEvent.enum';
 
 export default {
   name: 'OpenedQueueHooksPopup',
diff --git a/src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js b/src/modules/contact-center/modules/teams/modules/hooks/enum/HookTeamEvent.enum.js
similarity index 100%
rename from src/modules/contact-center/modules/teams/modules/hooks/enum/HookEvent.enum.js
rename to src/modules/contact-center/modules/teams/modules/hooks/enum/HookTeamEvent.enum.js

From 9a5a1dba5e63230ca76980cfa69c46fc4340a7fb Mon Sep 17 00:00:00 2001
From: liza-pohranichna <114492973+liza-pohranichna@users.noreply.github.com>
Date: Wed, 27 Mar 2024 15:35:37 +0200
Subject: [PATCH 6/8] Delete webitel-ui-sdk/src/scripts/caseConverters.js

mistakenly created file
---
 webitel-ui-sdk/src/scripts/caseConverters.js | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 webitel-ui-sdk/src/scripts/caseConverters.js

diff --git a/webitel-ui-sdk/src/scripts/caseConverters.js b/webitel-ui-sdk/src/scripts/caseConverters.js
deleted file mode 100644
index e69de29bb..000000000

From 59279be494235e6512506c410a48c734c52e34a3 Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Wed, 27 Mar 2024 16:04:56 +0200
Subject: [PATCH 7/8] feature: fixes after review [WTEL-4246]

---
 .../teams/modules/hooks/components/opened-team-hooks-popup.vue  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index 5f1d6776e..871050901 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -89,7 +89,7 @@ export default {
         } : {};
       },
       set({ value }) {
-        this.setItemProp({ prop: 'event', value: value });
+        this.setItemProp({ prop: 'event', value });
       },
     },
   },

From ea6dd12a65b96d955bf1ae80865f55d29b21d0f9 Mon Sep 17 00:00:00 2001
From: lizacoma <my.skin00@gmail.com>
Date: Wed, 27 Mar 2024 17:16:39 +0200
Subject: [PATCH 8/8] feature: fixes after review [WTEL-4246]

---
 .../components/opened-team-hooks-popup.vue    | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
index 871050901..5957fbb06 100644
--- a/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
+++ b/src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue
@@ -80,18 +80,13 @@ export default {
         value: event,
       }));
     },
-    event: {
-      get() {
-        const { event } = this.itemInstance;
-        return event ? {
-          name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
-          value: event,
-        } : {};
-      },
-      set({ value }) {
-        this.setItemProp({ prop: 'event', value });
-      },
-    },
+    event() {
+      const { event } = this.itemInstance;
+      return event ? {
+        name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
+        value: event,
+      } : {};
+    }
   },
 
   methods: {