| | |
| | | import type { FileAppearanceTypeEnum } from '@/app/components/base/file-uploader/types' |
| | | import cn from '@/utils/classnames' |
| | | import Tag from '@/app/components/datasets/documents/detail/completed/common/tag' |
| | | import { Markdown } from '@/app/components/base/markdown' |
| | | |
| | | const i18nPrefix = 'datasetHitTesting' |
| | | |
| | |
| | | }) => { |
| | | const { t } = useTranslation() |
| | | const { segment, score, child_chunks } = payload |
| | | const { position, content, sign_content, keywords, document } = segment |
| | | const { position, content, keywords, document } = segment |
| | | const isParentChildRetrieval = !!(child_chunks && child_chunks.length > 0) |
| | | const extension = document.name.split('.').slice(-1)[0] as FileAppearanceTypeEnum |
| | | const heighClassName = isParentChildRetrieval ? 'h-[min(627px,_80vh)] overflow-y-auto' : 'h-[min(539px,_80vh)] overflow-y-auto' |
| | |
| | | <div className='mt-4 flex'> |
| | | <div className={cn('flex-1', isParentChildRetrieval && 'pr-6')}> |
| | | {/* Meta info */} |
| | | <div className='flex items-center justify-between'> |
| | | <div className='flex grow items-center space-x-2'> |
| | | <div className='flex justify-between items-center'> |
| | | <div className='grow flex items-center space-x-2'> |
| | | <SegmentIndexTag |
| | | labelPrefix={`${isParentChildRetrieval ? 'Parent-' : ''}Chunk`} |
| | | positionId={position} |
| | | className={cn('w-fit group-hover:opacity-100')} |
| | | /> |
| | | <Dot /> |
| | | <div className='flex grow items-center space-x-1'> |
| | | <div className='grow flex items-center space-x-1'> |
| | | <FileIcon type={extension} size='sm' /> |
| | | <span className='w-0 grow truncate text-[13px] font-normal text-text-secondary'>{document.name}</span> |
| | | <span className='grow w-0 truncate text-text-secondary text-[13px] font-normal'>{document.name}</span> |
| | | </div> |
| | | </div> |
| | | <Score value={score} /> |
| | | </div> |
| | | <Markdown |
| | | className={cn('!mt-2 !text-text-secondary', heighClassName)} |
| | | content={sign_content || content} |
| | | customDisallowedElements={['input']} |
| | | /> |
| | | <div className={cn('mt-2 body-md-regular text-text-secondary break-all', heighClassName)}> |
| | | {content} |
| | | </div> |
| | | {!isParentChildRetrieval && keywords && keywords.length > 0 && ( |
| | | <div className='mt-6'> |
| | | <div className='text-xs font-medium uppercase text-text-tertiary'>{t(`${i18nPrefix}.keyword`)}</div> |
| | | <div className='font-medium text-xs text-text-tertiary uppercase'>{t(`${i18nPrefix}.keyword`)}</div> |
| | | <div className='mt-1 flex flex-wrap'> |
| | | {keywords.map(keyword => ( |
| | | <Tag key={keyword} text={keyword} className='mr-2' /> |
| | |
| | | </div> |
| | | |
| | | {isParentChildRetrieval && ( |
| | | <div className='flex-1 pb-6 pl-6'> |
| | | <div className='flex-1 pl-6 pb-6'> |
| | | <div className='system-xs-semibold-uppercase text-text-secondary'>{t(`${i18nPrefix}.hitChunks`, { num: child_chunks.length })}</div> |
| | | <div className={cn('mt-1 space-y-2', heighClassName)}> |
| | | {child_chunks.map(item => ( |