statebuddy/src/App/BottomPanel.tsx

36 lines
No EOL
1.2 KiB
TypeScript

import { useEffect, useState } from "react";
import { TraceableError } from "../statecharts/parser";
import "./BottomPanel.css";
import head from "../head.svg" ;
import { PersistentDetails } from "./PersistentDetails";
import { DigitalWatch } from "@/Plant/DigitalWatch/DigitalWatch";
export function BottomPanel(props: {errors: TraceableError[]}) {
const [greeting, setGreeting] = useState(<><b><img src={head} style={{transform: "scaleX(-1)"}}/>&emsp;"Welcome to StateBuddy, buddy!"</b><br/></>);
useEffect(() => {
setTimeout(() => {
setGreeting(<></>);
}, 2000);
}, []);
return <div className="toolbar bottom">
{greeting}
<DigitalWatch alarm={true} light={true} h={12} m={30} s={33}/>
{props.errors.length > 0 &&
<div className="errorStatus">
<PersistentDetails initiallyOpen={false} localStorageKey="errorsExpanded">
<summary>{props.errors.length} errors</summary>
<div style={{maxHeight: '25vh', overflow: 'auto'}}>
{props.errors.map(({message, shapeUid})=>
<div>
{shapeUid}: {message}
</div>)}
</div>
</PersistentDetails>
</div>
}
</div>;
}