onMuteToggle fails on page refresh

[joingram-priceline]

We are using the following code and onMuteToggle fails when the page is refreshed. onEnqueuedNextState works fine after a page refresh. We can see in the console log that mute events are still being received from amazon connect after the page refresh but code in onMuteToggle is not triggering.

if (connect) { try { connect.agent((agent) => { agent.onStateChange(() => { ... }) agent.onMuteToggle((agentMutedStatus) => {...}) agent.onEnqueuedNextState(() => {...}) }) } catch (err) {} }

[andywang219]

Hi,

Could you provide more details on the steps you did to reproduce the issue? Also, which Streams version are you using for testing and could you share where you've placed your logic to subscribe to onMuteToggle()?

I did a quick test with the following code:

if (connect) {
   connect.agent((agent) => {
        agent.onMuteToggle((data) => {
               console.log('muteToggle triggered');
         });
    });
}

and everything was working as expected. The console.log() inside of onMuteToggle() was being triggered even after refreshing the page.

[joingram-priceline]

Hi,

Sure, here are the steps:

1. Make an outbound or inbound call from the app
2. Connect to the call
3. Use mute toggle from app
4. Observe console.log inside of agent.onMuteToggle() works normally
5. Refresh the page
6. Use mute toggle from app
7. Observe console.log inside of agent.onMuteToggle() no longer triggers, but the event is still shown in the console: [AgentMuteToggle] Received MUTE event, nextMuteState: true

We are using amazon-connect-streams version 2.18.0

As for code, we have the same as your example. I will share a bit more context for it though.

const MyComponent = (): React.ReactElement => {
  	const initializeCallPanel = useCallback(async () => {
	    await initCcpInstance()

	    connect?.core.onInitialized(() => {
	      console.log('Connect Initialized')
	      setIsInitialized(true)
	      startAgentListeners()
	    })
	  }, [setIsInitialized])

	  useEffect(() => {
	    if (user && !isInitialized) {
	      initializeCallPanel()
	    }
	  }, [user, isInitialized, initializeCallPanel])

	  [...]

	  return Component
}

export const startAgentListeners = (): void => {
  if (connect) {
    try {
      connect.agent((agent) => {
        agent.onStateChange(() => {...})

        agent.onMuteToggle((agentMutedStatus) => {
          console.log('foobar', agentMutedStatus)
        })

        agent.onEnqueuedNextState(() => {...})
      })
    } catch (err) {...}
  }
}

[andywang219]

I see. One thing to note is that if you refresh the page while on a call, that call will be broken.

If you refresh prior to being on a call, does the onMuteToggle() work? <- This was the scenario that I tested.

[joingram-priceline]

Yes onMuteToggle() works prior to the call. Is there a way onMuteToggle() work for my scenario of being on a call when the page is refreshed? The built-in Amazon Connect CCP app has this scenario covered