Files
ragflow/web/src/hooks/use-knowledge-request.ts
Attili-sys 24af0875e5 Feat/configurable metadata display (#13464)
### What problem does this PR solve?

Currently, RAGFlow's Search and Chat interfaces display only raw
vectorized text chunks during retrieval, without contextual information
about their source documents. Users cannot see document titles, page
numbers, upload dates, or custom metadata fields that would help them
understand and trust the retrieved results.

This PR introduces an **optional metadata display feature** that
enriches retrieved chunks with document-level metadata in both the
Search tab and Chatbot interface.

**Key improvements:**
- **Search results**: Display document metadata as styled badges beneath
chunk snippets
- **Chat citations**: Show metadata in citation popovers and reference
lists for better source context
- **LLM context**: Metadata is injected into the LLM prompt to enable
more accurate, citation-aware responses
- **External API support**: Applications using RAGFlow's SDK retrieval
endpoints (`/v1/retrieval`, `/v1/searchbots/retrieval_test`) can opt-in
via request parameters
- **User control**: Multi-select dropdown UI allows users to choose
which metadata fields to display

**Implementation approach:**
-  Reuses existing `DocMetadataService` infrastructure (no new database
tables or indices)
-  Settings stored in existing JSON configuration fields
(`search_config.reference_metadata`, `prompt_config.reference_metadata`)
-  No database migrations required
-  Disabled by default (fully opt-in and backward-compatible)
-  Dynamic metadata field selection populated from actual document
metadata keys
-  Fixed critical bug where Python's builtin `set()` was shadowed by a
route handler function

**Modified endpoints (all backward-compatible):**
- `POST /v1/retrieval` (Public SDK)
- `POST /v1/searchbots/retrieval_test` (Searchbots)
- `POST /v1/chunk/retrieval_test` (UI/Internal)
- Chat completions endpoints (via `extra_body.reference_metadata` or
`prompt_config`)

### Type of change

- [x] New Feature (non-breaking change which adds functionality)


###Images
-
<img width="879" height="1275" alt="image"
src="https://github.com/user-attachments/assets/95b2d731-31ae-45a1-b081-bf5893f52aeb"
/>
<br><br>
<br><br>

<img width="1532" height="362" alt="image"
src="https://github.com/user-attachments/assets/9cebc65b-b7a7-459f-b25e-3b13fa9b638e"
/>
<br><br>
<br><br>

<img width="2586" height="1320" alt="image"
src="https://github.com/user-attachments/assets/2153d493-d899-461f-a7a9-041391e07776"
/>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Attili-sys <Attili-sys@users.noreply.github.com>
Co-authored-by: Ahmad Intisar <ahmadintisar@Ahmads-MacBook-M4-Pro.local>
2026-04-30 23:13:27 +08:00

695 lines
18 KiB
TypeScript

import { useHandleFilterSubmit } from '@/components/list-filter-bar/use-handle-filter-submit';
import message from '@/components/ui/message';
import { ParseType } from '@/constants/knowledge';
import { ResponsePostType } from '@/interfaces/database/base';
import {
IDataset,
IDatasetListResult,
IKnowledgeGraph,
INextTestingResult,
IRenameTag,
ITestingResult,
} from '@/interfaces/database/dataset';
import { ITestRetrievalRequestBody } from '@/interfaces/request/knowledge';
import i18n from '@/locales/config';
import kbService, {
deleteKnowledgeGraph,
getKbDetail,
getKnowledgeGraph,
listDataset,
listTag,
removeTag,
renameTag,
updateKb,
} from '@/services/knowledge-service';
import {
useIsMutating,
useMutation,
useMutationState,
useQuery,
useQueryClient,
} from '@tanstack/react-query';
import { useDebounce } from 'ahooks';
import { omit } from 'lodash';
import { useCallback, useMemo, useState } from 'react';
import { useParams, useSearchParams } from 'react-router';
import {
useGetPaginationWithRouter,
useHandleSearchChange,
} from './logic-hooks';
import { extractParserConfigExt } from './parser-config-utils';
import { useSetPaginationParams } from './route-hook';
export const enum KnowledgeApiAction {
FetchKnowledgeListByPage = 'fetchKnowledgeListByPage',
CreateKnowledge = 'createKnowledge',
DeleteKnowledge = 'deleteKnowledge',
SaveKnowledge = 'saveKnowledge',
FetchKnowledgeDetail = 'fetchKnowledgeDetail',
FetchKnowledgeGraph = 'fetchKnowledgeGraph',
FetchMetadata = 'fetchMetadata',
FetchMetadataKeys = 'fetchMetadataKeys',
FetchKnowledgeList = 'fetchKnowledgeList',
RemoveKnowledgeGraph = 'removeKnowledgeGraph',
}
export const useKnowledgeBaseId = (): string => {
const { id } = useParams();
return (id as string) || '';
};
export const useTestRetrieval = () => {
const knowledgeBaseId = useKnowledgeBaseId();
const [values, setValues] = useState<ITestRetrievalRequestBody>();
const { filterValue, setFilterValue } = useHandleFilterSubmit();
const [page, setPage] = useState(1);
const [pageSize, setPageSize] = useState(10);
const queryParams = useMemo(() => {
return {
...values,
kb_id: values?.kb_id || knowledgeBaseId,
page,
size: pageSize,
doc_ids: filterValue.doc_ids,
highlight: true,
};
}, [filterValue, knowledgeBaseId, page, pageSize, values]);
const mutation = useMutation<INextTestingResult, Error, typeof queryParams>({
mutationFn: async (params) => {
const { data } = await kbService.retrievalTest(params);
const result = data?.data ?? {};
return { ...result, isRuned: true };
},
});
const refetch = useCallback(() => {
if (queryParams.question) {
mutation.mutate(queryParams);
}
}, [mutation, queryParams]);
const onPaginationChange = useCallback(
(newPage: number, newPageSize: number) => {
setPage(newPage);
setPageSize(newPageSize);
if (mutation.data && queryParams.question) {
const newParams = { ...queryParams, page: newPage, size: newPageSize };
mutation.mutate(newParams);
}
},
[mutation, queryParams],
);
const handleFilterSubmit = useCallback(
(value: { doc_ids?: string[] }) => {
setFilterValue(value);
setPage(1);
if (mutation.data && queryParams.question) {
const newParams = {
...queryParams,
doc_ids: value.doc_ids ?? [],
page: 1,
};
mutation.mutate(newParams);
}
},
[mutation, queryParams, setFilterValue],
);
const data = useMemo(
() =>
mutation.data ?? {
chunks: [],
doc_aggs: [],
total: 0,
isRuned: false,
},
[mutation.data],
);
return {
data,
loading: mutation.isPending,
setValues,
refetch,
onPaginationChange,
page,
pageSize,
handleFilterSubmit,
filterValue,
};
};
export const useFetchNextKnowledgeListByPage = () => {
const { searchString, handleInputChange } = useHandleSearchChange();
const { pagination, setPagination } = useGetPaginationWithRouter();
const debouncedSearchString = useDebounce(searchString, { wait: 500 });
const { filterValue, handleFilterSubmit } = useHandleFilterSubmit();
const { data, isFetching: loading } = useQuery<IDatasetListResult>({
queryKey: [
KnowledgeApiAction.FetchKnowledgeListByPage,
{
debouncedSearchString,
...pagination,
filterValue,
},
],
initialData: {
kbs: [],
total_datasets: 0,
},
gcTime: 0,
queryFn: async () => {
const { data } = await listDataset({
page_size: pagination.pageSize,
page: pagination.current,
ext: {
keywords: debouncedSearchString,
owner_ids: filterValue.owner as string[],
},
});
return { kbs: data?.data, total_datasets: data?.total_datasets };
},
});
const onInputChange: React.ChangeEventHandler<HTMLInputElement> = useCallback(
(e) => {
// setPagination({ page: 1 }); // TODO: This results in repeated requests
handleInputChange(e);
},
[handleInputChange],
);
return {
...data,
searchString,
handleInputChange: onInputChange,
pagination: { ...pagination, total: data?.total_datasets },
setPagination,
loading,
filterValue,
handleFilterSubmit,
};
};
export const useCreateKnowledge = () => {
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: [KnowledgeApiAction.CreateKnowledge],
mutationFn: async (params: {
id?: string;
name: string;
embedding_model?: string;
chunk_method?: string;
parseType?: ParseType;
pipeline_id?: string | null;
ext?: {
language?: string;
[key: string]: any;
};
}) => {
const { data = {} } = await kbService.createKb(params);
if (data.code === 0) {
message.success(
i18n.t(`message.${params?.id ? 'modified' : 'created'}`),
);
queryClient.invalidateQueries({ queryKey: ['fetchKnowledgeList'] });
}
return data;
},
});
return { data, loading, createKnowledge: mutateAsync };
};
export const useDeleteKnowledge = () => {
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: [KnowledgeApiAction.DeleteKnowledge],
mutationFn: async (id: string) => {
const { data } = await kbService.rmKb({ ids: [id] });
if (data.code === 0) {
message.success(i18n.t(`message.deleted`));
queryClient.invalidateQueries({
queryKey: [KnowledgeApiAction.FetchKnowledgeListByPage],
});
}
return data?.data ?? [];
},
});
return { data, loading, deleteKnowledge: mutateAsync };
};
export const useUpdateKnowledge = (shouldFetchList = false) => {
const knowledgeBaseId = useKnowledgeBaseId();
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: [KnowledgeApiAction.SaveKnowledge],
mutationFn: async (params: {
kb_id?: string;
name?: string;
embedding_model?: string;
chunk_method?: string;
pipeline_id?: string | null;
avatar?: string | null;
description?: string;
permission?: string;
pagerank?: number;
parser_config?: Record<string, any>;
[key: string]: any;
}) => {
const kbId = params?.kb_id || knowledgeBaseId;
const {
embedding_model,
chunk_method,
pipeline_id,
avatar,
description,
permission,
pagerank,
parser_config,
...ext
} = params;
const requestBody: Record<string, any> = {
name,
embedding_model,
chunk_method,
pipeline_id,
avatar,
description,
permission,
pagerank,
parser_config: extractParserConfigExt(parser_config),
...omit(ext, ['kb_id']),
};
const { data = {} } = await updateKb(kbId, requestBody);
if (data.code === 0) {
message.success(i18n.t(`message.updated`));
if (shouldFetchList) {
queryClient.invalidateQueries({
queryKey: [KnowledgeApiAction.FetchKnowledgeListByPage],
});
} else {
queryClient.invalidateQueries({ queryKey: ['fetchKnowledgeDetail'] });
}
}
return data;
},
});
return { data, loading, saveKnowledgeConfiguration: mutateAsync };
};
export const useFetchKnowledgeBaseConfiguration = (props?: {
isEdit?: boolean;
}) => {
const { isEdit = true } = props || { isEdit: true };
const { id } = useParams();
const [searchParams] = useSearchParams();
const knowledgeBaseId = searchParams.get('id') || id;
const { data, isFetching: loading } = useQuery<IDataset>({
queryKey: [KnowledgeApiAction.FetchKnowledgeDetail, knowledgeBaseId],
initialData: {} as IDataset,
gcTime: 0,
enabled: !!knowledgeBaseId && isEdit,
queryFn: async () => {
const { data } = await getKbDetail(knowledgeBaseId || '');
return data?.data ?? {};
},
});
return { data, loading };
};
export function useFetchKnowledgeGraph() {
const knowledgeBaseId = useKnowledgeBaseId();
const { data, isFetching: loading } = useQuery<IKnowledgeGraph>({
queryKey: [KnowledgeApiAction.FetchKnowledgeGraph, knowledgeBaseId],
initialData: { graph: {}, mind_map: {} } as IKnowledgeGraph,
enabled: !!knowledgeBaseId,
gcTime: 0,
queryFn: async () => {
const { data } = await getKnowledgeGraph(knowledgeBaseId);
return data?.data;
},
});
return { data, loading };
}
export function useFetchKnowledgeMetadata(kbIds: string[] = []) {
const { data, isFetching: loading } = useQuery<
Record<string, Record<string, string[]>>
>({
queryKey: [KnowledgeApiAction.FetchMetadata, kbIds],
initialData: {},
enabled: kbIds.length > 0,
gcTime: 0,
queryFn: async () => {
const { data } = await kbService.getMeta({
dataset_ids: kbIds.join(','),
});
return data?.data ?? {};
},
});
return { data, loading };
}
export function useFetchKnowledgeMetadataKeys(kbIds: string[] = []) {
const sortedKbIds = useMemo(() => [...kbIds].sort(), [kbIds]);
const { data, isFetching: loading } = useQuery<string[]>({
queryKey: [KnowledgeApiAction.FetchMetadataKeys, sortedKbIds],
initialData: [],
enabled: sortedKbIds.length > 0,
gcTime: 0,
queryFn: async () => {
const { data } = await kbService.getMetaKeys({
kb_ids: sortedKbIds.join(','),
});
return data?.data ?? [];
},
});
return { data, loading };
}
export const useRemoveKnowledgeGraph = () => {
const knowledgeBaseId = useKnowledgeBaseId();
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: [KnowledgeApiAction.RemoveKnowledgeGraph],
mutationFn: async () => {
const { data } = await deleteKnowledgeGraph(knowledgeBaseId);
if (data.code === 0) {
message.success(i18n.t(`message.deleted`));
queryClient.invalidateQueries({
queryKey: [KnowledgeApiAction.FetchKnowledgeGraph],
});
}
return data?.code;
},
});
return { data, loading, removeKnowledgeGraph: mutateAsync };
};
export const useFetchKnowledgeList = (
shouldFilterListWithoutDocument: boolean = false,
): {
list: IDataset[];
loading: boolean;
} => {
const { data, isFetching: loading } = useQuery({
queryKey: [KnowledgeApiAction.FetchKnowledgeList],
initialData: [],
gcTime: 0, // https://tanstack.com/query/latest/docs/framework/react/guides/caching?from=reactQueryV3
queryFn: async () => {
const { data } = await listDataset();
const list = data?.data ?? [];
return shouldFilterListWithoutDocument
? list.filter((x: IDataset) => x.chunk_count > 0)
: list;
},
});
return { list: data, loading };
};
export const useSelectKnowledgeOptions = () => {
const { list } = useFetchKnowledgeList();
const options = list?.map((item) => ({
label: item.name,
value: item.id,
}));
return options;
};
//#region tags
export const useRenameTag = () => {
const knowledgeBaseId = useKnowledgeBaseId();
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: ['renameTag'],
mutationFn: async (params: IRenameTag) => {
const { data } = await renameTag(knowledgeBaseId, params);
if (data.code === 0) {
message.success(i18n.t(`message.modified`));
queryClient.invalidateQueries({
queryKey: ['fetchTagList'],
});
}
return data?.data ?? [];
},
});
return { data, loading, renameTag: mutateAsync };
};
export const useTagIsRenaming = () => {
return useIsMutating({ mutationKey: ['renameTag'] }) > 0;
};
export const useFetchTagListByKnowledgeIds = () => {
const [knowledgeIds, setKnowledgeIds] = useState<string[]>([]);
const { data, isFetching: loading } = useQuery<Array<[string, number]>>({
queryKey: ['fetchTagListByKnowledgeIds'],
enabled: knowledgeIds.length > 0,
initialData: [],
gcTime: 0, // https://tanstack.com/query/latest/docs/framework/react/guides/caching?from=reactQueryV3
queryFn: async () => {
const { data } = await kbService.listTagByKnowledgeIds({
dataset_ids: knowledgeIds.join(','),
});
const list = data?.data || [];
return list;
},
});
return { list: data, loading, setKnowledgeIds };
};
export const useFetchTagList = () => {
const knowledgeBaseId = useKnowledgeBaseId();
const { data, isFetching: loading } = useQuery<Array<[string, number]>>({
queryKey: ['fetchTagList'],
initialData: [],
gcTime: 0, // https://tanstack.com/query/latest/docs/framework/react/guides/caching?from=reactQueryV3
queryFn: async () => {
const { data } = await listTag(knowledgeBaseId);
const list = data?.data || [];
return list;
},
});
return { list: data, loading };
};
export const useDeleteTag = () => {
const knowledgeBaseId = useKnowledgeBaseId();
const queryClient = useQueryClient();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: ['deleteTag'],
mutationFn: async (tags: string[]) => {
const { data } = await removeTag(knowledgeBaseId, tags);
if (data.code === 0) {
message.success(i18n.t(`message.deleted`));
queryClient.invalidateQueries({
queryKey: ['fetchTagList'],
});
}
return data?.data ?? [];
},
});
return { data, loading, deleteTag: mutateAsync };
};
// #endregion
//#region Retrieval testing
export const useTestChunkRetrieval = (): ResponsePostType<ITestingResult> & {
testChunk: (...params: any[]) => void;
} => {
const knowledgeBaseId = useKnowledgeBaseId();
const { page, size: pageSize } = useSetPaginationParams();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: ['testChunk'], // This method is invalid
gcTime: 0,
mutationFn: async (values: any) => {
const { data } = await kbService.retrievalTest({
...values,
kb_id: values.kb_id ?? knowledgeBaseId,
page,
size: pageSize,
});
if (data.code === 0) {
const res = data.data;
return {
...res,
documents: res.doc_aggs,
};
}
return (
data?.data ?? {
chunks: [],
documents: [],
total: 0,
}
);
},
});
return {
data: data ?? { chunks: [], documents: [], total: 0 },
loading,
testChunk: mutateAsync,
};
};
export const useTestChunkAllRetrieval = (): ResponsePostType<ITestingResult> & {
testChunkAll: (...params: any[]) => void;
} => {
const knowledgeBaseId = useKnowledgeBaseId();
const { page, size: pageSize } = useSetPaginationParams();
const {
data,
isPending: loading,
mutateAsync,
} = useMutation({
mutationKey: ['testChunkAll'], // This method is invalid
gcTime: 0,
mutationFn: async (values: any) => {
const { data } = await kbService.retrievalTest({
...values,
kb_id: values.kb_id ?? knowledgeBaseId,
doc_ids: [],
page,
size: pageSize,
});
if (data.code === 0) {
const res = data.data;
return {
...res,
documents: res.doc_aggs,
};
}
return (
data?.data ?? {
chunks: [],
documents: [],
total: 0,
}
);
},
});
return {
data: data ?? { chunks: [], documents: [], total: 0 },
loading,
testChunkAll: mutateAsync,
};
};
export const useChunkIsTesting = () => {
return useIsMutating({ mutationKey: ['testChunk'] }) > 0;
};
export const useSelectTestingResult = (): ITestingResult => {
const data = useMutationState({
filters: { mutationKey: ['testChunk'] },
select: (mutation) => {
return mutation.state.data;
},
});
return (data.at(-1) ?? {
chunks: [],
documents: [],
total: 0,
}) as ITestingResult;
};
export const useSelectIsTestingSuccess = () => {
const status = useMutationState({
filters: { mutationKey: ['testChunk'] },
select: (mutation) => {
return mutation.state.status;
},
});
return status.at(-1) === 'success';
};
export const useAllTestingSuccess = () => {
const status = useMutationState({
filters: { mutationKey: ['testChunkAll'] },
select: (mutation) => {
return mutation.state.status;
},
});
return status.at(-1) === 'success';
};
export const useAllTestingResult = (): ITestingResult => {
const data = useMutationState({
filters: { mutationKey: ['testChunkAll'] },
select: (mutation) => {
return mutation.state.data;
},
});
return (data.at(-1) ?? {
chunks: [],
documents: [],
total: 0,
}) as ITestingResult;
};
//#endregion