Scissors-Website/src/pages/DownloadPage.tsx

94 lines
3.9 KiB
TypeScript

import React, { useEffect, useState } from "react";
import "../css/HomePage.css"
import { Build, getBuilds, getJobs, Job } from "../util/Jenkins";
import "../css/DownloadPage.css"
import { Button } from "react-bootstrap";
import { Alert } from "react-bootstrap";
import { Container } from "react-bootstrap";
import dayjs from "dayjs";
// Currently the timestamp here is undefined regardless of jenkins timestamp!
const DownloadPage = () => {
const [jobs, setJobs] = useState(new Map<Job, Build[]>())
const [version, setVersion] = useState("1.19")
const versions = ["1.17.1", "1.18.2", "1.19"]
useEffect(() => {
doJobs().then(value => {
})
}, [])
function doJobs(): Promise<void> {
return new Promise(resolve => {
getJobs().then(value => {
for (let job of value) {
// if the job name is not included in versions array, then skip it.
if (!versions.includes(job.name)) {
continue;
}
getBuilds(job.name).then(value1 => {
setJobs(prevState => {
let newState = new Map(prevState)
newState.set(job, value1)
return newState
})
resolve()
})
}
})
})
}
function onClick(event: React.MouseEvent<HTMLLIElement>) {
setVersion(event.currentTarget.innerHTML)
}
return (
<Container fluid className="p-sm-0 p-md-4">
<Alert variant="secondary">
<Alert.Heading>Scissors Downloads</Alert.Heading>
<p>
You may download builds of Scissors from here. Select the version you would like below. If the downloads page is not working, please use our <a href="https://ci.scissors.gg/job/Scissors">CI Server</a> instead.
</p>
<hr />
<p className="mb-0">
P.S. If you know React, PLEASE help us make this look better. Our code is <a href="https://github.com/AtlasMediaGroup/Scissors-Website/tree/master">here</a>.
</p>
</Alert>
<ul className="versions">
{Array.from(jobs.keys()).sort(function(x, y) {
let x1 = x.name.split(".")
let y1 = y.name.split(".")
if (x1.length >= 3) {
x1 = x1.slice(0, x1.length - 1)
}
if (y1.length >= 3) {
y1 = y1.slice(0, y1.length - 1)
}
return y1.join(".") > x1.join(".") ? 1 : -1
}).map(value => {
return <li className={version === value.name ? "selected" : "selectable"}
onClick={onClick}>{value.name}</li>
})}
</ul>
<ul className="builds">
{jobs.get(Array.from(jobs.keys()).filter(value => value.name === version)[0])?.map(value => {
return <li>
<Button href={value.artifact ? `${value.url}/artifact/${value.artifact}` : value.url}>#{value.number}</Button>
<ul className={`changes-${value.number}`}>
{value.changes?.map(value1 => {
return <li>[<a href={`https://github.com/AtlasMediaGroup/Scissors/commit/${value1.id}`}>{value1.id}</a>]&nbsp;&nbsp;{value1.comment}</li>
})}
</ul>
<span className={value.changes && value.changes?.length > 0 ? "date" : "date nochanges"}>{dayjs(value.timestamp!).format("MM/DD/YYYY [at] h:mm A")}</span>
</li>
})}
</ul>
</Container >
);
}
export default DownloadPage;