feat: use api schema

web/app/components/plugins/plugin-detail-panel/tool-selector/reasoning-config-form.tsx

@@ -25,6 +25,7 @@ import { VarType } from '@/app/components/workflow/types'
 import cn from '@/utils/classnames'
 import { useBoolean } from 'ahooks'
 import SchemaModal from './schema-modal'
+import type { SchemaRoot } from '@/app/components/workflow/nodes/llm/types'
 
 type Props = {
   value: Record<string, any>
@@ -141,7 +142,10 @@ const ReasoningConfigForm: React.FC<Props> = ({
     setFalse: hideSchema,
   }] = useBoolean(false)
 
-  const renderField = (schema: any, showSchema: () => void) => {
+  const [schema, setSchema] = useState<SchemaRoot | null>(null)
+  console.log(schema)
+
+  const renderField = (schema: any, showSchema: (schema: SchemaRoot) => void) => {
     const {
       variable,
       label,
@@ -150,6 +154,7 @@ const ReasoningConfigForm: React.FC<Props> = ({
       type,
       scope,
       url,
+      input_schema,
     } = schema
     const auto = value[variable]?.auto
     const tooltipContent = (tooltip && (
@@ -192,7 +197,7 @@ const ReasoningConfigForm: React.FC<Props> = ({
             {tooltipContent}
             <span className='system-xs-regular mx-1 text-text-quaternary'>·</span>
             <span className='system-xs-regular text-text-tertiary'>{valueType}</span>
-            {!isShowSchemaTooltip && (
+            {isShowSchemaTooltip && (
               <Tooltip
                 popupContent={<div className='system-xs-medium text-text-secondary'>
                   {t('workflow.nodes.agent.clickToViewParameterSchema')}
@@ -200,7 +205,7 @@ const ReasoningConfigForm: React.FC<Props> = ({
                 asChild={false}>
                   <div
                     className='ml-0.5 cursor-pointer rounded-[4px] p-px text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary'
-                    onClick={showSchema}
+                    onClick={() => showSchema(input_schema as SchemaRoot)}
                   >
                     <RiBracesLine className='size-3.5'/>
                   </div>
@@ -313,10 +318,14 @@ const ReasoningConfigForm: React.FC<Props> = ({
   }
   return (
     <div className='space-y-3 px-4 py-2'>
-      {!isShowSchema && schemas.map(schema => renderField(schema, showSchema))}
+      {!isShowSchema && schemas.map(schema => renderField(schema, (s: SchemaRoot) => {
+        setSchema(s)
+        showSchema()
+      }))}
       {isShowSchema && (
         <SchemaModal
           isShow={isShowSchema}
+          schema={schema!}
           onClose={hideSchema}
         />
       )}

web/app/components/plugins/plugin-detail-panel/tool-selector/schema-modal.tsx

@@ -4,89 +4,19 @@ import React from 'react'
 import Modal from '@/app/components/base/modal'
 import VisualEditor from '@/app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor'
 import type { SchemaRoot } from '@/app/components/workflow/nodes/llm/types'
-import { Type } from '@/app/components/workflow/nodes/llm/types'
 import { MittProvider, VisualEditorContextProvider } from '@/app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor/context'
 import { useTranslation } from 'react-i18next'
 import { RiCloseLine } from '@remixicon/react'
 
-const testSchema: SchemaRoot = {
-    type: Type.object,
-    properties: {
-      after: {
-          type: Type.string,
-          description: 'The ID of the existing block that the new block should be appended after. If not provided, content will be appended at the end of the page.',
-      },
-      content_block: {
-          type: Type.object,
-          properties: {
-              block_property: {
-                  type: Type.string,
-                  description: 'The block property of the block to be added. Possible property are `paragraph`,`heading_1`,`heading_2`,`heading_3`,`callout`,`todo`,`toggle`,`quote`, `bulleted_list_item`, `numbered_list_item`, other properties possible are `file`,`image`,`video` (link required).',
-              },
-              bold: {
-                  type: Type.boolean,
-                  description: 'Indicates if the text is bold.',
-              },
-              code: {
-                  type: Type.boolean,
-                  description: 'Indicates if the text is formatted as code.',
-              },
-              color: {
-                  type: Type.string,
-                  description: 'The color of the text background or text itself.',
-              },
-              content: {
-                  anyOf: [
-                      {
-                          type: Type.string,
-                      },
-                      {
-                          enum: [
-                              'null',
-                          ],
-                          nullable: true,
-                      },
-                  ],
-                  description: 'The textual content of the rich text object. Required for paragraph, heading_1, heading_2, heading_3, callout, todo, toggle, quote.',
-              },
-              italic: {
-                  type: Type.boolean,
-                  description: 'Indicates if the text is italic.',
-              },
-              link: {
-                  type: Type.string,
-                  description: 'The URL of the rich text object or the file to be uploaded or image/video link',
-              },
-              strikethrough: {
-                  type: Type.boolean,
-                  description: 'Indicates if the text has strikethrough.',
-              },
-              underline: {
-                  type: Type.boolean,
-                  description: 'Indicates if the text is underlined.',
-              },
-          },
-          additionalProperties: false,
-          description: 'Child content to append to a page.',
-      },
-      parent_block_id: {
-          type: Type.string,
-          description: 'The ID of the page which the children will be added.',
-      },
-  },
-  required: [
-      'content_block',
-      'parent_block_id',
-  ],
-  additionalProperties: false,
-}
 type Props = {
   isShow: boolean
+  schema: SchemaRoot
   onClose: () => void
 }
 
 const SchemaModal: FC<Props> = ({
   isShow,
+  schema,
   onClose,
 }) => {
   const { t } = useTranslation()
@@ -112,7 +42,7 @@ const SchemaModal: FC<Props> = ({
           <MittProvider>
             <VisualEditorContextProvider>
               <VisualEditor
-                schema={testSchema}
+                schema={schema}
                 readOnly
               ></VisualEditor>
             </VisualEditorContextProvider>