mirror of
https://github.com/johndoe6345789/AutoMetabuilder.git
synced 2026-04-24 13:54:59 +00:00
- 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>
29 lines
916 B
TypeScript
29 lines
916 B
TypeScript
"use client";
|
|
|
|
import { Paper, Stack, Typography } from "@mui/material";
|
|
|
|
type WorkflowInspectorProps = {
|
|
t: (key: string, fallback?: string) => string;
|
|
};
|
|
|
|
export default function WorkflowInspector({ t }: WorkflowInspectorProps) {
|
|
return (
|
|
<Paper sx={{ p: 2, minHeight: 400, backgroundColor: "var(--color-panel-alt)" }}>
|
|
<Typography variant="subtitle1" gutterBottom>
|
|
{t("ui.workflow.inspector.title", "Inspector")}
|
|
</Typography>
|
|
<Typography variant="body2" color="text.secondary">
|
|
{t(
|
|
"ui.workflow.inspector.empty",
|
|
"Select a node or edge to view and edit properties"
|
|
)}
|
|
</Typography>
|
|
<Stack spacing={2} sx={{ mt: 2 }}>
|
|
<Typography variant="caption" color="text.secondary">
|
|
{t("ui.workflow.inspector.hint", "Node properties will appear here when selected")}
|
|
</Typography>
|
|
</Stack>
|
|
</Paper>
|
|
);
|
|
}
|