mirror of
https://github.com/langgenius/dify.git
synced 2026-09-08 02:43:49 +08:00
75 lines
2.9 KiB
TypeScript
75 lines
2.9 KiB
TypeScript
'use client'
|
|
import type { FC } from 'react'
|
|
import { Switch } from '@langgenius/dify-ui/switch'
|
|
import { produce } from 'immer'
|
|
import * as React from 'react'
|
|
import { useCallback } from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { useContext } from 'use-context-selector'
|
|
import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
|
|
import { Document } from '@/app/components/base/icons/src/vender/features'
|
|
import { Infotip } from '@/app/components/base/infotip'
|
|
import { SupportUploadFileTypes } from '@/app/components/workflow/types'
|
|
import ConfigContext from '@/context/debug-configuration'
|
|
|
|
const ConfigDocument: FC = () => {
|
|
const { t } = useTranslation()
|
|
const file = useFeatures((s) => s.features.file)
|
|
const featuresStore = useFeaturesStore()
|
|
const { isShowDocumentConfig, readonly } = useContext(ConfigContext)
|
|
|
|
const isDocumentEnabled =
|
|
file?.allowed_file_types?.includes(SupportUploadFileTypes.document) ?? false
|
|
|
|
const handleChange = useCallback(
|
|
(value: boolean) => {
|
|
const { features, setFeatures } = featuresStore!.getState()
|
|
|
|
const newFeatures = produce(features, (draft) => {
|
|
if (value) {
|
|
draft.file!.allowed_file_types = Array.from(
|
|
new Set([...(draft.file?.allowed_file_types || []), SupportUploadFileTypes.document]),
|
|
)
|
|
} else {
|
|
draft.file!.allowed_file_types = draft.file!.allowed_file_types?.filter(
|
|
(type) => type !== SupportUploadFileTypes.document,
|
|
)
|
|
}
|
|
if (draft.file) draft.file.enabled = (draft.file.allowed_file_types?.length ?? 0) > 0
|
|
})
|
|
setFeatures(newFeatures)
|
|
},
|
|
[featuresStore],
|
|
)
|
|
|
|
if (!isShowDocumentConfig || (readonly && !isDocumentEnabled)) return null
|
|
|
|
return (
|
|
<div className="mt-2 flex items-center gap-2 rounded-xl border-t-[0.5px] border-l-[0.5px] border-effects-highlight bg-background-section-burn p-2">
|
|
<div className="shrink-0 p-1">
|
|
<div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-indigo-indigo-600 p-1 shadow-xs">
|
|
<Document className="size-4 text-text-primary-on-surface" />
|
|
</div>
|
|
</div>
|
|
<div className="flex grow items-center">
|
|
<div className="mr-1 system-sm-semibold text-text-secondary">
|
|
{t(($) => $['feature.documentUpload.title'], { ns: 'appDebug' })}
|
|
</div>
|
|
<Infotip
|
|
aria-label={t(($) => $['feature.documentUpload.description'], { ns: 'appDebug' })}
|
|
popupClassName="w-[180px]"
|
|
>
|
|
{t(($) => $['feature.documentUpload.description'], { ns: 'appDebug' })}
|
|
</Infotip>
|
|
</div>
|
|
{!readonly && (
|
|
<div className="flex shrink-0 items-center">
|
|
<div className="mr-3 ml-1 h-3.5 w-px bg-divider-regular"></div>
|
|
<Switch checked={isDocumentEnabled} onCheckedChange={handleChange} size="md" />
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
export default React.memo(ConfigDocument)
|