@webitel/ui-sdk 26.4.17 → 26.4.19

package/src/composables/useRepresentableAgentPauseCause/__tests__/useRepresentableAgentPauseCause.spec.js

@@ -2,137 +2,117 @@ import { useRepresentableAgentPauseCause } from '../useRepresentableAgentPauseCa
 
 describe('useRepresentableAgentPauseCause', () => {
 	it('correctly computes duration', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 10,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 10,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].duration).toBe('00:10');
 	});
 	it('isOverflow with limit = 0 returns false', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 10,
-					limitMin: 0,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 10,
+				limitMin: 0,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].isOverflow).toBe(false);
 	});
 	it('isOverflow with duration < limit returns false', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 10,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 10,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].isOverflow).toBe(false);
 	});
 	it('isOverflow with duration > limit returns true', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 14,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 14,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].isOverflow).toBe(true);
 	});
 
 	it('isOverflow with duration = limit returns false', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 12,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 12,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].isOverflow).toBe(false);
 	});
 
 	it('correctly computes progressColor', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 10,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 10,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].progressColor).toBe('primary');
 	});
 
 	it('correctly computes progressColor with duration > limit', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 14,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 14,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].progressColor).toBe('error');
 	});
 
 	it('correctly computes progressColor with duration < limit', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 3,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 3,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].progressColor).toBe('success');
 	});
 
 	it('correctly computes progressColor with duration = limit', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 12,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 12,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].progressColor).toBe('primary');
 	});
 
 	it('correctly computes limit', () => {
-		const pauseCauses = {
-			value: [
-				{
-					durationMin: 12,
-					limitMin: 12,
-				},
-			],
-		};
+		const pauseCauses = [
+			{
+				durationMin: 12,
+				limitMin: 12,
+			},
+		];
 		const { representablePauseCause } =
 			useRepresentableAgentPauseCause(pauseCauses);
 		expect(representablePauseCause.value[0].limit).toBe('00:12');

package/src/composables/useRepresentableAgentPauseCause/useRepresentableAgentPauseCause.js

@@ -12,7 +12,7 @@ const isDurationOverflow = ({ durationMin, limitMin }) => {
 	return durationMin > limitMin && limitMin !== 0;
 };
 
-const duration = ({ durationMin, limitMin }) => {
+const duration = ({ durationMin /* limitMin */ }) => {
 	return prettifyPauseCauseDuration(durationMin);
 };
 

package/src/composables/useTableColumnDrag/useTableColumnDrag.ts

@@ -52,7 +52,7 @@ export const useTableColumnDrag = (table, reorderableColumns) => {
 		copyEl.style.position = 'absolute';
 		copyEl.style.top = '-9999px';
 		copyEl.style.background = 'var(--p-datatable-header-cell-drag-background)';
-		copyEl.style.width = event.target.offsetWidth + 'px';
+		copyEl.style.width = `${event.target.offsetWidth}px`;
 		document.body.appendChild(copyEl);
 		event.dataTransfer.setDragImage(copyEl, event.offsetX, event.offsetY);
 		// Clean up after drag starts

package/src/enums/index.ts

@@ -1,7 +1,6 @@
 import AbstractUserStatus from './AbstractUserStatus/AbstractUserStatus.enum.js';
 import AgentStatus from './AgentStatus/AgentStatus.enum.js';
 import { ButtonColor } from './ButtonColor/ButtonColor';
-import { ButtonSize } from './ButtonSize/ButtonSize';
 import { ButtonVariant } from './ButtonVariant/ButtonVariant';
 import ChatGatewayProvider from './ChatGatewayProvider/ChatGatewayProvider.enum.js';
 import ProviderIconType from './ChatGatewayProvider/ProviderIconType.enum';

package/src/install.ts

@@ -13,7 +13,7 @@ import initPrimevue from './plugins/primevue/primevue.plugin';
 export { fillIconsRepository };
 
 export default {
-	install(app, { eventBus, router, globals = {} }) {
+	install(app, { eventBus, globals = {} }) {
 		Object.keys(Directives).forEach((name) => {
 			app.directive(name, Directives[name]);
 		});

package/src/locale/kz/kz.js

@@ -321,11 +321,9 @@ export default {
 						': ' +
 						linked('objects.case'),
 					[CrmSectionsNew.ContactsExtensions]: ({ linked }) =>
-						linked('objects.customization.customization') +
-						': ' +
-						linked('objects.contact'),
+						`${linked('objects.customization.customization')}: ${linked('objects.contact')}`,
 					[CrmSectionsNew.CustomLookups]: ({ linked }) =>
-						linked('objects.customization.customization') + ': Жекелендірулер', // dont use linked: objects.customLookup.customLookup, coz "linked" doesnt support pluralization
+						`${linked('objects.customization.customization')}: Жекелендірулер`, // dont use linked: objects.customLookup.customLookup, coz "linked" doesnt support pluralization
 				},
 			},
 		},

package/src/locale/pl/pl.js

@@ -321,11 +321,9 @@ export default {
 						': ' +
 						linked('objects.case'),
 					[CrmSectionsNew.ContactsExtensions]: ({ linked }) =>
-						linked('objects.customization.customization') +
-						': ' +
-						linked('objects.contact'),
+						`${linked('objects.customization.customization')}: ${linked('objects.contact')}`,
 					[CrmSectionsNew.CustomLookups]: ({ linked }) =>
-						linked('objects.customization.customization') + ': Dostosowania', // dont use linked: objects.customLookup.customLookup, coz "linked" doesnt support pluralization
+						`${linked('objects.customization.customization')}: Dostosowania`, // dont use linked: objects.customLookup.customLookup, coz "linked" doesnt support pluralization
 				},
 			},
 		},

package/src/mixins/dataFilterMixins/__tests__/sortFilterMixin.spec.js

@@ -69,7 +69,7 @@ describe('Sort filter mixin', () => {
 				sort: '+queue',
 			},
 		});
-		const wrapper = shallowMount(Component, {
+		shallowMount(Component, {
 			global: {
 				plugins: [
 					router,

package/src/modules/AgentPdfs/components/agent-pdfs-tab.vue

@@ -1,99 +1,105 @@
 <template>
-  <section class="table-wrapper table-page table-wrapper--tab-table">
-    <slot
-      name="header"
-      :selected="selected"
-      :load-data-list="loadDataList"
-      :ask-delete-confirmation="askDeleteConfirmation"
-      :handle-delete="handleDelete"
-    />
-
-    <delete-confirmation-popup
-      :shown="isDeleteConfirmationPopup"
-      :callback="deleteCallback"
-      :delete-count="deleteCount"
-      @close="closeDelete"
-    />
-
-    <wt-loader v-show="isLoading" />
-
-    <wt-empty
-      v-show="showEmpty"
-      :image="imageEmpty"
-      :headline="textEmpty"
-    />
-
-    <div v-if="dataList?.length" class="table-section__table-wrapper">
-      <wt-table
-        v-if="dataList?.length"
-        :data="dataList"
-        :headers="shownHeaders"
-        :selected="selected"
-        sortable
-        @sort="updateSort"
-        @update:selected="updateSelected"
-      >
-        <template #preview="{ item }">
-          <pdf-status-preview
-            :status="item.status"
-            :clickable="item.status === WebitelMediaExporterExportStatus.Done"
-            @click="openPdfInNewWindow(item.fileId)"
-          />
-        </template>
-
-        <template #name="{ item }">
-          {{ item.name }}
-        </template>
-
-        <template #status="{ item }">
-          <pdf-status :status="item.status" />
-        </template>
-
-        <template #valid_until="{ item }">
-          {{ prettifyTimestamp(item.validUntil) }}
-        </template>
-
-        <template #created_at="{ item }">
-          {{ prettifyTimestamp(item.createdAt) }}
-        </template>
-
-        <template #created_by="{ item }">
-          {{ item.createdBy }}
-        </template>
-
-        <template #actions="{ item }">
-          <wt-icon-action
-            action="download"
-            :disabled="isDownloadDisabled(item)"
-            @click="downloadPdf(item.fileId)"
-          />
-          <wt-icon-action
-            action="delete"
-            :disabled="isDeleteDisabled(item) || !hasDeleteAccess"
-            @click="
-              askDeleteConfirmation({
-                deleted: [item],
-                callback: () => handleDelete([item]),
-              })
-            "
-          />
-        </template>
-      </wt-table>
-
-      <wt-pagination
-        :next="next"
-        :prev="page > 1"
-        :size="size"
-        debounce
-        @change="updateSize"
-        @next="updatePage(page + 1)"
-        @prev="updatePage(page - 1)"
-      />
-    </div>
-  </section>
+	<section class="table-wrapper table-page table-wrapper--tab-table">
+		<slot
+			name="header"
+			:selected="selected"
+			:load-data-list="loadDataList"
+			:ask-delete-confirmation="askDeleteConfirmation"
+			:handle-delete="handleDelete"
+		/>
+
+		<delete-confirmation-popup
+			:shown="isDeleteConfirmationPopup"
+			:callback="deleteCallback"
+			:delete-count="deleteCount"
+			@close="closeDelete"
+		/>
+
+		<wt-loader v-show="isLoading" />
+
+		<wt-empty
+			v-show="showEmpty"
+			:image="imageEmpty"
+			:headline="textEmpty"
+		/>
+
+		<div
+			v-if="dataList?.length"
+			class="table-section__table-wrapper"
+		>
+			<wt-table
+				v-if="dataList?.length"
+				:data="dataList"
+				:headers="shownHeaders"
+				:selected="selected"
+				sortable
+				@sort="updateSort"
+				@update:selected="updateSelected"
+			>
+				<template #preview="{ item }">
+					<pdf-status-preview
+						:status="item.status"
+						:clickable="item.status === WebitelMediaExporterExportStatus.Done"
+						@click="openPdfInNewWindow(item.fileId)"
+					/>
+				</template>
+
+				<template #name="{ item }">
+					{{ item.name }}
+				</template>
+
+				<template #status="{ item }">
+					<pdf-status :status="item.status" />
+				</template>
+
+				<template #valid_until="{ item }">
+					{{ prettifyTimestamp(item.validUntil) }}
+				</template>
+
+				<template #created_at="{ item }">
+					{{ prettifyTimestamp(item.createdAt) }}
+				</template>
+
+				<template #created_by="{ item }">
+					{{ item.createdBy }}
+				</template>
+
+				<template #actions="{ item }">
+					<wt-icon-action
+						action="download"
+						:disabled="isDownloadDisabled(item)"
+						@click="downloadPdf(item.fileId)"
+					/>
+					<wt-icon-action
+						action="delete"
+						:disabled="isDeleteDisabled(item) || !hasDeleteAccess"
+						@click="
+							askDeleteConfirmation({
+								deleted: [item],
+								callback: () => handleDelete([item]),
+							})
+							"
+					/>
+				</template>
+			</wt-table>
+
+			<wt-pagination
+				:next="next"
+				:prev="page > 1"
+				:size="size"
+				debounce
+				@change="updateSize"
+				@next="updatePage(page + 1)"
+				@prev="updatePage(page - 1)"
+			/>
+		</div>
+	</section>
 </template>
 
-<script lang="ts" setup>
+<script
+	lang="ts"
+	setup
+>
 import {
 	downloadFile,
 	FileServicesAPI,
@@ -120,7 +126,7 @@ import PdfStatus from './pdf-status.vue';
 import PdfStatusPreview from './pdf-status-preview.vue';
 
 const props = defineProps<{
-	store?: any;
+	store?: unknown;
 	entityIdKey?: string;
 	entityIdValue?: string | number;
 	isCreatedAtFilter: boolean;
@@ -275,5 +281,7 @@ const openPdfInNewWindow = (fileId: string) => {
 };
 </script>
 
-<style lang="scss" scoped></style>
-
+<style
+	lang="scss"
+	scoped
+></style>

package/src/modules/AgentStatusSelect/api/agent-status.js

@@ -9,19 +9,15 @@ const AgentStatusAPIFactory = ({ instance, OpenAPIConfig }) => {
 		pauseCause,
 		statusComment,
 	}) => {
-		try {
-			const res = await service.updateAgentStatus(agentId, {
-				status,
-				id: agentId,
-				payload: pauseCause,
-				status_comment: statusComment,
-			});
-			return {
-				success: !!res,
-			};
-		} catch (err) {
-			throw err;
-		}
+		const res = await service.updateAgentStatus(agentId, {
+			status,
+			id: agentId,
+			payload: pauseCause,
+			status_comment: statusComment,
+		});
+		return {
+			success: !!res,
+		};
 	};
 
 	return {

package/src/modules/AgentStatusSelect/components/__tests__/wt-cc-agent-status-select.spec.js

@@ -54,53 +54,8 @@ describe('Wt Cc Agent Status Select', () => {
 		const wrapper = shallowMount(WtCcAgentStatusSelect, mountOptions);
 		expect(wrapper.exists()).toBe(true);
 	});
-	it(`at wt-status-select "change" to "online" event, triggers agent status patch
-   with "online" status`, () => {
-		const wrapper = shallowMount(WtCcAgentStatusSelect, mountOptions);
-		wrapper
-			.findComponent({
-				name: 'wt-status-select',
-			})
-			.vm.$emit('change', AgentStatus.ONLINE);
-		const reqPayload = {
-			status: AgentStatus.ONLINE,
-			agentId: agent.agentId,
-			payload: undefined,
-		};
-		expect(agentStatusMock).toHaveBeenCalledWith(reqPayload);
-	});
-	it('at wt-status-select "change" to "pause" event, pause causes are loaded', async () => {
-		const wrapper = shallowMount(WtCcAgentStatusSelect, mountOptions);
-		wrapper
-			.findComponent({
-				name: 'wt-status-select',
-			})
-			.vm.$emit('change', AgentStatus.PAUSE);
-		await wrapper.vm.$nextTick();
-		expect(getAgentPauseCausesMock).toHaveBeenCalled();
-	});
-	it(`at wt-status-select "change" to "pause" event and pause causes truthy response,
-   pause-cause-popup appears`, async () => {
-		const wrapper = mount(WtCcAgentStatusSelect, mountOptions);
-		wrapper
-			.findComponent({
-				name: 'wt-status-select',
-			})
-			.vm.$emit('change', AgentStatus.PAUSE);
-		await wrapper.vm.$nextTick(); // load pause causes
-		await wrapper.vm.$nextTick();
-		await wrapper.vm.$nextTick(); // render popup
-		expect(
-			wrapper
-				.findComponent({
-					name: 'pause-cause-popup',
-				})
-				.isVisible(),
-		).toBe(true);
-	});
 	it(`at pause-cause-popup "change" event, triggers patch agent status
    with "pause" status and passed pauseCause`, async () => {
-		const pauseCause = 'jest';
 		const wrapper = mount(WtCcAgentStatusSelect, mountOptions);
 		wrapper.vm.openPauseCausePopup();
 		await wrapper.vm.$nextTick();
@@ -109,11 +64,15 @@ describe('Wt Cc Agent Status Select', () => {
 			.findComponent({
 				name: 'pause-cause-popup',
 			})
-			.vm.$emit('change', pauseCause);
+			.vm.$emit('change', {
+				pauseCause: 'coffee',
+				statusComment: 'brb',
+			});
 		const reqPayload = {
 			status: AgentStatus.PAUSE,
 			agentId: agent.agentId,
-			pauseCause,
+			pauseCause: 'coffee',
+			statusComment: 'brb',
 		};
 		expect(agentStatusMock).toHaveBeenCalledWith(reqPayload);
 	});

package/src/modules/AgentStatusSelect/components/__tests__/wt-cc-pause-cause-popup.spec.js

@@ -13,7 +13,8 @@ describe('Pause cause popup', () => {
 			props: {
 				options: [
 					{
-						value,
+						id: 1,
+						name: value,
 					},
 				],
 			},
@@ -22,7 +23,34 @@ describe('Pause cause popup', () => {
 			.findComponent({
 				name: 'wt-radio',
 			})
-			.vm.$emit('input');
-		expect(wrapper.vm.selected.value).toEqual(value);
+			.vm.$emit('update:selected');
+		expect(wrapper.vm.selected.name).toEqual(value);
+	});
+
+	it('emits payload and close on setPause', async () => {
+		const wrapper = mount(WtCcPauseCausePopup, {
+			props: {
+				options: [
+					{
+						id: 1,
+						name: 'coffee',
+					},
+				],
+			},
+		});
+
+		wrapper.vm.select({
+			id: 1,
+			name: 'coffee',
+			statusComment: 'brb',
+		});
+		wrapper.vm.setPause();
+		await wrapper.vm.$nextTick();
+
+		expect(wrapper.emitted().change[0][0]).toEqual({
+			pauseCause: 'coffee',
+			statusComment: 'brb',
+		});
+		expect(wrapper.emitted().close).toBeTruthy();
 	});
 });