fix(front-end): change functionality when the server panel is in edit mode

striker-ui/.eslintrc.json

@@ -36,7 +36,7 @@
     "sourceType": "module"
   },
   "rules": {
-    "complexity": ["error", 5],
+    "complexity": ["error", 6],
     "import/extensions": [
       "error",
       "ignorePackages",

striker-ui/components/Servers.tsx

@@ -248,16 +248,16 @@ const Servers = ({ anvil }: { anvil: AnvilListItem[] }): JSX.Element => {
       {!isLoading ? (
         <Box className={classes.root}>
           <List component="nav">
-            {data &&
+            {data?.servers.map((server: AnvilServer) => {
-              data.servers.map((server: AnvilServer) => {
               return (
                 <>
                   <ListItem
                     button
                     className={classes.button}
                     key={server.server_uuid}
-                      component="a"
+                    component={showCheckbox ? 'div' : 'a'}
                     href={`/server?uuid=${server.server_uuid}&server_name=${server.server_name}`}
+                    onClick={() => handleChange(server.server_uuid)}
                   >
                     <Box display="flex" flexDirection="row" width="100%">
                       {showCheckbox && (
@@ -266,11 +266,9 @@ const Servers = ({ anvil }: { anvil: AnvilListItem[] }): JSX.Element => {
                             style={{ color: TEXT }}
                             color="secondary"
                             checked={
-                                selected.find(
+                              selected.find((s) => s === server.server_uuid) !==
-                                  (s) => s === server.server_uuid,
+                              undefined
-                                ) !== undefined
                             }
-                              onChange={() => handleChange(server.server_uuid)}
                           />
                         </Box>
                       )}
@@ -305,8 +303,7 @@ const Servers = ({ anvil }: { anvil: AnvilListItem[] }): JSX.Element => {
                                   <BodyText
                                     text={host.host_name}
                                     selected={
-                                        server.server_host_uuid ===
+                                      server.server_host_uuid === host.host_uuid
-                                        host.host_uuid
                                     }
                                   />
                                 </Box>