diff --git a/app/w/[id]/components/workflow-block/workflow-block.tsx b/app/w/[id]/components/workflow-block/workflow-block.tsx index 9990e16cda..150b080e48 100644 --- a/app/w/[id]/components/workflow-block/workflow-block.tsx +++ b/app/w/[id]/components/workflow-block/workflow-block.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef, useState } from 'react' -import { RectangleHorizontal, RectangleVertical } from 'lucide-react' +import { Info, RectangleHorizontal, RectangleVertical } from 'lucide-react' import { Handle, NodeProps, Position, useUpdateNodeInternals } from 'reactflow' import { Badge } from '@/components/ui/badge' import { Button } from '@/components/ui/button' @@ -165,7 +165,7 @@ export function WorkflowBlock({ id, data }: NodeProps) { } const handleNameSubmit = () => { - const trimmedName = editedName.trim() + const trimmedName = editedName.trim().slice(0, 18) if (trimmedName && trimmedName !== name) { updateBlockName(id, trimmedName) } @@ -230,17 +230,21 @@ export function WorkflowBlock({ id, data }: NodeProps) { setEditedName(e.target.value.slice(0, 40))} + onChange={(e) => setEditedName(e.target.value.slice(0, 18))} onBlur={handleNameSubmit} onKeyDown={handleNameKeyDown} autoFocus - className="font-medium text-md bg-transparent border-none outline-none p-0 w-[200px]" - maxLength={40} + className="font-medium text-md bg-transparent border-none outline-none p-0 w-[180px]" + maxLength={18} /> ) : ( {name} @@ -252,6 +256,49 @@ export function WorkflowBlock({ id, data }: NodeProps) { Disabled )} + {config.longDescription && ( + + + + + +
+
+

Description

+

{config.longDescription}

+
+ {config.outputs && ( +
+

Output

+
+ {Object.entries(config.outputs).map(([key, value]) => ( +
+ {key}{' '} + {typeof value.type === 'object' ? ( +
+ {Object.entries(value.type).map(([typeKey, typeValue]) => ( +
+ {typeKey}: + + {typeValue as string} + +
+ ))} +
+ ) : ( + {value.type as string} + )} +
+ ))} +
+
+ )} +
+
+
+ )}