From 777f0880425f98a4b9b30e83334c6956d83c4eca Mon Sep 17 00:00:00 2001
From: davidliu <davidliu@deviange.net>
Date: Sat, 13 May 2023 00:57:49 +0900
Subject: [PATCH] chore: add simulation scenarios to example

---
 example/src/RoomControls.tsx                  |  48 +++++++--
 example/src/RoomPage.tsx                      |   3 +
 example/src/icons/outline_dots_white_24dp.png | Bin 0 -> 240 bytes
 example/src/{ => ui}/AudioOutputList.tsx      |   0
 example/src/ui/SimulateScenarioList.tsx       | 101 ++++++++++++++++++
 yarn.lock                                     |  25 ++---
 6 files changed, 153 insertions(+), 24 deletions(-)
 create mode 100644 example/src/icons/outline_dots_white_24dp.png
 rename example/src/{ => ui}/AudioOutputList.tsx (100%)
 create mode 100644 example/src/ui/SimulateScenarioList.tsx

diff --git a/example/src/RoomControls.tsx b/example/src/RoomControls.tsx
index 9ce1a60..a6699c3 100644
--- a/example/src/RoomControls.tsx
+++ b/example/src/RoomControls.tsx
@@ -11,7 +11,9 @@ import {
   StyleProp,
   Modal,
 } from 'react-native';
-import { AudioOutputList } from './AudioOutputList';
+import { AudioOutputList } from './ui/AudioOutputList';
+import type { SimulationScenario } from 'livekit-client';
+import { SimulateScenarioList } from './ui/SimulateScenarioList';
 
 export type Props = {
   micEnabled?: boolean;
@@ -22,6 +24,7 @@ export type Props = {
   screenShareEnabled: boolean;
   setScreenShareEnabled: (enabled: boolean) => void;
   sendData: (message: string) => void;
+  onSimulate: (scenario: SimulationScenario) => void;
   onDisconnectClick: () => void;
   style?: StyleProp<ViewStyle>;
 };
@@ -34,10 +37,12 @@ export const RoomControls = ({
   screenShareEnabled = false,
   setScreenShareEnabled,
   sendData,
+  onSimulate,
   onDisconnectClick,
   style,
 }: Props) => {
-  const [modalVisible, setModalVisible] = useState(false);
+  const [audioModalVisible, setAudioModalVisible] = useState(false);
+  const [simulateModalVisible, setSimulateModalVisible] = useState(false);
   var micImage = micEnabled
     ? require('./icons/baseline_mic_white_24dp.png')
     : require('./icons/baseline_mic_off_white_24dp.png');
@@ -64,16 +69,36 @@ export const RoomControls = ({
       <Modal
         animationType="slide"
         transparent={true}
-        visible={modalVisible}
+        visible={audioModalVisible}
         onRequestClose={() => {
-          setModalVisible(!modalVisible);
+          setAudioModalVisible(!audioModalVisible);
         }}
       >
         <View style={styles.centeredView}>
           <View style={styles.modalView}>
             <AudioOutputList
               onSelect={() => {
-                return setModalVisible(false);
+                return setAudioModalVisible(false);
+              }}
+            />
+          </View>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="slide"
+        transparent={true}
+        visible={simulateModalVisible}
+        onRequestClose={() => {
+          setSimulateModalVisible(!simulateModalVisible);
+        }}
+      >
+        <View style={styles.centeredView}>
+          <View style={styles.modalView}>
+            <SimulateScenarioList
+              onSelect={(simulate) => {
+                onSimulate(simulate);
+                return setSimulateModalVisible(false);
               }}
             />
           </View>
@@ -134,12 +159,23 @@ export const RoomControls = ({
 
       <Pressable
         onPress={() => {
-          setModalVisible(true);
+          setAudioModalVisible(true);
         }}
       >
         <Image style={styles.icon} source={require('./icons/speaker.png')} />
       </Pressable>
 
+      <Pressable
+        onPress={() => {
+          setSimulateModalVisible(true);
+        }}
+      >
+        <Image
+          style={styles.icon}
+          source={require('./icons/outline_dots_white_24dp.png')}
+        />
+      </Pressable>
+
       <Dialog.Container
         visible={messageDialogVisible}
         onBackdropPress={handleCancel}
diff --git a/example/src/RoomPage.tsx b/example/src/RoomPage.tsx
index 86fe44e..2a0ea96 100644
--- a/example/src/RoomPage.tsx
+++ b/example/src/RoomPage.tsx
@@ -206,6 +206,9 @@ export const RoomPage = ({
             DataPacket_Kind.RELIABLE
           );
         }}
+        onSimulate={(scenario) => {
+          room.simulateScenario(scenario);
+        }}
         onDisconnectClick={() => {
           navigation.pop();
         }}
diff --git a/example/src/icons/outline_dots_white_24dp.png b/example/src/icons/outline_dots_white_24dp.png
new file mode 100644
index 0000000000000000000000000000000000000000..d1213f84ac3aa23c554739b161c2093ca27a5d74
GIT binary patch
literal 240
zcmV<M01y9(P)<h;3K|Lk000e1NJLTq000;O000;W1ONa4N`Cco0002DNkl<ZILp1$
zF%E)25Czc9CUkNTJ%%@+pyCEva1ObK+=#}&EwrL~mZ+e~V)R$DyEB>pXa9uoXULS!
zdN(({vr_gcy)byipjb|hPM}lU+Su5tb>Jk<3mS|L&rhO*5zU+oqy1v<y^$wkG6Rlp
zwH+}$$XB9U;5iZNP)-*u>W|~D(N4z;cA`ophA@xpaG46O$W@>UVIIkG{h}b5QnKje
qv8H}pvNcwiZ-u>+7iiUr{sedMWoLZBFlCSc0000<MNUMnLSTY94QQMI

literal 0
HcmV?d00001

diff --git a/example/src/AudioOutputList.tsx b/example/src/ui/AudioOutputList.tsx
similarity index 100%
rename from example/src/AudioOutputList.tsx
rename to example/src/ui/AudioOutputList.tsx
diff --git a/example/src/ui/SimulateScenarioList.tsx b/example/src/ui/SimulateScenarioList.tsx
new file mode 100644
index 0000000..4dcd1c9
--- /dev/null
+++ b/example/src/ui/SimulateScenarioList.tsx
@@ -0,0 +1,101 @@
+import type { SimulationScenario } from 'livekit-client';
+import React from 'react';
+import {
+  FlatList,
+  ListRenderItem,
+  Pressable,
+  StyleSheet,
+  Text,
+  View,
+} from 'react-native';
+
+export type Props = {
+  onSelect: (scenario: SimulationScenario) => void;
+};
+export const SimulateScenarioList = ({ onSelect }: Props) => {
+  let scenarios: SimulationScenario[] = [
+    'signal-reconnect',
+    'speaker',
+    'node-failure',
+    'server-leave',
+    'migration',
+    'resume-reconnect',
+    'force-tcp',
+    'force-tls',
+    'full-reconnect',
+  ];
+
+  let render: ListRenderItem<SimulationScenario> = ({ item }) => {
+    return (
+      <Pressable
+        onPress={() => {
+          onSelect(item);
+        }}
+      >
+        <View style={styles.spacer} />
+        <Text style={styles.itemTextStyle}>{item}</Text>
+        <View style={styles.spacer} />
+      </Pressable>
+    );
+  };
+  return (
+    <View>
+      <Text style={styles.titleTextStyle}>{'Select Simulation'}</Text>
+      <View style={styles.spacer} />
+      <FlatList
+        data={scenarios}
+        renderItem={render}
+        keyExtractor={(item) => item}
+      />
+    </View>
+  );
+};
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-evenly',
+    marginVertical: 8,
+  },
+  icon: {
+    width: 32,
+    height: 32,
+  },
+  spacer: {
+    paddingTop: 10,
+  },
+  centeredView: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginTop: 22,
+  },
+  modalView: {
+    margin: 20,
+    backgroundColor: 'black',
+    borderRadius: 20,
+    padding: 35,
+    alignItems: 'center',
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 4,
+    elevation: 5,
+  },
+  titleTextStyle: {
+    color: 'white',
+    fontWeight: 'bold',
+    textAlign: 'center',
+    fontSize: 24,
+  },
+  itemTextStyle: {
+    color: 'white',
+    fontWeight: 'bold',
+    textAlign: 'center',
+    fontSize: 20,
+  },
+});
diff --git a/yarn.lock b/yarn.lock
index b3b71b0..880dc23 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2983,11 +2983,6 @@ astral-regex@^1.0.0:
   resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9"
   integrity sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg==
 
-async-await-queue@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/async-await-queue/-/async-await-queue-1.2.1.tgz#baf459f5fbac902b060a88fee4da853fd86f2128"
-  integrity sha512-v2j+/EMzAnuJZ8I4570KJMFhi6G9g3WZyFh6cPnmQSJh3nLao77XpRt01kyFegQazPSKvue1yaIYDp/NfV/b0g==
-
 async-limiter@~1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd"
@@ -3398,15 +3393,10 @@ camelcase@^6.0.0, camelcase@^6.2.0:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a"
   integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==
 
-caniuse-lite@^1.0.30001312:
-  version "1.0.30001312"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz#e11eba4b87e24d22697dae05455d5aea28550d5f"
-  integrity sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==
-
-caniuse-lite@^1.0.30001332:
-  version "1.0.30001346"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001346.tgz#e895551b46b9cc9cc9de852facd42f04839a8fbe"
-  integrity sha512-q6ibZUO2t88QCIPayP/euuDREq+aMAxFE5S70PkrLh0iTDj/zEhgvJRKC2+CvXY6EWc6oQwUR48lL5vCW6jiXQ==
+caniuse-lite@^1.0.30001312, caniuse-lite@^1.0.30001332:
+  version "1.0.30001486"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001486.tgz"
+  integrity sha512-uv7/gXuHi10Whlj0pp5q/tsK/32J2QSqVRKQhs2j8VsDCjgyruAh/eEXHF822VqO9yT6iZKw3nRwZRSPBE9OQg==
 
 chalk@4.1.2, chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.1, chalk@^4.1.2:
   version "4.1.2"
@@ -6873,11 +6863,10 @@ lines-and-columns@^1.1.6:
   integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
 
 livekit-client@^1.8.0:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/livekit-client/-/livekit-client-1.9.1.tgz#1cf06190b594d64128738763c9b94c1fee4ba426"
-  integrity sha512-zuQEAlXb6Ka8yx5SpgsvtyfoazJhsC3iqGVRF5rFT+aUmdna6P4UaqdhRkWRH0R5odT5+ysUg+Crh6ejQagxIg==
+  version "1.9.4"
+  resolved "https://registry.yarnpkg.com/livekit-client/-/livekit-client-1.9.4.tgz#1da512d9daa9249af71cfd93a9dec510e5ad0627"
+  integrity sha512-QaIEbkVKQl9/+fWCWzNgZ7jA7f5PoqvQQErwQborkqHQZX8O9v5u6DXbnHXtJkQmdvgE+83Og8Ct9sBeMN9zuQ==
   dependencies:
-    async-await-queue "^1.2.1"
     events "^3.3.0"
     loglevel "^1.8.0"
     protobufjs "^7.0.0"