Changed Builder Format

.replit-default

@@ -1,14 +1,5 @@
 entrypoint = "index.js"
 
-[interpreter]
-command = [
-    "prybar-nodejs",
-    "-q",
-    "--ps1",
-    "\u0001\u001b[33m\u0002\u0001\u001b[00m\u0002 ",
-    "-i"
-]
-
 [nix]
 channel = "stable-21_11"
 

replit.nix

@@ -1,6 +1,7 @@
 { pkgs }: {
 	deps = [
-		pkgs.nodejs-16_x
+		pkgs.cloc
+pkgs.nodejs-16_x
         pkgs.nodePackages.typescript-language-server
         pkgs.nodePackages.yarn
         pkgs.replitPackages.jest

src/views/jobs/JobView.jsx

@@ -20,7 +20,7 @@ export default function JobView(props) {
   function downloadLog() {}
 
   function navigateToJobs() {
-    navigate("/jobs");
+    navigate("/qualiteer/jobs");
   }
 
   function onLog(d) {

src/views/jobs/Jobs.jsx

@@ -1,27 +1,11 @@
 import { useState, useContext, useEffect } from "react";
 import { useLocation } from "react-router-dom";
 
-import StoreContext from "../../ctx/StoreContext.jsx";
 import JobContext from "../../ctx/JobContext.jsx";
 import JobBox from "./JobBox.jsx";
 import JobTestSelector from "./JobTestSelector.jsx";
 import JobView from "./JobView.jsx";
-
+import JobBuilder from "./builder/JobBuilder.jsx";
-import Button from "@mui/material/Button";
-import Dialog from "@mui/material/Dialog";
-import DialogActions from "@mui/material/DialogActions";
-import DialogContent from "@mui/material/DialogContent";
-import Toolbar from "@mui/material/Toolbar";
-import DialogTitle from "@mui/material/DialogTitle";
-
-import ClickAwayListener from "@mui/material/ClickAwayListener";
-import SpeedDial from "@mui/material/SpeedDial";
-import SpeedDialAction from "@mui/material/SpeedDialAction";
-import SpeedDialIcon from "@mui/material/SpeedDialIcon";
-
-import PageviewIcon from "@mui/icons-material/Pageview";
-import ViewColumnIcon from "@mui/icons-material/ViewColumn";
-import ViewCarouselIcon from "@mui/icons-material/ViewCarousel";
 
 export default function Jobs() {
   const {
@@ -30,37 +14,10 @@ export default function Jobs() {
     jobBuilder,
   } = useContext(JobContext);
   const location = useLocation();
-  const { state: store, updateStore } = useContext(StoreContext);
-  const [quickOpen, setQuickOpen] = useState(false);
-  const [jobDialogOpen, setJobDialogOpen] = useState(false);
-
-  const actions = [
-    { name: "Suite", icon: <ViewCarouselIcon /> },
-    { name: "Compound", icon: <ViewColumnIcon /> },
-    { name: "Manual", icon: <PageviewIcon /> },
-  ];
-
-  const quickOpenClick = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (!store.simplifiedControls) return setQuickOpen(!quickOpen);
-    setJobDialogOpen(true);
-  };
-  const quickOpenClose = () => setQuickOpen(false);
-
-  const handleClickOpen = () => setJobDialogOpen(true);
-
-  const [queued, setQueued] = useState([]);
-  useEffect(() => {}, [jobState.jobs, location]);
-
-  const handleClose = (confirmed) => () => {
-    setJobDialogOpen(false);
-    if (!confirmed) return;
-    jobBuilder(queued);
-  };
 
   return (
     <div className="jobs">
+      <JobBuilder />
       {location.hash === "" &&
         jobState.jobs.map((v, i) => (
           <a
@@ -76,44 +33,6 @@ export default function Jobs() {
           job={jobState.jobs.find((job) => job.name === location.hash.slice(1))}
         />
       )}
-
-      <Dialog open={jobDialogOpen} onClose={handleClose()} fullScreen>
-        <Toolbar />
-        <DialogTitle>New Job</DialogTitle>
-        <DialogContent>
-          <span>Some Selectors</span>
-          <JobTestSelector
-            queued={queued}
-            availableTests={store.catalog}
-            setQueued={setQueued}
-          />
-        </DialogContent>
-        <DialogActions>
-          <Button onClick={handleClose()}>Cancel</Button>
-          <Button onClick={handleClose(true)} autoFocus>
-            Start
-          </Button>
-        </DialogActions>
-      </Dialog>
-
-      <ClickAwayListener onClickAway={quickOpenClose}>
-        <SpeedDial
-          ariaLabel="New Job"
-          sx={{ position: "fixed", bottom: 16, right: 16 }}
-          icon={<SpeedDialIcon />}
-          onClick={quickOpenClick}
-          open={quickOpen}
-        >
-          {actions.map((action) => (
-            <SpeedDialAction
-              key={action.name}
-              icon={action.icon}
-              tooltipTitle={action.name}
-              onClick={handleClickOpen}
-            />
-          ))}
-        </SpeedDial>
-      </ClickAwayListener>
     </div>
   );
 }

src/views/jobs/builder/JobBuilder.jsx

@@ -0,0 +1,86 @@
+import React, { useContext, useState, useEffect } from "react";
+
+import StoreContext from "../../../ctx/StoreContext.jsx";
+
+import Button from "@mui/material/Button";
+import Dialog from "@mui/material/Dialog";
+import DialogActions from "@mui/material/DialogActions";
+import DialogContent from "@mui/material/DialogContent";
+import Toolbar from "@mui/material/Toolbar";
+import DialogTitle from "@mui/material/DialogTitle";
+
+import ClickAwayListener from "@mui/material/ClickAwayListener";
+import SpeedDial from "@mui/material/SpeedDial";
+import SpeedDialAction from "@mui/material/SpeedDialAction";
+import SpeedDialIcon from "@mui/material/SpeedDialIcon";
+
+import PageviewIcon from "@mui/icons-material/Pageview";
+import ViewColumnIcon from "@mui/icons-material/ViewColumn";
+import ViewCarouselIcon from "@mui/icons-material/ViewCarousel";
+
+export default function JobBuilder(props) {
+  const { state: store, updateStore } = useContext(StoreContext);
+
+  const [quickOpen, setQuickOpen] = useState(false);
+  const [jobDialogOpen, setJobDialogOpen] = useState(false);
+
+  const quickOpenClick = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (!store.simplifiedControls) return setQuickOpen(!quickOpen);
+    setJobDialogOpen(true);
+  };
+
+  const quickOpenClose = () => setQuickOpen(false);
+  const handleClickOpen = () => setJobDialogOpen(true);
+
+  const [cache, setCache] = useState({});
+
+  const handleClose = (confirmed) => () => {
+    setJobDialogOpen(false);
+    if (!confirmed) return;
+    jobBuilder(cache);
+  };
+
+  // Pull info from url if possible?
+  const actions = [
+    { name: "Suite", icon: <ViewCarouselIcon /> },
+    { name: "Compound", icon: <ViewColumnIcon /> },
+    { name: "Manual", icon: <PageviewIcon /> },
+  ];
+
+  return (
+    <React.Fragment>
+      <Dialog open={jobDialogOpen} onClose={handleClose()} fullScreen>
+        <Toolbar />
+        <DialogTitle>New Job</DialogTitle>
+        <DialogContent></DialogContent>
+        <DialogActions>
+          <Button onClick={handleClose()}>Cancel</Button>
+          <Button onClick={handleClose(true)} autoFocus>
+            Start
+          </Button>
+        </DialogActions>
+      </Dialog>
+
+      <ClickAwayListener onClickAway={quickOpenClose}>
+        <SpeedDial
+          ariaLabel="New Job"
+          sx={{ position: "fixed", bottom: 16, right: 16 }}
+          icon={<SpeedDialIcon />}
+          onClick={quickOpenClick}
+          open={quickOpen}
+        >
+          {actions.map((action) => (
+            <SpeedDialAction
+              key={action.name}
+              icon={action.icon}
+              tooltipTitle={action.name}
+              onClick={handleClickOpen}
+            />
+          ))}
+        </SpeedDial>
+      </ClickAwayListener>
+    </React.Fragment>
+  );
+}