fix: external dataset hit test display issue(#12564) (#12612)

Co-authored-by: zhuxinliang <zhuxinliang@didiglobal.com>
This commit is contained in:
le0zh
2025-01-21 14:31:45 +08:00
committed by GitHub
parent 9903f1e703
commit 0c6a8a130e
6 changed files with 174 additions and 46 deletions

View File

@@ -12,8 +12,9 @@ import Textarea from './textarea'
import s from './style.module.css'
import ModifyRetrievalModal from './modify-retrieval-modal'
import ResultItem from './components/result-item'
import ResultItemExternal from './components/result-item-external'
import cn from '@/utils/classnames'
import type { ExternalKnowledgeBaseHitTestingResponse, HitTestingResponse } from '@/models/datasets'
import type { ExternalKnowledgeBaseHitTesting, ExternalKnowledgeBaseHitTestingResponse, HitTesting, HitTestingResponse } from '@/models/datasets'
import Loading from '@/app/components/base/loading'
import Drawer from '@/app/components/base/drawer'
import Pagination from '@/app/components/base/pagination'
@@ -41,7 +42,7 @@ const RecordsEmpty: FC = () => {
</div>
}
const HitTesting: FC<Props> = ({ datasetId }: Props) => {
const HitTestingPage: FC<Props> = ({ datasetId }: Props) => {
const { t } = useTranslation()
const { formatTime } = useTimestamp()
@@ -68,19 +69,25 @@ const HitTesting: FC<Props> = ({ datasetId }: Props) => {
const [retrievalConfig, setRetrievalConfig] = useState(currentDataset?.retrieval_model_dict as RetrievalConfig)
const [isShowModifyRetrievalModal, setIsShowModifyRetrievalModal] = useState(false)
const [isShowRightPanel, { setTrue: showRightPanel, setFalse: hideRightPanel, set: setShowRightPanel }] = useBoolean(!isMobile)
const renderHitResults = (results: any[]) => (
const renderHitResults = (results: HitTesting[] | ExternalKnowledgeBaseHitTesting[]) => (
<div className='h-full flex flex-col py-3 px-4 rounded-t-2xl bg-background-body'>
<div className='shrink-0 pl-2 text-text-primary font-semibold leading-6 mb-2'>
{t('datasetHitTesting.hit.title', { num: results.length })}
</div>
<div className='grow overflow-y-auto space-y-2'>
{results.map((record, idx) => (
<ResultItem
key={idx}
payload={record}
isExternal={isExternal}
/>
))}
{results.map((record, idx) =>
isExternal
? (
<ResultItemExternal
key={idx}
positionId={idx + 1}
payload={record as ExternalKnowledgeBaseHitTesting}
/>
)
: (
<ResultItem key={idx} payload={record as HitTesting} />
),
)}
</div>
</div>
)
@@ -130,7 +137,7 @@ const HitTesting: FC<Props> = ({ datasetId }: Props) => {
<>
<div className='grow overflow-y-auto'>
<table className={'w-full border-collapse border-0 text-[13px] leading-4 text-text-secondary '}>
<thead className="sticky top-0 h-7 leading-7 text-xs text-text-tertiary font-medium uppercase">
<thead className='sticky top-0 h-7 leading-7 text-xs text-text-tertiary font-medium uppercase'>
<tr>
<td className='pl-3 w-[128px] rounded-l-lg bg-background-section-burn'>{t('datasetHitTesting.table.header.source')}</td>
<td className='bg-background-section-burn'>{t('datasetHitTesting.table.header.text')}</td>
@@ -208,4 +215,4 @@ const HitTesting: FC<Props> = ({ datasetId }: Props) => {
)
}
export default HitTesting
export default HitTestingPage