залочил поле ввода, после нажатья кнопки. указал ссылка для токен ыы

app/(tabs)/index.tsx

@@ -1,26 +1,22 @@
-import { Image, StyleSheet, Platform, Button, TextInput } from 'react-native';
-import { useState, useEffect } from 'react';
+import { Image, StyleSheet, Button, TextInput } from 'react-native';
+import React, { useState, useEffect } from 'react';
 import { HelloWave } from '@/components/HelloWave';
 import ParallaxScrollView from '@/components/ParallaxScrollView';
 import { ThemedText } from '@/components/ThemedText';
 import { ThemedView } from '@/components/ThemedView';
 import * as Location from 'expo-location';
-import io from 'socket.io-client';
-
-// URL вашего WebSocket сервера
-const WS_URL = 'ws://192.168.0.76:9992/ws/1x0Avi/sendGeo';
+import io, { Socket } from 'socket.io-client';
 
 export default function HomeScreen() {
   const [btnColor, setBtnColor] = useState("#008000");
   const [broadcastState, setBroadcastState] = useState(false);
-  const [token, setToken] = useState(""); // State для ввода токена
-  const [socket, setSocket] = useState(null);
+  const [token, setToken] = useState<string>(""); // State для ввода токена
+  const [socket, setSocket] = useState<Socket | null>(null);
 
   useEffect(() => {
     // Очистка подключения при размонтировании компонента
     return () => {
       if (socket) {
-        // @ts-ignore
         socket.disconnect();
       }
     };
@@ -28,26 +24,29 @@ export default function HomeScreen() {
 
   const onPressSwitchBroadcast = () => {
     setBtnColor(btnColor === "#008000" ? "#FF0000" : "#008000");
+    setBroadcastState(!broadcastState);
     
-    if (!socket) {
-      // Подключаемся к WebSocket серверу при нажатии
-      const newSocket = io(WS_URL);
-      newSocket.on('connect', () => {
-        console.log('Connected to WebSocket Server');
-      });
-
-      newSocket.on('disconnect', () => {
-        console.log('Disconnected from WebSocket Server');
-      });
-
-      newSocket.on('location_ack', (data) => {
-        console.log('Location acknowledged by server:', data);
-      });
-// @ts-ignore
-      setSocket(newSocket);
+    if (socket) {
+      socket.disconnect();
+      setSocket(null);
     } else {
-      // Если уже подключены, отправляем данные
-      getLocation();
+      if (token) {
+        const newSocket = io(`ws://192.168.0.76:9992/ws/${token}/sendGeo`);
+        newSocket.on('connect', () => {
+          console.log('Connected to WebSocket Server');
+        });
+
+        newSocket.on('disconnect', () => {
+          console.log('Disconnected from WebSocket Server');
+        });
+
+        newSocket.on('location_ack', (data) => {
+          console.log('Location acknowledged by server:', data);
+        });
+        setSocket(newSocket);
+      } else {
+        console.error('Token is required to start the broadcast');
+      }
     }
   };
 
@@ -62,19 +61,24 @@ export default function HomeScreen() {
     sendLocation(location.coords.latitude, location.coords.longitude);
   };
 
-  const sendLocation = (latitude : any, longitude : any) => {
+  const sendLocation = (latitude: number, longitude: number) => {
     if (socket) {
       const locationData = {
         latitude,
         longitude,
-        // token, // Include token in the message
+        token, // Include token in the message
       };
-      // @ts-ignore
       socket.emit('location', locationData);
       console.log('Location sent:', locationData);
     }
   };
 
+  useEffect(() => {
+    if (broadcastState) {
+      getLocation();
+    }
+  }, [broadcastState]);
+
   return (
     <ParallaxScrollView
       headerBackgroundColor={{ light: '#A1CEDC', dark: '#1D3D47' }}
@@ -97,6 +101,7 @@ export default function HomeScreen() {
           style={styles.input}
           onChangeText={setToken}
           value={token}
+          editable={!broadcastState} // Поле ввода будет неактивным, если трансляция активна
         />
       </ThemedView>
       <ThemedView style={styles.stepContainer}>
@@ -106,7 +111,7 @@ export default function HomeScreen() {
         </ThemedText>
         <Button
           onPress={onPressSwitchBroadcast}
-          title="Начать трансляцию геолокации"
+          title={broadcastState ? "Остановить трансляцию" : "Начать трансляцию геолокации"}
           color={btnColor}
           accessibilityLabel="Learn more about this purple button"
         />