{
diff --git a/web/app/components/base/icons/assets/public/knowledge/chunk.svg b/web/app/components/base/icons/assets/public/knowledge/chunk.svg
new file mode 100644
index 0000000000..1dc04943fc
--- /dev/null
+++ b/web/app/components/base/icons/assets/public/knowledge/chunk.svg
@@ -0,0 +1,13 @@
+
diff --git a/web/app/components/base/icons/assets/public/knowledge/collapse.svg b/web/app/components/base/icons/assets/public/knowledge/collapse.svg
new file mode 100644
index 0000000000..b54e046085
--- /dev/null
+++ b/web/app/components/base/icons/assets/public/knowledge/collapse.svg
@@ -0,0 +1,9 @@
+
diff --git a/web/app/components/base/icons/src/public/knowledge/Chunk.json b/web/app/components/base/icons/src/public/knowledge/Chunk.json
new file mode 100644
index 0000000000..469d85d1a7
--- /dev/null
+++ b/web/app/components/base/icons/src/public/knowledge/Chunk.json
@@ -0,0 +1,116 @@
+{
+ "icon": {
+ "type": "element",
+ "isRootNode": true,
+ "name": "svg",
+ "attributes": {
+ "width": "10",
+ "height": "10",
+ "viewBox": "0 0 10 10",
+ "fill": "none",
+ "xmlns": "http://www.w3.org/2000/svg"
+ },
+ "children": [
+ {
+ "type": "element",
+ "name": "g",
+ "attributes": {
+ "id": "Group"
+ },
+ "children": [
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector",
+ "d": "M2.5 10H0V7.5H2.5V10Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_2",
+ "d": "M6.25 6.25H3.75V3.75H6.25V6.25Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_3",
+ "d": "M2.5 6.25H0V3.75H2.5V6.25Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_4",
+ "d": "M6.25 2.5H3.75V0H6.25V2.5Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_5",
+ "d": "M2.5 2.5H0V0H2.5V2.5Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_6",
+ "d": "M10 2.5H7.5V0H10V2.5Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_7",
+ "d": "M9.58342 7.91663H7.91675V9.58329H9.58342V7.91663Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_8",
+ "d": "M9.58342 4.16663H7.91675V5.83329H9.58342V4.16663Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "id": "Vector_9",
+ "d": "M5.83341 7.91663H4.16675V9.58329H5.83341V7.91663Z",
+ "fill": "#676F83"
+ },
+ "children": []
+ }
+ ]
+ }
+ ]
+ },
+ "name": "Chunk"
+}
\ No newline at end of file
diff --git a/web/app/components/base/icons/src/public/knowledge/Chunk.tsx b/web/app/components/base/icons/src/public/knowledge/Chunk.tsx
new file mode 100644
index 0000000000..87ff635811
--- /dev/null
+++ b/web/app/components/base/icons/src/public/knowledge/Chunk.tsx
@@ -0,0 +1,16 @@
+// GENERATE BY script
+// DON NOT EDIT IT MANUALLY
+
+import * as React from 'react'
+import data from './Chunk.json'
+import IconBase from '@/app/components/base/icons/IconBase'
+import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
+
+const Icon = React.forwardRef
, Omit>((
+ props,
+ ref,
+) => )
+
+Icon.displayName = 'Chunk'
+
+export default Icon
diff --git a/web/app/components/base/icons/src/public/knowledge/Collapse.json b/web/app/components/base/icons/src/public/knowledge/Collapse.json
new file mode 100644
index 0000000000..66d457155d
--- /dev/null
+++ b/web/app/components/base/icons/src/public/knowledge/Collapse.json
@@ -0,0 +1,62 @@
+{
+ "icon": {
+ "type": "element",
+ "isRootNode": true,
+ "name": "svg",
+ "attributes": {
+ "width": "16",
+ "height": "16",
+ "viewBox": "0 0 16 16",
+ "fill": "none",
+ "xmlns": "http://www.w3.org/2000/svg"
+ },
+ "children": [
+ {
+ "type": "element",
+ "name": "g",
+ "attributes": {
+ "id": "Icon L"
+ },
+ "children": [
+ {
+ "type": "element",
+ "name": "g",
+ "attributes": {
+ "id": "Vector"
+ },
+ "children": [
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "d": "M2.66602 11.3333H0.666016L3.33268 8.66667L5.99935 11.3333H3.99935L3.99935 14H2.66602L2.66602 11.3333Z",
+ "fill": "#354052"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "d": "M2.66602 4.66667L2.66602 2L3.99935 2L3.99935 4.66667L5.99935 4.66667L3.33268 7.33333L0.666016 4.66667L2.66602 4.66667Z",
+ "fill": "#354052"
+ },
+ "children": []
+ },
+ {
+ "type": "element",
+ "name": "path",
+ "attributes": {
+ "d": "M7.33268 2.66667H13.9993V4H7.33268V2.66667ZM7.33268 12H13.9993V13.3333H7.33268V12ZM5.99935 7.33333H13.9993V8.66667H5.99935V7.33333Z",
+ "fill": "#354052"
+ },
+ "children": []
+ }
+ ]
+ }
+ ]
+ }
+ ]
+ },
+ "name": "Collapse"
+}
\ No newline at end of file
diff --git a/web/app/components/base/icons/src/public/knowledge/Collapse.tsx b/web/app/components/base/icons/src/public/knowledge/Collapse.tsx
new file mode 100644
index 0000000000..48206c4d0c
--- /dev/null
+++ b/web/app/components/base/icons/src/public/knowledge/Collapse.tsx
@@ -0,0 +1,16 @@
+// GENERATE BY script
+// DON NOT EDIT IT MANUALLY
+
+import * as React from 'react'
+import data from './Collapse.json'
+import IconBase from '@/app/components/base/icons/IconBase'
+import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
+
+const Icon = React.forwardRef, Omit>((
+ props,
+ ref,
+) => )
+
+Icon.displayName = 'Collapse'
+
+export default Icon
diff --git a/web/app/components/base/icons/src/public/knowledge/index.ts b/web/app/components/base/icons/src/public/knowledge/index.ts
index 24bcf3e41c..86300c9ee3 100644
--- a/web/app/components/base/icons/src/public/knowledge/index.ts
+++ b/web/app/components/base/icons/src/public/knowledge/index.ts
@@ -1,3 +1,5 @@
+export { default as Chunk } from './Chunk'
+export { default as Collapse } from './Collapse'
export { default as GeneralType } from './GeneralType'
export { default as ParentChildType } from './ParentChildType'
export { default as SelectionMod } from './SelectionMod'
diff --git a/web/app/components/base/tooltip/index.tsx b/web/app/components/base/tooltip/index.tsx
index f3b4cff132..e5f27fdd8c 100644
--- a/web/app/components/base/tooltip/index.tsx
+++ b/web/app/components/base/tooltip/index.tsx
@@ -96,7 +96,7 @@ const Tooltip: FC = ({
>
{popupContent && ( triggerMethod === 'hover' && setHoverPopup()}
diff --git a/web/app/components/datasets/documents/detail/completed/batch-action.tsx b/web/app/components/datasets/documents/detail/completed/batch-action.tsx
new file mode 100644
index 0000000000..3bed21df96
--- /dev/null
+++ b/web/app/components/datasets/documents/detail/completed/batch-action.tsx
@@ -0,0 +1,57 @@
+import React, { type FC } from 'react'
+import { RiCheckboxCircleLine, RiCloseCircleLine, RiDeleteBinLine } from '@remixicon/react'
+import Divider from '@/app/components/base/divider'
+
+type IBatchActionProps = {
+ selectedSegmentIds: string[]
+ onBatchEnable: () => Promise
+ onBatchDisable: () => Promise
+ onBatchDelete: () => Promise
+ onCancel: () => void
+}
+
+const BatchAction: FC = ({
+ selectedSegmentIds,
+ onBatchEnable,
+ onBatchDisable,
+ onBatchDelete,
+ onCancel,
+}) => {
+ return (
+
+
+
+
+ {selectedSegmentIds.length}
+
+ Selected
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
- {localPositionId}
+
+
+
+ {localPositionId}
+
)
}
@@ -52,10 +69,11 @@ export const SegmentIndexTag: FC<{ positionId: string | number; className?: stri
type ISegmentDetailProps = {
embeddingAvailable: boolean
segInfo?: Partial
& { id: string }
- onChangeSwitch?: (segId: string, enabled: boolean) => Promise
+ onChangeSwitch?: (enabled: boolean, segId?: string) => Promise
onUpdate: (segmentId: string, q: string, a: string, k: string[]) => void
onCancel: () => void
archived?: boolean
+ isEditing?: boolean
}
/**
* Show all the contents of the segment
@@ -67,9 +85,10 @@ const SegmentDetailComponent: FC = ({
onChangeSwitch,
onUpdate,
onCancel,
+ isEditing: initialIsEditing,
}) => {
const { t } = useTranslation()
- const [isEditing, setIsEditing] = useState(false)
+ const [isEditing, setIsEditing] = useState(initialIsEditing)
const [question, setQuestion] = useState(segInfo?.content || '')
const [answer, setAnswer] = useState(segInfo?.answer || '')
const [keywords, setKeywords] = useState(segInfo?.keywords || [])
@@ -195,7 +214,7 @@ const SegmentDetailComponent: FC = ({
size='md'
defaultValue={segInfo?.enabled}
onChange={async (val) => {
- await onChangeSwitch?.(segInfo?.id || '', val)
+ await onChangeSwitch?.(val, segInfo?.id || '')
}}
disabled={archived}
/>
@@ -223,6 +242,8 @@ type ICompletedProps = {
onNewSegmentModalChange: (state: boolean) => void
importStatus: ProcessStatus | string | undefined
archived?: boolean
+ mode?: ProcessMode
+ parentMode?: ParentMode
// data: Array<{}> // all/part segments
}
/**
@@ -235,22 +256,26 @@ const Completed: FC = ({
onNewSegmentModalChange,
importStatus,
archived,
+ mode,
+ parentMode,
}) => {
const { t } = useTranslation()
const { notify } = useContext(ToastContext)
const { datasetId = '', documentId = '', docForm } = useContext(DocumentContext)
// the current segment id and whether to show the modal
- const [currSegment, setCurrSegment] = useState<{ segInfo?: SegmentDetailModel; showModal: boolean }>({ showModal: false })
+ const [currSegment, setCurrSegment] = useState<{ segInfo?: SegmentDetailModel; showModal: boolean; isEditing?: boolean }>({ showModal: false })
const [inputValue, setInputValue] = useState('') // the input value
const [searchValue, setSearchValue] = useState('') // the search value
const [selectedStatus, setSelectedStatus] = useState('all') // the selected status, enabled/disabled/undefined
- const [lastSegmentsRes, setLastSegmentsRes] = useState(undefined)
- const [allSegments, setAllSegments] = useState>([]) // all segments data
- const [loading, setLoading] = useState(false)
- const [total, setTotal] = useState()
+ const [segments, setSegments] = useState([]) // all segments data
+ const [selectedSegmentIds, setSelectedSegmentIds] = useState([])
const { eventEmitter } = useEventEmitterContextContext()
+ const [isCollapsed, setIsCollapsed] = useState(true)
+ // todo: pagination
+ const [currentPage, setCurrentPage] = useState(1)
+ const [limit, setLimit] = useState(10)
const { run: handleSearch } = useDebounceFn(() => {
setSearchValue(inputValue)
@@ -265,72 +290,86 @@ const Completed: FC = ({
setSelectedStatus(value === 'all' ? 'all' : !!value)
}
- const getSegments = async (needLastId?: boolean) => {
- const finalLastId = lastSegmentsRes?.data?.[lastSegmentsRes.data.length - 1]?.id || ''
- setLoading(true)
- const [e, res] = await asyncRunSafe(fetchSegments({
+ const { isLoading: isLoadingSegmentList, data: segmentList, refetch: refreshSegmentList } = useSegmentList(
+ {
datasetId,
documentId,
- params: omitBy({
- last_id: !needLastId ? undefined : finalLastId,
- limit: 12,
+ params: {
+ page: currentPage,
+ limit,
keyword: searchValue,
enabled: selectedStatus === 'all' ? 'all' : !!selectedStatus,
- }, isNil) as SegmentsQuery,
- }) as Promise)
- if (!e) {
- setAllSegments([...(!needLastId ? [] : allSegments), ...splitArray(res.data || [])])
- setLastSegmentsRes(res)
- if (!lastSegmentsRes || !needLastId)
- setTotal(res?.total || 0)
- }
- setLoading(false)
- }
+ },
+ },
+ mode === 'hierarchical' && parentMode === 'full-doc',
+ )
- const resetList = () => {
- setLastSegmentsRes(undefined)
- setAllSegments([])
- setLoading(false)
- setTotal(undefined)
- getSegments(false)
- }
+ useEffect(() => {
+ if (segmentList)
+ setSegments(segmentList.data || [])
+ }, [segmentList])
- const onClickCard = (detail: SegmentDetailModel) => {
- setCurrSegment({ segInfo: detail, showModal: true })
+ const resetList = useCallback(() => {
+ setSegments([])
+ refreshSegmentList()
+ }, [])
+
+ const onClickCard = (detail: SegmentDetailModel, isEditing = false) => {
+ setCurrSegment({ segInfo: detail, showModal: true, isEditing })
}
const onCloseModal = () => {
setCurrSegment({ ...currSegment, showModal: false })
}
- const onChangeSwitch = async (segId: string, enabled: boolean) => {
- const opApi = enabled ? enableSegment : disableSegment
- const [e] = await asyncRunSafe(opApi({ datasetId, segmentId: segId }) as Promise)
- if (!e) {
- notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
- for (const item of allSegments) {
- for (const seg of item) {
- if (seg.id === segId)
- seg.enabled = enabled
- }
- }
- setAllSegments([...allSegments])
- }
- else {
- notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })
- }
- }
+ const { mutateAsync: enableSegment } = useEnableSegment()
- const onDelete = async (segId: string) => {
- const [e] = await asyncRunSafe(deleteSegment({ datasetId, documentId, segmentId: segId }) as Promise)
- if (!e) {
- notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
- resetList()
- }
- else {
- notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })
- }
- }
+ const { mutateAsync: disableSegment } = useDisableSegment()
+
+ const onChangeSwitch = useCallback(async (enable: boolean, segId?: string) => {
+ const operationApi = enable ? enableSegment : disableSegment
+ await operationApi({ datasetId, documentId, segmentIds: segId ? [segId] : selectedSegmentIds }, {
+ onSuccess: () => {
+ notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
+ for (const seg of segments) {
+ if (segId ? seg.id === segId : selectedSegmentIds.includes(seg.id))
+ seg.enabled = enable
+ }
+ setSegments([...segments])
+ },
+ onError: () => {
+ notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })
+ },
+ })
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [datasetId, documentId, selectedSegmentIds, segments])
+
+ const { mutateAsync: deleteSegment } = useDeleteSegment()
+
+ const onDelete = useCallback(async (segId?: string) => {
+ await deleteSegment({ datasetId, documentId, segmentIds: segId ? [segId] : selectedSegmentIds }, {
+ onSuccess: () => {
+ notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
+ resetList()
+ },
+ onError: () => {
+ notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })
+ },
+ })
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [datasetId, documentId, selectedSegmentIds])
+
+ const onCancelBatchOperation = useCallback(() => {
+ setSelectedSegmentIds([])
+ }, [])
+
+ const onSelected = useCallback((segId: string) => {
+ setSelectedSegmentIds(prev =>
+ prev.includes(segId)
+ ? prev.filter(id => id !== segId)
+ : [...prev, segId],
+ )
+ }, [])
const handleUpdateSegment = async (segmentId: string, question: string, answer: string, keywords: string[]) => {
const params: SegmentUpdater = { content: '' }
@@ -358,40 +397,62 @@ const Completed: FC = ({
const res = await updateSegment({ datasetId, documentId, segmentId, body: params })
notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
onCloseModal()
- for (const item of allSegments) {
- for (const seg of item) {
- if (seg.id === segmentId) {
- seg.answer = res.data.answer
- seg.content = res.data.content
- seg.keywords = res.data.keywords
- seg.word_count = res.data.word_count
- seg.hit_count = res.data.hit_count
- seg.index_node_hash = res.data.index_node_hash
- seg.enabled = res.data.enabled
- }
+ for (const seg of segments) {
+ if (seg.id === segmentId) {
+ seg.answer = res.data.answer
+ seg.content = res.data.content
+ seg.keywords = res.data.keywords
+ seg.word_count = res.data.word_count
+ seg.hit_count = res.data.hit_count
+ seg.index_node_hash = res.data.index_node_hash
+ seg.enabled = res.data.enabled
}
}
- setAllSegments([...allSegments])
+ setSegments([...segments])
}
finally {
eventEmitter?.emit('')
}
}
- useEffect(() => {
- if (lastSegmentsRes !== undefined)
- getSegments(false)
- }, [selectedStatus, searchValue])
-
useEffect(() => {
if (importStatus === ProcessStatus.COMPLETED)
resetList()
- }, [importStatus])
+ }, [importStatus, resetList])
+
+ const isAllSelected = useMemo(() => {
+ return segments.every(seg => selectedSegmentIds.includes(seg.id))
+ }, [segments, selectedSegmentIds])
+
+ const isSomeSelected = useMemo(() => {
+ return segments.some(seg => selectedSegmentIds.includes(seg.id))
+ }, [segments, selectedSegmentIds])
+
+ const onSelectedAll = useCallback(() => {
+ setSelectedSegmentIds((prev) => {
+ const currentAllSegIds = segments.map(seg => seg.id)
+ const prevSelectedIds = prev.filter(item => !currentAllSegIds.includes(item))
+ return [...prevSelectedIds, ...((isAllSelected || selectedSegmentIds.length > 0) ? [] : currentAllSegIds)]
+ })
+ }, [segments, isAllSelected, selectedSegmentIds])
+
+ const totalText = useMemo(() => {
+ return segmentList?.total ? formatNumber(segmentList.total) : '--'
+ }, [segmentList?.total])
return (
- <>
+ setIsCollapsed(!isCollapsed),
+ }}>
-
{total ? formatNumber(total) : '--'} {t('datasetDocuments.segment.paragraphs')}
+
+
{totalText} {t('datasetDocuments.segment.chunks')}
= ({
]}
defaultValue={'all'}
className={s.select}
- wrapperClassName='h-fit w-[120px] mr-2' />
+ wrapperClassName='h-fit w-[100px] mr-2' />
= ({
onChange={e => handleInputChange(e.target.value)}
onClear={() => handleInputChange('')}
/>
+
+
·
+ )
+})
+
+Dot.displayName = 'Dot'
+
+const ProgressBar: FC<{ percent: number; loading: boolean }> = React.memo(({ percent, loading }) => {
+ return (
+
+
+
{loading ? null : percent.toFixed(2)}
+
+
+ {name || '--'}
+
+ )
+})
+
+DocumentTitle.displayName = 'DocumentTitle'
+
+const Tag = React.memo(({ text }: { text: string }) => {
+ return (
+
+ #
+ {text}
+
+ )
+})
+
+Tag.displayName = 'Tag'
+
+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?: (enabled: boolean, segId?: string) => Promise
+ onDelete?: (segId: string) => Promise
+ onClickEdit?: () => void
+ scene?: UsageScene
+ className?: string
+ archived?: boolean
+ embeddingAvailable?: boolean
+}
+
+const SegmentCard: FC = ({
+ detail = {},
+ contentExternal,
+ isExternal,
+ refSource,
+ score,
+ onClick,
+ onChangeSwitch,
+ onDelete,
+ onClickEdit,
+ loading = true,
+ scene = 'doc',
+ className = '',
+ archived,
+ embeddingAvailable,
+}) => {
+ const { t } = useTranslation()
+ const {
+ id,
+ position,
+ enabled,
+ content,
+ word_count,
+ hit_count,
+ answer,
+ keywords,
+ } = detail as Required['detail']
+ const [showModal, setShowModal] = useState(false)
+
+ const isDocScene = useMemo(() => {
+ return scene === 'doc'
+ }, [scene])
+
+ // todo: change to real logic
+ const chunkEdited = useMemo(() => {
+ return true
+ }, [])
+
+ const textOpacity = useMemo(() => {
+ return enabled ? '' : 'opacity-50'
+ }, [enabled])
+
+ const renderContent = () => {
+ if (answer) {
+ return (
+ <>
+
+
+
+ )
+ }
+
+ if (contentExternal)
+ return contentExternal
+
+ return content
+ }
+ const isCollapsed = useSegmentListContext(s => s.isCollapsed)
+
+ return (
+ onClick?.()}>
+
+ {isDocScene
+ ? <>
+
+
+
+
{`${formatNumber(word_count)} Characters`}
+
+
{`${formatNumber(hit_count)} Retrieval Count`}
+
+ {chunkEdited && (
+
+ )}
+
+
+ {loading
+ ? (
+
+ )
+ : (
+ <>
+
+ {embeddingAvailable && (
+
+ {!archived && (
+ <>
+
{
+ e.stopPropagation()
+ onClickEdit?.()
+ }}>
+
+
+
{
+ e.stopPropagation()
+ setShowModal(true)
+ }
+ }>
+
+
+
+
+ )}
+
) =>
+ e.stopPropagation()
+ }
+ className="flex items-center"
+ >
+ {
+ await onChangeSwitch?.(val, id)
+ }}
+ />
+
+
+ )}
+
+ )}
+
+
+ : (
+ score !== null
+ ? (
+
+ )
+ : null
+ )}
+
+ {loading
+ ? (
+
+ )
+ : (
+ isDocScene
+ ? <>
+
+ {renderContent()}
+
+
+ {keywords?.map(keyword => )}
+
+
+ : <>
+
+ {renderContent()}
+
+
+
+
+
+
+ {isExternal ? t('datasetHitTesting.viewDetail') : t('datasetHitTesting.viewChart')}
+
+
+
+
+
+ )}
+ {showModal
+ &&
{ await onDelete?.(id) }}
+ onCancel={() => setShowModal(false)}
+ />
+ }
+
+ {
+ items.map((segItem) => {
+ const isLast = items[items.length - 1].id === segItem.id
+ return (
+
+
onSelected(segItem.id)}
+ />
+
+
onClickCard(segItem)}
+ onChangeSwitch={onChangeSwitch}
+ onClickEdit={() => onClickCard(segItem, true)}
+ onDelete={onDelete}
+ loading={false}
+ archived={archived}
+ embeddingAvailable={embeddingAvailable}
+ />
+ {!isLast && }
+
+ )
+ })
+ }
+
{isDetailLoading
?
- :
+ :
{embedding
?
:
= ({ datasetId, documentId }) => {
onNewSegmentModalChange={setNewSegmentModalVisible}
importStatus={importStatus}
archived={documentDetail?.archived}
+ mode={documentDetail?.dataset_process_rule.mode}
+ parentMode={documentDetail?.dataset_process_rule.rules.parent_mode}
/>
}
diff --git a/web/app/components/datasets/documents/list.tsx b/web/app/components/datasets/documents/list.tsx
index ee883e912b..4321a610cb 100644
--- a/web/app/components/datasets/documents/list.tsx
+++ b/web/app/components/datasets/documents/list.tsx
@@ -270,14 +270,14 @@ export const OperationAction: FC<{
popupClassName='text-text-secondary system-xs-medium'
needsDelay
>
-
router.push(`/datasets/${datasetId}/documents/${detail.id}/settings`)}>
-
+
{
+ const { datasetId, documentId, params } = payload
+ const { page, limit, keyword, enabled } = params
+ return useQuery({
+ queryKey: [...useSegmentListKey, datasetId, documentId, page, limit, keyword, enabled],
+ queryFn: () => {
+ return get(`/datasets/${datasetId}/documents/${documentId}/segments`, { params })
+ },
+ enabled: !disable,
+ initialData: disable ? { data: [], has_more: false, total: 0, total_pages: 0, limit: 10 } : undefined,
+ })
+}
+
export const useEnableSegment = () => {
return useMutation({
mutationKey: [NAME_SPACE, 'enable'],
- mutationFn: (payload: { datasetId: string; segmentIds: string[] }) => {
- const { datasetId, segmentIds } = payload
+ mutationFn: (payload: { datasetId: string; documentId: string; segmentIds: string[] }) => {
+ const { datasetId, documentId, segmentIds } = payload
const query = segmentIds.map(id => `segment_id=${id}`).join('&')
- return patch(`/datasets/${datasetId}/segments/enable?${query}`)
+ return patch(`/datasets/${datasetId}/documents/${documentId}/segments/enable?${query}`)
},
})
}
@@ -18,10 +46,10 @@ export const useEnableSegment = () => {
export const useDisableSegment = () => {
return useMutation({
mutationKey: [NAME_SPACE, 'disable'],
- mutationFn: (payload: { datasetId: string; segmentIds: string[] }) => {
- const { datasetId, segmentIds } = payload
+ mutationFn: (payload: { datasetId: string; documentId: string; segmentIds: string[] }) => {
+ const { datasetId, documentId, segmentIds } = payload
const query = segmentIds.map(id => `segment_id=${id}`).join('&')
- return patch(`/datasets/${datasetId}/segments/disable?${query}`)
+ return patch(`/datasets/${datasetId}/documents/${documentId}/segments/disable?${query}`)
},
})
}
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index 956cfb66f5..59c896f23f 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -99,6 +99,10 @@ module.exports = {
'workflow-process-bg': 'var(--color-workflow-process-bg)',
'dataset-chunk-process-success-bg': 'var(--color-dataset-chunk-process-success-bg)',
'dataset-chunk-process-error-bg': 'var(--color-dataset-chunk-process-error-bg)',
+ 'dataset-chunk-detail-card-hover-bg': 'var(--color-dataset-chunk-detail-card-hover-bg)',
+ },
+ lineClamp: {
+ 20: '20',
},
},
},
diff --git a/web/themes/manual-dark.css b/web/themes/manual-dark.css
index 26604370c4..6e2f50849f 100644
--- a/web/themes/manual-dark.css
+++ b/web/themes/manual-dark.css
@@ -4,4 +4,5 @@ html[data-theme="dark"] {
--color-workflow-process-bg: linear-gradient(90deg, rgba(24, 24, 27, 0.25) 0%, rgba(24, 24, 27, 0.04) 100%);
--color-dataset-chunk-process-success-bg: linear-gradient(92deg, rgba(23, 178, 106, 0.30) 0%, rgba(0, 0, 0, 0.00) 100%);
--color-dataset-chunk-process-error-bg: linear-gradient(92deg, rgba(240, 68, 56, 0.30) 0%, rgba(0, 0, 0, 0.00) 100%);
+ --color-dataset-chunk-detail-card-hover-bg: linear-gradient(180deg, #1D1D20 0%, #222225 100%);
}
\ No newline at end of file
diff --git a/web/themes/manual-light.css b/web/themes/manual-light.css
index 2113ef7fc0..c85dd40a87 100644
--- a/web/themes/manual-light.css
+++ b/web/themes/manual-light.css
@@ -4,4 +4,5 @@ html[data-theme="light"] {
--color-workflow-process-bg: linear-gradient(90deg, rgba(200, 206, 218, 0.20) 0%, rgba(200, 206, 218, 0.04) 100%);
--color-dataset-chunk-process-success-bg: linear-gradient(92deg, rgba(23, 178, 106, 0.25) 0%, rgba(255, 255, 255, 0.00) 100%);
--color-dataset-chunk-process-error-bg: linear-gradient(92deg, rgba(240, 68, 56, 0.25) 0%, rgba(255, 255, 255, 0.00) 100%);
+ --color-dataset-chunk-detail-card-hover-bg: linear-gradient(180deg, #F2F4F7 0%, #F9FAFB 100%);
}
\ No newline at end of file