mirror of
https://github.com/johndoe6345789/AutoMetabuilder.git
synced 2026-04-25 06:15:01 +00:00
6e9ff896e7
- Created custom hooks: useWorkflowGraph, useWorkflowPlugins, usePluginSearch, useTabNavigation - Decomposed canvas logic into: useCanvasNodes, useCanvasEdges, useCanvasDragDrop - Built atomic node components: NodeHeader, NodeBody, NodePorts - Created canvas UI components: CanvasInfoPanel, CanvasHintPanel - Split builder into: LoadingState, ErrorState, WorkflowBuilderHeader, WorkflowBuilderTabs, WorkflowBuilderContent - Added React Flow for n8n-style visual canvas with drag-and-drop - All components now under 100 LOC following PROMPT.md guidelines Co-authored-by: johndoe6345789 <224850594+johndoe6345789@users.noreply.github.com>
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
import { Stack, Typography } from "@mui/material";
|
|
|
|
type NodeBodyProps = {
|
|
label: string;
|
|
category?: string;
|
|
inputCount: number;
|
|
outputCount: number;
|
|
t: (key: string, fallback?: string) => string;
|
|
};
|
|
|
|
export default function NodeBody({ label, category, inputCount, outputCount, t }: NodeBodyProps) {
|
|
return (
|
|
<Stack spacing={0.5}>
|
|
<Typography
|
|
variant="body2"
|
|
sx={{
|
|
fontWeight: 500,
|
|
color: "var(--color-text-strong)",
|
|
}}
|
|
>
|
|
{label}
|
|
</Typography>
|
|
|
|
{category && (
|
|
<Typography variant="caption" color="text.secondary">
|
|
{t(`ui.workflow.category.${category}`, category)}
|
|
</Typography>
|
|
)}
|
|
|
|
<Stack direction="row" spacing={1}>
|
|
{inputCount > 0 && (
|
|
<Typography variant="caption" color="text.secondary">
|
|
{t("ui.workflow.node.inputs", "In: {count}").replace("{count}", String(inputCount))}
|
|
</Typography>
|
|
)}
|
|
{outputCount > 0 && (
|
|
<Typography variant="caption" color="text.secondary">
|
|
{t("ui.workflow.node.outputs", "Out: {count}").replace("{count}", String(outputCount))}
|
|
</Typography>
|
|
)}
|
|
</Stack>
|
|
</Stack>
|
|
);
|
|
}
|