features

web/app/components/base/features/feature-panel/index.tsx

@@ -3,6 +3,7 @@ import {
   useMemo,
 } from 'react'
 import { useTranslation } from 'react-i18next'
+import type { OnFeaturesChange } from '../types'
 import { useFeatures } from '../hooks'
 import OpeningStatement from './opening-statement'
 import type { OpeningStatementProps } from './opening-statement'
@@ -11,14 +12,16 @@ import TextToSpeech from './text-to-speech'
 import SpeechToText from './speech-to-text'
 import Citation from './citation'
 import Moderation from './moderation'
-import Annotation from './annotation/config-param'
-import type { AnnotationProps } from './annotation/config-param'
+import Annotation from './annotation'
+import type { AnnotationProps } from './annotation'
 
 export type FeaturePanelProps = {
+  onChange?: OnFeaturesChange
   openingStatementProps: OpeningStatementProps
   annotationProps: AnnotationProps
 }
 const FeaturePanel = ({
+  onChange,
   openingStatementProps,
   annotationProps,
 }: FeaturePanelProps) => {
@@ -50,7 +53,7 @@ const FeaturePanel = ({
             <div className='py-2 space-y-2'>
               {
                 features.opening.enabled && (
-                  <OpeningStatement {...openingStatementProps} />
+                  <OpeningStatement {...openingStatementProps} onChange={onChange} />
                 )
               }
               {
@@ -92,7 +95,7 @@ const FeaturePanel = ({
             <div className='py-2 space-y-2'>
               {
                 features.moderation.enabled && (
-                  <Moderation />
+                  <Moderation onChange={onChange} />
                 )
               }
               {

web/app/components/base/features/feature-panel/moderation/index.tsx

@@ -7,13 +7,19 @@ import {
   useFeatures,
   useFeaturesStore,
 } from '../../hooks'
+import type { OnFeaturesChange } from '../../types'
 import { FileSearch02 } from '@/app/components/base/icons/src/vender/solid/files'
 import { Settings01 } from '@/app/components/base/icons/src/vender/line/general'
 import { useModalContext } from '@/context/modal-context'
 import { fetchCodeBasedExtensionList } from '@/service/common'
 import I18n from '@/context/i18n'
 
-const Moderation = () => {
+type ModerationProps = {
+  onChange?: OnFeaturesChange
+}
+const Moderation = ({
+  onChange,
+}: ModerationProps) => {
   const { t } = useTranslation()
   const { setShowModerationSettingModal } = useModalContext()
   const { locale } = useContext(I18n)
@@ -33,9 +39,12 @@ const Moderation = () => {
     setShowModerationSettingModal({
       payload: moderation as any,
       onSaveCallback: (newModeration) => {
-        setFeatures(produce(features, (draft) => {
+        const newFeatures = produce(features, (draft) => {
           draft.moderation = newModeration
-        }))
+        })
+        setFeatures(newFeatures)
+        if (onChange)
+          onChange(newFeatures)
       },
     })
   }

web/app/components/base/features/feature-panel/opening-statement/index.tsx

@@ -11,6 +11,7 @@ import {
   useFeatures,
   useFeaturesStore,
 } from '../../hooks'
+import type { OnFeaturesChange } from '../../types'
 import Panel from '@/app/components/app/configuration/base/feature-panel'
 import Button from '@/app/components/base/button'
 import OperationBtn from '@/app/components/app/configuration/base/operation-btn'
@@ -24,6 +25,7 @@ import type { PromptVariable } from '@/models/debug'
 const MAX_QUESTION_NUM = 5
 
 export type OpeningStatementProps = {
+  onChange?: OnFeaturesChange
   readonly?: boolean
   promptVariables?: PromptVariable[]
   onAutoAddPromptVariable: (variable: PromptVariable[]) => void
@@ -33,6 +35,7 @@ export type OpeningStatementProps = {
 const regex = /\{\{([^}]+)\}\}/g
 
 const OpeningStatement: FC<OpeningStatementProps> = ({
+  onChange,
   readonly,
   promptVariables = [],
   onAutoAddPromptVariable,
@@ -112,10 +115,14 @@ const OpeningStatement: FC<OpeningStatementProps> = ({
       setFeatures,
     } = getState()
 
-    setFeatures(produce(features, (draft) => {
+    const newFeatures = produce(features, (draft) => {
       draft.opening.opening_statement = tempValue
       draft.opening.suggested_questions = tempSuggestedQuestions
-    }))
+    })
+    setFeatures(newFeatures)
+
+    if (onChange)
+      onChange(newFeatures)
   }
 
   const cancelAutoAddVar = () => {
@@ -125,9 +132,13 @@ const OpeningStatement: FC<OpeningStatementProps> = ({
       setFeatures,
     } = getState()
 
-    setFeatures(produce(features, (draft) => {
+    const newFeatures = produce(features, (draft) => {
       draft.opening.opening_statement = tempValue
-    }))
+    })
+    setFeatures(newFeatures)
+
+    if (onChange)
+      onChange(newFeatures)
     hideConfirmAddVar()
     setBlur()
   }
@@ -139,9 +150,12 @@ const OpeningStatement: FC<OpeningStatementProps> = ({
       setFeatures,
     } = getState()
 
-    setFeatures(produce(features, (draft) => {
+    const newFeatures = produce(features, (draft) => {
       draft.opening.opening_statement = tempValue
-    }))
+    })
+    setFeatures(newFeatures)
+    if (onChange)
+      onChange(newFeatures)
     onAutoAddPromptVariable([...notIncludeKeys.map(key => getNewVar(key, 'string'))])
     hideConfirmAddVar()
     setBlur()