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

Node Configuration Sidebar Milestone 3

Browse Source
This commit is contained in:
Nicole Rappe
2025-05-15 00:26:31 -06:00
parent 6f6fc96d17
commit cb2a974520
3 changed files with 45 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
Data/Server/WebUI/src/Node_Configuration_Sidebar.jsx
View File

@ -1,13 +1,17 @@
////////// PROJECT FILE SEPARATION LINE ////////// CODE AFTER THIS LINE ARE FROM: <ProjectRoot>/Data/WebUI/src/Node_Configuration_Sidebar.jsx
import { Box, Typography, Tabs, Tab, TextField } from "@mui/material";
import React, { useState } from "react";
import { useReactFlow } from "reactflow";
export default function NodeConfigurationSidebar({ drawerOpen, setDrawerOpen, title, nodeData }) {
const [activeTab, setActiveTab] = useState(0);
const { setNodes } = useReactFlow();
const handleTabChange = (_, newValue) => setActiveTab(newValue);
const renderConfigFields = () => {
const config = nodeData?.config || [];
const nodeId = nodeData?.nodeId;
return config.map((field, index) => (
<Box key={index} sx={{ mb: 2 }}>
<Typography variant="body2" sx={{ color: "#ccc", mb: 0.5 }}>
@ -18,6 +22,18 @@ export default function NodeConfigurationSidebar({ drawerOpen, setDrawerOpen, ti
size="small"
fullWidth
value={nodeData?.[field.key] || ""}
onChange={(e) => {
const newValue = e.target.value;
if (!nodeId) return;
setNodes((nds) =>
nds.map((n) =>
n.id === nodeId
? { ...n, data: { ...n.data, [field.key]: newValue } }
: n
)
);
window.BorealisValueBus[nodeId] = newValue;
}}
InputProps={{
sx: {
backgroundColor: "#1e1e1e",
@ -90,7 +106,7 @@ export default function NodeConfigurationSidebar({ drawerOpen, setDrawerOpen, ti
{activeTab === 0 && renderConfigFields()}
{activeTab === 1 && (
<Typography sx={{ whiteSpace: "pre-wrap", fontSize: "0.85rem", color: "#aaa" }}>
{nodeData?.usage_documentation || "No documentation provided for this node."}
{nodeData?.usage_documentation || "No usage documentation provided for this node."}
</Typography>
)}
</Box>