Bumping to use the latest version of @pipecat-ai/react-native-daily-transport, and removing code not needed.

examples/simple-chatbot/client/react-native/app.json

@@ -2,6 +2,7 @@
   "expo": {
     "name": "RN Simple Chatbot",
     "slug": "simple-chatbot-demo",
+    "newArchEnabled": false,
     "version": "1.0.0",
     "orientation": "portrait",
     "icon": "./assets/images/pipecat.png",

examples/simple-chatbot/client/react-native/package.json

@@ -11,7 +11,7 @@
   "dependencies": {
     "@config-plugins/react-native-webrtc": "^10.0.0",
     "@daily-co/config-plugin-rn-daily-js": "0.0.7",
-    "@daily-co/react-native-daily-js": "^0.73.0",
+    "@daily-co/react-native-daily-js": "^0.76.0",
     "@daily-co/react-native-webrtc": "^118.0.3-daily.2",
     "@react-native-async-storage/async-storage": "1.24.0",
     "@react-navigation/native": "^7.0.14",
@@ -26,7 +26,7 @@
     "react-native-background-timer": "^2.4.1",
     "react-native-gesture-handler": "^2.25.0",
     "react-native-get-random-values": "^1.11.0",
-    "@pipecat-ai/react-native-daily-transport": "^0.3.2",
+    "@pipecat-ai/react-native-daily-transport": "^0.3.5",
     "react-native-safe-area-context": "^5.4.0",
     "react-native-screens": "^4.10.0",
     "react-native-toast-message": "^2.3.0"

examples/simple-chatbot/client/react-native/src/components/CameraButtonView.tsx

@@ -1,113 +0,0 @@
-import { View, Image, StyleSheet, LayoutChangeEvent, ImageStyle, ViewStyle } from 'react-native';
-
-import React, { useMemo, useState } from 'react';
-
-import { Icons } from '../theme/Assets';
-import Colors from '../theme/Colors';
-
-import { useVoiceClient } from '../context/VoiceClientContext';
-import { VoiceClientVideoView } from '@pipecat-ai/react-native-daily-transport';
-
-interface CameraButtonViewProps {
-  style?: ViewStyle; // Optional additional styles for the button container
-}
-
-const CameraButtonView: React.FC<CameraButtonViewProps> = ({ style }) => {
-  const { videoTrack, isCamEnabled } = useVoiceClient();
-  const [dimensions, setDimensions] = useState({ width: 0, height: 0 });
-
-  const onLayout = (event: LayoutChangeEvent) => {
-    const { width, height } = event.nativeEvent.layout;
-    setDimensions({ width, height });
-  };
-
-  const mediaComponent = useMemo(() => {
-    return (
-      <VoiceClientVideoView
-        videoTrack={videoTrack || null}
-        audioTrack={null}
-        mirror={true}
-        zOrder={1}
-        style={styles.media}
-        objectFit="cover"
-      />
-    );
-  }, [videoTrack]);
-
-  const { width } = dimensions;
-  const circleSize = width * 0.9;
-  const innerCircleSize = width * 0.82;
-
-  return (
-    <View style={[styles.container, style]} onLayout={onLayout}>
-      <View
-        style={[
-          styles.outerCircle,
-          { width: circleSize, height: circleSize, borderRadius: circleSize / 2 },
-        ]}
-      >
-        {isCamEnabled ? (
-          <View style={[styles.videoView, { borderRadius: circleSize / 2 }]}>
-            {mediaComponent}
-          </View>
-        ) : (
-          <>
-            <View
-              style={[
-                styles.innerCircle,
-                {
-                  width: innerCircleSize,
-                  height: innerCircleSize,
-                  borderRadius: innerCircleSize / 2,
-                },
-              ]}
-            />
-            <Image
-              source={Icons.vision}
-              style={[
-                styles.image,
-                {
-                  width: width * 0.3,
-                  height: width * 0.3,
-                  tintColor: 'green',
-                },
-              ]}
-              resizeMode="contain"
-            />
-          </>
-        )}
-      </View>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    justifyContent: 'center',
-    alignItems: 'center',
-  } as ViewStyle,
-  outerCircle: {
-    borderWidth: 1,
-    borderColor: Colors.buttonsBorder,
-    justifyContent: 'center',
-    alignItems: 'center',
-  } as ViewStyle,
-  innerCircle: {
-    backgroundColor: Colors.disabledVision,
-    position: 'absolute',
-  } as ViewStyle,
-  videoView: {
-    aspectRatio: 1,
-    width: '100%',
-    height: '100%',
-    overflow: 'hidden',
-  } as ViewStyle,
-  image: {} as ImageStyle,
-  media: {
-    width: '100%',
-    height: '100%',
-    position: 'absolute',
-  },
-});
-
-export default CameraButtonView;

examples/simple-chatbot/client/react-native/src/views/MeetingView.tsx

@@ -15,7 +15,6 @@ import { MaterialIcons } from '@expo/vector-icons';
 
 import WaveformView from '../components/WaveformView';
 import MicrophoneView from '../components/MicrophoneView';
-import CameraButtonView from '../components/CameraButtonView';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import Colors from '../theme/Colors';
 import CustomButton from '../theme/CustomButton';
@@ -50,11 +49,6 @@ const MeetingView: React.FC = () => {
                 style={styles.microphone}
               />
             </TouchableOpacity>
-            <TouchableOpacity onPress={toggleCamInput}>
-              <CameraButtonView
-                style={styles.camera}
-              />
-            </TouchableOpacity>
           </View>
         </View>
 
@@ -128,20 +122,6 @@ const styles = StyleSheet.create({
   bottomPanel: {
     paddingVertical: 10,
   },
-  settingsButton: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-    borderWidth: 1,
-    borderColor: '#ccc', // Replace with Color.buttonsBorder equivalent
-    borderRadius: 12,
-    padding: 10,
-    marginBottom: 10,
-  },
-  settingsText: {
-    marginLeft: 5,
-    color: 'black',
-  },
   endButton: {
     flexDirection: 'row',
     alignItems: 'center',

examples/simple-chatbot/client/react-native/yarn.lock

@@ -775,10 +775,10 @@
   dependencies:
     expo-build-properties "~0.8.3"
 
-"@daily-co/daily-js@^0.76.0":
+"@daily-co/daily-js@^0.79.0":
-  version "0.76.0"
+  version "0.79.0"
-  resolved "https://registry.yarnpkg.com/@daily-co/daily-js/-/daily-js-0.76.0.tgz#5b45fae585de3175985fc008af0fdd022989844b"
+  resolved "https://registry.yarnpkg.com/@daily-co/daily-js/-/daily-js-0.79.0.tgz#6628c145951f9951ea213c65e916d6e8a3934b45"
-  integrity sha512-v3yPJ6oxz/CViHM1R78YMc7b9cLsTD+G4OxwvVIRX5vfqjn0tFhisqBwdzGK4MGAI/IdnE4oNahuPWAPpKwysA==
+  integrity sha512-Ii/Zi6cfTl2EZBpX8msRPNkkCHcajA+ErXpbN2Xe2KySd1Nb4IzC/QWJlSl9VA9pIlYPQicRTDoZnoym/0uEAw==
   dependencies:
     "@babel/runtime" "^7.12.5"
     "@sentry/browser" "^8.33.1"
@@ -786,12 +786,12 @@
     dequal "^2.0.3"
     events "^3.1.0"
 
-"@daily-co/react-native-daily-js@^0.73.0":
+"@daily-co/react-native-daily-js@^0.76.0":
-  version "0.73.0"
+  version "0.76.0"
-  resolved "https://registry.yarnpkg.com/@daily-co/react-native-daily-js/-/react-native-daily-js-0.73.0.tgz#12b7eb7ad2868f6741c3ad720e1c88fd5864b160"
+  resolved "https://registry.yarnpkg.com/@daily-co/react-native-daily-js/-/react-native-daily-js-0.76.0.tgz#63a7f55bce975e8af30ca3f7ac4a8018e935bb5e"
-  integrity sha512-T8FA7fDq+eXRG7XHYwHJIZUxHE44SCRWCvOaY53W5qBy3GABjGENNE5WxUqdzQVOuXC6jEaVZcCtJielkQwR8g==
+  integrity sha512-/W8FJVIKAF8wgZMJdPyNaRw06r4UHh4MYNlMQS8eQMmIdskFN7kLL3Vpd/9qm3VaH65Aev6RH/n4X/p/yoc4Ug==
   dependencies:
-    "@daily-co/daily-js" "^0.76.0"
+    "@daily-co/daily-js" "^0.79.0"
     "@types/react-native-background-timer" "^2.0.0"
     base-64 "^1.0.0"
     react-native-url-polyfill "^1.1.2"
@@ -1248,7 +1248,7 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
-"@pipecat-ai/client-js@^0.3.2":
+"@pipecat-ai/client-js@^0.3.5":
   version "0.3.5"
   resolved "https://registry.yarnpkg.com/@pipecat-ai/client-js/-/client-js-0.3.5.tgz#70610e093097784dbfd777f071a5f21a601cd15f"
   integrity sha512-qmhnDjwY2XUtLjww35ShsYf5TF9BCuAk0tIj0oHjpTe6v6QOlgKQt8JVCAdc32p5ycouzSZOeDFtBd2aNWuq1g==
@@ -1259,12 +1259,12 @@
     typed-emitter "^2.1.0"
     uuid "^10.0.0"
 
-"@pipecat-ai/react-native-daily-transport@^0.3.2":
+"@pipecat-ai/react-native-daily-transport@^0.3.5":
-  version "0.3.2"
+  version "0.3.5"
-  resolved "https://registry.yarnpkg.com/@pipecat-ai/react-native-daily-transport/-/react-native-daily-transport-0.3.2.tgz#a8cbee24e41937f48a279b5f0b5b9784bb5b543a"
+  resolved "https://registry.yarnpkg.com/@pipecat-ai/react-native-daily-transport/-/react-native-daily-transport-0.3.5.tgz#b88fff52ff498049cc5889816ab528791073c8f3"
-  integrity sha512-KSTcE8ziDo8HS4/mkQeEOhg1YnCyH/z6RRzcFryYKQo0XkeEZ3UwPM+9L9cJFyuG/wu/UYI+R0gqcwPiqQvuEA==
+  integrity sha512-L/Ynj6PACy2//Q9Yv3UqTfvf7070LhcavKI67yy0tSQ0wj8C7l2OIziPIAm8woP2BNGbaP7J88M5QRfPOp9F4Q==
   dependencies:
-    "@pipecat-ai/client-js" "^0.3.2"
+    "@pipecat-ai/client-js" "^0.3.5"
 
 "@pkgjs/parseargs@^0.11.0":
   version "0.11.0"