refactor: replace Toast notifications with emit for editing state management

web/app/components/workflow/nodes/llm/components/json-schema-config-modal/json-importer.tsx

@@ -9,7 +9,7 @@ import { JSON_SCHEMA_MAX_DEPTH } from '@/config'
 import CodeEditor from './code-editor'
 import ErrorMessage from './error-message'
 import { useVisualEditorStore } from './visual-editor/store'
-import Toast from '@/app/components/base/toast'
+import { useMittContext } from './visual-editor/context'
 
 type JsonImporterProps = {
   onSubmit: (schema: any) => void
@@ -27,6 +27,7 @@ const JsonImporter: FC<JsonImporterProps> = ({
   const importBtnRef = useRef<HTMLButtonElement>(null)
   const advancedEditing = useVisualEditorStore(state => state.advancedEditing)
   const isAddingNewField = useVisualEditorStore(state => state.isAddingNewField)
+  const { emit } = useMittContext()
 
   useEffect(() => {
     if (importBtnRef.current) {
@@ -38,15 +39,10 @@ const JsonImporter: FC<JsonImporterProps> = ({
 
   const handleTrigger = useCallback((e: React.MouseEvent<HTMLElement, MouseEvent>) => {
     e.stopPropagation()
-    if (advancedEditing || isAddingNewField) {
+    if (advancedEditing || isAddingNewField)
-      Toast.notify({
+      emit('quitEditing', {})
-        type: 'warning',
-        message: t('workflow.nodes.llm.jsonSchema.warningTips.jsonImport'),
-      })
-      return
-    }
     setOpen(!open)
-  }, [open, advancedEditing, isAddingNewField, t])
+  }, [open, advancedEditing, isAddingNewField, emit])
 
   const onClose = useCallback(() => {
     setOpen(false)

web/app/components/workflow/nodes/llm/components/json-schema-config-modal/json-schema-config.tsx

@@ -17,7 +17,7 @@ import {
   preValidateSchema,
   validateSchemaAgainstDraft7,
 } from '../../utils'
-import { MittProvider, VisualEditorContextProvider } from './visual-editor/context'
+import { MittProvider, VisualEditorContextProvider, useMittContext } from './visual-editor/context'
 import ErrorMessage from './error-message'
 import { useVisualEditorStore } from './visual-editor/store'
 import Toast from '@/app/components/base/toast'
@@ -73,6 +73,7 @@ const JsonSchemaConfig: FC<JsonSchemaConfigProps> = ({
   const isAddingNewField = useVisualEditorStore(state => state.isAddingNewField)
   const setIsAddingNewField = useVisualEditorStore(state => state.setIsAddingNewField)
   const setHoveringProperty = useVisualEditorStore(state => state.setHoveringProperty)
+  const { emit } = useMittContext()
 
   const updateBtnWidth = useCallback((width: number) => {
     setBtnWidth(width + 32)
@@ -113,18 +114,12 @@ const JsonSchemaConfig: FC<JsonSchemaConfigProps> = ({
       }
     }
     else if (currentTab === SchemaView.VisualEditor) {
-      if (advancedEditing || isAddingNewField) {
+      if (advancedEditing || isAddingNewField)
-        Toast.notify({
+        emit('quitEditing', { callback: (backup: SchemaRoot) => setJson(JSON.stringify(backup || jsonSchema, null, 2)) })
-          type: 'warning',
-          message: t('workflow.nodes.llm.jsonSchema.warningTips.switchToJsonSchema'),
-        })
-        return
-      }
-      setJson(JSON.stringify(jsonSchema, null, 2))
     }
 
     setCurrentTab(value)
-  }, [currentTab, jsonSchema, json, advancedEditing, isAddingNewField, t])
+  }, [currentTab, jsonSchema, json, advancedEditing, isAddingNewField, emit])
 
   const handleApplySchema = useCallback((schema: SchemaRoot) => {
     if (currentTab === SchemaView.VisualEditor)

web/app/components/workflow/nodes/llm/components/json-schema-config-modal/json-schema-generator/index.tsx

@@ -20,6 +20,7 @@ import { type FormValue, ModelTypeEnum } from '@/app/components/header/account-s
 import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { useVisualEditorStore } from '../visual-editor/store'
 import { useTranslation } from 'react-i18next'
+import { useMittContext } from '../visual-editor/context'
 
 type JsonSchemaGeneratorProps = {
   onApply: (schema: SchemaRoot) => void
@@ -52,6 +53,7 @@ export const JsonSchemaGenerator: FC<JsonSchemaGeneratorProps> = ({
   } = useModelListAndDefaultModelAndCurrentProviderAndModel(ModelTypeEnum.textGeneration)
   const advancedEditing = useVisualEditorStore(state => state.advancedEditing)
   const isAddingNewField = useVisualEditorStore(state => state.isAddingNewField)
+  const { emit } = useMittContext()
   const SchemaGenerator = theme === Theme.light ? SchemaGeneratorLight : SchemaGeneratorDark
 
   useEffect(() => {
@@ -66,15 +68,10 @@ export const JsonSchemaGenerator: FC<JsonSchemaGeneratorProps> = ({
 
   const handleTrigger = useCallback((e: React.MouseEvent<HTMLElement, MouseEvent>) => {
     e.stopPropagation()
-    if (advancedEditing || isAddingNewField) {
+    if (advancedEditing || isAddingNewField)
-      Toast.notify({
+      emit('quitEditing', {})
-        type: 'warning',
-        message: t('workflow.nodes.llm.jsonSchema.warningTips.jsonGeneration'),
-      })
-      return
-    }
     setOpen(!open)
-  }, [open, advancedEditing, isAddingNewField, t])
+  }, [open, advancedEditing, isAddingNewField, emit])
 
   const onClose = useCallback(() => {
     setOpen(false)

web/app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor/edit-card/index.tsx

@@ -89,11 +89,8 @@ const EditCard: FC<EditCardProps> = ({
   })
 
   useSubscribe('fieldChangeSuccess', () => {
-    if (isAddingNewField) {
+    isAddingNewField && setIsAddingNewField(false)
-      setIsAddingNewField(false)
+    advancedEditing && setAdvancedEditing(false)
-      return
-    }
-    setAdvancedEditing(false)
   })
 
   const emitPropertyNameChange = useCallback(() => {

web/app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor/hooks.ts

@@ -22,7 +22,10 @@ export const useSchemaNodeOperations = (props: VisualEditorProps) => {
   const { schema: jsonSchema, onChange } = props
   const backupSchema = useVisualEditorStore(state => state.backupSchema)
   const setBackupSchema = useVisualEditorStore(state => state.setBackupSchema)
+  const isAddingNewField = useVisualEditorStore(state => state.isAddingNewField)
   const setIsAddingNewField = useVisualEditorStore(state => state.setIsAddingNewField)
+  const advancedEditing = useVisualEditorStore(state => state.advancedEditing)
+  const setAdvancedEditing = useVisualEditorStore(state => state.setAdvancedEditing)
   const setHoveringProperty = useVisualEditorStore(state => state.setHoveringProperty)
   const { emit, useSubscribe } = useMittContext()
 
@@ -33,6 +36,15 @@ export const useSchemaNodeOperations = (props: VisualEditorProps) => {
     }
   })
 
+  useSubscribe('quitEditing', (params) => {
+    const { callback } = params as any
+    callback?.(backupSchema)
+    emit('restoreSchema')
+    isAddingNewField && setIsAddingNewField(false)
+    advancedEditing && setAdvancedEditing(false)
+    setHoveringProperty(null)
+  })
+
   useSubscribe('propertyNameChange', (params) => {
     const { parentPath, oldFields, fields } = params as ChangeEventParams
     const { name: oldName } = oldFields
@@ -204,6 +216,7 @@ export const useSchemaNodeOperations = (props: VisualEditorProps) => {
   })
 
   useSubscribe('addField', (params) => {
+    advancedEditing && setAdvancedEditing(false)
     setBackupSchema(jsonSchema)
     const { path } = params as AddEventParams
     setIsAddingNewField(true)

web/i18n/en-US/workflow.ts

@@ -442,9 +442,6 @@ const translation = {
         fieldNamePlaceholder: 'Field Name',
         descriptionPlaceholder: 'Add description',
         warningTips: {
-          jsonGeneration: 'Please finish editing the current field before generating a schema',
-          jsonImport: 'Please finish editing the current field before importing a schema',
-          switchToJsonSchema: 'Please finish editing the current field before switching to JSON Schema',
           saveSchema: 'Please finish editing the current field before saving the schema',
         },
       },

web/i18n/zh-Hans/workflow.ts

@@ -443,9 +443,6 @@ const translation = {
         fieldNamePlaceholder: '字段名',
         descriptionPlaceholder: '添加描述',
         warningTips: {
-          jsonGeneration: '请先完成当前字段的编辑',
-          jsonImport: '请先完成当前字段的编辑',
-          switchToJsonSchema: '请先完成当前字段的编辑',
           saveSchema: '请先完成当前字段的编辑',
         },
       },