Stable Modification Point

src/views/components/JobTestSelector.jsx

@@ -0,0 +1,47 @@
+import { useState, useEffect } from "react";
+import Box from "@mui/material/Box";
+import List from "@mui/material/List";
+import ListItem from "@mui/material/ListItem";
+import ListItemButton from "@mui/material/ListItemButton";
+import ListItemText from "@mui/material/ListItemText";
+import Checkbox from "@mui/material/Checkbox";
+
+export default function JobTestSelector(props){
+  const {availableTests, queued, setQueued} = props;
+  
+  useEffect(()=>{},[availableTests]);
+
+  const queueTest = (test) => () => {
+    const q = [...queued];
+    const testIndex = q.indexOf(test);
+    if(testIndex === -1) q.push(test);
+    else q.splice(testIndex, 1);
+    setQueued(q);
+  };
+  
+   return (
+      <Box style={{ overflow: "auto",  maxHeight: 250 }}>
+        <List>
+          {availableTests.map((v, i) => (
+            <ListItem
+              key={i}
+              secondaryAction={<Checkbox edge="end" checked={queued.includes(v)} />}
+              disablePadding
+              onClick={queueTest(v)}
+            >
+              <ListItemButton key={i}>
+                <ListItemText
+                  primary={
+                    <span>
+                      {v.class}#<strong>{v.name}</strong>
+                    </span>
+                  }
+                  style={{ wordBreak: "break-word" }}
+                />
+              </ListItemButton>
+            </ListItem>
+          ))}
+        </List>
+      </Box>
+    );
+}