Migrating the base API URL for the react native example to an .env file.

examples/bot-ready-signalling/client/react-native/README.md

@@ -34,6 +34,10 @@ npm i
 
 # Before a native app can be compiled, the native source code must be generated.
 npx expo prebuild
+
+# Configure the environment variable to connect to the local server
+cp env.example .env
+# edit .env and add your local ip address, for example: http://192.168.1.16:7860
 ```
 
 #### Running on Android
@@ -53,4 +57,4 @@ npm run ios
 ```
 
 #### Connect to the server
-Use the http://localhost:5173 in your app.
+Use the http://localhost:5173 in your app.

examples/bot-ready-signalling/client/react-native/babel.config.js

@@ -2,5 +2,6 @@ module.exports = function(api) {
   api.cache(true);
   return {
     presets: ['babel-preset-expo'],
+    plugins: [["module:react-native-dotenv"]],
   };
 };

examples/bot-ready-signalling/client/react-native/env.example

@@ -0,0 +1 @@
+API_BASE_URL=http://YOUR_LOCAL_IP:7860

examples/bot-ready-signalling/client/react-native/package-lock.json

@@ -21,6 +21,7 @@
         "react": "18.3.1",
         "react-native": "0.76.3",
         "react-native-background-timer": "^2.4.1",
+        "react-native-dotenv": "^3.4.11",
         "react-native-get-random-values": "^1.11.0"
       },
       "devDependencies": {
@@ -9223,6 +9224,18 @@
         "react-native": ">=0.47.0"
       }
     },
+    "node_modules/react-native-dotenv": {
+      "version": "3.4.11",
+      "resolved": "https://registry.npmjs.org/react-native-dotenv/-/react-native-dotenv-3.4.11.tgz",
+      "integrity": "sha512-6vnIE+WHABSeHCaYP6l3O1BOEhWxKH6nHAdV7n/wKn/sciZ64zPPp2NUdEUf1m7g4uuzlLbjgr+6uDt89q2DOg==",
+      "license": "MIT",
+      "dependencies": {
+        "dotenv": "^16.4.5"
+      },
+      "peerDependencies": {
+        "@babel/runtime": "^7.20.6"
+      }
+    },
     "node_modules/react-native-get-random-values": {
       "version": "1.11.0",
       "resolved": "https://registry.npmjs.org/react-native-get-random-values/-/react-native-get-random-values-1.11.0.tgz",

examples/bot-ready-signalling/client/react-native/package.json

@@ -21,6 +21,7 @@
     "react": "18.3.1",
     "react-native": "0.76.3",
     "react-native-background-timer": "^2.4.1",
+    "react-native-dotenv": "^3.4.11",
     "react-native-get-random-values": "^1.11.0"
   },
   "devDependencies": {

examples/bot-ready-signalling/client/react-native/src/App.js

@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import {SafeAreaView, View, Text, Button, StyleSheet, ScrollView} from 'react-native';
 import Daily from "@daily-co/react-native-daily-js";
+import { API_BASE_URL } from "@env";
 
 const CallScreen = () => {
   const [connectionStatus, setConnectionStatus] = useState('Disconnected');
@@ -59,7 +60,7 @@ const CallScreen = () => {
     try {
       const callObject = Daily.createCallObject({ subscribeToTracksAutomatically: true });
       setCallObject(callObject);
-      const connectionUrl = 'http://192.168.1.16:7860/connect'
+      const connectionUrl = `${API_BASE_URL}/connect`
       const res = await fetch(connectionUrl, { method: "POST", headers: { "Content-Type": "application/json" } });
       const roomInfo = await res.json();
       await callObject.join({ url: roomInfo.room_url });