Merge pull request 'Update UI for CardLine and ModalTerminal components' (#2) from that into main

Reviewed-on: #2

FRONTEND/src/components/CardLine.tsx

@@ -179,10 +179,6 @@ const CardLine = ({
                         navigator.clipboard.writeText(
                           `PID: ${line?.inventory?.pid || ""} | SN: ${
                             line?.inventory?.sn || ""
-                          } | Ticket: ${
-                            line?.tickets && line?.tickets?.length > 0
-                              ? line?.tickets[0].description
-                              : ""
                           }`
                         );
                       }}
@@ -263,13 +259,13 @@ const CardLine = ({
                   </Flex>
                   <Flex justify={"space-between"} w={"100%"}>
                     <Box>
-                      {line?.tickets && line?.tickets?.length > 0 ? (
+                      {/* {line?.tickets && line?.tickets?.length > 0 ? (
                         <Text fz={"13px"}>
                           <i>{line?.tickets[0].description ?? ""}</i>
                         </Text>
                       ) : (
                         ""
-                      )}
+                      )} */}
                     </Box>
                     <div
                       style={{

FRONTEND/src/components/Component.module.css

@@ -138,3 +138,13 @@
   padding-right: 4px !important;
   padding-left: 4px !important;
 }
+
+.buttonControl {
+  font-size: 10px !important;
+  font-weight: 400;
+  width: 50px !important;
+  min-width: 50px !important;
+  height: 26px !important;
+  padding-right: 4px !important;
+  padding-left: 4px !important;
+}

FRONTEND/src/components/ModalTerminal.tsx

@@ -31,6 +31,7 @@ import { ButtonDPELP, ButtonScenario } from "./ButtonAction";
 import moment from "moment";
 import axios from "axios";
 import { notifications } from "@mantine/notifications";
+import classes from "./Component.module.css";
 const apiUrl = import.meta.env.VITE_BACKEND_URL;
 
 const INIT_TICKET = {
@@ -475,7 +476,14 @@ const ModalTerminal = ({
               <Box>
                 <fieldset>
                   <Flex justify={"center"}>
-                    <IconCircleDot color="green" />
+                    <IconCircleDot
+                      color={
+                        line?.interface &&
+                        findSwitchPort(line?.interface)?.status === "ON"
+                          ? "green"
+                          : "red"
+                      }
+                    />
                     <Flex>
                       <Text size="sm" ml={"sm"}>
                         Internet
@@ -499,6 +507,7 @@ const ModalTerminal = ({
                   </Flex>
                   <Flex justify={"space-around"} mt={"4px"}>
                     <Button
+                      className={classes.buttonControl}
                       disabled={isDisable}
                       fw={400}
                       variant="outline"
@@ -511,6 +520,7 @@ const ModalTerminal = ({
                       ON
                     </Button>
                     <Button
+                      className={classes.buttonControl}
                       disabled={isDisable}
                       fw={400}
                       variant="outline"
@@ -523,6 +533,7 @@ const ModalTerminal = ({
                       OFF
                     </Button>
                     <Button
+                      className={classes.buttonControl}
                       disabled={isDisable}
                       fw={400}
                       variant="outline"
@@ -578,9 +589,9 @@ const ModalTerminal = ({
             </Flex>
           </Grid.Col>
           <Grid.Col
-            span={7}
+            span={10}
             style={{
-              borderRight: "1px solid #ccc",
+              // borderRight: "1px solid #ccc",
               borderLeft: "1px solid #ccc",
             }}
           >
@@ -750,7 +761,7 @@ const ModalTerminal = ({
               </Menu>
             </Flex>
           </Grid.Col>
-          <Grid.Col span={3}>
+          <Grid.Col span={3} display={"none"}>
             <Box>
               <Tooltip
                 label={