From c9168c19cd231b4b891ec0893ac315cb6886bc35 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Wed, 20 Mar 2024 16:48:52 +0800
Subject: [PATCH] feat: question classify support readonly

---
 .../components/advanced-setting.tsx                |  3 +++
 .../question-classifier/components/class-item.tsx  | 13 +++++++++----
 .../question-classifier/components/class-list.tsx  | 14 ++++++++++----
 .../workflow/nodes/question-classifier/panel.tsx   |  8 ++++++--
 4 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/web/app/components/workflow/nodes/question-classifier/components/advanced-setting.tsx b/web/app/components/workflow/nodes/question-classifier/components/advanced-setting.tsx
index 3a9e294399..4c70ee7f3b 100644
--- a/web/app/components/workflow/nodes/question-classifier/components/advanced-setting.tsx
+++ b/web/app/components/workflow/nodes/question-classifier/components/advanced-setting.tsx
@@ -13,6 +13,7 @@ type Props = {
   hideMemorySetting: boolean
   memory: Memory
   onMemoryChange: (memory: Memory) => void
+  readonly?: boolean
 }
 
 const AdvancedSetting: FC<Props> = ({
@@ -21,6 +22,7 @@ const AdvancedSetting: FC<Props> = ({
   hideMemorySetting,
   memory,
   onMemoryChange,
+  readonly,
 }) => {
   const { t } = useTranslation()
 
@@ -38,6 +40,7 @@ const AdvancedSetting: FC<Props> = ({
             <div className='mx-3 h-3 w-px bg-gray-200'></div>
           </div>
         )}
+        readonly={readonly}
       />
       {!hideMemorySetting && (
         <MemoryConfig
diff --git a/web/app/components/workflow/nodes/question-classifier/components/class-item.tsx b/web/app/components/workflow/nodes/question-classifier/components/class-item.tsx
index b032bda815..de8de94e77 100644
--- a/web/app/components/workflow/nodes/question-classifier/components/class-item.tsx
+++ b/web/app/components/workflow/nodes/question-classifier/components/class-item.tsx
@@ -13,6 +13,7 @@ type Props = {
   onChange: (payload: Topic) => void
   onRemove: () => void
   index: number
+  readonly?: boolean
 }
 
 const ClassItem: FC<Props> = ({
@@ -20,6 +21,7 @@ const ClassItem: FC<Props> = ({
   onChange,
   onRemove,
   index,
+  readonly,
 }) => {
   const { t } = useTranslation()
 
@@ -45,12 +47,15 @@ const ClassItem: FC<Props> = ({
         <div className='flex items-center h-full'>
           <div className='text-xs font-medium text-gray-500'>{payload.name.length}</div>
           <div className='mx-3 h-3 w-px bg-gray-200'></div>
-          <Trash03
-            className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer'
-            onClick={onRemove}
-          />
+          {!readonly && (
+            <Trash03
+              className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer'
+              onClick={onRemove}
+            />
+          )}
         </div>
       )}
+      readonly={readonly}
       minHeight={64}
     />
   )
diff --git a/web/app/components/workflow/nodes/question-classifier/components/class-list.tsx b/web/app/components/workflow/nodes/question-classifier/components/class-list.tsx
index 4ec98fccc4..e23c42bf97 100644
--- a/web/app/components/workflow/nodes/question-classifier/components/class-list.tsx
+++ b/web/app/components/workflow/nodes/question-classifier/components/class-list.tsx
@@ -14,12 +14,14 @@ type Props = {
   id: string
   list: Topic[]
   onChange: (list: Topic[]) => void
+  readonly?: boolean
 }
 
 const ClassList: FC<Props> = ({
   id,
   list,
   onChange,
+  readonly,
 }) => {
   const { t } = useTranslation()
   const { handleEdgeDeleteByDeleteBranch } = useEdgesInteractions()
@@ -62,14 +64,18 @@ const ClassList: FC<Props> = ({
               onChange={handleClassChange(index)}
               onRemove={handleRemoveClass(index)}
               index={index + 1}
+              readonly={readonly}
             />
           )
         })
       }
-      <AddButton
-        onClick={handleAddClass}
-        text={t(`${i18nPrefix}.addClass`)}
-      />
+      {!readonly && (
+        <AddButton
+          onClick={handleAddClass}
+          text={t(`${i18nPrefix}.addClass`)}
+        />
+      )}
+
     </div>
   )
 }
diff --git a/web/app/components/workflow/nodes/question-classifier/panel.tsx b/web/app/components/workflow/nodes/question-classifier/panel.tsx
index 6c8126b4f7..b5c6b5e6eb 100644
--- a/web/app/components/workflow/nodes/question-classifier/panel.tsx
+++ b/web/app/components/workflow/nodes/question-classifier/panel.tsx
@@ -19,9 +19,9 @@ const Panel: FC<NodePanelProps<QuestionClassifierNodeType>> = ({
   data,
 }) => {
   const { t } = useTranslation()
-  const readOnly = false
 
   const {
+    readOnly,
     inputs,
     handleModelChanged,
     isChatModel,
@@ -73,6 +73,7 @@ const Panel: FC<NodePanelProps<QuestionClassifierNodeType>> = ({
             onCompletionParamsChange={handleCompletionParamsChange}
             hideDebugWithMultipleModel
             debugWithMultipleModel={false}
+            readonly={readOnly}
           />
         </Field>
         <Field
@@ -81,7 +82,9 @@ const Panel: FC<NodePanelProps<QuestionClassifierNodeType>> = ({
           <ClassList
             id={id}
             list={inputs.classes}
-            onChange={handleTopicsChange} />
+            onChange={handleTopicsChange}
+            readonly={readOnly}
+          />
         </Field>
         <Field
           title={t(`${i18nPrefix}.advancedSetting`)}
@@ -93,6 +96,7 @@ const Panel: FC<NodePanelProps<QuestionClassifierNodeType>> = ({
             onInstructionChange={handleInstructionChange}
             memory={inputs.memory}
             onMemoryChange={handleMemoryChange}
+            readonly={readOnly}
           />
         </Field>
       </div>