chore: enable auto collapse

web/app/components/workflow/nodes/_base/components/collapse/field-collapse.tsx

@@ -4,11 +4,15 @@ import Collapse from '.'
 type FieldCollapseProps = {
   title: string
   children: ReactNode
+  collapsed?: boolean
+  onCollapse?: (collapsed: boolean) => void
   operations?: ReactNode
 }
 const FieldCollapse = ({
   title,
   children,
+  collapsed,
+  onCollapse,
   operations,
 }: FieldCollapseProps) => {
   return (
@@ -18,6 +22,8 @@ const FieldCollapse = ({
           <div className='system-sm-semibold-uppercase flex h-6 cursor-pointer items-center text-text-secondary'>{title}</div>
         }
         operations={operations}
+        collapsed={collapsed}
+        onCollapse={onCollapse}
       >
         <div className='px-4'>
           {children}

web/app/components/workflow/nodes/_base/components/output-vars.tsx

@@ -9,18 +9,24 @@ type Props = {
   title?: string
   children: ReactNode
   operations?: ReactNode
+  collapsed?: boolean
+  onCollapse?: (collapsed: boolean) => void
 }
 
 const OutputVars: FC<Props> = ({
   title,
   children,
   operations,
+  collapsed,
+  onCollapse,
 }) => {
   const { t } = useTranslation()
   return (
     <FieldCollapse
       title={title || t('workflow.nodes.common.outputVars')}
       operations={operations}
+      collapsed={collapsed}
+      onCollapse={onCollapse}
     >
       {children}
     </FieldCollapse>

web/app/components/workflow/nodes/llm/panel.tsx

@@ -68,6 +68,8 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
     setContexts,
     runningStatus,
     isModelSupportStructuredOutput,
+    structuredOutputCollapsed,
+    setStructuredOutputCollapsed,
     handleStructureOutputEnableChange,
     handleStructureOutputChange,
     handleRun,
@@ -289,6 +291,8 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
       </div>
       <Split />
       <OutputVars
+        collapsed={structuredOutputCollapsed}
+        onCollapse={setStructuredOutputCollapsed}
         operations={
           <div className='mr-4 flex items-center'>
             {!isModelSupportStructuredOutput && (

web/app/components/workflow/nodes/llm/use-config.ts

@@ -285,11 +285,14 @@ const useConfig = (id: string, payload: LLMNodeType) => {
     ?.models.find(modelItem => modelItem.model === model?.name)
     ?.features?.includes(ModelFeatureEnum.StructuredOutput)
 
+  const [structuredOutputCollapsed, setStructuredOutputCollapsed] = useState(true)
   const handleStructureOutputEnableChange = useCallback((enabled: boolean) => {
     const newInputs = produce(inputs, (draft) => {
       draft.structured_output_enabled = enabled
     })
     setInputs(newInputs)
+    if (enabled)
+      setStructuredOutputCollapsed(false)
   }, [inputs, setInputs])
 
   const handleStructureOutputChange = useCallback((newOutput: StructuredOutput) => {
@@ -432,6 +435,8 @@ const useConfig = (id: string, payload: LLMNodeType) => {
     runningStatus,
     isModelSupportStructuredOutput,
     handleStructureOutputChange,
+    structuredOutputCollapsed,
+    setStructuredOutputCollapsed,
     handleStructureOutputEnableChange,
     handleRun,
     handleStop,