Fix：Optimize Agent template page, fix bugs in knowledge base (#9009)

### What problem does this PR solve?

Replace Avatar with RAGFlowAvatar component for knowledge base and
agent, optimize Agent template page, and modify bugs in knowledge base
#3221

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/components/entity-types-form-field.tsx

@@ -12,13 +12,6 @@ import {
 type EntityTypesFormFieldProps = {
   name?: string;
 };
-const initialEntityTypes = [
-  'organization',
-  'person',
-  'geo',
-  'event',
-  'category',
-];
 export function EntityTypesFormField({
   name = 'parser_config.entity_types',
 }: EntityTypesFormFieldProps) {
@@ -29,7 +22,6 @@ export function EntityTypesFormField({
     <FormField
       control={form.control}
       name={name}
-      defaultValue={initialEntityTypes}
       render={({ field }) => {
         return (
           <FormItem className=" items-center space-y-0 ">

web/src/components/knowledge-base-item.tsx

@@ -3,9 +3,8 @@ import { useTranslate } from '@/hooks/common-hooks';
 import { useFetchKnowledgeList } from '@/hooks/knowledge-hooks';
 import { UserOutlined } from '@ant-design/icons';
 import { Avatar as AntAvatar, Form, Select, Space } from 'antd';
-import { Book } from 'lucide-react';
 import { useFormContext } from 'react-hook-form';
-import { Avatar, AvatarFallback, AvatarImage } from './ui/avatar';
+import { RAGFlowAvatar } from './ragflow-avatar';
 import { FormControl, FormField, FormItem, FormLabel } from './ui/form';
 import { MultiSelect } from './ui/multi-select';
 
@@ -81,12 +80,7 @@ export function KnowledgeBaseFormField() {
     label: x.name,
     value: x.id,
     icon: () => (
-      <Avatar className="size-4 mr-2">
-        <AvatarImage src={x.avatar} />
-        <AvatarFallback>
-          <Book />
-        </AvatarFallback>
-      </Avatar>
+      <RAGFlowAvatar className="size-4 mr-2" avatar={x.avatar} name={x.name} />
     ),
   }));
 

web/src/components/parse-configuration/raptor-form-fields.tsx

@@ -3,7 +3,7 @@ import { DocumentParserType } from '@/constants/knowledge';
 import { useTranslate } from '@/hooks/common-hooks';
 import random from 'lodash/random';
 import { Plus } from 'lucide-react';
-import { useCallback } from 'react';
+import { useCallback, useEffect } from 'react';
 import { useFormContext, useWatch } from 'react-hook-form';
 import { SliderInputFormField } from '../slider-input-form-field';
 import { Button } from '../ui/button';
@@ -46,6 +46,10 @@ export const showTagItems = (parserId: DocumentParserType) => {
 
 const UseRaptorField = 'parser_config.raptor.use_raptor';
 const RandomSeedField = 'parser_config.raptor.random_seed';
+const MaxTokenField = 'parser_config.raptor.max_token';
+const ThresholdField = 'parser_config.raptor.threshold';
+const MaxCluster = 'parser_config.raptor.max_cluster';
+const Prompt = 'parser_config.raptor.prompt';
 
 // The three types "table", "resume" and "one" do not display this configuration.
 
@@ -53,6 +57,15 @@ const RaptorFormFields = () => {
   const form = useFormContext();
   const { t } = useTranslate('knowledgeConfiguration');
   const useRaptor = useWatch({ name: UseRaptorField });
+  useEffect(() => {
+    if (useRaptor) {
+      form.setValue(MaxTokenField, 256);
+      form.setValue(ThresholdField, 0.1);
+      form.setValue(MaxCluster, 64);
+      form.setValue(RandomSeedField, 0);
+      form.setValue(Prompt, t('promptText'));
+    }
+  }, [form, useRaptor, t]);
 
   const handleGenerate = useCallback(() => {
     form.setValue(RandomSeedField, random(10000));
@@ -114,11 +127,7 @@ const RaptorFormFields = () => {
                     </FormLabel>
                     <div className="w-3/4">
                       <FormControl>
-                        <Textarea
-                          {...field}
-                          rows={8}
-                          defaultValue={t('promptText')}
-                        />
+                        <Textarea {...field} rows={8} />
                       </FormControl>
                     </div>
                   </div>
@@ -134,7 +143,6 @@ const RaptorFormFields = () => {
             name={'parser_config.raptor.max_token'}
             label={t('maxToken')}
             tooltip={t('maxTokenTip')}
-            defaultValue={256}
             max={2048}
             min={0}
             layout={FormLayout.Horizontal}
@@ -143,7 +151,6 @@ const RaptorFormFields = () => {
             name={'parser_config.raptor.threshold'}
             label={t('threshold')}
             tooltip={t('thresholdTip')}
-            defaultValue={0.1}
             step={0.01}
             max={1}
             min={0}
@@ -153,7 +160,6 @@ const RaptorFormFields = () => {
             name={'parser_config.raptor.max_cluster'}
             label={t('maxCluster')}
             tooltip={t('maxClusterTip')}
-            defaultValue={64}
             max={1024}
             min={1}
             layout={FormLayout.Horizontal}