bunny-lab/Borealis-Github-Replica
1
0
Fork 0
mirror of https://github.com/bunny-lab-io/Borealis.git synced 2025-09-11 01:48:42 -06:00
Code Issues Packages Projects Releases Wiki Activity

Added Quick Job Button to Device Details Page

Browse Source
This commit is contained in:
Nicole Rappe
2025-09-04 16:23:23 -06:00
parent ee7c6f3062
commit 9913ee673b
1 changed files with 48 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
Data/Server/WebUI/src/Devices/Device_Details.jsx
View File

@@ -28,6 +28,7 @@ import "prismjs/components/prism-powershell";
import "prismjs/components/prism-batch"; import "prismjs/components/prism-batch";
import "prismjs/themes/prism-okaidia.css"; import "prismjs/themes/prism-okaidia.css";
import Editor from "react-simple-code-editor"; import Editor from "react-simple-code-editor";
import QuickJob from "../Scheduling/Quick_Job.jsx";
export default function DeviceDetails({ device, onBack }) { export default function DeviceDetails({ device, onBack }) {
const [tab, setTab] = useState(0); const [tab, setTab] = useState(0);
@@ -44,6 +45,7 @@ export default function DeviceDetails({ device, onBack }) {
const [outputTitle, setOutputTitle] = useState(""); const [outputTitle, setOutputTitle] = useState("");
const [outputContent, setOutputContent] = useState(""); const [outputContent, setOutputContent] = useState("");
const [outputLang, setOutputLang] = useState("powershell"); const [outputLang, setOutputLang] = useState("powershell");
const [quickJobOpen, setQuickJobOpen] = useState(false);
// Snapshotted status for the lifetime of this page // Snapshotted status for the lifetime of this page
const [lockedStatus, setLockedStatus] = useState(() => { const [lockedStatus, setLockedStatus] = useState(() => {
// Prefer status provided by the device list row if available // Prefer status provided by the device list row if available
@@ -671,28 +673,45 @@ export default function DeviceDetails({ device, onBack }) {
return ( return (
<Paper sx={{ m: 2, p: 2, bgcolor: "#1e1e1e" }} elevation={2}> <Paper sx={{ m: 2, p: 2, bgcolor: "#1e1e1e" }} elevation={2}>
<Box sx={{ mb: 2, display: "flex", alignItems: "center" }}> <Box sx={{ mb: 2, display: "flex", alignItems: "center", justifyContent: "space-between" }}>
{onBack && ( <Box sx={{ display: "flex", alignItems: "center" }}>
<Button variant="outlined" size="small" onClick={onBack} sx={{ mr: 2 }}> {onBack && (
Back <Button variant="outlined" size="small" onClick={onBack} sx={{ mr: 2 }}>
</Button> Back
)} </Button>
<Typography )}
variant="h6" <Typography
sx={{ color: "#58a6ff", display: "flex", alignItems: "center" }} variant="h6"
> sx={{ color: "#58a6ff", display: "flex", alignItems: "center" }}
<span >
style={{ <span
display: "inline-block", style={{
width: 10, display: "inline-block",
height: 10, width: 10,
borderRadius: 10, height: 10,
background: statusColor(status), borderRadius: 10,
marginRight: 8, background: statusColor(status),
marginRight: 8,
}}
/>
{agent.hostname || "Device Details"}
</Typography>
</Box>
<Box>
<Button
variant="outlined"
size="small"
disabled={!(agent?.hostname || device?.hostname)}
onClick={() => setQuickJobOpen(true)}
sx={{
color: !(agent?.hostname || device?.hostname) ? "#666" : "#58a6ff",
borderColor: !(agent?.hostname || device?.hostname) ? "#333" : "#58a6ff",
textTransform: "none"
}} }}
/> >
{agent.hostname || "Device Details"} Quick Job
</Typography> </Button>
</Box>
</Box> </Box>
<Tabs <Tabs
value={tab} value={tab}
@@ -730,6 +749,14 @@ export default function DeviceDetails({ device, onBack }) {
<Button onClick={() => setOutputOpen(false)} sx={{ color: "#58a6ff" }}>Close</Button> <Button onClick={() => setOutputOpen(false)} sx={{ color: "#58a6ff" }}>Close</Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
{quickJobOpen && (
<QuickJob
open={quickJobOpen}
onClose={() => setQuickJobOpen(false)}
hostnames={[agent?.hostname || device?.hostname].filter(Boolean)}
/>
)}
</Paper> </Paper>
); );
} }