feat: retrieval support readonly

web/app/components/workflow/nodes/knowledge-retrieval/components/dataset-item.tsx

@@ -15,12 +15,14 @@ type Props = {
   payload: DataSet
   onRemove: () => void
   onChange: (dataSet: DataSet) => void
+  readonly?: boolean
 }
 
 const DatasetItem: FC<Props> = ({
   payload,
   onRemove,
   onChange,
+  readonly,
 }) => {
   const media = useBreakpoints()
   const isMobile = media === MediaType.mobile
@@ -54,20 +56,23 @@ const DatasetItem: FC<Props> = ({
         }
         <div className='w-0 grow text-[13px] font-normal text-gray-800 truncate'>{payload.name}</div>
       </div>
-      <div className='hidden group-hover/dataset-item:flex shrink-0 ml-2  items-center space-x-1'>
-        <div
-          className='flex items-center justify-center w-6 h-6 hover:bg-black/5 rounded-md cursor-pointer'
-          onClick={showSettingsModal}
-        >
-          <Settings01 className='w-4 h-4 text-gray-500' />
+      {!readonly && (
+        <div className='hidden group-hover/dataset-item:flex shrink-0 ml-2  items-center space-x-1'>
+          <div
+            className='flex items-center justify-center w-6 h-6 hover:bg-black/5 rounded-md cursor-pointer'
+            onClick={showSettingsModal}
+          >
+            <Settings01 className='w-4 h-4 text-gray-500' />
+          </div>
+          <div
+            className='flex items-center justify-center w-6 h-6 hover:bg-black/5 rounded-md cursor-pointer'
+            onClick={onRemove}
+          >
+            <Trash03 className='w-4 h-4 text-gray-500' />
+          </div>
         </div>
-        <div
-          className='flex items-center justify-center w-6 h-6 hover:bg-black/5 rounded-md cursor-pointer'
-          onClick={onRemove}
-        >
-          <Trash03 className='w-4 h-4 text-gray-500' />
-        </div>
-      </div>
+      )}
+
       {isShowSettingsModal && (
         <Drawer isOpen={isShowSettingsModal} onClose={hideSettingsModal} footer={null} mask={isMobile} panelClassname='mt-16 mx-2 sm:mr-2 mb-3 !p-0 !max-w-[640px] rounded-xl'>
           <SettingsModal

web/app/components/workflow/nodes/knowledge-retrieval/components/dataset-list.tsx

@@ -7,11 +7,13 @@ import type { DataSet } from '@/models/datasets'
 type Props = {
   list: DataSet[]
   onChange: (list: DataSet[]) => void
+  readonly?: boolean
 }
 
 const DatasetList: FC<Props> = ({
   list,
   onChange,
+  readonly,
 }) => {
   const handleRemove = useCallback((index: number) => {
     return () => {
@@ -40,6 +42,7 @@ const DatasetList: FC<Props> = ({
               payload={item}
               onRemove={handleRemove(index)}
               onChange={handleChange(index)}
+              readonly={readonly}
             />
           )
         })

web/app/components/workflow/nodes/knowledge-retrieval/components/retrieval-config.tsx

@@ -31,6 +31,7 @@ type Props = {
   singleRetrievalModelConfig?: ModelConfig
   onSingleRetrievalModelChange?: (config: ModelConfig) => void
   onSingleRetrievalModelParamsChange?: (config: ModelConfig) => void
+  readonly?: boolean
 }
 
 const RetrievalConfig: FC<Props> = ({
@@ -40,6 +41,7 @@ const RetrievalConfig: FC<Props> = ({
   singleRetrievalModelConfig,
   onSingleRetrievalModelChange,
   onSingleRetrievalModelParamsChange,
+  readonly,
 }) => {
   const { t } = useTranslation()
 
@@ -83,11 +85,15 @@ const RetrievalConfig: FC<Props> = ({
       }}
     >
       <PortalToFollowElemTrigger
-        onClick={() => setOpen(v => !v)}
+        onClick={() => {
+          if (readonly)
+            return
+          setOpen(v => !v)
+        }}
       >
-        <div className={cn(open && 'bg-gray-100', 'flex items-center h-6  px-2 rounded-md hover:bg-gray-100 group cursor-pointer select-none')}>
+        <div className={cn(!readonly && 'cursor-pointer', open && 'bg-gray-100', 'flex items-center h-6  px-2 rounded-md hover:bg-gray-100 group  select-none')}>
           <div className={cn(open ? 'text-gray-700' : 'text-gray-500', 'leading-[18px] text-xs font-medium group-hover:bg-gray-100')}>{payload.retrieval_mode === RETRIEVE_TYPE.oneWay ? t('appDebug.datasetConfig.retrieveOneWay.title') : t('appDebug.datasetConfig.retrieveMultiWay.title')}</div>
-          <ChevronDown className='ml-1 w-3 h-3' />
+          {!readonly && <ChevronDown className='ml-1 w-3 h-3' />}
         </div>
       </PortalToFollowElemTrigger>
       <PortalToFollowElemContent style={{ zIndex: 1001 }}>

web/app/components/workflow/nodes/knowledge-retrieval/panel.tsx

@@ -21,9 +21,9 @@ const Panel: FC<NodePanelProps<KnowledgeRetrievalNodeType>> = ({
   data,
 }) => {
   const { t } = useTranslation()
-  const readOnly = false
 
   const {
+    readOnly,
     inputs,
     handleQueryVarChange,
     filterVar,
@@ -76,18 +76,22 @@ const Panel: FC<NodePanelProps<KnowledgeRetrievalNodeType>> = ({
                 singleRetrievalModelConfig={inputs.single_retrieval_config?.model}
                 onSingleRetrievalModelChange={handleModelChanged as any}
                 onSingleRetrievalModelParamsChange={handleCompletionParamsChange}
+                readonly={readOnly}
               />
-              <div className='w-px h-3 bg-gray-200'></div>
-              <AddKnowledge
-                selectedIds={inputs.dataset_ids}
-                onChange={handleOnDatasetsChange}
-              />
+              {!readOnly && (<div className='w-px h-3 bg-gray-200'></div>)}
+              {!readOnly && (
+                <AddKnowledge
+                  selectedIds={inputs.dataset_ids}
+                  onChange={handleOnDatasetsChange}
+                />
+              )}
             </div>
           }
         >
           <DatasetList
             list={selectedDatasets}
             onChange={handleOnDatasetsChange}
+            readonly={readOnly}
           />
         </Field>
       </div>