elysium/qualiteer
elysium/qualiteer
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Super Pipelines and display

Browse source
This commit is contained in:
Dunemask 2022-08-09 14:07:53 +00:00
parent 8ad56e8d38
commit c05502f15c
8 changed files with 223 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/views/jobs/JobPipelineBox.jsx Normal file
View file

@ -0,0 +1,50 @@
import React, { useState, useContext } from "react";
import StoreContext from "../../ctx/StoreContext.jsx";
import JobContext, { jobStatus } from "../../ctx/JobContext.jsx";
import Accordion from "@mui/material/Accordion";
import AccordionDetails from "@mui/material/AccordionDetails";
import AccordionSummary from "@mui/material/AccordionSummary";
import Typography from "@mui/material/Typography";
import IconButton from "@mui/material/IconButton";
import CheckIcon from "@mui/icons-material/Check";
import ClearIcon from "@mui/icons-material/Clear";
import ViewColumnIcon from "@mui/icons-material/ViewColumn";
import PendingIcon from "@mui/icons-material/Pending";
import VisibilityIcon from "@mui/icons-material/Visibility";
import DoNotDisturbIcon from "@mui/icons-material/DoNotDisturb";
import Box from "@mui/material/Box";
import Stack from "@mui/material/Stack";
export default function JobPipelineBox(props) {
const { pipeline } = props;
function jobIcon() {
return <ViewColumnIcon />;
}
return (
<Accordion expanded={false} disableGutters={true} square>
<AccordionSummary
style={{
backgroundColor: "rgba(0, 0, 0, .03)",
flexWrap: "wrap",
}}
>
<Typography
component={"span"}
style={{ wordBreak: "break-word", margin: "auto 0" }}
>
{pipeline.id}
</Typography>
<Stack sx={{ ml: "auto" }}>
<IconButton aria-label="" component="span">
{jobIcon()}
</IconButton>
</Stack>
</AccordionSummary>
</Accordion>
);
}

63
src/views/jobs/JobPipelineDisplay.jsx Normal file
View file

@ -0,0 +1,63 @@
import React, { useContext } from "react";
import {useNavigate} from "react-router-dom";
import JobContext from "../../ctx/JobContext.jsx";
import Button from "@mui/material/Button";
import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@mui/material/AccordionSummary";
import Box from "@mui/material/Box";
import Typography from "@mui/material/Typography";
import Stack from "@mui/material/Stack";
function JobPipelineDisplay(props) {
const { back, pipeline } = props;
const {state: jobState} = useContext(JobContext);
const navigate = useNavigate();
const pipelineJobs = jobState.jobs.filter((j)=>j.isPipeline && j.pipelineId === pipeline.id);
const selectJob = (testName) => () =>{
const job = pipelineJobs.find((j)=>j.branchId === testName);
if(!job) return; navigate(`/qualiteer/jobs#${job.jobId}`);
}
return (
<React.Fragment>
<h3>{}</h3>
{pipeline.branches.map((track, i) => (
<React.Fragment key={i}>
<Typography variant="h6">{i + 1}</Typography>
<Box>
{track.map((test, j) => (
<Accordion
expanded={false}
disableGutters={true}
square
key={j}
onClick={selectJob(test)}
>
<AccordionSummary
style={{
backgroundColor: "rgba(0, 0, 0, .03)",
flexWrap: "wrap",
}}
>
<Typography
component={"span"}
style={{ wordBreak: "break-word", margin: "auto 0" }}
>
{test}
</Typography>
<Stack sx={{ ml: "auto" }}>I</Stack>
</AccordionSummary>
</Accordion>
))}
</Box>
</React.Fragment>
))}
</React.Fragment>
);
}
export default JobPipelineDisplay;

3
src/views/jobs/JobView.jsx
View file

@ -72,7 +72,10 @@ export default function JobView(props) {
cb();
};
function navigateToJobs() {
if(job.isPipeline) return navigate(`/qualiteer/jobs#p${job.pipelineId}`)
navigate("/qualiteer/jobs");
}

26
src/views/jobs/Jobs.jsx
View file

@ -3,7 +3,9 @@ import { useLocation, useNavigate } from "react-router-dom";
import JobContext from "../../ctx/JobContext.jsx";
import JobBox from "./JobBox.jsx";
import JobPipelineBox from "./JobPipelineBox.jsx";
import JobView from "./JobView.jsx";
import JobPipelineDisplay from "./JobPipelineDisplay.jsx";
import JobBuilder from "./builder/JobBuilder.jsx";
import Typography from "@mui/material/Typography";
import Box from "@mui/material/Box";
@ -15,7 +17,11 @@ export default function Jobs() {
useEffect(() => {
const jobName = location.hash.slice(1);
if (!jobName || jobState.jobs.find((job) => job.name === jobName)) return;
const pipelineId = jobName.slice(1);
const noPipeline = !jobName || jobState.pipelines.find((p)=>p.id ===pipelineId);
const noJob = !jobName || jobState.jobs.find((job) => job.name === jobName)
if(!noPipeline || !noJob) return;
navigate("/qualiteer/jobs");
});
@ -45,8 +51,9 @@ export default function Jobs() {
</React.Fragment>
) : null}
<JobBuilder />
{location.hash === "" &&
jobState.jobs
{location.hash === "" &&(
<React.Fragment>
{jobState.jobs
.filter((j) => !j.isPipeline)
.map((v, i) => (
<a
@ -55,10 +62,15 @@ export default function Jobs() {
style={{ textDecoration: "none" }}
>
<JobBox job={v} />
</a>
))}
{jobState.jobs.find((job) => job.name === location.hash.slice(1)) && (
<JobView
</a>))}
{jobState.pipelines.map((p,i)=><a key={i} style={{textDecoration: "none"}} href={`/qualiteer/jobs#p${p.id}`}>
<JobPipelineBox pipeline={p}/>
</a>)}
</React.Fragment>)
}
{ location.hash[1] === "p"? <JobPipelineDisplay pipeline={jobState.pipelines.find((p)=>p.id===location.hash.slice(2))}/> :
jobState.jobs.find((job) => job.name === location.hash.slice(1)) && (<JobView
job={jobState.jobs.find((job) => job.name === location.hash.slice(1))}
/>
)}