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

Job navigation rewrite

Browse source
This commit is contained in:
Elijah Dunemask 2022-08-13 20:43:35 +00:00
parent aced10d083
commit 4097c121e3
10 changed files with 242 additions and 67 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,4 +1,4 @@
import React, { useState, useContext, useEffect } from "react";
import React, { useContext, useEffect } from "react";
import { useLocation, useNavigate } from "react-router-dom";
import JobContext from "@qltr/jobs";
@ -15,14 +15,33 @@ export default function Jobs() {
const location = useLocation();
const navigate = useNavigate();
const jobViewPrefix = "#job-";
const pipelineViewPrefix = "#pipeline-";
const cachePrefix = "#cache-";
function jobHashLoader() {
const { hash } = location;
if (!hash) return {};
const jobIndex = hash.indexOf(jobViewPrefix);
const pipelineIndex = hash.indexOf(pipelineViewPrefix);
const cacheIndex = hash.indexOf(cachePrefix);
const jobId = jobIndex !== 0 ? null : hash.slice(jobViewPrefix.length);
const pipelineId =
pipelineIndex !== 0 ? null : hash.slice(pipelineViewPrefix.length);
const cacheData = cacheIndex !== 0 ? null : hash.slice(cachePrefix.length);
const job = !jobId ? null : jobState.jobs.find((j) => j.jobId === jobId);
const pipeline = !pipelineId
? null
: jobState.pipelines.find((p) => p.id === pipelineId);
const builderCache = !cacheData ? null : { fakedata: "yep" };
return { job, pipeline, builderCache };
}
const jobHash = jobHashLoader();
useEffect(() => {
const jobName = location.hash.slice(1);
const pipelineId = jobName.slice(1);
if (!jobName || !pipelineId) return;
const hasJob = jobState.pipelines.find((p) => p.id === pipelineId);
const hasPipeline = jobState.jobs.find((job) => job.name === jobName);
if (hasPipeline || hasJob) return;
if (jobName || pipelineId) navigate("/qualiteer/jobs");
const { job, pipeline, builderCache } = jobHash;
if (!job && !pipeline && !builderCache) navigate("/qualiteer/jobs");
});
return (
@ -59,7 +78,7 @@ export default function Jobs() {
.map((v, i) => (
<a
key={i}
href={`/qualiteer/jobs#${v.name}`}
href={`/qualiteer/jobs#job-${v.jobId}`}
style={{ textDecoration: "none" }}
>
<JobBox job={v} />
@ -69,7 +88,7 @@ export default function Jobs() {
<a
key={i}
style={{ textDecoration: "none" }}
href={`/qualiteer/jobs#p${p.id}`}
href={`/qualiteer/jobs#pipeline-${p.id}`}
>
<JobPipelineBox pipeline={p} />
</a>
@ -77,21 +96,8 @@ export default function Jobs() {
</React.Fragment>
)}
{location.hash[1] === "p"
? jobState.pipelines.find((p) => p.id === location.hash.slice(2)) && (
<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)
)}
/>
)}
{jobHash.pipeline && <JobPipelineDisplay pipeline={jobHash.pipeline} />}
{jobHash.job && <JobView job={jobHash.job} />}
</div>
);
}