Squashed 'ai-context/workbench-ui/' content from commit 32e36a5c

git-subtree-dir: ai-context/workbench-ui
git-subtree-split: 32e36a5c2131e429a7081cfaf67dabad3193cda3

src/components/flow-editor/FlowClassEditor.tsx

@@ -0,0 +1,58 @@
+import React from "react";
+import { Box, VStack, Heading, Text, Button } from "@chakra-ui/react";
+import { Construction } from "lucide-react";
+
+interface FlowClassEditorProps {
+  flowClassId?: string;
+  onClose?: () => void;
+}
+
+export const FlowClassEditor: React.FC<FlowClassEditorProps> = ({
+  flowClassId,
+  onClose,
+}) => {
+  return (
+    <Box
+      h="100vh"
+      bg="bg.subtle"
+      display="flex"
+      alignItems="center"
+      justifyContent="center"
+    >
+      <VStack
+        gap={6}
+        p={8}
+        bg="bg"
+        borderRadius="lg"
+        boxShadow="lg"
+        maxW="600px"
+      >
+        <Construction size={48} color="var(--colors-fg-muted)" />
+
+        <VStack gap={2} textAlign="center">
+          <Heading size="xl">Flow Class Editor</Heading>
+          <Text color="fg.muted" fontSize="lg">
+            Under Construction
+          </Text>
+        </VStack>
+
+        <VStack gap={3} textAlign="center">
+          <Text color="fg.subtle">
+            The Flow Class Editor is being rebuilt for a better experience.
+          </Text>
+          {flowClassId && (
+            <Text fontSize="sm" color="fg.muted">
+              Flow Class ID: <code>{flowClassId}</code>
+            </Text>
+          )}
+        </VStack>
+
+        {onClose && (
+          <Button onClick={onClose} variant="outline" size="lg">
+            Go Back
+          </Button>
+        )}
+      </VStack>
+    </Box>
+  );
+};