91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
import { useState, useEffect } from "react";
|
|
import PipelineTriggerWidget from "./PipelineTriggerWidget.jsx";
|
|
import useMediaQuery from "@mui/material/useMediaQuery";
|
|
import { useTheme } from "@mui/material/styles";
|
|
import Box from "@mui/material/Box";
|
|
import Button from "@mui/material/Button";
|
|
import DialogTitle from "@mui/material/DialogTitle";
|
|
import DialogContent from "@mui/material/DialogContent";
|
|
import DialogActions from "@mui/material/DialogActions";
|
|
import Dialog from "@mui/material/Dialog";
|
|
import Typography from "@mui/material/Typography";
|
|
import TextField from "@mui/material/TextField";
|
|
import Toolbar from "@mui/material/Toolbar";
|
|
|
|
export function usePipelineTriggerDialog(isOpen = false) {
|
|
const [open, setOpen] = useState(isOpen);
|
|
const [trigger, setTrigger] = useState({});
|
|
const dialogToggle = () => setOpen(!open);
|
|
const dialogClose = (confirmedTrigger) => {
|
|
setOpen(false);
|
|
if (!confirmedTrigger) return;
|
|
setTrigger({});
|
|
};
|
|
return [open, dialogToggle, trigger, setTrigger, dialogClose];
|
|
}
|
|
|
|
export default function PipelineTriggerDialog(props) {
|
|
const { trigger, open, onClose } = props;
|
|
const theme = useTheme();
|
|
const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
|
|
useEffect(() => {
|
|
if (!trigger.triggerAt) return;
|
|
const expiredInterval = setInterval(() => {
|
|
if (Date.now() < trigger.triggerAt.valueOf()) return;
|
|
onClose();
|
|
clearInterval(expiredInterval);
|
|
}, 1000);
|
|
return () => clearInterval(expiredInterval);
|
|
}, [trigger, open]);
|
|
return (
|
|
<Dialog
|
|
sx={
|
|
fullScreen
|
|
? {}
|
|
: { "& .MuiDialog-paper": { width: "80%", maxHeight: 525 } }
|
|
}
|
|
maxWidth="xs"
|
|
open={open}
|
|
fullScreen={fullScreen}
|
|
>
|
|
<Toolbar sx={{ display: { sm: "none" } }} />
|
|
<DialogTitle>Pipeline Timeout</DialogTitle>
|
|
<DialogContent>
|
|
<Box
|
|
style={{
|
|
display: "flex",
|
|
justifyContent: "center",
|
|
flexWrap: "wrap",
|
|
}}
|
|
>
|
|
<Typography
|
|
margin="normal"
|
|
component={"div"}
|
|
style={{
|
|
margin: "auto",
|
|
width: "100%",
|
|
wordBreak: "break-word",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
textAlign: "center",
|
|
}}
|
|
>
|
|
<div>
|
|
<span style={{ fontWeight: "bold" }}>Test: </span>
|
|
{trigger.testName}
|
|
</div>
|
|
</Typography>
|
|
<TextField
|
|
margin="normal"
|
|
label="Expires"
|
|
value={JSON.stringify(trigger.jobReq)}
|
|
/>
|
|
</Box>
|
|
<PipelineTriggerWidget trigger={trigger} close={onClose} />
|
|
</DialogContent>
|
|
<DialogActions>
|
|
<Button onClick={onClose}>Close</Button>
|
|
</DialogActions>
|
|
</Dialog>
|
|
);
|
|
}
|