AI/ragflow
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/infiniflow/ragflow.git synced 2025-08-14 12:05:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: Fixed the issue where the dataset configuration page kept refreshing #3221 (#7666)

Browse Source 
### What problem does this PR solve?

Feat: Fixed the issue where the dataset configuration page kept
refreshing #3221
### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu 2025-05-16 09:53:47 +08:00 committed by GitHub
parent d373c46976
commit 0e9ff8c1f7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
24 changed files with 263 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/form-container.tsx
View File

@ -1,7 +1,7 @@
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { PropsWithChildren } from 'react'; import { PropsWithChildren } from 'react';
type FormContainerProps = { export type FormContainerProps = {
className?: string; className?: string;
show?: boolean; show?: boolean;
} & PropsWithChildren; } & PropsWithChildren;

8
web/src/components/parse-configuration/graph-rag-form-fields.tsx
View File

@ -46,6 +46,7 @@ export const showGraphRagItems = (parserId: DocumentParserType | undefined) => {
type GraphRagItemsProps = { type GraphRagItemsProps = {
marginBottom?: boolean; marginBottom?: boolean;
className?: string;
}; };
export function UseGraphRagFormField() { export function UseGraphRagFormField() {
@ -75,7 +76,10 @@ export function UseGraphRagFormField() {
} }
// The three types "table", "resume" and "one" do not display this configuration. // The three types "table", "resume" and "one" do not display this configuration.
const GraphRagItems = ({ marginBottom = false }: GraphRagItemsProps) => { const GraphRagItems = ({
marginBottom = false,
className = 'p-10',
}: GraphRagItemsProps) => {
const { t } = useTranslate('knowledgeConfiguration'); const { t } = useTranslate('knowledgeConfiguration');
const form = useFormContext(); const form = useFormContext();
@ -99,7 +103,7 @@ const GraphRagItems = ({ marginBottom = false }: GraphRagItemsProps) => {
); );
return ( return (
<FormContainer className={cn({ 'mb-4': marginBottom })}> <FormContainer className={cn({ 'mb-4': marginBottom }, className)}>
<UseGraphRagFormField></UseGraphRagFormField> <UseGraphRagFormField></UseGraphRagFormField>
{useRaptor && ( {useRaptor && (
<> <>

49
web/src/hooks/llm-hooks.tsx
View File

@ -18,7 +18,7 @@ import { getLLMIconName, getRealModelName } from '@/utils/llm-util';
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { Flex, message } from 'antd'; import { Flex, message } from 'antd';
import { DefaultOptionType } from 'antd/es/select'; import { DefaultOptionType } from 'antd/es/select';
import { useMemo } from 'react'; import { useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
export const useFetchLlmList = ( export const useFetchLlmList = (
@ -77,7 +77,7 @@ function buildLlmOptionsWithIcon(x: IThirdOAIModel) {
export const useSelectLlmOptionsByModelType = () => { export const useSelectLlmOptionsByModelType = () => {
const llmInfo: IThirdOAIModelCollection = useFetchLlmList(); const llmInfo: IThirdOAIModelCollection = useFetchLlmList();
const groupImage2TextOptions = () => { const groupImage2TextOptions = useCallback(() => {
const modelType = LlmModelType.Image2text; const modelType = LlmModelType.Image2text;
const modelTag = modelType.toUpperCase(); const modelTag = modelType.toUpperCase();
@ -96,27 +96,32 @@ export const useSelectLlmOptionsByModelType = () => {
}; };
}) })
.filter((x) => x.options.length > 0); .filter((x) => x.options.length > 0);
}; }, [llmInfo]);
const groupOptionsByModelType = (modelType: LlmModelType) => { const groupOptionsByModelType = useCallback(
return Object.entries(llmInfo) (modelType: LlmModelType) => {
.filter(([, value]) => return Object.entries(llmInfo)
modelType ? value.some((x) => x.model_type.includes(modelType)) : true, .filter(([, value]) =>
) modelType
.map(([key, value]) => { ? value.some((x) => x.model_type.includes(modelType))
return { : true,
label: key, )
options: value .map(([key, value]) => {
.filter( return {
(x) => label: key,
(modelType ? x.model_type.includes(modelType) : true) && options: value
x.available, .filter(
) (x) =>
.map(buildLlmOptionsWithIcon), (modelType ? x.model_type.includes(modelType) : true) &&
}; x.available,
}) )
.filter((x) => x.options.length > 0); .map(buildLlmOptionsWithIcon),
}; };
})
.filter((x) => x.options.length > 0);
},
[llmInfo],
);
return { return {
[LlmModelType.Chat]: groupOptionsByModelType(LlmModelType.Chat), [LlmModelType.Chat]: groupOptionsByModelType(LlmModelType.Chat),

22
web/src/pages/dataset/setting/chunk-method-form.tsx
View File

@ -1,8 +1,7 @@
import { useFormContext, useWatch } from 'react-hook-form'; import { useFormContext, useWatch } from 'react-hook-form';
import { useTranslation } from 'react-i18next';
import { DocumentParserType } from '@/constants/knowledge'; import { DocumentParserType } from '@/constants/knowledge';
import { useMemo, useState } from 'react'; import { useMemo } from 'react';
import { AudioConfiguration } from './configuration/audio'; import { AudioConfiguration } from './configuration/audio';
import { BookConfiguration } from './configuration/book'; import { BookConfiguration } from './configuration/book';
import { EmailConfiguration } from './configuration/email'; import { EmailConfiguration } from './configuration/email';
@ -18,7 +17,6 @@ import { QAConfiguration } from './configuration/qa';
import { ResumeConfiguration } from './configuration/resume'; import { ResumeConfiguration } from './configuration/resume';
import { TableConfiguration } from './configuration/table'; import { TableConfiguration } from './configuration/table';
import { TagConfiguration } from './configuration/tag'; import { TagConfiguration } from './configuration/tag';
import { useFetchKnowledgeConfigurationOnMount } from './hooks';
const ConfigurationComponentMap = { const ConfigurationComponentMap = {
[DocumentParserType.Naive]: NaiveConfiguration, [DocumentParserType.Naive]: NaiveConfiguration,
@ -44,14 +42,8 @@ function EmptyComponent() {
export function ChunkMethodForm() { export function ChunkMethodForm() {
const form = useFormContext(); const form = useFormContext();
const { t } = useTranslation();
const [finalParserId, setFinalParserId] = useState<DocumentParserType>(
DocumentParserType.Naive,
);
const knowledgeDetails = useFetchKnowledgeConfigurationOnMount(form); const finalParserId: DocumentParserType = useWatch({
const parserId: DocumentParserType = useWatch({
control: form.control, control: form.control,
name: 'parser_id', name: 'parser_id',
}); });
@ -62,16 +54,8 @@ export function ChunkMethodForm() {
: EmptyComponent; : EmptyComponent;
}, [finalParserId]); }, [finalParserId]);
// useEffect(() => {
// setFinalParserId(parserId);
// }, [parserId]);
// useEffect(() => {
// setFinalParserId(knowledgeDetails.parser_id as DocumentParserType);
// }, [knowledgeDetails.parser_id]);
return ( return (
<section> <section className="overflow-auto max-h-[76vh]">
<ConfigurationComponent></ConfigurationComponent> <ConfigurationComponent></ConfigurationComponent>
</section> </section>
); );

16
web/src/pages/dataset/setting/configuration-form-container.tsx Normal file
View File

@ -0,0 +1,16 @@
import { FormContainer, FormContainerProps } from '@/components/form-container';
import { cn } from '@/lib/utils';
import { PropsWithChildren } from 'react';
export function ConfigurationFormContainer({
children,
className,
}: FormContainerProps) {
return (
<FormContainer className={cn('p-10', className)}>{children}</FormContainer>
);
}
export function MainContainer({ children }: PropsWithChildren) {
return <section className="space-y-5">{children}</section>;
}

7
web/src/pages/dataset/setting/configuration/audio.tsx
View File

@ -5,14 +5,15 @@ import {
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function AudioConfiguration() { export function AudioConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
@ -26,6 +27,6 @@ export function AudioConfiguration() {
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

32
web/src/pages/dataset/setting/configuration/book.tsx
View File

@ -6,28 +6,38 @@ import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-fie
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function BookConfiguration() { export function BookConfiguration() {
return ( return (
<> <MainContainer>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem> <ChunkMethodItem></ChunkMethodItem>
<ChunkMethodItem></ChunkMethodItem> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</ConfigurationFormContainer>
<> <ConfigurationFormContainer>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields>
</ConfigurationFormContainer>
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom className="p-10"></GraphRagItems>
<TagItems></TagItems> <ConfigurationFormContainer>
</> <TagItems></TagItems>
</ConfigurationFormContainer>
</MainContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/email.tsx
View File

@ -5,14 +5,15 @@ import {
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function EmailConfiguration() { export function EmailConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
@ -26,6 +27,6 @@ export function EmailConfiguration() {
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

2
web/src/pages/dataset/setting/configuration/knowledge-graph.tsx
View File

@ -7,8 +7,8 @@ import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function KnowledgeGraphConfiguration() { export function KnowledgeGraphConfiguration() {
return ( return (
<> <>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>

30
web/src/pages/dataset/setting/configuration/laws.tsx
View File

@ -6,28 +6,38 @@ import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-fie
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function LawsConfiguration() { export function LawsConfiguration() {
return ( return (
<> <MainContainer>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem> <ChunkMethodItem></ChunkMethodItem>
<ChunkMethodItem></ChunkMethodItem> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</ConfigurationFormContainer>
<> <ConfigurationFormContainer>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields>
</ConfigurationFormContainer>
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <ConfigurationFormContainer>
</> <TagItems></TagItems>
</ConfigurationFormContainer>
</MainContainer>
); );
} }

27
web/src/pages/dataset/setting/configuration/manual.tsx
View File

@ -6,28 +6,35 @@ import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-fie
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function ManualConfiguration() { export function ManualConfiguration() {
return ( return (
<> <MainContainer>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem> <ChunkMethodItem></ChunkMethodItem>
<ChunkMethodItem></ChunkMethodItem> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</ConfigurationFormContainer>
<> <ConfigurationFormContainer>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </ConfigurationFormContainer>
<ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <RaptorFormFields></RaptorFormFields>
</ConfigurationFormContainer>
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <TagItems></TagItems>
</> </MainContainer>
); );
} }

23
web/src/pages/dataset/setting/configuration/naive.tsx
View File

@ -4,36 +4,39 @@ import {
} from '@/components/auto-keywords-form-field'; } from '@/components/auto-keywords-form-field';
import { DelimiterFormField } from '@/components/delimiter-form-field'; import { DelimiterFormField } from '@/components/delimiter-form-field';
import { ExcelToHtmlFormField } from '@/components/excel-to-html-form-field'; import { ExcelToHtmlFormField } from '@/components/excel-to-html-form-field';
import { FormContainer } from '@/components/form-container';
import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-field'; import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-field';
import { MaxTokenNumberFormField } from '@/components/max-token-number-from-field'; import { MaxTokenNumberFormField } from '@/components/max-token-number-from-field';
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function NaiveConfiguration() { export function NaiveConfiguration() {
return ( return (
<section className="space-y-5 mb-4 overflow-auto"> <MainContainer>
<FormContainer> <ConfigurationFormContainer>
<ChunkMethodItem></ChunkMethodItem>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem> <EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem>
<MaxTokenNumberFormField></MaxTokenNumberFormField> <MaxTokenNumberFormField></MaxTokenNumberFormField>
<DelimiterFormField></DelimiterFormField> <DelimiterFormField></DelimiterFormField>
</FormContainer> </ConfigurationFormContainer>
<FormContainer> <ConfigurationFormContainer>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
<ExcelToHtmlFormField></ExcelToHtmlFormField> <ExcelToHtmlFormField></ExcelToHtmlFormField>
<TagItems></TagItems> <TagItems></TagItems>
</FormContainer> </ConfigurationFormContainer>
<FormContainer> <ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <RaptorFormFields></RaptorFormFields>
</FormContainer> </ConfigurationFormContainer>
<GraphRagItems></GraphRagItems> <GraphRagItems></GraphRagItems>
</section> </MainContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/one.tsx
View File

@ -5,15 +5,16 @@ import {
import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-field'; import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-field';
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function OneConfiguration() { export function OneConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<ChunkMethodItem></ChunkMethodItem>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem> <EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
@ -25,6 +26,6 @@ export function OneConfiguration() {
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

30
web/src/pages/dataset/setting/configuration/paper.tsx
View File

@ -6,28 +6,38 @@ import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-fie
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function PaperConfiguration() { export function PaperConfiguration() {
return ( return (
<> <MainContainer>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem> <ChunkMethodItem></ChunkMethodItem>
<ChunkMethodItem></ChunkMethodItem> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</ConfigurationFormContainer>
<> <ConfigurationFormContainer>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields>
</ConfigurationFormContainer>
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<TagItems></TagItems> <ConfigurationFormContainer>
</> <TagItems></TagItems>
</ConfigurationFormContainer>
</MainContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/picture.tsx
View File

@ -3,14 +3,15 @@ import {
AutoQuestionsFormField, AutoQuestionsFormField,
} from '@/components/auto-keywords-form-field'; } from '@/components/auto-keywords-form-field';
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function PictureConfiguration() { export function PictureConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
@ -19,6 +20,6 @@ export function PictureConfiguration() {
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

31
web/src/pages/dataset/setting/configuration/presentation.tsx
View File

@ -6,28 +6,37 @@ import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-fie
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields'; import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields'; import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
import {
ConfigurationFormContainer,
MainContainer,
} from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function PresentationConfiguration() { export function PresentationConfiguration() {
return ( return (
<> <MainContainer>
<LayoutRecognizeFormField></LayoutRecognizeFormField> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem> <ChunkMethodItem></ChunkMethodItem>
<ChunkMethodItem></ChunkMethodItem> <LayoutRecognizeFormField></LayoutRecognizeFormField>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</ConfigurationFormContainer>
<> <ConfigurationFormContainer>
<AutoKeywordsFormField></AutoKeywordsFormField> <AutoKeywordsFormField></AutoKeywordsFormField>
<AutoQuestionsFormField></AutoQuestionsFormField> <AutoQuestionsFormField></AutoQuestionsFormField>
</> </ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields> <ConfigurationFormContainer>
<RaptorFormFields></RaptorFormFields>
</ConfigurationFormContainer>
<GraphRagItems marginBottom></GraphRagItems> <GraphRagItems marginBottom></GraphRagItems>
<ConfigurationFormContainer>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
</MainContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/qa.tsx
View File

@ -1,16 +1,17 @@
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function QAConfiguration() { export function QAConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/resume.tsx
View File

@ -1,16 +1,17 @@
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { TagItems } from '../tag-item'; import { TagItems } from '../tag-item';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function ResumeConfiguration() { export function ResumeConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
<TagItems></TagItems> <TagItems></TagItems>
</> </ConfigurationFormContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/table.tsx
View File

@ -1,13 +1,14 @@
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function TableConfiguration() { export function TableConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</> </ConfigurationFormContainer>
); );
} }

7
web/src/pages/dataset/setting/configuration/tag.tsx
View File

@ -1,13 +1,14 @@
import PageRankFormField from '@/components/page-rank-form-field'; import PageRankFormField from '@/components/page-rank-form-field';
import { ConfigurationFormContainer } from '../configuration-form-container';
import { ChunkMethodItem, EmbeddingModelItem } from './common-item'; import { ChunkMethodItem, EmbeddingModelItem } from './common-item';
export function TagConfiguration() { export function TagConfiguration() {
return ( return (
<> <ConfigurationFormContainer>
<EmbeddingModelItem></EmbeddingModelItem>
<ChunkMethodItem></ChunkMethodItem> <ChunkMethodItem></ChunkMethodItem>
<EmbeddingModelItem></EmbeddingModelItem>
<PageRankFormField></PageRankFormField> <PageRankFormField></PageRankFormField>
</> </ConfigurationFormContainer>
); );
} }

41
web/src/pages/dataset/setting/form-schema.ts Normal file
View File

@ -0,0 +1,41 @@
import { z } from 'zod';
export const formSchema = z.object({
name: z.string().min(1, {
message: 'Username must be at least 2 characters.',
}),
description: z.string().min(2, {
message: 'Username must be at least 2 characters.',
}),
avatar: z.instanceof(File),
permission: z.string(),
parser_id: z.string(),
embd_id: z.string(),
parser_config: z.object({
layout_recognize: z.string(),
chunk_token_num: z.number(),
delimiter: z.string(),
auto_keywords: z.number(),
auto_questions: z.number(),
html4excel: z.boolean(),
tag_kb_ids: z.array(z.string()),
topn_tags: z.number(),
raptor: z.object({
use_raptor: z.boolean(),
prompt: z.string(),
max_token: z.number(),
threshold: z.number(),
max_cluster: z.number(),
random_seed: z.number(),
}),
graphrag: z.object({
use_graphrag: z.boolean(),
entity_types: z.array(z.string()),
method: z.string(),
resolution: z.boolean(),
community: z.boolean(),
}),
}),
pagerank: z.number(),
// icon: z.array(z.instanceof(File)),
});

2
web/src/pages/dataset/setting/general-form.tsx
View File

@ -17,7 +17,7 @@ export function GeneralForm() {
const { t } = useTranslation(); const { t } = useTranslation();
return ( return (
<FormContainer className="space-y-2"> <FormContainer className="space-y-2 p-10">
<FormField <FormField
control={form.control} control={form.control}
name="name" name="name"

10
web/src/pages/dataset/setting/hooks.ts
View File

@ -15,9 +15,11 @@ import {
import { useIsFetching } from '@tanstack/react-query'; import { useIsFetching } from '@tanstack/react-query';
import { Form, UploadFile } from 'antd'; import { Form, UploadFile } from 'antd';
import { FormInstance } from 'antd/lib'; import { FormInstance } from 'antd/lib';
import pick from 'lodash/pick'; import { pick } from 'lodash';
import { useCallback, useEffect, useState } from 'react'; import { useCallback, useEffect, useState } from 'react';
import { UseFormReturn } from 'react-hook-form'; import { UseFormReturn } from 'react-hook-form';
import { z } from 'zod';
import { formSchema } from './form-schema';
export const useSubmitKnowledgeConfiguration = (form: FormInstance) => { export const useSubmitKnowledgeConfiguration = (form: FormInstance) => {
const { saveKnowledgeConfiguration, loading } = useUpdateKnowledge(); const { saveKnowledgeConfiguration, loading } = useUpdateKnowledge();
@ -59,13 +61,17 @@ export function useHasParsedDocument() {
return knowledgeDetails.chunk_num > 0; return knowledgeDetails.chunk_num > 0;
} }
export const useFetchKnowledgeConfigurationOnMount = (form: UseFormReturn) => { export const useFetchKnowledgeConfigurationOnMount = (
form: UseFormReturn<z.infer<typeof formSchema>, any, undefined>,
) => {
const { data: knowledgeDetails } = useFetchKnowledgeBaseConfiguration(); const { data: knowledgeDetails } = useFetchKnowledgeBaseConfiguration();
useEffect(() => { useEffect(() => {
const fileList: UploadFile[] = getUploadFileListFromBase64( const fileList: UploadFile[] = getUploadFileListFromBase64(
knowledgeDetails.avatar, knowledgeDetails.avatar,
); );
console.log('🚀 ~ useEffect ~ fileList:', fileList);
form.reset({ form.reset({
...pick(knowledgeDetails, [ ...pick(knowledgeDetails, [
'description', 'description',

57
web/src/pages/dataset/setting/index.tsx
View File

@ -1,12 +1,15 @@
import { ButtonLoading } from '@/components/ui/button';
import { Form } from '@/components/ui/form'; import { Form } from '@/components/ui/form';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { DocumentParserType } from '@/constants/knowledge'; import { DocumentParserType } from '@/constants/knowledge';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useForm } from 'react-hook-form'; import { useForm, useWatch } from 'react-hook-form';
import { z } from 'zod'; import { z } from 'zod';
import CategoryPanel from './category-panel'; import CategoryPanel from './category-panel';
import { ChunkMethodForm } from './chunk-method-form'; import { ChunkMethodForm } from './chunk-method-form';
import { formSchema } from './form-schema';
import { GeneralForm } from './general-form'; import { GeneralForm } from './general-form';
import { useFetchKnowledgeConfigurationOnMount } from './hooks';
const enum DocumentType { const enum DocumentType {
DeepDOC = 'DeepDOC', DeepDOC = 'DeepDOC',
@ -27,45 +30,6 @@ const enum MethodValue {
} }
export default function DatasetSettings() { export default function DatasetSettings() {
const formSchema = z.object({
name: z.string().min(1, {
message: 'Username must be at least 2 characters.',
}),
description: z.string().min(2, {
message: 'Username must be at least 2 characters.',
}),
avatar: z.instanceof(File),
permission: z.string(),
parser_id: z.string(),
parser_config: z.object({
layout_recognize: z.string(),
chunk_token_num: z.number(),
delimiter: z.string(),
auto_keywords: z.number(),
auto_questions: z.number(),
html4excel: z.boolean(),
tag_kb_ids: z.array(z.string()),
topn_tags: z.number(),
raptor: z.object({
use_raptor: z.boolean(),
prompt: z.string(),
max_token: z.number(),
threshold: z.number(),
max_cluster: z.number(),
random_seed: z.number(),
}),
graphrag: z.object({
use_graphrag: z.boolean(),
entity_types: z.array(z.string()),
method: z.string(),
resolution: z.boolean(),
community: z.boolean(),
}),
}),
pagerank: z.number(),
// icon: z.array(z.instanceof(File)),
});
const form = useForm<z.infer<typeof formSchema>>({ const form = useForm<z.infer<typeof formSchema>>({
resolver: zodResolver(formSchema), resolver: zodResolver(formSchema),
defaultValues: { defaultValues: {
@ -97,6 +61,13 @@ export default function DatasetSettings() {
}, },
}); });
useFetchKnowledgeConfigurationOnMount(form);
const parserId = useWatch({
control: form.control,
name: 'parser_id',
});
async function onSubmit(data: z.infer<typeof formSchema>) { async function onSubmit(data: z.infer<typeof formSchema>) {
console.log('🚀 ~ DatasetSettings ~ data:', data); console.log('🚀 ~ DatasetSettings ~ data:', data);
} }
@ -128,9 +99,13 @@ export default function DatasetSettings() {
<ChunkMethodForm></ChunkMethodForm> <ChunkMethodForm></ChunkMethodForm>
</TabsContent> </TabsContent>
</Tabs> </Tabs>
<div className="text-right">
<ButtonLoading type="submit">Submit</ButtonLoading>
</div>
</form> </form>
</Form> </Form>
<CategoryPanel chunkMethod={DocumentParserType.Naive}></CategoryPanel>
<CategoryPanel chunkMethod={parserId}></CategoryPanel>
</div> </div>
</section> </section>
); );