Pipeline Magic

lib/jobs/pipelines.js

@@ -0,0 +1,31 @@
+import _ from "lodash";
+
+const nest = (arr) => {
+  const obj = {};
+  arr.reduce((o, s) => (o[s] = {}), obj);
+  return obj;
+};
+
+export const asTree = (branches) => {
+    const nests = branches.map((b)=>nest(b));
+    return _.merge(...nests);
+  };
+
+export const asBranches = (array) => {
+    const merged = [];
+    array.forEach((p, i) => {
+      p.forEach((v, i) => {
+        if (!merged[i]) merged[i] = [];
+        if (!merged[i].includes(v)) merged[i].push(v);
+      });
+    });
+    return merged;
+  }
+
+export const as1d = (a) => [].concat.apply([], a);
+
+export const selectBranch = (map,test) => {
+    const pipeline = map.find((pm)=>pm.includes(test)); 
+    const testIndex = pipeline.findIndex((t) => t === test);
+    return pipeline.slice(0, testIndex + 1);
+  }

src/Queries.jsx

@@ -2,26 +2,24 @@ import { useQuery } from '@tanstack/react-query'
 
 const QUALITEER_URL = "https://qualiteer.elijahparker3.repl.co/api";
 
-export const useCatalogTests = () => useQuery(['catalogTests'], () =>
-    fetch(`${QUALITEER_URL}/catalog/tests`).then(res =>
-      res.json()
-    )
+const useMock = true;
+
+const asMock = (data) => ({ data });
+
+const fetchApi = (subPath)=> async ()=> fetch(`${QUALITEER_URL}${subPath}`).then((res)=>res.json());
+
+export const useCatalogTests = () => useMock ? asMock([]): useQuery(['catalogTests'], fetchApi("/catalog/tests")
   )
 
-export const usePipelineMappings = () => useQuery(['pipelineMappings'], () =>
-    fetch(`${QUALITEER_URL}/catalog/pipeline-mappings`).then(res =>
-      res.json()
-    )
+export const usePipelineMappings = () => useMock ? asMock([
+  ["primary", "secondary1", "tertiary1"],
+  ["primary", "secondary1", "tertiary2"],
+  ["primary", "secondary2", "tertiary3"],
+]) : useQuery(['pipelineMappings'], fetchApi("/catalog/pipeline-mappings")
   )
 
-export const useSilencedAlerts = () => useQuery(['silenced'], () =>
-    fetch(`${QUALITEER_URL}/alerting/silenced`).then(res =>
-      res.json()
-    )
+export const useSilencedAlerts = () => useMock? asMock([]) : useQuery(['silenced'], fetchApi("/alerting/silenced")
   )
 
-export const useCurrentlyFailing = () => useQuery(['failing'], () =>
-    fetch(`${QUALITEER_URL}/results/failing`).then(res =>
-      res.json()
-    )
+export const useCurrentlyFailing = () => useQuery(['failing'], useMock? asMock([]) : fetchApi("/results/failing")
   )

src/ctx/JobContext.jsx

@@ -94,11 +94,11 @@ export const JobProvider = ({ children }) => {
   function pipelineFactory(builderCache) {
     console.log("Would create pipeline with cache");
     console.log(builderCache);
-    return jobFactory({testNames: ["single"]});
+    return jobFactory({testNames: ["primary"]});
   }
 
   function jobFactory(builderCache) {
-    if(builderCache.pipelineMasterTrack) return pipelineFactory(builderCache);
+    if(builderCache.tracks) return pipelineFactory(builderCache);
     // Find test
     const i = new Initiator(url);
     const jobId = `j${Date.now()}`;

src/views/jobs/builder/PipelineTrackSelector.jsx

@@ -8,72 +8,46 @@ import AccordionSummary from "@mui/material/AccordionSummary";
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
 import Stack from "@mui/material/Stack";
+import {selectBranch, asTree, asBranches, as1d} from "../../../../lib/jobs/pipelines.js";
 
 function PipelineTrackSelector(props) {
   const { cache, setCache, back, next } = props;
-
-  const pipelineTracks = [];
-  for (var track of cache.primarySelectedMappings) {
-    for (var i in track) {
-      if (!pipelineTracks[i]) pipelineTracks[i] = [];
-      if (pipelineTracks[i].includes(track[i])) continue;
-      pipelineTracks[i].push(track[i]);
-    }
-  }
-
+  const {primarySelectedMappings: primaries} = cache;
   const addTrack = (test) => {
-    const pipelineMasterTrack = cache.pipelineMasterTrack ?? [];
-    for (var track of cache.primarySelectedMappings) {
-      const trackIndex = track.indexOf(test);
-      if (trackIndex === -1) continue;
-      const trackSlice = track.slice(0, trackIndex + 1);
-      trackSlice.forEach((t, i) => {
-        if (!pipelineMasterTrack[i]) pipelineMasterTrack[i] = [];
-        if (!pipelineMasterTrack[i].includes(t)) pipelineMasterTrack[i].push(t);
-      });
-      break;
-    }
-
-    console.log(pipelineMasterTrack);
-    setCache({ ...cache, pipelineMasterTrack });
+    const tracks = cache.tracks ?? [];     tracks.push(selectBranch(primaries, test));    
+    setCache({ ...cache, tracks});  
   };
 
   const removeTrack = (test) => {
-    const pipelineMasterTrack = cache.pipelineMasterTrack ?? [];
-    const toRemove = [];
-    for (var mapping of cache.primarySelectedMappings) {
-      const testIndex = mapping.indexOf(test);
-      if (testIndex === -1) continue;
-      const removeSlice = mapping.slice(testIndex, mapping.length);
-      toRemove.push(...removeSlice);
+    const {tracks} = cache;
+    for(var i in tracks){
+      const index = tracks[i].indexOf(test);
+      if(index===-1) continue;
+      tracks[i] = tracks[i].slice(0,index);
     }
-
-    for (var i in pipelineMasterTrack) {
-      pipelineMasterTrack[i] = pipelineMasterTrack[i].filter(
-        (t) => !toRemove.includes(t)
-      );
-    }
-    setCache({ ...cache, pipelineMasterTrack });
+    setCache({ ...cache, tracks});
   };
 
   const selectTrack = (test) => () => {
-    const pipelineMasterTrack = cache.pipelineMasterTrack ?? [];
-    if (![].concat.apply([], pipelineMasterTrack).includes(test))
-      return addTrack(test);
-    removeTrack(test);
+    if(as1d(cache.tracks).includes(test)) return removeTrack(test);
+    addTrack(test);
   };
 
-  const getColor = (test) => {
-    return [].concat.apply([], cache.pipelineMasterTrack).includes(test)
+  const getColor = (test) => as1d(cache.tracks).includes(test)
       ? "primary"
       : null;
-  };
+
+  const nextClick = () => {
+    
+    setCache({...cache, branches: asBranches(primaries), tree: asTree(cache.tracks)});
+    next();
+  }
 
   return (
     <React.Fragment>
       <DialogContent>
         <h3>Select Track</h3>
-        {pipelineTracks.map((track, i) => (
+        {asBranches(primaries).map((track, i) => (
           <React.Fragment key={i}>
             <Typography variant="h6">{i + 1}</Typography>
             <Box>
@@ -108,7 +82,7 @@ function PipelineTrackSelector(props) {
       </DialogContent>
       <DialogActions>
         <Button onClick={back}>Back</Button>
-        <Button onClick={next} autoFocus>
+        <Button onClick={nextClick} autoFocus>
           Next
         </Button>
       </DialogActions>