bunny-lab/Borealis-Github-Replica
1
0
Fork 0
mirror of https://github.com/bunny-lab-io/Borealis.git synced 2025-07-27 17:38:28 -06:00
Code Issues Packages Projects Releases Wiki Activity

Added Tooltips and Misc Fixes

Browse Source
This commit is contained in:
Nicole Rappe
2025-05-01 00:51:05 -06:00
parent cf14ee0111
commit a6f40d2502
8 changed files with 543 additions and 459 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
Data/Server/WebUI/src/Node_Sidebar.jsx
View File

@ -8,7 +8,8 @@ import {
Button,
Tooltip,
Typography,
IconButton
IconButton,
Box
} from "@mui/material";
import {
ExpandMore as ExpandMoreIcon,
@ -71,15 +72,21 @@ export default function NodeSidebar({
</Typography>
</AccordionSummary>
<AccordionDetails sx={{ p: 0, bgcolor: "#232323" }}>
<Button fullWidth startIcon={<SaveIcon />} onClick={handleExportFlow} sx={buttonStyle}>
Export Current Flow
</Button>
<Button fullWidth startIcon={<FileOpenIcon />} onClick={handleImportFlow} sx={buttonStyle}>
Import Flow
</Button>
<Button fullWidth startIcon={<DeleteForeverIcon />} onClick={handleOpenCloseAllDialog} sx={buttonStyle}>
Close All Flows
</Button>
<Tooltip title="Export Current Tab to a JSON File" placement="right" arrow>
<Button fullWidth startIcon={<SaveIcon />} onClick={handleExportFlow} sx={buttonStyle}>
Export Current Flow
</Button>
</Tooltip>
<Tooltip title="Import JSON File into New Flow Tab" placement="right" arrow>
<Button fullWidth startIcon={<FileOpenIcon />} onClick={handleImportFlow} sx={buttonStyle}>
Import Flow
</Button>
</Tooltip>
<Tooltip title="Destroy all Flow Tabs Immediately" placement="right" arrow>
<Button fullWidth startIcon={<DeleteForeverIcon />} onClick={handleOpenCloseAllDialog} sx={buttonStyle}>
Close All Flows
</Button>
</Tooltip>
</AccordionDetails>
</Accordion>
@ -176,17 +183,30 @@ export default function NodeSidebar({
</div>
{/* Bottom toggle button */}
<div style={{ padding: "6px", borderTop: "1px solid #333", display: "flex", justifyContent: "center" }}>
<Tooltip title={collapsed ? "Expand Sidebar" : "Collapse Sidebar"} placement="right">
<IconButton
onClick={() => setCollapsed(!collapsed)}
size="small"
sx={{ color: "#888" }}
>
{collapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}
</IconButton>
</Tooltip>
</div>
<Tooltip title={collapsed ? "Expand Sidebar" : "Collapse Sidebar"} placement="left">
<Box
onClick={() => setCollapsed(!collapsed)}
sx={{
height: "36px",
borderTop: "1px solid #333",
cursor: "pointer",
display: "flex",
alignItems: "center",
justifyContent: "center",
color: "#888",
backgroundColor: "#121212",
transition: "background-color 0.2s ease",
"&:hover": {
backgroundColor: "#1e1e1e"
},
"&:active": {
backgroundColor: "#2a2a2a"
}
}}
>
{collapsed ? <ChevronLeftIcon /> : <ChevronRightIcon />}
</Box>
</Tooltip>
</div>
);
}