diff --git a/web/app/components/tools/setting/build-in/config-credentials.tsx b/web/app/components/tools/setting/build-in/config-credentials.tsx index d5365001c8..5daab8e39c 100644 --- a/web/app/components/tools/setting/build-in/config-credentials.tsx +++ b/web/app/components/tools/setting/build-in/config-credentials.tsx @@ -16,14 +16,16 @@ type Props = { collection: Collection onCancel: () => void onSaved: (value: Record) => void - onRemove: () => void + isHideRemoveBtn?: boolean + onRemove?: () => void } const ConfigCredential: FC = ({ collection, onCancel, onSaved, - onRemove, + isHideRemoveBtn, + onRemove = () => { }, }) => { const { t } = useTranslation() const [credentialSchema, setCredentialSchema] = useState(null) @@ -74,9 +76,9 @@ const ConfigCredential: FC = ({ ) : null} /> -
+
{ - collection.is_team_authorization && ( + (collection.is_team_authorization && !isHideRemoveBtn) && ( ) } diff --git a/web/app/components/workflow/nodes/tool/panel.tsx b/web/app/components/workflow/nodes/tool/panel.tsx index e03f545eb1..0f1326f324 100644 --- a/web/app/components/workflow/nodes/tool/panel.tsx +++ b/web/app/components/workflow/nodes/tool/panel.tsx @@ -9,6 +9,8 @@ import Button from '@/app/components/base/button' import Field from '@/app/components/workflow/nodes/_base/components/field' import type { NodePanelProps } from '@/app/components/workflow/types' import Form from '@/app/components/header/account-setting/model-provider-page/model-modal/Form' +import ConfigCredential from '@/app/components/tools/setting/build-in/config-credentials' +import Loading from '@/app/components/base/loading' const i18nPrefix = 'workflow.nodes.tool' @@ -26,26 +28,39 @@ const Panel: FC> = ({ toolSettingSchema, toolSettingValue, setToolSettingValue, + currCollection, + isShowAuthBtn, + showSetAuth, + showSetAuthModal, + hideSetAuthModal, + handleSaveAuth, + isLoading, } = useConfig(id, data) + if (isLoading) { + return
+ +
+ } + return (
- {!readOnly && ( + {!readOnly && isShowAuthBtn && ( <>
- )} - -
- {toolInputVarSchema.length > 0 && ( - <> + {!isShowAuthBtn && <> +
+ {toolInputVarSchema.length > 0 && ( @@ -56,24 +71,36 @@ const Panel: FC> = ({ onChange={setInputVar} /> - - - )} + )} -
0 && toolSettingSchema.length > 0 && ( + + )} + + +
+ } + + {showSetAuth && ( + -
+ )}
) } diff --git a/web/app/components/workflow/nodes/tool/use-config.ts b/web/app/components/workflow/nodes/tool/use-config.ts index b3109bfbc5..f2fbcabb5a 100644 --- a/web/app/components/workflow/nodes/tool/use-config.ts +++ b/web/app/components/workflow/nodes/tool/use-config.ts @@ -1,16 +1,56 @@ import { useCallback, useEffect, useState } from 'react' +import { useTranslation } from 'react-i18next' +import { useBoolean } from 'ahooks' import type { ToolNodeType, ToolVarInput } from './types' import useNodeCrud from '@/app/components/workflow/nodes/_base/hooks/use-node-crud' -import { fetchBuiltInToolList, fetchCustomToolList } from '@/service/tools' -import type { Tool } from '@/app/components/tools/types' -import { addDefaultValue, toolParametersToFormSchemas } from '@/app/components/tools/utils/to-form-schema' - import { CollectionType } from '@/app/components/tools/types' +import type { Collection, Tool } from '@/app/components/tools/types' +import { fetchBuiltInToolList, fetchCollectionList, fetchCustomToolList } from '@/service/tools' +import { addDefaultValue, toolParametersToFormSchemas } from '@/app/components/tools/utils/to-form-schema' +import Toast from '@/app/components/base/toast' const useConfig = (id: string, payload: ToolNodeType) => { + const { t } = useTranslation() + const { inputs, setInputs } = useNodeCrud(id, payload) const { provider_id, provider_name, provider_type, tool_name, tool_parameters } = inputs const isBuiltIn = provider_type === CollectionType.builtIn + const [currCollection, setCurrCollection] = useState(null) + const fetchCurrCollection = useCallback(async () => { + if (!provider_id) + return + const res = await fetchCollectionList() + const currCollection = res.find(item => item.id === provider_id) + setCurrCollection(currCollection) + }, [provider_id]) + + useEffect(() => { + if (!provider_id || !isBuiltIn) + return + + fetchCurrCollection() + }, [provider_id]) + + // Auth + const needAuth = !!currCollection?.allow_delete + const isAuthed = !!currCollection?.is_team_authorization + const isShowAuthBtn = isBuiltIn && needAuth && !isAuthed + const [showSetAuth, { + setTrue: showSetAuthModal, + setFalse: hideSetAuthModal, + }] = useBoolean(false) + + const handleSaveAuth = useCallback(async (value: any) => { + // await updateBuiltInToolCredential(currCollection?.name, value) + + Toast.notify({ + type: 'success', + message: t('common.api.actionSuccess'), + }) + await fetchCurrCollection() + hideSetAuthModal() + }, [currCollection]) + const [currTool, setCurrTool] = useState(null) const formSchemas = currTool ? toolParametersToFormSchemas(currTool.parameters) : [] // use setting @@ -34,6 +74,8 @@ const useConfig = (id: string, payload: ToolNodeType) => { }) }, [inputs, setInputs]) + const isLoading = currTool && (isBuiltIn ? !currCollection : false) + useEffect(() => { (async () => { const list = isBuiltIn ? await fetchBuiltInToolList(provider_name || provider_id) : await fetchCustomToolList(provider_name) @@ -42,6 +84,7 @@ const useConfig = (id: string, payload: ToolNodeType) => { setCurrTool(currTool) })() }, [provider_name]) + return { inputs, currTool, @@ -50,6 +93,13 @@ const useConfig = (id: string, payload: ToolNodeType) => { setToolSettingValue, toolInputVarSchema, setInputVar, + currCollection, + isShowAuthBtn, + showSetAuth, + showSetAuthModal, + hideSetAuthModal, + handleSaveAuth, + isLoading, } }