Merge pull request 'UI improvements and bug fixes for line and switch controls' (#16) from that into main

Reviewed-on: #16

FRONTEND/src/App.tsx

@@ -501,7 +501,7 @@ function App() {
                         style={{
                           margin: 0,
                           width: "100%",
-                          overflowX: "hidden",
+                          // overflowX: "hidden",
                         }}
                       >
                         {station.lines.map((line, i) => (

FRONTEND/src/components/CardLine.tsx

@@ -212,7 +212,7 @@ const CardLine = ({
                   </Box>
                 </Flex>
                 <Box w={"100%"}>
-                  <Flex direction={"column"} gap={"4px"} w={"100%"}>
+                  <Flex justify={"space-between"} gap={"4px"} w={"100%"}>
                     <div className={classes.info_line}>
                       PID:{" "}
                       <Text
@@ -238,6 +238,20 @@ const CardLine = ({
                         ""
                       )}
                     </div>
+                    <div
+                      style={{
+                        fontSize: "11px",
+                        color: "red",
+                      }}
+                    >
+                      {line?.userOpenCLI
+                        ? (line?.userOpenCLI === user?.userName
+                            ? "You are"
+                            : line?.userOpenCLI + " is") + " using"
+                        : ""}
+                    </div>
+                  </Flex>
+                  <Flex direction={"column"} gap={"4px"} w={"100%"}>
                     <div className={classes.info_line}>
                       SN:{" "}
                       <Text
@@ -257,7 +271,7 @@ const CardLine = ({
                       </Text>
                     </div>
                   </Flex>
-                  <Flex justify={"space-between"} w={"100%"}>
+                  <Flex justify={"space-between"} w={"100%"} display={"none"}>
                     <Box>
                       {/* {line?.tickets && line?.tickets?.length > 0 ? (
                         <Text fz={"13px"}>

FRONTEND/src/components/Component.module.css

@@ -10,7 +10,7 @@
 
 .info_line {
   color: dimgrey;
-  font-size: 11px;
+  font-size: 12px;
   display: flex;
   align-items: center;
   gap: 4px;

FRONTEND/src/components/DrawerControl.tsx

@@ -884,8 +884,14 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
           }}
         >
           <Box ps={"8px"} pt={"4px"}>
-            {dataStation?.switch ? (
+            {dataStation?.switch_control_ip ? (
-              RenderAPCStatus(dataStation?.switch)
+              dataStation?.switch ? (
+                RenderAPCStatus(dataStation?.switch)
+              ) : (
+                <Text fw={800} c="red" fz={"12px"}>
+                  DISCONNECTED
+                </Text>
+              )
             ) : (
               <Text fw={800} c="red" fz={"12px"}>
                 Switch not available

FRONTEND/src/components/ModalTerminal.tsx

@@ -520,11 +520,13 @@ const ModalTerminal = ({
                         <Text size="sm" fw={"bold"}>
                           Issue:
                         </Text>
-                        {line?.latestScenario?.detectAI?.issue?.map((el, i) => (
+                        {(line?.latestScenario?.detectAI?.issue || [])?.map(
-                          <Box key={i}>
+                          (el, i) => (
-                            <Text size="sm">- {el}</Text>
+                            <Box key={i}>
-                          </Box>
+                              <Text size="sm">- {el}</Text>
-                        ))}
+                            </Box>
+                          )
+                        )}
                       </Box>
                     </Box>
                   ) : (