fix(prebuilt): 🐛 instance is created and destroyed on meeting leave

packages/react-native-room-kit/src/HMSContainer.tsx

@@ -1,14 +1,30 @@
-import React from 'react';
-import { useSelector } from 'react-redux';
+import * as React from 'react';
+import { useDispatch, useSelector } from 'react-redux';
 
 import type { RootState } from './redux';
 import { HMSInstanceSetup } from './HMSInstanceSetup';
 import { HMSRoomSetup } from './HMSRoomSetup';
+import { MeetingState } from './types';
+import { clearStore } from './redux/actions';
 
 export const HMSContainer = () => {
+  const dispatch = useDispatch();
   const isHMSInstanceAvailable = useSelector(
     (state: RootState) => !!state.user.hmsInstance
   );
+  const outOfMeeting = useSelector(
+    (state: RootState) =>
+      state.app.meetingState === MeetingState.OUT_FROM_MEETING
+  );
+  const canCleanupAfter = isHMSInstanceAvailable && outOfMeeting;
+
+  React.useEffect(() => {
+    if (canCleanupAfter) {
+      return () => {
+        dispatch(clearStore());
+      };
+    }
+  }, [canCleanupAfter]);
 
   if (isHMSInstanceAvailable) {
     return <HMSRoomSetup />;

packages/react-native-room-kit/src/HMSRoomSetup.tsx

@@ -400,7 +400,7 @@ export const HMSRoomSetup = () => {
   useEffect(() => {
     return () => {
       ignoreHLSStreamPromise.current = true;
-      prebuiltCleanUp();
+      // prebuiltCleanUp();
     };
   }, []);
 

packages/react-native-room-kit/src/hooks-util.ts

@@ -2149,18 +2149,17 @@ export const useLeaveMethods = () => {
         const onLeave = reduxStore.getState().user.onLeave;
 
         if (typeof onLeave === 'function') {
+          dispatch(changeMeetingState(MeetingState.OUT_FROM_MEETING));
           onLeave(reason);
-          dispatch(clearStore());
         } else if (
           navigation &&
           typeof navigation.canGoBack === 'function' &&
           navigation.canGoBack()
         ) {
+          dispatch(changeMeetingState(MeetingState.OUT_FROM_MEETING));
           navigation.goBack();
-          dispatch(clearStore());
         } else {
           // Otherwise default action is to show "Meeting Ended" screen
-          dispatch(clearStore()); // TODO: We need different clearStore for MeetingEnded
           dispatch(changeMeetingState(MeetingState.MEETING_ENDED));
         }
       } catch (e) {

packages/react-native-room-kit/src/types.ts

@@ -5,6 +5,7 @@ export enum MeetingState {
   NOT_JOINED,
   IN_PREVIEW,
   IN_MEETING,
+  OUT_FROM_MEETING,
   MEETING_ENDED,
   ERROR,
 }