From 1419430015cb0dc8a0f65cc4228ec5dbb568caec Mon Sep 17 00:00:00 2001 From: AkaraChen Date: Tue, 7 Jan 2025 11:25:06 +0800 Subject: [PATCH 1/2] chore: upd --- .../workflow/nodes/_base/components/install-plugin-button.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/web/app/components/workflow/nodes/_base/components/install-plugin-button.tsx b/web/app/components/workflow/nodes/_base/components/install-plugin-button.tsx index f6a3334378..bdbcdfde5a 100644 --- a/web/app/components/workflow/nodes/_base/components/install-plugin-button.tsx +++ b/web/app/components/workflow/nodes/_base/components/install-plugin-button.tsx @@ -7,10 +7,11 @@ import { useCheckInstalled, useInstallPackageFromMarketPlace } from '@/service/u type InstallPluginButtonProps = Omit, 'children' | 'loading'> & { uniqueIdentifier: string + onSuccess?: () => void } export const InstallPluginButton = (props: InstallPluginButtonProps) => { - const { className, uniqueIdentifier, ...rest } = props + const { className, uniqueIdentifier, onSuccess, ...rest } = props const { t } = useTranslation() const manifest = useCheckInstalled({ pluginIds: [uniqueIdentifier], @@ -19,6 +20,7 @@ export const InstallPluginButton = (props: InstallPluginButtonProps) => { const install = useInstallPackageFromMarketPlace({ onSuccess() { manifest.refetch() + onSuccess?.() }, }) const handleInstall: MouseEventHandler = (e) => { From 0e98794d49aa8edeb45c9d12dd4161ce71e0fe9e Mon Sep 17 00:00:00 2001 From: Joel Date: Tue, 7 Jan 2025 11:26:33 +0800 Subject: [PATCH 2/2] feat: use all refresh plugin tools to hooks --- .../hooks/use-refresh-plugin-list.tsx | 43 +++++++++++++++++++ .../install-from-marketplace/index.tsx | 18 +++----- 2 files changed, 48 insertions(+), 13 deletions(-) create mode 100644 web/app/components/plugins/install-plugin/hooks/use-refresh-plugin-list.tsx diff --git a/web/app/components/plugins/install-plugin/hooks/use-refresh-plugin-list.tsx b/web/app/components/plugins/install-plugin/hooks/use-refresh-plugin-list.tsx new file mode 100644 index 0000000000..6bcb8f0321 --- /dev/null +++ b/web/app/components/plugins/install-plugin/hooks/use-refresh-plugin-list.tsx @@ -0,0 +1,43 @@ +import { useUpdateModelProviders } from '@/app/components/header/account-setting/model-provider-page/hooks' +import { useProviderContext } from '@/context/provider-context' +import { useInvalidateInstalledPluginList } from '@/service/use-plugins' +import { useInvalidateAllBuiltInTools, useInvalidateAllToolProviders } from '@/service/use-tools' +import { useInvalidateStrategyProviders } from '@/service/use-strategy' +import type { Plugin, PluginManifestInMarket } from '../../types' +import { PluginType } from '../../types' + +const useRefreshPluginList = () => { + const invalidateInstalledPluginList = useInvalidateInstalledPluginList() + const updateModelProviders = useUpdateModelProviders() + const { refreshModelProviders } = useProviderContext() + + const invalidateAllToolProviders = useInvalidateAllToolProviders() + const invalidateAllBuiltInTools = useInvalidateAllBuiltInTools() + + const invalidateStrategyProviders = useInvalidateStrategyProviders() + return { + refreshPluginList: (manifest: PluginManifestInMarket | Plugin) => { + // installed list + invalidateInstalledPluginList() + + // tool page, tool select + if (PluginType.tool.includes(manifest.category)) { + invalidateAllToolProviders() + invalidateAllBuiltInTools() + // TODO: update suggested tools. It's a function in hook useMarketplacePlugins,handleUpdatePlugins + } + + // model select + if (PluginType.model.includes(manifest.category)) { + updateModelProviders() + refreshModelProviders() + } + + // agent select + if (PluginType.agent.includes(manifest.category)) + invalidateStrategyProviders() + }, + } +} + +export default useRefreshPluginList diff --git a/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx b/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx index 046806ee08..7ac271b83f 100644 --- a/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx +++ b/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx @@ -3,13 +3,11 @@ import React, { useCallback, useState } from 'react' import Modal from '@/app/components/base/modal' import type { Dependency, Plugin, PluginManifestInMarket } from '../../types' -import { InstallStep, PluginType } from '../../types' +import { InstallStep } from '../../types' import Install from './steps/install' import Installed from '../base/installed' import { useTranslation } from 'react-i18next' -import { useUpdateModelProviders } from '@/app/components/header/account-setting/model-provider-page/hooks' -import { useInvalidateInstalledPluginList } from '@/service/use-plugins' -import { useInvalidateAllToolProviders } from '@/service/use-tools' +import useRefreshPluginList from '../hooks/use-refresh-plugin-list' import ReadyToInstallBundle from '../install-bundle/ready-to-install' const i18nPrefix = 'plugin.installModal' @@ -35,9 +33,7 @@ const InstallFromMarketplace: React.FC = ({ // readyToInstall -> check installed -> installed/failed const [step, setStep] = useState(InstallStep.readyToInstall) const [errorMsg, setErrorMsg] = useState(null) - const updateModelProviders = useUpdateModelProviders() - const invalidateAllToolProviders = useInvalidateAllToolProviders() - const invalidateInstalledPluginList = useInvalidateInstalledPluginList() + const { refreshPluginList } = useRefreshPluginList() const getTitle = useCallback(() => { if (isBundle && step === InstallStep.installed) @@ -51,12 +47,8 @@ const InstallFromMarketplace: React.FC = ({ const handleInstalled = useCallback(() => { setStep(InstallStep.installed) - invalidateInstalledPluginList() - if (PluginType.model.includes(manifest.category)) - updateModelProviders() - if (PluginType.tool.includes(manifest.category)) - invalidateAllToolProviders() - }, [invalidateAllToolProviders, invalidateInstalledPluginList, manifest, updateModelProviders]) + refreshPluginList(manifest) + }, [manifest, refreshPluginList]) const handleFailed = useCallback((errorMsg?: string) => { setStep(InstallStep.installFailed)