From a1a0a41ffef46386076de69a63308b85d0daa98b Mon Sep 17 00:00:00 2001
From: gokhangunduz <me@gokhangunduz.com.tr>
Date: Wed, 20 Dec 2023 14:40:47 +0300
Subject: [PATCH] refactor(connections): :tada: add ros connection control
 functions

---
 package.json                                  |  2 +-
 src/components/Connections/Connections.tsx    | 43 +------------------
 src/components/RosConnector/RosConnector.tsx  |  6 +--
 src/contexts/RobotContext.tsx                 |  4 ++
 src/hooks/useRobot.tsx                        |  2 +
 .../EnvironmentPageLayout.tsx                 |  4 +-
 6 files changed, 14 insertions(+), 47 deletions(-)

diff --git a/package.json b/package.json
index 8046fe61..5d2881d1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ui",
-  "version": "0.23.9",
+  "version": "0.24.1",
   "private": true,
   "scripts": {
     "dev": "react-scripts start",
diff --git a/src/components/Connections/Connections.tsx b/src/components/Connections/Connections.tsx
index c916cee6..0d992a52 100644
--- a/src/components/Connections/Connections.tsx
+++ b/src/components/Connections/Connections.tsx
@@ -3,51 +3,12 @@ import StateCell from "../TableInformationCells/StateCell";
 import { envApplication } from "../../helpers/envProvider";
 import { useKeycloak } from "@react-keycloak/web";
 import useRobot from "../../hooks/useRobot";
-import { ReactElement, useEffect, useState } from "react";
-import ROSLIB from "roslib";
+import { ReactElement, useEffect } from "react";
 
 export default function Connections(): ReactElement {
-  const { responseRobot, isSettedCookie, isRobotReady } = useRobot();
+  const { responseRobot, isSettedCookie, isRosConnected } = useRobot();
   const { keycloak } = useKeycloak();
 
-  const [isRosConnected, setIsRosConnected] = useState<boolean | null>(null);
-
-  useEffect(() => {
-    let rosClient: ROSLIB.Ros | null = null;
-
-    function tryConnection() {
-      rosClient = new ROSLIB.Ros({
-        url: responseRobot?.bridgeIngressEndpoint,
-      });
-
-      rosClient.on("connection", () => setIsRosConnected(true));
-      rosClient.on(
-        "error",
-        () => isRosConnected === null && setIsRosConnected(false),
-      );
-    }
-
-    function closeRosConnection() {
-      // rosClient?.close();
-    }
-
-    if (
-      isRobotReady &&
-      isSettedCookie &&
-      responseRobot?.bridgeIngressEndpoint
-    ) {
-      closeRosConnection();
-      isRosConnected === null && tryConnection();
-    }
-
-    return closeRosConnection();
-  }, [
-    isRobotReady,
-    isRosConnected,
-    isSettedCookie,
-    responseRobot?.bridgeIngressEndpoint,
-  ]);
-
   useEffect(() => {
     console.log("isRosConnected", isRosConnected);
   }, [isRosConnected]);
diff --git a/src/components/RosConnector/RosConnector.tsx b/src/components/RosConnector/RosConnector.tsx
index 3f4d7a41..fb2a9d1b 100644
--- a/src/components/RosConnector/RosConnector.tsx
+++ b/src/components/RosConnector/RosConnector.tsx
@@ -13,6 +13,7 @@ export default function RosConnector(): ReactElement {
     responseRobot,
     topicList,
     setTopicList,
+    setIsRosConnected,
   } = useRobot();
 
   useEffect(() => {
@@ -27,11 +28,10 @@ export default function RosConnector(): ReactElement {
       setRos(ros);
 
       ros?.on("connection", function () {
-        console.log("Connected to websocket server.");
-        console.info("ROSBRIDGE URL: ", ros);
+        setIsRosConnected(true);
       });
       ros?.on("error", function (error) {
-        console.warn("Error connecting to websocket server: ", error);
+        setIsRosConnected(false);
       });
       ros?.on("close", function () {
         console.log("Connection to websocket server closed.");
diff --git a/src/contexts/RobotContext.tsx b/src/contexts/RobotContext.tsx
index a1de99c6..30969aef 100644
--- a/src/contexts/RobotContext.tsx
+++ b/src/contexts/RobotContext.tsx
@@ -42,6 +42,8 @@ export default ({ children }: any) => {
     undefined,
   );
 
+  const [isRosConnected, setIsRosConnected] = useState<boolean | null>(null);
+
   // Main Functions
   useEffect(() => {
     if (
@@ -357,6 +359,8 @@ export default ({ children }: any) => {
         topicList,
         isSettedCookie,
         setIsSettedCookie,
+        isRosConnected,
+        setIsRosConnected,
         setTopicList,
         handleForceUpdate,
         handleResetRobot,
diff --git a/src/hooks/useRobot.tsx b/src/hooks/useRobot.tsx
index b28acdff..411bb345 100644
--- a/src/hooks/useRobot.tsx
+++ b/src/hooks/useRobot.tsx
@@ -15,6 +15,8 @@ interface IuseRobot {
   setTopicList: any;
   isSettedCookie: boolean | null;
   setIsSettedCookie: any;
+  isRosConnected: boolean | null;
+  setIsRosConnected: any;
   adrinState: any;
   setAdrinState: any;
   handleForceUpdate: any;
diff --git a/src/layouts/EnvironmentPageLayout/EnvironmentPageLayout.tsx b/src/layouts/EnvironmentPageLayout/EnvironmentPageLayout.tsx
index 4f4f8275..01d34f9e 100644
--- a/src/layouts/EnvironmentPageLayout/EnvironmentPageLayout.tsx
+++ b/src/layouts/EnvironmentPageLayout/EnvironmentPageLayout.tsx
@@ -2,7 +2,7 @@ import { Fragment, ReactElement } from "react";
 import EnvironmentHeader from "../../components/EnvironmentHeader/EnvironmentHeader";
 import HiddenFrame from "../../components/HiddenFrame/HiddenFrame";
 import { envApplication } from "../../helpers/envProvider";
-// import RosConnector from "../../components/RosConnector/RosConnector";
+import RosConnector from "../../components/RosConnector/RosConnector";
 import Overview from "../../pages/EnvironmentPage/Overview/Overview";
 import MissionContext from "../../contexts/MissionContext";
 import BarcodeContext from "../../contexts/BarcodeContext";
@@ -24,7 +24,7 @@ export default function EnvironmentPageLayout(): ReactElement {
     <Fragment>
       <div className="flex h-full flex-col gap-6">
         <EnvironmentHeader />
-        {/* {!envApplication && <RosConnector />} */}
+        {!envApplication && <RosConnector />}
 
         {(() => {
           switch (activeTab) {