Merge pull request #2199 from theit8514/log-window-improvements

Log window improvements
This commit is contained in:
hydroflame 2021-12-28 10:32:04 -05:00 committed by GitHub
commit 8b42703f95
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -77,6 +77,16 @@ interface IProps {
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
title: {
"&.is-minimized + *": {
border: "none",
margin: 0,
"max-height": 0,
padding: 0,
"pointer-events": "none",
visibility: "hidden"
},
},
logs: { logs: {
overflowY: "scroll", overflowY: "scroll",
overflowX: "hidden", overflowX: "hidden",
@ -107,6 +117,7 @@ function LogWindow(props: IProps): React.ReactElement {
const classes = useStyles(); const classes = useStyles();
const container = useRef<HTMLDivElement>(null); const container = useRef<HTMLDivElement>(null);
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
const [minimized, setMinimized] = useState(false);
function rerender(): void { function rerender(): void {
setRerender((old) => !old); setRerender((old) => !old);
} }
@ -140,15 +151,19 @@ function LogWindow(props: IProps): React.ReactElement {
rerender(); rerender();
} }
function title(): string { function title(full = false): string {
const maxLength = 30; const maxLength = 30;
const t = `${script.filename} ${script.args.map((x: any): string => `${x}`).join(" ")}`; const t = `${script.filename} ${script.args.map((x: any): string => `${x}`).join(" ")}`;
if (t.length <= maxLength) { if (full || t.length <= maxLength) {
return t; return t;
} }
return t.slice(0, maxLength - 3) + "..."; return t.slice(0, maxLength - 3) + "...";
} }
function minimize(): void {
setMinimized(!minimized);
}
function lineClass(s: string): string { function lineClass(s: string): string {
if (s.match(/(^\[[^\]]+\] )?ERROR/) || s.match(/(^\[[^\]]+\] )?FAIL/)) { if (s.match(/(^\[[^\]]+\] )?ERROR/) || s.match(/(^\[[^\]]+\] )?FAIL/)) {
return classes.error; return classes.error;
@ -180,18 +195,20 @@ function LogWindow(props: IProps): React.ReactElement {
> >
<div onMouseDown={updateLayer}> <div onMouseDown={updateLayer}>
<Paper <Paper
className={classes.title + " " + (minimized ? 'is-minimized' : '')}
style={{ style={{
cursor: "grab", cursor: "grab",
}} }}
> >
<Box className="drag" display="flex" alignItems="center"> <Box className="drag" display="flex" alignItems="center">
<Typography color="primary" variant="h6"> <Typography color="primary" variant="h6" title={title(true)}>
{title()} {title()}
</Typography> </Typography>
<Box position="absolute" right={0}> <Box position="absolute" right={0}>
{!workerScripts.has(script.pid) && <Button onClick={run}>Run</Button>} {!workerScripts.has(script.pid) && <Button onClick={run}>Run</Button>}
{workerScripts.has(script.pid) && <Button onClick={kill}>Kill</Button>} {workerScripts.has(script.pid) && <Button onClick={kill}>Kill</Button>}
<Button onClick={minimize}>{minimized ? "\u{1F5D6}" : "\u{1F5D5}"}</Button>
<Button onClick={props.onClose}>Close</Button> <Button onClick={props.onClose}>Close</Button>
</Box> </Box>
</Box> </Box>