Introduce Plugins (#13836)

Signed-off-by: yihong0618 <zouzou0208@gmail.com>
Signed-off-by: -LAN- <laipz8200@outlook.com>
Signed-off-by: xhe <xw897002528@gmail.com>
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: takatost <takatost@gmail.com>
Co-authored-by: kurokobo <kuro664@gmail.com>
Co-authored-by: Novice Lee <novicelee@NoviPro.local>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: AkaraChen <akarachen@outlook.com>
Co-authored-by: Yi <yxiaoisme@gmail.com>
Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: JzoNg <jzongcode@gmail.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: Hiroshi Fujita <fujita-h@users.noreply.github.com>
Co-authored-by: AkaraChen <85140972+AkaraChen@users.noreply.github.com>
Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: Wu Tianwei <30284043+WTW0313@users.noreply.github.com>
Co-authored-by: 非法操作 <hjlarry@163.com>
Co-authored-by: Novice <857526207@qq.com>
Co-authored-by: Hiroki Nagai <82458324+nagaihiroki-git@users.noreply.github.com>
Co-authored-by: Gen Sato <52241300+halogen22@users.noreply.github.com>
Co-authored-by: eux <euxuuu@gmail.com>
Co-authored-by: huangzhuo1949 <167434202+huangzhuo1949@users.noreply.github.com>
Co-authored-by: huangzhuo <huangzhuo1@xiaomi.com>
Co-authored-by: lotsik <lotsik@mail.ru>
Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com>
Co-authored-by: nite-knite <nkCoding@gmail.com>
Co-authored-by: Jyong <76649700+JohnJyong@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: gakkiyomi <gakkiyomi@aliyun.com>
Co-authored-by: CN-P5 <heibai2006@gmail.com>
Co-authored-by: CN-P5 <heibai2006@qq.com>
Co-authored-by: Chuehnone <1897025+chuehnone@users.noreply.github.com>
Co-authored-by: yihong <zouzou0208@gmail.com>
Co-authored-by: Kevin9703 <51311316+Kevin9703@users.noreply.github.com>
Co-authored-by: -LAN- <laipz8200@outlook.com>
Co-authored-by: Boris Feld <lothiraldan@gmail.com>
Co-authored-by: mbo <himabo@gmail.com>
Co-authored-by: mabo <mabo@aeyes.ai>
Co-authored-by: Warren Chen <warren.chen830@gmail.com>
Co-authored-by: JzoNgKVO <27049666+JzoNgKVO@users.noreply.github.com>
Co-authored-by: jiandanfeng <chenjh3@wangsu.com>
Co-authored-by: zhu-an <70234959+xhdd123321@users.noreply.github.com>
Co-authored-by: zhaoqingyu.1075 <zhaoqingyu.1075@bytedance.com>
Co-authored-by: 海狸大師 <86974027+yenslife@users.noreply.github.com>
Co-authored-by: Xu Song <xusong.vip@gmail.com>
Co-authored-by: rayshaw001 <396301947@163.com>
Co-authored-by: Ding Jiatong <dingjiatong@gmail.com>
Co-authored-by: Bowen Liang <liangbowen@gf.com.cn>
Co-authored-by: JasonVV <jasonwangiii@outlook.com>
Co-authored-by: le0zh <newlight@qq.com>
Co-authored-by: zhuxinliang <zhuxinliang@didiglobal.com>
Co-authored-by: k-zaku <zaku99@outlook.jp>
Co-authored-by: luckylhb90 <luckylhb90@gmail.com>
Co-authored-by: hobo.l <hobo.l@binance.com>
Co-authored-by: jiangbo721 <365065261@qq.com>
Co-authored-by: 刘江波 <jiangbo721@163.com>
Co-authored-by: Shun Miyazawa <34241526+miya@users.noreply.github.com>
Co-authored-by: EricPan <30651140+Egfly@users.noreply.github.com>
Co-authored-by: crazywoola <427733928@qq.com>
Co-authored-by: sino <sino2322@gmail.com>
Co-authored-by: Jhvcc <37662342+Jhvcc@users.noreply.github.com>
Co-authored-by: lowell <lowell.hu@zkteco.in>
Co-authored-by: Boris Polonsky <BorisPolonsky@users.noreply.github.com>
Co-authored-by: Ademílson Tonato <ademilsonft@outlook.com>
Co-authored-by: Ademílson Tonato <ademilson.tonato@refurbed.com>
Co-authored-by: IWAI, Masaharu <iwaim.sub@gmail.com>
Co-authored-by: Yueh-Po Peng (Yabi) <94939112+y10ab1@users.noreply.github.com>
Co-authored-by: Jason <ggbbddjm@gmail.com>
Co-authored-by: Xin Zhang <sjhpzx@gmail.com>
Co-authored-by: yjc980121 <3898524+yjc980121@users.noreply.github.com>
Co-authored-by: heyszt <36215648+hieheihei@users.noreply.github.com>
Co-authored-by: Abdullah AlOsaimi <osaimiacc@gmail.com>
Co-authored-by: Abdullah AlOsaimi <189027247+osaimi@users.noreply.github.com>
Co-authored-by: Yingchun Lai <laiyingchun@apache.org>
Co-authored-by: Hash Brown <hi@xzd.me>
Co-authored-by: zuodongxu <192560071+zuodongxu@users.noreply.github.com>
Co-authored-by: Masashi Tomooka <tmokmss@users.noreply.github.com>
Co-authored-by: aplio <ryo.091219@gmail.com>
Co-authored-by: Obada Khalili <54270856+obadakhalili@users.noreply.github.com>
Co-authored-by: Nam Vu <zuzoovn@gmail.com>
Co-authored-by: Kei YAMAZAKI <1715090+kei-yamazaki@users.noreply.github.com>
Co-authored-by: TechnoHouse <13776377+deephbz@users.noreply.github.com>
Co-authored-by: Riddhimaan-Senapati <114703025+Riddhimaan-Senapati@users.noreply.github.com>
Co-authored-by: MaFee921 <31881301+2284730142@users.noreply.github.com>
Co-authored-by: te-chan <t-nakanome@sakura-is.co.jp>
Co-authored-by: HQidea <HQidea@users.noreply.github.com>
Co-authored-by: Joshbly <36315710+Joshbly@users.noreply.github.com>
Co-authored-by: xhe <xw897002528@gmail.com>
Co-authored-by: weiwenyan-dev <154779315+weiwenyan-dev@users.noreply.github.com>
Co-authored-by: ex_wenyan.wei <ex_wenyan.wei@tcl.com>
Co-authored-by: engchina <12236799+engchina@users.noreply.github.com>
Co-authored-by: engchina <atjapan2015@gmail.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: 呆萌闷油瓶 <253605712@qq.com>
Co-authored-by: Kemal <kemalmeler@outlook.com>
Co-authored-by: Lazy_Frog <4590648+lazyFrogLOL@users.noreply.github.com>
Co-authored-by: Yi Xiao <54782454+YIXIAO0@users.noreply.github.com>
Co-authored-by: Steven sun <98230804+Tuyohai@users.noreply.github.com>
Co-authored-by: steven <sunzwj@digitalchina.com>
Co-authored-by: Kalo Chin <91766386+fdb02983rhy@users.noreply.github.com>
Co-authored-by: Katy Tao <34019945+KatyTao@users.noreply.github.com>
Co-authored-by: depy <42985524+h4ckdepy@users.noreply.github.com>
Co-authored-by: 胡春东 <gycm520@gmail.com>
Co-authored-by: Junjie.M <118170653@qq.com>
Co-authored-by: MuYu <mr.muzea@gmail.com>
Co-authored-by: Naoki Takashima <39912547+takatea@users.noreply.github.com>
Co-authored-by: Summer-Gu <37869445+gubinjie@users.noreply.github.com>
Co-authored-by: Fei He <droxer.he@gmail.com>
Co-authored-by: ybalbert001 <120714773+ybalbert001@users.noreply.github.com>
Co-authored-by: Yuanbo Li <ybalbert@amazon.com>
Co-authored-by: douxc <7553076+douxc@users.noreply.github.com>
Co-authored-by: liuzhenghua <1090179900@qq.com>
Co-authored-by: Wu Jiayang <62842862+Wu-Jiayang@users.noreply.github.com>
Co-authored-by: Your Name <you@example.com>
Co-authored-by: kimjion <45935338+kimjion@users.noreply.github.com>
Co-authored-by: AugNSo <song.tiankai@icloud.com>
Co-authored-by: llinvokerl <38915183+llinvokerl@users.noreply.github.com>
Co-authored-by: liusurong.lsr <liusurong.lsr@alibaba-inc.com>
Co-authored-by: Vasu Negi <vasu-negi@users.noreply.github.com>
Co-authored-by: Hundredwz <1808096180@qq.com>
Co-authored-by: Xiyuan Chen <52963600+GareArc@users.noreply.github.com>
This commit is contained in:
Yeuoly 2025-02-17 17:05:13 +08:00 • committed by GitHub
commit 403e2d58b9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3272 changed files with 66339 additions and 281594 deletions

View file

@ -11,15 +11,17 @@ export const ChunkLabel: FC<ChunkLabelProps> = (props) => {
const { label, characterCount } = props
return <div className='flex items-center text-text-tertiary text-xs font-medium'>
<SelectionMod className='size-[10px]' />
<p className='flex gap-2 ml-0.5'><span>
{label}
</span>
<span>
<p className='flex gap-2 ml-0.5'>
<span>
{label}
</span>
<span>
·
</span>
<span>
{`${characterCount} characters`}
</span></p>
</span>
<span>
{`${characterCount} characters`}
</span>
</p>
</div>
}

View file

@ -12,7 +12,7 @@ import Button from '@/app/components/base/button'
import { ToastContext } from '@/app/components/base/toast'
import { createEmptyDataset } from '@/service/datasets'
type IProps = {
interface IProps {
show: boolean
onHide: () => void
}

View file

@ -6,7 +6,7 @@ import { ModelTypeEnum } from '../../header/account-setting/model-provider-page/
import StepOne from './step-one'
import StepTwo from './step-two'
import StepThree from './step-three'
import { Topbar } from './top-bar'
import { TopBar } from './top-bar'
import { DataSourceType } from '@/models/datasets'
import type { CrawlOptions, CrawlResultItem, DataSet, FileItem, createDocumentResponse } from '@/models/datasets'
import { fetchDataSource } from '@/service/common'
@ -111,7 +111,7 @@ const DatasetUpdateForm = ({ datasetId }: DatasetUpdateFormProps) => {
const detail = await fetchDatasetDetail(datasetId)
setDetail(detail)
}
catch (e) {
catch {
setHasError(true)
}
}
@ -123,7 +123,7 @@ const DatasetUpdateForm = ({ datasetId }: DatasetUpdateFormProps) => {
return (
<div className='flex flex-col bg-components-panel-bg' style={{ height: 'calc(100vh - 56px)' }}>
<Topbar activeIndex={step - 1} />
<TopBar activeIndex={step - 1} datasetId={datasetId} />
<div style={{ height: 'calc(100% - 52px)' }}>
{step === 1 && <StepOne
hasConnection={hasConnection}

View file

@ -23,7 +23,7 @@ import classNames from '@/utils/classnames'
type IStepOneProps = {
datasetId?: string
dataSourceType?: DataSourceType
dataSourceTypeDisable: Boolean
dataSourceTypeDisable: boolean
hasConnection: boolean
onSetting: () => void
files: FileItem[]

View file

@ -37,7 +37,7 @@ import Button from '@/app/components/base/button'
import FloatRightContainer from '@/app/components/base/float-right-container'
import RetrievalMethodConfig from '@/app/components/datasets/common/retrieval-method-config'
import EconomicalRetrievalMethodConfig from '@/app/components/datasets/common/economical-retrieval-method-config'
import { type RetrievalConfig } from '@/types/app'
import type { RetrievalConfig } from '@/types/app'
import { isReRankModelSelected } from '@/app/components/datasets/common/check-rerank-model'
import Toast from '@/app/components/base/toast'
import type { NotionPage } from '@/models/common'
@ -98,7 +98,7 @@ export enum IndexingType {
const DEFAULT_SEGMENT_IDENTIFIER = '\\n\\n'
const DEFAULT_MAXIMUM_CHUNK_LENGTH = 500
const DEFAULT_OVERLAP = 50
const MAXIMUM_CHUNK_TOKEN_LENGTH = parseInt(globalThis.document?.body?.getAttribute('data-public-indexing-max-segmentation-tokens-length') || '4000', 10)
const MAXIMUM_CHUNK_TOKEN_LENGTH = Number.parseInt(globalThis.document?.body?.getAttribute('data-public-indexing-max-segmentation-tokens-length') || '4000', 10)
type ParentChildConfig = {
chunkForContext: ParentMode
@ -206,7 +206,7 @@ const StepTwo = ({
if (value === ChunkingMode.parentChild && indexType === IndexingType.ECONOMICAL)
setIndexType(IndexingType.QUALIFIED)
setDocForm(value)
// eslint-disable-next-line @typescript-eslint/no-use-before-define
// eslint-disable-next-line ts/no-use-before-define
currentEstimateMutation.reset()
}
@ -1073,10 +1073,9 @@ const StepTwo = ({
}
{
currentDocForm !== ChunkingMode.qa
&& <Badge text={t(
'datasetCreation.stepTwo.previewChunkCount', {
count: estimate?.total_segments || 0,
}) as string}
&& <Badge text={t('datasetCreation.stepTwo.previewChunkCount', {
count: estimate?.total_segments || 0,
}) as string}
/>
}
</div>

View file

@ -6,7 +6,7 @@ import cn from '@/utils/classnames'
import Popover from '@/app/components/base/popover'
import { languages } from '@/i18n/language'
export type ILanguageSelectProps = {
export interface ILanguageSelectProps {
currentLanguage: string
onSelect: (language: string) => void
disabled?: boolean

View file

@ -1,107 +0,0 @@
.stepsHeader {
@apply flex items-center px-6 py-6;
color: #344054;
font-weight: 600;
font-size: 14px;
line-height: 20px;
}
.navBack {
@apply box-border flex justify-center items-center mr-3 w-8 h-8 bg-white bg-center bg-no-repeat cursor-pointer hover:border-gray-300;
border: 0.5px solid #F2F4F7;
box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
border-radius: 32px;
background-image: url(../assets/arrow-narrow-left.svg);
background-size: 16px;
}
.stepList {
@apply p-4 relative;
line-height: 18px;
}
.stepItem {
@apply relative flex justify-items-start pt-3 pr-0 pb-3 box-content;
padding-left: 52px;
font-size: 13px;
height: 18px;
}
.stepItem.step1::before {
content: '';
position: absolute;
bottom: 0;
left: 23px;
width: 2px;
height: 7px;
background-color: #f2f4f7;
}
.stepItem.step2::before {
content: '';
position: absolute;
top: 0;
left: 23px;
width: 2px;
height: 100%;
background-color: #f2f4f7;
}
.stepItem.step2::after {
content: '';
position: absolute;
top: 6px;
left: 23px;
width: 2px;
height: 28px;
background-color: #fff;
}
.stepItem.step3::before {
content: '';
position: absolute;
top: 0;
left: 23px;
width: 2px;
height: 7px;
background-color: #f2f4f7;
}
.stepNum {
@apply box-border absolute top-2 left-3 flex justify-center items-center w-6 h-6;
color: #98a2b3;
font-size: 12px;
border: 1px solid #F2F4F7;
border-radius: 24px;
z-index: 1;
}
.stepName {
color: #98a2b3;
}
.stepItem.active .stepNum {
color: #1c64f2;
background-color: #EFF4FF;
border: none;
}
.stepItem.active .stepName {
color: #1c64f2;
}
.stepItem.done .stepNum {
color: #667085;
background-color: #f2f4f7;
border: none;
}
.stepItem.done .stepNum::after {
content: '';
display: flex;
width: 12px;
height: 12px;
background: center no-repeat url(../assets/check.svg);
background-size: 12px;
}
.stepItem.done .stepName {
color: #667085;
}

View file

@ -1,61 +0,0 @@
'use client'
import { useTranslation } from 'react-i18next'
import { useRouter } from 'next/navigation'
import { useCallback } from 'react'
import s from './index.module.css'
import cn from '@/utils/classnames'
import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
type IStepsNavBarProps = {
step: number
datasetId?: string
}
const STEP_T_MAP: Record<number, string> = {
1: 'datasetCreation.steps.one',
2: 'datasetCreation.steps.two',
3: 'datasetCreation.steps.three',
}
const STEP_LIST = [1, 2, 3]
const StepsNavBar = ({
step,
datasetId,
}: IStepsNavBarProps) => {
const { t } = useTranslation()
const router = useRouter()
const media = useBreakpoints()
const isMobile = media === MediaType.mobile
const navBackHandle = useCallback(() => {
if (!datasetId)
router.replace('/datasets')
else
router.replace(`/datasets/${datasetId}/documents`)
}, [router, datasetId])
return (
<div className='w-full pt-4'>
<div className={cn(s.stepsHeader, isMobile && '!px-0 justify-center')}>
<div onClick={navBackHandle} className={cn(s.navBack, isMobile && '!mr-0')} />
{!isMobile && (!datasetId ? t('datasetCreation.steps.header.creation') : t('datasetCreation.steps.header.update'))}
</div>
<div className={cn(s.stepList, isMobile && '!p-0')}>
{STEP_LIST.map(item => (
<div
key={item}
className={cn(s.stepItem, s[`step${item}`], step === item && s.active, step > item && s.done, isMobile && 'px-0')}
>
<div className={cn(s.stepNum)}>{step > item ? '' : item}</div>
<div className={cn(s.stepName)}>{isMobile ? '' : t(STEP_T_MAP[item])}</div>
</div>
))}
</div>
</div>
)
}
export default StepsNavBar

View file

@ -1,12 +1,13 @@
import type { FC } from 'react'
import { type FC, useMemo } from 'react'
import { RiArrowLeftLine } from '@remixicon/react'
import Link from 'next/link'
import { useTranslation } from 'react-i18next'
import { Stepper, type StepperProps } from '../stepper'
import classNames from '@/utils/classnames'
export type TopbarProps = Pick<StepperProps, 'activeIndex'> & {
export type TopBarProps = Pick<StepperProps, 'activeIndex'> & {
className?: string
datasetId?: string
}
const STEP_T_MAP: Record<number, string> = {
@ -15,20 +16,25 @@ const STEP_T_MAP: Record<number, string> = {
3: 'datasetCreation.steps.three',
}
export const Topbar: FC<TopbarProps> = (props) => {
const { className, ...rest } = props
export const TopBar: FC<TopBarProps> = (props) => {
const { className, datasetId, ...rest } = props
const { t } = useTranslation()
const fallbackRoute = useMemo(() => {
return datasetId ? `/datasets/${datasetId}/documents` : '/datasets'
}, [datasetId])
return <div className={classNames('flex shrink-0 h-[52px] items-center justify-between relative border-b border-b-divider-subtle', className)}>
<Link href={'/datasets'} className="h-12 pl-2 pr-6 py-2 justify-start items-center gap-1 inline-flex">
<Link href={fallbackRoute} replace className="h-12 pl-2 pr-6 py-2 justify-start items-center gap-1 inline-flex">
<div className='p-2'>
<RiArrowLeftLine className='size-4 text-text-primary' />
</div>
<p className="text-text-primary system-sm-semibold-uppercase">
{t('datasetCreation.steps.header.creation')}
{t('datasetCreation.steps.header.fallbackRoute')}
</p>
</Link>
<div className={
'top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 absolute'
'top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 absolute'
}>
<Stepper
steps={Array.from({ length: 3 }, (_, i) => ({

View file

@ -5,7 +5,7 @@ import cn from '@/utils/classnames'
import Checkbox from '@/app/components/base/checkbox'
import Tooltip from '@/app/components/base/tooltip'
type Props = {
interface Props {
className?: string
isChecked: boolean
onChange: (isChecked: boolean) => void

View file

@ -4,7 +4,7 @@ import React from 'react'
import cn from '@/utils/classnames'
import { AlertTriangle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback'
type Props = {
interface Props {
className?: string
title: string
errorMsg?: string

View file

@ -5,7 +5,7 @@ import Input from './input'
import cn from '@/utils/classnames'
import Tooltip from '@/app/components/base/tooltip'
type Props = {
interface Props {
className?: string
label: string
labelClassName?: string

View file

@ -2,7 +2,7 @@
import type { FC } from 'react'
import React, { useCallback } from 'react'
type Props = {
interface Props {
value: string | number
onChange: (value: string | number) => void
placeholder?: string
@ -20,7 +20,7 @@ const Input: FC<Props> = ({
const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
const value = e.target.value
if (isNumber) {
let numberValue = parseInt(value, 10) // integer only
let numberValue = Number.parseInt(value, 10) // integer only
if (isNaN(numberValue)) {
onChange('')
return

View file

@ -8,7 +8,7 @@ import { Settings04 } from '@/app/components/base/icons/src/vender/line/general'
import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'
const I18N_PREFIX = 'datasetCreation.stepOne.website'
type Props = {
interface Props {
className?: string
children: React.ReactNode
controlFoldOptions?: number

View file

@ -7,7 +7,7 @@ import Button from '@/app/components/base/button'
const I18N_PREFIX = 'datasetCreation.stepOne.website'
type Props = {
interface Props {
isRunning: boolean
onRun: (url: string) => void
}

View file

@ -6,7 +6,7 @@ import cn from '@/utils/classnames'
import type { CrawlResultItem as CrawlResultItemType } from '@/models/datasets'
import Checkbox from '@/app/components/base/checkbox'
type Props = {
interface Props {
payload: CrawlResultItemType
isChecked: boolean
isPreview: boolean

View file

@ -9,7 +9,7 @@ import type { CrawlResultItem } from '@/models/datasets'
const I18N_PREFIX = 'datasetCreation.stepOne.website'
type Props = {
interface Props {
className?: string
list: CrawlResultItem[]
checkedList: CrawlResultItem[]

View file

@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'
import cn from '@/utils/classnames'
import { RowStruct } from '@/app/components/base/icons/src/public/other'
type Props = {
interface Props {
className?: string
crawledNum: number
totalNum: number

View file

@ -1,259 +0,0 @@
import type { FC } from 'react'
import React, { useState } from 'react'
import { ArrowUpRightIcon } from '@heroicons/react/24/outline'
import { useTranslation } from 'react-i18next'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import { StatusItem } from '../../list'
import style from '../../style.module.css'
import s from './style.module.css'
import { SegmentIndexTag } from './common/segment-index-tag'
import cn from '@/utils/classnames'
import Confirm from '@/app/components/base/confirm'
import Switch from '@/app/components/base/switch'
import Divider from '@/app/components/base/divider'
import Indicator from '@/app/components/header/indicator'
import { formatNumber } from '@/utils/format'
import type { SegmentDetailModel } from '@/models/datasets'
const ProgressBar: FC<{ percent: number; loading: boolean }> = ({ percent, loading }) => {
return (
<div className={s.progressWrapper}>
<div className={cn(s.progress, loading ? s.progressLoading : '')}>
<div
className={s.progressInner}
style={{ width: `${loading ? 0 : (Math.min(percent, 1) * 100).toFixed(2)}%` }}
/>
</div>
<div className={loading ? s.progressTextLoading : s.progressText}>{loading ? null : percent.toFixed(2)}</div>
</div>
)
}
type DocumentTitleProps = {
extension?: string
name?: string
iconCls?: string
textCls?: string
wrapperCls?: string
}
const DocumentTitle: FC<DocumentTitleProps> = ({ extension, name, iconCls, textCls, wrapperCls }) => {
const localExtension = extension?.toLowerCase() || name?.split('.')?.pop()?.toLowerCase()
return <div className={cn('flex items-center justify-start flex-1', wrapperCls)}>
<div className={cn(s[`${localExtension || 'txt'}Icon`], style.titleIcon, iconCls)}></div>
<span className={cn('font-semibold text-lg text-gray-900 ml-1', textCls)}> {name || '--'}</span>
</div>
}
export type UsageScene = 'doc' | 'hitTesting'
type ISegmentCardProps = {
loading: boolean
detail?: SegmentDetailModel & { document: { name: string } }
contentExternal?: string
refSource?: {
title: string
uri: string
}
isExternal?: boolean
score?: number
onClick?: () => void
onChangeSwitch?: (segId: string, enabled: boolean) => Promise<void>
onDelete?: (segId: string) => Promise<void>
scene?: UsageScene
className?: string
archived?: boolean
embeddingAvailable?: boolean
}
const SegmentCard: FC<ISegmentCardProps> = ({
detail = {},
contentExternal,
isExternal,
refSource,
score,
onClick,
onChangeSwitch,
onDelete,
loading = true,
scene = 'doc',
className = '',
archived,
embeddingAvailable,
}) => {
const { t } = useTranslation()
const {
id,
position,
enabled,
content,
word_count,
hit_count,
index_node_hash,
answer,
} = detail as Required<ISegmentCardProps>['detail']
const isDocScene = scene === 'doc'
const [showModal, setShowModal] = useState(false)
const renderContent = () => {
if (answer) {
return (
<>
<div className='flex mb-2'>
<div className='mr-2 text-[13px] font-semibold text-gray-400'>Q</div>
<div className='text-[13px]'>{content}</div>
</div>
<div className='flex'>
<div className='mr-2 text-[13px] font-semibold text-gray-400'>A</div>
<div className='text-[13px]'>{answer}</div>
</div>
</>
)
}
if (contentExternal)
return contentExternal
return content
}
return (
<div
className={cn(
s.segWrapper,
(isDocScene && !enabled) ? 'bg-gray-25' : '',
'group',
!loading ? 'pb-4 hover:pb-[10px]' : '',
className,
)}
onClick={() => onClick?.()}
>
<div className={s.segTitleWrapper}>
{isDocScene
? <>
<SegmentIndexTag positionId={position} className={cn('w-fit group-hover:opacity-100', (isDocScene && !enabled) ? 'opacity-50' : '')} />
<div className={s.segStatusWrapper}>
{loading
? (
<Indicator
color="gray"
className="bg-gray-200 border-gray-300 shadow-none"
/>
)
: (
<>
<StatusItem status={enabled ? 'enabled' : 'disabled'} reverse textCls="text-gray-500 text-xs" />
{embeddingAvailable && (
<div className="hidden group-hover:inline-flex items-center">
<Divider type="vertical" className="!h-2" />
<div
onClick={(e: React.MouseEvent<HTMLDivElement, MouseEvent>) =>
e.stopPropagation()
}
className="inline-flex items-center"
>
<Switch
size='md'
disabled={archived || detail.status !== 'completed'}
defaultValue={enabled}
onChange={async (val) => {
await onChangeSwitch?.(id, val)
}}
/>
</div>
</div>
)}
</>
)}
</div>
</>
: (
score !== null
? (
<div className={s.hitTitleWrapper}>
<div className={cn(s.commonIcon, s.targetIcon, loading ? '!bg-gray-300' : '', '!w-3.5 !h-3.5')} />
<ProgressBar percent={score ?? 0} loading={loading} />
</div>
)
: null
)}
</div>
{loading
? (
<div className={cn(s.cardLoadingWrapper, s.cardLoadingIcon)}>
<div className={cn(s.cardLoadingBg)} />
</div>
)
: (
isDocScene
? <>
<div
className={cn(
s.segContent,
enabled ? '' : 'opacity-50',
'group-hover:text-transparent group-hover:bg-clip-text group-hover:bg-gradient-to-b',
)}
>
{renderContent()}
</div>
<div className={cn('group-hover:flex', s.segData)}>
<div className="flex items-center mr-6">
<div className={cn(s.commonIcon, s.typeSquareIcon)}></div>
<div className={s.segDataText}>{formatNumber(word_count)}</div>
</div>
<div className="flex items-center mr-6">
<div className={cn(s.commonIcon, s.targetIcon)} />
<div className={s.segDataText}>{formatNumber(hit_count)}</div>
</div>
<div className="grow flex items-center">
<div className={cn(s.commonIcon, s.bezierCurveIcon)} />
<div className={s.segDataText}>{index_node_hash}</div>
</div>
{!archived && embeddingAvailable && (
<div className='shrink-0 w-6 h-6 flex items-center justify-center rounded-md hover:bg-red-100 hover:text-red-600 cursor-pointer group/delete' onClick={(e) => {
e.stopPropagation()
setShowModal(true)
}}>
<RiDeleteBinLine className='w-[14px] h-[14px] text-gray-500 group-hover/delete:text-red-600' />
</div>
)}
</div>
</>
: <>
<div className="h-[140px] overflow-hidden text-ellipsis text-sm font-normal text-gray-800">
{renderContent()}
</div>
<div className={cn('w-full bg-gray-50 group-hover:bg-white')}>
<Divider />
<div className="relative flex items-center w-full pb-1">
<DocumentTitle
name={detail?.document?.name || refSource?.title || ''}
extension={(detail?.document?.name || refSource?.title || '').split('.').pop() || 'txt'}
wrapperCls='w-full'
iconCls="!h-4 !w-4 !bg-contain"
textCls="text-xs text-gray-700 !font-normal overflow-hidden whitespace-nowrap text-ellipsis"
/>
<div className={cn(s.chartLinkText, 'group-hover:inline-flex')}>
{isExternal ? t('datasetHitTesting.viewDetail') : t('datasetHitTesting.viewChart')}
<ArrowUpRightIcon className="w-3 h-3 ml-1 stroke-current stroke-2" />
</div>
</div>
</div>
</>
)}
{showModal
&& <Confirm
isShow={showModal}
title={t('datasetDocuments.segment.delete')}
confirmText={t('common.operation.sure')}
onConfirm={async () => { await onDelete?.(id) }}
onCancel={() => setShowModal(false)}
/>
}
</div>
)
}
export default SegmentCard

View file

@ -3,6 +3,7 @@ import type { ComponentProps, FC } from 'react'
import { useTranslation } from 'react-i18next'
import { ChunkingMode } from '@/models/datasets'
import classNames from '@/utils/classnames'
import { Markdown } from '@/app/components/base/markdown'
type IContentProps = ComponentProps<'textarea'>
@ -52,7 +53,7 @@ const AutoResizeTextArea: FC<IAutoResizeTextAreaProps> = React.memo(({
if (!textarea)
return
textarea.style.height = 'auto'
const lineHeight = parseInt(getComputedStyle(textarea).lineHeight)
const lineHeight = Number.parseInt(getComputedStyle(textarea).lineHeight)
const textareaHeight = Math.max(textarea.scrollHeight, lineHeight)
textarea.style.height = `${textareaHeight}px`
}, [value])
@ -175,6 +176,15 @@ const ChunkContent: FC<IChunkContentProps> = ({
/>
}
if (!isEditMode) {
return (
<Markdown
className='h-full w-full !text-text-secondary'
content={question}
/>
)
}
return (
<Textarea
className='h-full w-full pb-6 body-md-regular text-text-secondary tracking-[-0.07px] caret-[#295EFF]'

View file

@ -80,7 +80,7 @@ export const useSegmentListContext = (selector: (value: SegmentListContextValue)
return useContextSelector(SegmentListContext, selector)
}
type ICompletedProps = {
interface ICompletedProps {
embeddingAvailable: boolean
showNewSegmentModal: boolean
onNewSegmentModalChange: (state: boolean) => void

View file

@ -0,0 +1,56 @@
import React, { type FC } from 'react'
import cn from '@/utils/classnames'
import { useSegmentListContext } from '..'
import { Markdown } from '@/app/components/base/markdown'
type ChunkContentProps = {
detail: {
answer?: string
content: string
sign_content: string
}
isFullDocMode: boolean
className?: string
}
const ChunkContent: FC<ChunkContentProps> = ({
detail,
isFullDocMode,
className,
}) => {
const { answer, content, sign_content } = detail
const isCollapsed = useSegmentListContext(s => s.isCollapsed)
if (answer) {
return (
<div className={className}>
<div className='flex gap-x-1'>
<div className='w-4 text-[13px] font-medium leading-[20px] text-text-tertiary shrink-0'>Q</div>
<div
className={cn('text-text-secondary body-md-regular',
isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
)}>
{content}
</div>
</div>
<div className='flex gap-x-1'>
<div className='w-4 text-[13px] font-medium leading-[20px] text-text-tertiary shrink-0'>A</div>
<div className={cn('text-text-secondary body-md-regular',
isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
)}>
{answer}
</div>
</div>
</div>
)
}
return <Markdown
className={cn('!text-text-secondary !mt-0.5',
isFullDocMode ? 'line-clamp-3' : isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
className,
)}
content={sign_content || content}
/>
}
export default React.memo(ChunkContent)

View file

@ -1,14 +1,13 @@
import React, { type FC, useCallback, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { RiDeleteBinLine, RiEditLine } from '@remixicon/react'
import { StatusItem } from '../../list'
import { useDocumentContext } from '../index'
import ChildSegmentList from './child-segment-list'
import Tag from './common/tag'
import Dot from './common/dot'
import { SegmentIndexTag } from './common/segment-index-tag'
import ParentChunkCardSkeleton from './skeleton/parent-chunk-card-skeleton'
import { useSegmentListContext } from './index'
import { StatusItem } from '../../../list'
import { useDocumentContext } from '../../index'
import ChildSegmentList from '../child-segment-list'
import Tag from '../common/tag'
import Dot from '../common/dot'
import { SegmentIndexTag } from '../common/segment-index-tag'
import ParentChunkCardSkeleton from '../skeleton/parent-chunk-card-skeleton'
import type { ChildChunkDetail, SegmentDetailModel } from '@/models/datasets'
import Switch from '@/app/components/base/switch'
import Divider from '@/app/components/base/divider'
@ -18,6 +17,7 @@ import cn from '@/utils/classnames'
import Badge from '@/app/components/base/badge'
import { isAfter } from '@/utils/time'
import Tooltip from '@/app/components/base/tooltip'
import ChunkContent from './chunk-content'
type ISegmentCardProps = {
loading: boolean
@ -59,6 +59,7 @@ const SegmentCard: FC<ISegmentCardProps> = ({
position,
enabled,
content,
sign_content,
word_count,
hit_count,
answer,
@ -68,7 +69,6 @@ const SegmentCard: FC<ISegmentCardProps> = ({
updated_at,
} = detail as Required<ISegmentCardProps>['detail']
const [showModal, setShowModal] = useState(false)
const isCollapsed = useSegmentListContext(s => s.isCollapsed)
const mode = useDocumentContext(s => s.mode)
const parentMode = useDocumentContext(s => s.parentMode)
@ -103,33 +103,6 @@ const SegmentCard: FC<ISegmentCardProps> = ({
onClick?.()
}, [mode, parentMode, onClick])
const renderContent = () => {
if (answer) {
return (
<>
<div className='flex gap-x-1'>
<div className='w-4 text-[13px] font-medium leading-[20px] text-text-tertiary shrink-0'>Q</div>
<div
className={cn('text-text-secondary body-md-regular',
isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
)}>
{content}
</div>
</div>
<div className='flex gap-x-1'>
<div className='w-4 text-[13px] font-medium leading-[20px] text-text-tertiary shrink-0'>A</div>
<div className={cn('text-text-secondary body-md-regular',
isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
)}>
{answer}
</div>
</div>
</>
)
}
return content
}
const wordCountText = useMemo(() => {
const total = formatNumber(word_count)
return `${total} ${t('datasetDocuments.segment.characters', { count: word_count })}`
@ -234,12 +207,15 @@ const SegmentCard: FC<ISegmentCardProps> = ({
: null}
</>
</div>
<div className={cn('text-text-secondary body-md-regular -tracking-[0.07px] mt-0.5',
contentOpacity,
isFullDocMode ? 'line-clamp-3' : isCollapsed ? 'line-clamp-2' : 'line-clamp-20',
)}>
{renderContent()}
</div>
<ChunkContent
detail={{
answer,
content,
sign_content,
}}
isFullDocMode={isFullDocMode}
className={contentOpacity}
/>
{isGeneralMode && <div className={cn('flex flex-wrap items-center gap-2 py-1.5', contentOpacity)}>
{keywords?.map(keyword => <Tag key={keyword} text={keyword} />)}
</div>}

View file

@ -142,9 +142,9 @@ const SegmentDetail: FC<ISegmentDetailProps> = ({
<div className={classNames(
'flex grow',
fullScreen ? 'w-full flex-row justify-center px-6 pt-6 gap-x-8' : 'flex-col gap-y-1 py-3 px-4',
!isEditMode && 'pb-0',
!isEditMode && 'pb-0 overflow-hidden',
)}>
<div className={classNames('break-all overflow-hidden whitespace-pre-line', fullScreen ? 'w-1/2' : 'grow')}>
<div className={classNames(isEditMode ? 'break-all whitespace-pre-line overflow-hidden' : 'overflow-y-auto', fullScreen ? 'w-1/2' : 'grow')}>
<ChunkContent
docForm={docForm}
question={question}

View file

@ -17,7 +17,7 @@ const FullDocListSkeleton = () => {
return (
<div className='w-full grow flex flex-col gap-y-3 relative z-10 overflow-y-hidden'>
<div className='absolute top-0 left-0 bottom-14 w-full h-full bg-dataset-chunk-list-mask-bg z-20' />
{[...Array(15)].map((_, index) => <Slice key={index} />)}
{[...Array.from({ length: 15 })].map((_, index) => <Slice key={index} />)}
</div>
)
}

View file

@ -8,7 +8,7 @@ import {
import Checkbox from '@/app/components/base/checkbox'
import Divider from '@/app/components/base/divider'
const CardSkelton = React.memo(() => {
export const CardSkelton = React.memo(() => {
return (
<SkeletonContainer className='p-1 pb-2 gap-y-0'>
<SkeletonContainer className='px-2 pt-1.5 gap-y-0.5'>
@ -50,7 +50,7 @@ const GeneralListSkeleton = () => {
return (
<div className='relative flex flex-col grow overflow-y-hidden z-10'>
<div className='absolute top-0 left-0 w-full h-full bg-dataset-chunk-list-mask-bg z-20' />
{[...Array(10)].map((_, index) => {
{[...Array.from({ length: 10 })].map((_, index) => {
return (
<div key={index} className='flex items-start gap-x-2'>
<Checkbox

View file

@ -52,7 +52,7 @@ const ParagraphListSkeleton = () => {
return (
<div className='relative flex flex-col h-full overflow-y-hidden z-10'>
<div className='absolute top-0 left-0 w-full h-full bg-dataset-chunk-list-mask-bg z-20' />
{[...Array(10)].map((_, index) => {
{[...Array.from({ length: 10 })].map((_, index) => {
return (
<div key={index} className='flex items-start gap-x-2'>
<Checkbox

View file

@ -49,7 +49,7 @@ const EmbeddingSkeleton = () => {
return (
<div className='relative flex flex-col grow overflow-y-hidden z-10'>
<div className='absolute top-0 left-0 w-full h-full bg-dataset-chunk-list-mask-bg z-20' />
{[...Array(5)].map((_, index) => {
{[...Array.from({ length: 5 })].map((_, index) => {
return (
<div key={index} className='w-full px-11'>
<CardSkelton />

View file

@ -29,7 +29,7 @@ const map2Options = (map: { [key: string]: string }) => {
return Object.keys(map).map(key => ({ value: key, name: map[key] }))
}
type IFieldInfoProps = {
interface IFieldInfoProps {
label: string
value?: string
valueIcon?: ReactNode
@ -117,7 +117,7 @@ const IconButton: FC<{
)
}
type IMetadataProps = {
interface IMetadataProps {
docDetail?: FullDocumentDetail
loading: boolean
onUpdate: () => void

View file

@ -16,7 +16,7 @@ import { ModelTypeEnum } from '@/app/components/header/account-setting/model-pro
import type { NotionPage } from '@/models/common'
import { useDocumentDetail, useInvalidDocumentDetailKey } from '@/service/knowledge/use-document'
type DocumentSettingsProps = {
interface DocumentSettingsProps {
datasetId: string
documentId: string
}

View file

@ -73,7 +73,7 @@ const EmptyElement: FC<{ canAdd: boolean; onClick: () => void; type?: 'upload' |
</div>
}
type IDocumentsProps = {
interface IDocumentsProps {
datasetId: string
}

View file

@ -9,7 +9,7 @@ import Button from '@/app/components/base/button'
import Input from '@/app/components/base/input'
import { renameDocumentName } from '@/service/datasets'
type Props = {
interface Props {
datasetId: string
documentId: string
name: string

View file

@ -87,4 +87,6 @@ const Form: FC<FormProps> = React.memo(({
)
})
Form.displayName = 'Form'
export default Form

View file

@ -12,6 +12,7 @@ import FileIcon from '@/app/components/base/file-uploader/file-type-icon'
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'
@ -26,7 +27,7 @@ const ChunkDetailModal: FC<Props> = ({
}) => {
const { t } = useTranslation()
const { segment, score, child_chunks } = payload
const { position, content, keywords, document } = segment
const { position, content, sign_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'
@ -56,9 +57,10 @@ const ChunkDetailModal: FC<Props> = ({
</div>
<Score value={score} />
</div>
<div className={cn('mt-2 body-md-regular text-text-secondary break-all', heighClassName)}>
{content}
</div>
<Markdown
className={cn('!mt-2 !text-text-secondary', heighClassName)}
content={sign_content || content}
/>
{!isParentChildRetrieval && keywords && keywords.length > 0 && (
<div className='mt-6'>
<div className='font-medium text-xs text-text-tertiary uppercase'>{t(`${i18nPrefix}.keyword`)}</div>

View file

@ -13,6 +13,7 @@ import cn from '@/utils/classnames'
import type { FileAppearanceTypeEnum } from '@/app/components/base/file-uploader/types'
import Tag from '@/app/components/datasets/documents/detail/completed/common/tag'
import { extensionToFileType } from '@/app/components/datasets/hit-testing/utils/extension-to-file-type'
import { Markdown } from '@/app/components/base/markdown'
const i18nPrefix = 'datasetHitTesting'
type Props = {
@ -25,7 +26,7 @@ const ResultItem: FC<Props> = ({
const { t } = useTranslation()
const { segment, score, child_chunks } = payload
const data = segment
const { position, word_count, content, keywords, document } = data
const { position, word_count, content, sign_content, keywords, document } = data
const isParentChildRetrieval = !!(child_chunks && child_chunks.length > 0)
const extension = document.name.split('.').slice(-1)[0] as FileAppearanceTypeEnum
const fileType = extensionToFileType(extension)
@ -46,10 +47,16 @@ const ResultItem: FC<Props> = ({
{/* Main */}
<div className='mt-1 px-3'>
<div className='line-clamp-2 body-md-regular break-all'>{content}</div>
<Markdown className='line-clamp-2' content={sign_content || content} />
{isParentChildRetrieval && (
<div className='mt-1'>
<div className={cn('inline-flex items-center h-6 space-x-0.5 text-text-secondary select-none rounded-lg cursor-pointer', isFold && 'pl-1 bg-[linear-gradient(90deg,_rgba(200,_206,_218,_0.20)_0%,_rgba(200,_206,_218,_0.04)_100%)]')} onClick={toggleFold}>
<div
className={cn('inline-flex items-center h-6 space-x-0.5 text-text-secondary select-none rounded-lg cursor-pointer', isFold && 'pl-1 bg-[linear-gradient(90deg,_rgba(200,_206,_218,_0.20)_0%,_rgba(200,_206,_218,_0.04)_100%)]')}
onClick={(e) => {
e.stopPropagation()
toggleFold()
}}
>
<Icon className={cn('w-4 h-4', isFold && 'opacity-50')} />
<div className='text-xs font-semibold uppercase'>{t(`${i18nPrefix}.hitChunks`, { num: child_chunks.length })}</div>
</div>

View file

@ -7,7 +7,6 @@ import { omit } from 'lodash-es'
import { useBoolean } from 'ahooks'
import { useContext } from 'use-context-selector'
import { RiApps2Line, RiFocus2Line } from '@remixicon/react'
import SegmentCard from '../documents/detail/completed/SegmentCard'
import Textarea from './textarea'
import s from './style.module.css'
import ModifyRetrievalModal from './modify-retrieval-modal'
@ -25,6 +24,7 @@ import type { RetrievalConfig } from '@/types/app'
import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
import useTimestamp from '@/hooks/use-timestamp'
import docStyle from '@/app/components/datasets/documents/detail/completed/style.module.css'
import { CardSkelton } from '../documents/detail/completed/skeleton/general-list-skeleton'
const limit = 10
@ -180,11 +180,9 @@ const HitTestingPage: FC<Props> = ({ datasetId }: Props) => {
<div className='flex flex-col pt-3'>
{/* {renderHitResults(generalResultData)} */}
{submitLoading
? <SegmentCard
loading={true}
scene='hitTesting'
className='h-[216px]'
/>
? <div className='h-full flex flex-col py-3 px-4 rounded-t-2xl bg-background-body'>
<CardSkelton />
</div>
: (
(() => {
if (!hitResult?.records.length && !externalHitResult?.records.length)

View file

@ -15,7 +15,7 @@ import { asyncRunSafe } from '@/utils'
import { RETRIEVE_METHOD, type RetrievalConfig } from '@/types/app'
import promptS from '@/app/components/app/configuration/config-prompt/style.module.css'
type TextAreaWithButtonIProps = {
interface TextAreaWithButtonIProps {
datasetId: string
onUpdateList: () => void
setHitResult: (res: HitTestingResponse) => void

View file

@ -14,7 +14,7 @@ import { ToastContext } from '@/app/components/base/toast'
import type { DataSet } from '@/models/datasets'
import { updateDatasetSetting } from '@/service/datasets'
type RenameDatasetModalProps = {
interface RenameDatasetModalProps {
show: boolean
dataset: DataSet
onSuccess?: () => void

View file

@ -19,7 +19,7 @@ import { ApiConnectionMod } from '@/app/components/base/icons/src/vender/solid/d
import { updateDatasetSetting } from '@/service/datasets'
import { type DataSetListResponse, DatasetPermission } from '@/models/datasets'
import DatasetDetailContext from '@/context/dataset-detail'
import { type RetrievalConfig } from '@/types/app'
import type { RetrievalConfig } from '@/types/app'
import { useAppContext } from '@/context/app-context'
import { isReRankModelSelected } from '@/app/components/datasets/common/check-rerank-model'
import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'

View file

@ -88,8 +88,8 @@ const PermissionSelector = ({ disabled, permission, value, memberList, onChange,
<div className='mr-2 flex items-center justify-center w-6 h-6 rounded-lg bg-[#EEF4FF]'>
<Users01 className='w-3.5 h-3.5 text-[#444CE7]' />
</div>
<div className='grow mr-2 text-gray-900 text-sm leading-5'>{t('datasetSettings.form.permissionsAllMember')}</div>
{!disabled && <RiArrowDownSLine className='shrink-0 w-4 h-4 text-gray-700' />}
<div className='grow mr-2 text-text-primary text-sm leading-5'>{t('datasetSettings.form.permissionsAllMember')}</div>
{!disabled && <RiArrowDownSLine className='shrink-0 w-4 h-4 text-text-secondary' />}
</div>
)}
{isPartialMembers && (
@ -97,13 +97,13 @@ const PermissionSelector = ({ disabled, permission, value, memberList, onChange,
<div className='mr-2 flex items-center justify-center w-6 h-6 rounded-lg bg-[#EEF4FF]'>
<Users01 className='w-3.5 h-3.5 text-[#444CE7]' />
</div>
<div title={selectedMembers} className='grow mr-2 text-gray-900 text-sm leading-5 truncate'>{selectedMembers}</div>
{!disabled && <RiArrowDownSLine className='shrink-0 w-4 h-4 text-gray-700' />}
<div title={selectedMembers} className='grow mr-2 text-text-primary text-sm leading-5 truncate'>{selectedMembers}</div>
{!disabled && <RiArrowDownSLine className='shrink-0 w-4 h-4 text-text-secondary' />}
</div>
)}
</PortalToFollowElemTrigger>
<PortalToFollowElemContent className='z-[1002]'>
<div className='relative w-[480px] rounded-lg border-[0.5px] bg-white shadow-lg'>
<div className='relative w-[480px] rounded-lg border-[0.5px] border-components-panel-border bg-components-panel-bg-blur backdrop-blur-sm shadow-lg'>
<div className='p-1'>
<div className='pl-3 pr-2 py-1 rounded-lg hover:bg-gray-50 cursor-pointer' onClick={() => {
onChange(DatasetPermission.onlyMe)
@ -155,23 +155,23 @@ const PermissionSelector = ({ disabled, permission, value, memberList, onChange,
<div className='pl-3 pr-[10px] py-1 flex gap-2 items-center rounded-lg'>
<Avatar avatar={userProfile.avatar_url} name={userProfile.name} className='shrink-0' size={24} />
<div className='grow'>
<div className='text-[13px] text-gray-700 font-medium leading-[18px] truncate'>
<div className='text-[13px] text-text-secondary font-medium leading-[18px] truncate'>
{userProfile.name}
<span className='text-xs text-gray-500 font-normal'>{t('datasetSettings.form.me')}</span>
<span className='text-xs text-text-tertiary font-normal'>{t('datasetSettings.form.me')}</span>
</div>
<div className='text-xs text-gray-500 leading-[18px] truncate'>{userProfile.email}</div>
<div className='text-xs text-text-tertiary leading-[18px] truncate'>{userProfile.email}</div>
</div>
<Check className='shrink-0 w-4 h-4 text-primary-600 opacity-30' />
<Check className='shrink-0 w-4 h-4 text-text-accent opacity-30' />
</div>
)}
{filteredMemberList.map(member => (
<div key={member.id} className='pl-3 pr-[10px] py-1 flex gap-2 items-center rounded-lg hover:bg-gray-100 cursor-pointer' onClick={() => selectMember(member)}>
<div key={member.id} className='pl-3 pr-[10px] py-1 flex gap-2 items-center rounded-lg hover:bg-state-base-hover cursor-pointer' onClick={() => selectMember(member)}>
<Avatar avatar={userProfile.avatar_url} name={member.name} className='shrink-0' size={24} />
<div className='grow'>
<div className='text-[13px] text-gray-700 font-medium leading-[18px] truncate'>{member.name}</div>
<div className='text-xs text-gray-500 leading-[18px] truncate'>{member.email}</div>
<div className='text-[13px] text-text-secondary font-medium leading-[18px] truncate'>{member.name}</div>
<div className='text-xs text-text-tertiary leading-[18px] truncate'>{member.email}</div>
</div>
{value.includes(member.id) && <Check className='shrink-0 w-4 h-4 text-primary-600' />}
{value.includes(member.id) && <Check className='shrink-0 w-4 h-4 text-text-accent' />}
</div>
))}
</div>