Getting Error when joining the meetin

I am using @zoom/meetingsdk/embedded Component view
When i click on the join button it showing error and when i click second time its allowing me to join the meeting

This is the error message

chunk-YUEN4NC3.js?v=94aaa529:521 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot
    at Meeting (http://localhost:3001/src/pages/student/liveClass/meeting/index.tsx?t=1707199403301:26:20)
Uncaught (in promise) TypeError: l10 is not a function
    at @zoom_meetingsdk_embedded.js?v=94aaa529:44587:94
    at d2 (@zoom_meetingsdk_embedded.js?v=94aaa529:91:50)
    at Generator.<anonymous> (@zoom_meetingsdk_embedded.js?v=94aaa529:174:28)
    at Generator.next (@zoom_meetingsdk_embedded.js?v=94aaa529:114:31)
    at O (@zoom_meetingsdk_embedded.js?v=94aaa529:334:30)
    at a2 (@zoom_meetingsdk_embedded.js?v=94aaa529:346:19)
    at @zoom_meetingsdk_embedded.js?v=94aaa529:351:17
    at new Promise (<anonymous>)
    at e10.<anonymous> (@zoom_meetingsdk_embedded.js?v=94aaa529:343:22)
    at e10.join (@zoom_meetingsdk_embedded.js?v=94aaa529:44595:30)
js_media.min.js:1 VP9?: true AMD?: false AMDdecodecheck: true isenbaleHD:true enable720p?: true capacityfor720: false

This is the complete code in React+ts

 useEffect(() => {
    const client = ZoomMtgEmbedded.createClient();

    if (signatureFetched && signature) {
      const meetingSDKElement = document.getElementById("meetingSDKElement");

      if (meetingSDKElement) {
        client.init({ zoomAppRoot: meetingSDKElement, language: "en-US" });
        client.join({
          sdkKey: sdkKey,
          signature: signature,
          meetingNumber: meetingNumber,
          password: password,
          userName: userName,
        });
      }
    }
  }, [signature, signatureFetched]);

  return (
    <div style={{ border: "2px solid red", width: "100vw", height: "90vh" }}>
      <div id="meetingSDKElement"></div>
      <Button onClick={getSignature}>Join Meeting</Button>
    </div>
  );

I am using
“react”: “^18.2.0”,
@zoom/meetingsdk”: “^3.1.4”,

Hi @qwerty1234 , is this with the sample app?

I am integrating the zoomsdk component view, same as the documentation provided.

Hi @qwerty1234 , are you using this sample app? GitHub - zoom/meetingsdk-react-sample: Use the Zoom Meeting SDK in React

I am not using that sample app, i wrote the same logic of code that is in that sample app in my application.

Hi @qwerty1234 , please see if you can reproduce with the sample app. Testing issues in the sample app helps decipher if it’s an issue with the release version itself or something in your application.