From 453c3f8b6f5bf3e710b40b9abdbb5e39ee61235f Mon Sep 17 00:00:00 2001 From: Ludo Vlieger Date: Wed, 18 Oct 2023 15:17:22 -0400 Subject: [PATCH] Add more options --- flex-config/ui_attributes.common.json | 2 + .../feature-library/worker-details/config.ts | 8 ++ .../AttributeBoolean.tsx | 35 ------ .../WorkerDetailsContainer.tsx | 112 +++++++++++++----- .../types/ServiceConfiguration.ts | 2 + 5 files changed, 95 insertions(+), 64 deletions(-) delete mode 100644 plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/AttributeBoolean.tsx diff --git a/flex-config/ui_attributes.common.json b/flex-config/ui_attributes.common.json index 8c6a694dd..5ac2f9d47 100644 --- a/flex-config/ui_attributes.common.json +++ b/flex-config/ui_attributes.common.json @@ -362,6 +362,8 @@ "edit_location": true, "edit_manager": false, "edit_schedule": true, + "edit_auto_accept": true, + "edit_auto_wrapup": true, "edit_unit_leader": true, "edit_coach": true }, diff --git a/plugin-flex-ts-template-v2/src/feature-library/worker-details/config.ts b/plugin-flex-ts-template-v2/src/feature-library/worker-details/config.ts index cb73174a9..a039fc800 100644 --- a/plugin-flex-ts-template-v2/src/feature-library/worker-details/config.ts +++ b/plugin-flex-ts-template-v2/src/feature-library/worker-details/config.ts @@ -8,6 +8,8 @@ const { edit_location = true, edit_manager = false, edit_schedule = true, + edit_auto_accept = true, + edit_auto_wrapup = true, edit_unit_leader = true, edit_coach = true, } = (getFeatureFlags()?.features?.worker_details as WorkerDetailsConfig) || {}; @@ -32,6 +34,12 @@ export const editManager = () => { export const editSchedule = () => { return edit_schedule; }; +export const editAutoAccept = () => { + return edit_auto_accept; +}; +export const editAutoWrapup = () => { + return edit_auto_wrapup; +}; export const editUnitLeader = () => { return edit_unit_leader; }; diff --git a/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/AttributeBoolean.tsx b/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/AttributeBoolean.tsx deleted file mode 100644 index c296c5647..000000000 --- a/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/AttributeBoolean.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { Label } from '@twilio-paste/core/label'; -import { Tr, Td } from '@twilio-paste/core/table'; -import { Switch } from '@twilio-paste/core/switch'; - -interface OwnProps { - id: string; - label: string; - description: string; - value: boolean; - enabled: boolean; - onChangeHandler: (value: boolean) => void; -} - -const AttributeBoolean = (props: OwnProps) => { - const { id, label, description, value, enabled, onChangeHandler } = props; - const handleChange = (e: React.ChangeEvent) => { - const value = e.target.checked; - onChangeHandler(value); - }; - - return ( - - - - - - - {label} - - - - ); -}; - -export default AttributeBoolean; diff --git a/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/WorkerDetailsContainer.tsx b/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/WorkerDetailsContainer.tsx index c1abdf16c..76f2ecb7f 100644 --- a/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/WorkerDetailsContainer.tsx +++ b/plugin-flex-ts-template-v2/src/feature-library/worker-details/custom-components/WorkerDetailsContainer/WorkerDetailsContainer.tsx @@ -1,10 +1,13 @@ import { IWorker, Template, templates } from '@twilio/flex-ui'; import React, { useState, useEffect } from 'react'; +import { Flex as FlexBox } from '@twilio-paste/core/flex'; +import { Box } from '@twilio-paste/core/box'; import { Button } from '@twilio-paste/core/button'; import { Label } from '@twilio-paste/core/label'; -import { Flex } from '@twilio-paste/core/flex'; import { Stack } from '@twilio-paste/core/stack'; import { Table, TBody, Tr, Td } from '@twilio-paste/core/table'; +import { Switch, SwitchGroup } from '@twilio-paste/core/switch'; +import { Text } from '@twilio-paste/core/text'; import TaskRouterService from '../../../../utils/serverless/TaskRouter/TaskRouterService'; import { @@ -17,11 +20,12 @@ import { editUnitLeader, editCoach, editSchedule, + editAutoAccept, + editAutoWrapup, } from '../../config'; import AttributeText from './AttributeText'; import AttributeSelect from './AttributeSelect'; import AttributeDisplay from './AttributeDisplay'; -import AttributeBoolean from './AttributeBoolean'; const shiftOptions = ['Early', 'Regular', 'Late', 'Night']; @@ -38,6 +42,8 @@ const WorkerDetailsContainer = ({ worker }: OwnProps) => { const [unitLeader, setUnitLeader] = useState(false); const [coach, setCoach] = useState(false); const [schedule, setSchedule] = useState(''); + const [autoAccept, setAutoAccept] = useState(false); + const [autoWrapup, setAutoWrapup] = useState(false); useEffect(() => { if (worker) { @@ -48,6 +54,8 @@ const WorkerDetailsContainer = ({ worker }: OwnProps) => { setUnitLeader(worker.attributes.unit_leader || false); setCoach(worker.attributes.coach || false); setSchedule(worker.attributes.schedule || ''); + setAutoAccept(worker.attributes.auto_accept || false); + setAutoWrapup(worker.attributes.auto_Wrapup || false); } }, [worker]); @@ -76,15 +84,6 @@ const WorkerDetailsContainer = ({ worker }: OwnProps) => { setSchedule(value); }; - const handleUnitLeaderChange = (value: boolean) => { - setChanged(true); - setUnitLeader(value); - }; - - const handleCoachChange = (value: boolean) => { - setChanged(true); - setCoach(value); - }; // See the notes in our Flex insights docs // https://www.twilio.com/docs/flex/developer/insights/enhance-integration // The team_id attribute is required to display team_name. @@ -107,6 +106,8 @@ const WorkerDetailsContainer = ({ worker }: OwnProps) => { unit_leader: unitLeader, coach, schedule, + auto_accept: autoAccept, + auto_wrapup: autoWrapup, }; await TaskRouterService.updateWorkerAttributes(workerSid, JSON.stringify(updatedAttr)); setChanged(false); @@ -168,31 +169,84 @@ const WorkerDetailsContainer = ({ worker }: OwnProps) => { ) : ( )} - - - +
+ + + + Agent Automation + + } + > + { + setAutoAccept(!autoAccept); + setChanged(true); + }} + > + Auto Accept + + { + setAutoWrapup(!autoWrapup); + setChanged(true); + }} + > + Auto Accept + + + + + + Agent permissions + + } + > + { + setUnitLeader(!unitLeader); + setChanged(true); + }} + > + Unit Leader + + { + setCoach(!coach); + setChanged(true); + }} + > + Coach + + + + +