UI Kit not working after switching between Tabs

Video SDK UI ToolKit
1

I have 2 tabs in my application 1st tab calling the UI kit. Once I move to next tab and come back to the Video call page it is not loading. First time it is working next time it is not working .

var sessionContainer
var authEndpoint = ‘’
var role = 1
useEffect(() => {
var config = {
videoSDKJWT: “eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJhcHBfa2V5IjoiTVZZSnEtZlNTX3Vpak50VDFqTmtJdyIsInJvbGVfdHlwZSI6MSwidHBjIjoicXpBQ255dFF3UlRIRXRSd1BSMGoxNzIyMDg3ODQxMzk4IiwiZ2VvX3JlZ2lvbnMiOiJVUyxBVSxDQSxJTixDTixCUixNWCxISyxTRyxKUCxERSxOTCIsInNlc3Npb25fa2V5IjoiQ29uc3VsdGF0aW9uIiwiZXhwIjoxNzIyMDkzMjQxLCJ2ZXJzaW9uIjoxLCJpYXQiOjE3MjIwODc4NDF9.Bm8_Cdbv5coiF8ZCO5-LF7CFtO8fibfaNHunp6EkmtE”,
sessionName: “qzACnytQwRTHEtRwPR0j1722087841398”,
userName: ‘React’,
sessionPasscode: ‘’,
features: [‘video’, ‘audio’, ‘settings’, ‘users’, ‘chat’, ‘share’]
};
sessionContainer = document.getElementById(‘sessionContainer’)
uitoolkit.joinSession(sessionContainer, config)
uitoolkit.onSessionClosed(sessionClosed)
//joinSession()
});
var sessionClosed = (() => {
console.log(‘session closed’)
uitoolkit.closeSession(sessionContainer)
document.getElementById(‘join-flow’).style.display = ‘block’
})
var sessionJoined = (() => {
console.info(‘session joined’)
})
return (




Zoom Video SDK Sample React


User interface offered by the Video SDK UI Toolkit


Join Session




);
This the code snippet

2

Can you share more details: Are you seeing any errors? Do you have any message in the console?

Is it possible when you’re changing tabs your component is being re-rendered causing the useEffect to trigger again? I see in your code snippet the useEffect does not have a dependency array, can you try adding an empty array as the second arguement:

useEffect(() => {
// your code
}, [])