move sync state to services/

plugin-hrm-form/src/HrmFormPlugin.tsx

@@ -31,7 +31,7 @@ import * as Channels from './channels/setUpChannels';
 import setUpMonitoring from './utils/setUpMonitoring';
 import { changeLanguage } from './states/configuration/actions';
 import { getAseloFeatureFlags, getHrmConfig, initializeConfig, subscribeToConfigUpdates } from './hrmConfig';
-import { setUpSyncClient } from './utils/sharedState';
+import { setUpSyncClient } from './services/SyncService';
 import { FeatureFlags } from './types/types';
 import { setUpReferrableResources } from './components/resources/setUpReferrableResources';
 import QueuesView from './components/queuesView';

plugin-hrm-form/src/components/Conference/ConferenceActions/ConferencePanel.tsx

@@ -19,7 +19,7 @@ import { Manager, Notifications, TaskContextProps, TaskHelper, Template, withTas
 import AddIcCallRounded from '@material-ui/icons/AddIcCallRounded';
 import { useDispatch, useSelector } from 'react-redux';
 
-import { createCallStatusSyncDocument } from '../../../utils/sharedState';
+import { createCallStatusSyncDocument } from '../../../services/SyncService';
 import { ConferenceNotifications } from '../../../conference/setUpConferenceActions';
 import PhoneInputDialog from './PhoneInputDialog';
 import { ConferenceButtonWrapper, ConferenceButton } from './styles';

plugin-hrm-form/src/components/queuesView/QueueSelectionModals.tsx

@@ -31,25 +31,15 @@ type SelectQueueModalProps = {
   isOpen: boolean;
   onClose: () => void;
   onSelect: (queue: string) => void;
-  selectedQueue: string | null;
-  setSelectedQueue: (queue: string) => void;
-  queueRef: React.MutableRefObject<string | null>;
   queues: Queue[];
 };
 
-export const SelectQueueModal: React.FC<SelectQueueModalProps> = ({
-  isOpen,
-  onClose,
-  onSelect,
-  selectedQueue,
-  setSelectedQueue,
-  queueRef,
-  queues,
-}) => {
+export const SelectQueueModal: React.FC<SelectQueueModalProps> = ({ isOpen, onClose, onSelect, queues }) => {
   // Define custom radio button handler
+  const [selectedQueue, setSelectedQueue] = React.useState<string | null>(null);
+
   const handleRadioChange = (value: string) => {
     setSelectedQueue(value);
-    queueRef.current = value;
   };
 
   return (
@@ -180,7 +170,7 @@ export const SelectQueueModal: React.FC<SelectQueueModalProps> = ({
           </TertiaryButton>
           <StyledNextStepButton
             onClick={() => {
-              const currentQueue = selectedQueue || queueRef.current;
+              const currentQueue = selectedQueue;
               if (currentQueue) {
                 onSelect(currentQueue);
               } else {

plugin-hrm-form/src/components/queuesView/SwitchboardTile.tsx

@@ -40,7 +40,7 @@ export const setUpSwitchboard = () => {
 };
 
 const SwitchboardTile = () => {
-  const [selectedQueue, setSelectedQueue] = useState<string | null>(null);
+  // const [selectedQueue, setSelectedQueue] = useState<string | null>(null);
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [isConfirmationDialogOpen, setIsConfirmationDialogOpen] = useState(false);
 
@@ -55,12 +55,11 @@ const SwitchboardTile = () => {
   useSubscribeToSwitchboardState();
 
   useEffect(() => {
-    selectedQueueRef.current = selectedQueue;
-  }, [selectedQueue]);
+    selectedQueueRef.current = switchboardState.queueName;
+  }, [switchboardState]);
 
   const handleOpenModal = () => {
     setIsModalOpen(true);
-    setSelectedQueue(null);
     selectedQueueRef.current = null;
   };
 
@@ -78,15 +77,15 @@ const SwitchboardTile = () => {
 
   const toggleSwitchboardingForQueue = useToggleSwitchboardingForQueue();
 
-  const handleSwitchboarding = async (queue: string) => {
-    if (!queue) {
+  const handleSwitchboarding = async (queueSid: string) => {
+    if (!queueSid) {
       return;
     }
 
     try {
-      await toggleSwitchboardingForQueue(queue, workerSid);
+      await toggleSwitchboardingForQueue({ queueSid, supervisorWorkerSid: workerSid });
       setIsModalOpen(false);
-      setSelectedQueue(queue);
+      selectedQueueRef.current = queueSid;
     } catch (error) {
       console.error('Error in switchboarding:', error);
     }
@@ -96,7 +95,7 @@ const SwitchboardTile = () => {
     if (switchboardState?.isSwitchboardingActive) {
       // If already switchboarding, open confirmation modal to turn it off
       if (switchboardState.queueSid) {
-        setSelectedQueue(switchboardState.queueSid);
+        selectedQueueRef.current = switchboardState.queueSid;
         handleOpenConfirmationDialog();
       }
     } else {
@@ -142,10 +141,9 @@ const SwitchboardTile = () => {
   );
 
   const handleConfirmTurnOff = () => {
-    if (selectedQueue) {
-      handleSwitchboarding(selectedQueue);
+    if (!switchboardState.isSwitchboardingActive) {
+      handleSwitchboarding(switchboardState.queueName);
       handleCloseConfirmationDialog();
-    } else {
     }
   };
   const borderColor = switchboardState?.isSwitchboardingActive ? '#f8c000' : '#e1e3ea';
@@ -230,17 +228,14 @@ const SwitchboardTile = () => {
         isOpen={isModalOpen}
         onClose={handleCloseModal}
         onSelect={handleSwitchboarding}
-        selectedQueue={selectedQueue}
-        setSelectedQueue={setSelectedQueue}
-        queueRef={selectedQueueRef}
         queues={filteredQueues}
       />
 
       <TurnOffSwitchboardDialog
         isOpen={isConfirmationDialogOpen}
         onClose={handleCloseConfirmationDialog}
         onConfirm={handleConfirmTurnOff}
-        selectedQueue={selectedQueue}
+        selectedQueue={selectedQueueRef.current}
         renderStatusText={(queueKey, startTime) =>
           renderSwitchboardStatusText(
             getQueueName(queueKey),

plugin-hrm-form/src/dualWrite/index.ts

@@ -16,7 +16,7 @@
 
 import { ITask } from '@twilio/flex-ui';
 
-import { savePendingContactToSharedState } from '../utils/sharedState';
+import { savePendingContactToSharedState } from '../services/SyncService';
 import saveContactToSaferNet from './br';
 import { getAseloFeatureFlags, getHrmConfig } from '../hrmConfig';
 

plugin-hrm-form/src/services/SwitchboardService.ts

@@ -15,8 +15,9 @@
  */
 
 import { Manager } from '@twilio/flex-ui';
+import { SwitchboardSyncState } from 'hrm-types';
 
-import { getSwitchboardState, SwitchboardSyncState } from '../states/switchboard/useSwitchboard';
+import { getSwitchboardState } from '../states/switchboard/useSwitchboard';
 import fetchProtectedApi from './fetchProtectedApi';
 
 /**
@@ -36,21 +37,13 @@
       throw new Error('Invalid queue SID or supervisor worker SID provided');
     }
 
-    const manager = Manager.getInstance();
-    const flexToken = manager.user.token;
-
-    if (!flexToken) {
-      throw new Error('Authentication token not available. Please refresh the page and try again.');
-    }
-
     const currentState = await getSwitchboardState();
     const isDisabling = currentState.isSwitchboardingActive && currentState.queueSid === queueSid;
     const operation = isDisabling ? 'disable' : 'enable';
 
     const body = {
       originalQueueSid: queueSid,
       operation,
-      Token: flexToken,
       supervisorWorkerSid,
     };
 

plugin-hrm-form/src/utils/sharedState.ts → plugin-hrm-form/src/services/SyncService.ts

@@ -15,14 +15,15 @@
  */
 
 import SyncClient from 'twilio-sync';
+import { DEFAULT_SWITCHBOARD_STATE, SWITCHBOARD_DOCUMENT_NAME, SwitchboardSyncState } from 'hrm-types';
 
-import { issueSyncToken } from '../services/ServerlessService';
+import { issueSyncToken } from './ServerlessService';
 import { getAseloFeatureFlags, getTemplateStrings } from '../hrmConfig';
 
 // eslint-disable-next-line import/no-mutable-exports
 let sharedSyncClient: SyncClient;
 
 export { sharedSyncClient };
 
 export const setUpSyncClient = async () => {
   const updateSharedStateToken = async () => {
@@ -139,3 +140,44 @@
 
   return { status: 'success', callStatusSyncDocument } as const;
 };
+
+/**
+ * Get the current switchboard state
+ * @returns Current switchboarding state
+ */
+export const getSwitchboardState = async (): Promise<SwitchboardSyncState> => {
+  try {
+    const doc = await sharedSyncClient.document(SWITCHBOARD_DOCUMENT_NAME);
+    return doc.data as SwitchboardSyncState;
+  } catch (error) {
+    console.error('Error getting switchboard state:', error);
+    throw error;
+  }
+};
+
+/**
+ * Subscribe to switchboarding state changes
+ * @param callback Function to call when switchboarding state changes: (state: SwitchboardSyncState) => void
+ * @returns Function to unsubscribe from updates: () => void
+ */
+export const subscribeSwitchboardState = async (
+  callback: (state: SwitchboardSyncState) => void,
+): Promise<() => void> => {
+  try {
+    const doc = await getSwitchboardState();
+
+    const handler = (event: { data: unknown }) => {
+      callback(event.data as SwitchboardSyncState);
+    };
+
+    doc.on('updated', handler);
+    callback(doc.data as SwitchboardSyncState);
+
+    return () => {
+      doc.off('updated', handler);
+    };
+  } catch (error) {
+    console.error('Error subscribing to switchboard state:', error);
+    throw error;
+  }
+};

plugin-hrm-form/src/states/contacts/llmAssistant.ts

@@ -95,7 +95,7 @@ export const llmAssistantReducer = (initialState: ContactsState) =>
       (state, { payload: { contactId, summaryText, form, item } }): ContactsState => {
         const { draftContact, savedContact } = state.existingContacts[contactId];
         const llmSupportedEntries =
-          draftContact?.rawJson?.llmSupportedEntries ?? (savedContact.rawJson as any).llmSupportedEntries ?? {};
+          draftContact?.rawJson?.llmSupportedEntries ?? savedContact.rawJson.llmSupportedEntries ?? {};
         llmSupportedEntries[form] = Array.from(new Set([...(llmSupportedEntries[form] ?? []), item]));
         const existingText = draftContact?.rawJson[form]?.[item] ?? savedContact.rawJson[form]?.[item] ?? '';
         const updatedText = `${existingText}${existingText ? '\n\n' : ''}${summaryText}`;

plugin-hrm-form/src/states/switchboard/useSwitchboard.ts

@@ -16,73 +16,14 @@
 
 import { useDispatch, useSelector } from 'react-redux';
 import { useEffect, useCallback } from 'react';
+import { SwitchboardSyncState, SWITCHBOARD_DOCUMENT_NAME, DEFAULT_SWITCHBOARD_STATE } from 'hrm-types';
 
 import { updateSwitchboardState, setSwitchboardLoading, setSwitchboardError } from './actions';
 import { toggleSwitchboardingForQueue } from '../../services/SwitchboardService';
 import { RootState } from '..';
 import { SwitchboardState } from './types';
 import { namespace, switchboardBase } from '../storeNamespaces';
-import { sharedSyncClient } from '../../utils/sharedState';
-import { 
-  SwitchboardSyncState, 
-  SWITCHBOARD_DOCUMENT_NAME, 
-  DEFAULT_SWITCHBOARD_STATE 
-} from '@tech-matters/hrm-types';
-
-/**
- * Initialize or get the switchboard document from Twilio Sync
- * @returns Twilio Sync document
- */
-const initSwitchboardSyncDocument = () => {
-  try {
-    return sharedSyncClient.document(SWITCHBOARD_DOCUMENT_NAME);
-  } catch (error) {
-    return sharedSyncClient.document({
-      id: SWITCHBOARD_DOCUMENT_NAME,
-      data: DEFAULT_SWITCHBOARD_STATE,
-      ttl: 48 * 60 * 60, // 48 hours
-    });
-  }
-};
-
-/**
- * Get the current switchboard state
- * @returns Current switchboarding state
- */
-export const getSwitchboardState = async (): Promise<SwitchboardSyncState> => {
-  try {
-    const doc = await initSwitchboardSyncDocument();
-    return doc.data as SwitchboardSyncState;
-  } catch (error) {
-    console.error('Error getting switchboard state:', error);
-    throw error;
-  }
-};
-
-/**
- * Subscribe to switchboarding state changes
- * @param callback Function to call when switchboarding state changes: (state: SwitchboardSyncState) => void
- * @returns Function to unsubscribe from updates: () => void
- */
-const subscribeSwitchboardState = async (callback: (state: SwitchboardSyncState) => void): Promise<() => void> => {
-  try {
-    const doc = await initSwitchboardSyncDocument();
-
-    const handler = (event: { data: unknown }) => {
-      callback(event.data as SwitchboardSyncState);
-    };
-
-    doc.on('updated', handler);
-    callback(doc.data as SwitchboardSyncState);
-
-    return () => {
-      doc.off('updated', handler);
-    };
-  } catch (error) {
-    console.error('Error subscribing to switchboard state:', error);
-    throw error;
-  }
-};
+import { subscribeSwitchboardState } from '../../services/SyncService';
 
 export const useSwitchboardState = (): SwitchboardState => {
   return useSelector((state: RootState) => state[namespace][switchboardBase]);
@@ -137,14 +78,17 @@ export const useSubscribeToSwitchboardState = (): void => {
  * Hook that provides a function to toggle switchboarding for a queue
  * @returns Function to toggle switchboarding for a queue
  */
-export const useToggleSwitchboardingForQueue = (): ((
-  queueSid: string,
-  supervisorWorkerSid?: string,
-) => Promise<void>) => {
+export const useToggleSwitchboardingForQueue = (): (({
+  queueSid,
+  supervisorWorkerSid,
+}: {
+  queueSid: string;
+  supervisorWorkerSid?: string;
+}) => Promise<void>) => {
   const dispatch = useDispatch();
 
   return useCallback(
-    async (queueSid: string, supervisorWorkerSid?: string): Promise<void> => {
+    async ({ queueSid, supervisorWorkerSid }: { queueSid: string; supervisorWorkerSid?: string }): Promise<void> => {
       try {
         dispatch(setSwitchboardLoading(true));
         dispatch(setSwitchboardError(null));