diff --git a/web/app/components/plugins/reference-setting-modal/auto-update-setting/plugins-picker.tsx b/web/app/components/plugins/reference-setting-modal/auto-update-setting/plugins-picker.tsx index 7523259318..d7c8c31043 100644 --- a/web/app/components/plugins/reference-setting-modal/auto-update-setting/plugins-picker.tsx +++ b/web/app/components/plugins/reference-setting-modal/auto-update-setting/plugins-picker.tsx @@ -7,6 +7,8 @@ import PluginsSelected from './plugins-selected' import Button from '@/app/components/base/button' import { RiAddLine } from '@remixicon/react' import { useTranslation } from 'react-i18next' +import { useBoolean } from 'ahooks' +import ToolPicker from './tool-picker' const i18nPrefix = 'plugin.autoUpdate' @@ -27,6 +29,10 @@ const PluginsPicker: FC = ({ const handleClear = () => { onChange([]) } + + const [isShowToolPicker, { + set: setToolPicker, + }] = useBoolean(false) return (
{hasSelected ? ( @@ -45,10 +51,18 @@ const PluginsPicker: FC = ({ /> )} - + + + {t(`${i18nPrefix}.operation.select`)} + + } + value={value} + onChange={onChange} + isShow={isShowToolPicker} + onShowChange={setToolPicker} + />
) } diff --git a/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-picker.tsx b/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-picker.tsx new file mode 100644 index 0000000000..5bcadcc3d4 --- /dev/null +++ b/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-picker.tsx @@ -0,0 +1,47 @@ +'use client' +import type { FC } from 'react' +import React, { useCallback } from 'react' +import { + PortalToFollowElem, + PortalToFollowElemContent, + PortalToFollowElemTrigger, +} from '@/app/components/base/portal-to-follow-elem' + +type Props = { + trigger: React.ReactNode + value: string[] + onChange: (value: string[]) => void + isShow: boolean + onShowChange: (isShow: boolean) => void + +} + +const ToolPicker: FC = ({ + trigger, + value, + onChange, + isShow, + onShowChange, +}) => { + const toggleShowPopup = useCallback(() => { + onShowChange(!isShow) + }, [onShowChange, isShow]) + return ( + + + {trigger} + + +
aafdf
+
+
+ ) +} +export default React.memo(ToolPicker)