Run prettier

hello-robot · Oct 24, 2024 · 83a7f77 · 83a7f77
1 parent 40dfa5e
commit 83a7f77
Show file tree

Hide file tree

Showing 16 changed files with 509 additions and 314 deletions.
diff --git a/server.js b/server.js
@@ -57,11 +57,13 @@ io.on("connect_error", (err) => {
 let protocol = undefined; // TODO(binit): ensure robot/operator protocol match
 let status = "offline"; // ["online", "offline", "occupied"]
 function updateRooms() {
-    io.emit("update_rooms", { "robot_id": {
-        "name": process.env.HELLO_FLEET_ID,
-        "protocol": protocol,
-        "status": status
-    }})
+    io.emit("update_rooms", {
+        robot_id: {
+            name: process.env.HELLO_FLEET_ID,
+            protocol: protocol,
+            status: status,
+        },
+    });
 }
 
 io.on("connection", function (socket) {
@@ -88,8 +90,11 @@ io.on("connection", function (socket) {
     });
 
     socket.on("list_rooms", () => {
-        if (io.sockets.adapter.rooms.get("robot") && io.sockets.adapter.rooms.get("robot").size >= 2) {
-            status = "occupied"
+        if (
+            io.sockets.adapter.rooms.get("robot") &&
+            io.sockets.adapter.rooms.get("robot").size >= 2
+        ) {
+            status = "occupied";
         }
         updateRooms();
     });

diff --git a/src/pages/home/css/CallRobotSelector.css b/src/pages/home/css/CallRobotSelector.css
@@ -1,4 +1,3 @@
-
 .rs-container {
     overflow: auto;
 }
diff --git a/src/pages/home/css/Changelog.css b/src/pages/home/css/Changelog.css
@@ -1,4 +1,3 @@
-
 .cv-container {
     overflow: auto;
 }
diff --git a/src/pages/home/css/LoginView.css b/src/pages/home/css/LoginView.css
@@ -1,4 +1,3 @@
-
 .lv-container {
     padding: 20px;
 }
diff --git a/src/pages/home/css/SideBySideView.css b/src/pages/home/css/SideBySideView.css
@@ -1,4 +1,3 @@
-
 .sbs-container {
     padding: 20px;
 }
diff --git a/src/pages/home/tsx/components/CallRobotSelector.tsx b/src/pages/home/tsx/components/CallRobotSelector.tsx
@@ -1,137 +1,167 @@
 import "home/css/CallRobotSelector.css";
 import React, { useEffect, useState } from "react";
-import Box from '@mui/material/Box';
-import Grid from '@mui/material/Grid2';
-import Card from '@mui/material/Card';
-import CardContent from '@mui/material/CardContent';
-import CardActions from '@mui/material/CardActions';
-import Button from '@mui/material/Button';
-import Typography from '@mui/material/Typography';
+import Box from "@mui/material/Box";
+import Grid from "@mui/material/Grid2";
+import Card from "@mui/material/Card";
+import CardContent from "@mui/material/CardContent";
+import CardActions from "@mui/material/CardActions";
+import Button from "@mui/material/Button";
+import Typography from "@mui/material/Typography";
 import CircleIcon from "@mui/icons-material/Circle";
-import { green, red, yellow, grey } from '@mui/material/colors';
+import { green, red, yellow, grey } from "@mui/material/colors";
 import { loginHandler } from "../index";
 
-
 function get_indicator_text(status_str) {
     switch (status_str) {
         case "online":
-            return "Online"
+            return "Online";
         case "offline":
-            return "Offline"
+            return "Offline";
         case "occupied":
-            return "Occupied"
+            return "Occupied";
         default:
-            return "Unknown"
+            return "Unknown";
     }
 }
 
-
 function get_indicator(status_str) {
     let statusui;
     switch (status_str) {
         case "online":
             statusui = {
-                "color_name": "green",
-                "color": green,
+                color_name: "green",
+                color: green,
             };
             break;
         case "offline":
             statusui = {
-                "color_name": "red",
-                "color": red,
+                color_name: "red",
+                color: red,
             };
             break;
         case "occupied":
             statusui = {
-                "color_name": "yellow",
-                "color": yellow,
+                color_name: "yellow",
+                color: yellow,
             };
             break;
         default:
             statusui = {
-                "color_name": "grey",
-                "color": grey,
+                color_name: "grey",
+                color: grey,
             };
     }
     let indicator_css = {
         fontSize: 12,
-        color: statusui['color']["A400"],
-        animation: `glowing_${statusui['color_name']} 3s linear infinite`
+        color: statusui["color"]["A400"],
+        animation: `glowing_${statusui["color_name"]} 3s linear infinite`,
     };
-    indicator_css[`@keyframes glowing_${statusui['color_name']}`] = {
+    indicator_css[`@keyframes glowing_${statusui["color_name"]}`] = {
         "0%": {
-            color: statusui['color']["A400"]
+            color: statusui["color"]["A400"],
         },
         "50%": {
-            color: statusui['color']["A200"]
+            color: statusui["color"]["A200"],
         },
         "100%": {
-            color: statusui['color']["A400"]
-        }
+            color: statusui["color"]["A400"],
+        },
     };
-    return <CircleIcon sx={indicator_css} />
+    return <CircleIcon sx={indicator_css} />;
 }
 
-
 function get_action(status_str, robot_name) {
     switch (status_str) {
         case "online":
-            return <Button href={`/operator/${robot_name}`} variant="contained" size="small">Call Robot</Button>
+            return (
+                <Button
+                    href={`/operator/${robot_name}`}
+                    variant="contained"
+                    size="small"
+                >
+                    Call Robot
+                </Button>
+            );
         case "offline":
-            return <Button href={`/operator/${robot_name}`} variant="contained" size="small" disabled>Call Robot</Button>
+            return (
+                <Button
+                    href={`/operator/${robot_name}`}
+                    variant="contained"
+                    size="small"
+                    disabled
+                >
+                    Call Robot
+                </Button>
+            );
         case "occupied":
-            return <Button href={`/operator/${robot_name}`} variant="contained" size="small" disabled>Call Robot</Button>
+            return (
+                <Button
+                    href={`/operator/${robot_name}`}
+                    variant="contained"
+                    size="small"
+                    disabled
+                >
+                    Call Robot
+                </Button>
+            );
         default:
-            return <Button href={`/operator/${robot_name}`} variant="contained" size="small" disabled>Call Robot</Button>
+            return (
+                <Button
+                    href={`/operator/${robot_name}`}
+                    variant="contained"
+                    size="small"
+                    disabled
+                >
+                    Call Robot
+                </Button>
+            );
     }
 }
 
-
-const CallRobotItem = (props: {
-    name: String;
-    status: String;
-}) => {
-
+const CallRobotItem = (props: { name: String; status: String }) => {
     return (
         <Card sx={{ minWidth: 275 }}>
             <CardContent>
                 <Typography variant="h5" component="div">
                     {props.name}
                 </Typography>
-                <Typography sx={{ color: 'text.secondary', mb: 1.5 }}>
-                    {get_indicator(props.status)} {get_indicator_text(props.status)}
+                <Typography sx={{ color: "text.secondary", mb: 1.5 }}>
+                    {get_indicator(props.status)}{" "}
+                    {get_indicator_text(props.status)}
                 </Typography>
             </CardContent>
-            <CardActions>
-                {get_action(props.status, props.name)}
-            </CardActions>
+            <CardActions>{get_action(props.status, props.name)}</CardActions>
         </Card>
     );
 };
 
-
-export const CallRobotSelector = (props: {
-    style?: React.CSSProperties;
-}) => {
+export const CallRobotSelector = (props: { style?: React.CSSProperties }) => {
     const [callableRobots, setCallableRobots] = useState({});
 
     useEffect(() => {
         loginHandler.listRooms(setCallableRobots);
-    },[props]);
+    }, [props]);
 
     return (
         <Box sx={{ flexGrow: 1 }}>
             <h2>Robots:</h2>
-            <Grid container spacing={2} className='rs-container' style={props.style}>
-                {
-                    Object.entries(callableRobots).map(([key, value], idx) => {
-                        return (
-                            <Grid key={idx} size={{md: 12, lg: 6}}>
-                                <CallRobotItem key={idx} name={value["name"]} status={value["status"]} />
-                            </Grid>
-                        )
-                    })
-                }
+            <Grid
+                container
+                spacing={2}
+                className="rs-container"
+                style={props.style}
+            >
+                {Object.entries(callableRobots).map(([key, value], idx) => {
+                    return (
+                        <Grid key={idx} size={{ md: 12, lg: 6 }}>
+                            <CallRobotItem
+                                key={idx}
+                                name={value["name"]}
+                                status={value["status"]}
+                            />
+                        </Grid>
+                    );
+                })}
             </Grid>
         </Box>
     );