From 5dad4793e674d83042ef8f7ff8dcd2a052cf7730 Mon Sep 17 00:00:00 2001 From: twwu Date: Fri, 20 Dec 2024 09:56:06 +0800 Subject: [PATCH 1/7] fix: Fix context selector usage in plugin page components --- web/app/components/plugins/plugin-page/index.tsx | 3 ++- web/app/components/plugins/plugin-page/plugins-panel.tsx | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/web/app/components/plugins/plugin-page/index.tsx b/web/app/components/plugins/plugin-page/index.tsx index f5b354effc..05b5acf8e7 100644 --- a/web/app/components/plugins/plugin-page/index.tsx +++ b/web/app/components/plugins/plugin-page/index.tsx @@ -123,7 +123,8 @@ const PluginPage = ({ const [currentFile, setCurrentFile] = useState(null) const containerRef = usePluginPageContext(v => v.containerRef) const options = usePluginPageContext(v => v.options) - const [activeTab, setActiveTab] = usePluginPageContext(v => [v.activeTab, v.setActiveTab]) + const activeTab = usePluginPageContext(v => v.activeTab) + const setActiveTab = usePluginPageContext(v => v.setActiveTab) const { enable_marketplace } = useAppContextSelector(s => s.systemFeatures) const uploaderProps = useUploader({ diff --git a/web/app/components/plugins/plugin-page/plugins-panel.tsx b/web/app/components/plugins/plugin-page/plugins-panel.tsx index 76e3ea7eca..f1a5fba1b9 100644 --- a/web/app/components/plugins/plugin-page/plugins-panel.tsx +++ b/web/app/components/plugins/plugin-page/plugins-panel.tsx @@ -11,7 +11,8 @@ import Empty from './empty' import Loading from '../../base/loading' const PluginsPanel = () => { - const [filters, setFilters] = usePluginPageContext(v => [v.filters, v.setFilters]) as [FilterState, (filter: FilterState) => void] + const filters = usePluginPageContext(v => v.filters) as FilterState + const setFilters = usePluginPageContext(v => v.setFilters) const { data: pluginList, isLoading: isPluginListLoading } = useInstalledPluginList() const invalidateInstalledPluginList = useInvalidateInstalledPluginList() const currentPluginID = usePluginPageContext(v => v.currentPluginID) From 1fa5b1755f46f305c9b4ea132e6bf0980bc779ad Mon Sep 17 00:00:00 2001 From: JzoNg Date: Wed, 18 Dec 2024 15:18:56 +0800 Subject: [PATCH 2/7] dark mode for model provider --- web/app/components/base/dropdown/index.tsx | 12 +- .../assets/vender/other/anthropic-text.svg | 78 +++ .../base/icons/assets/vender/other/openai.svg | 9 + .../icons/src/vender/other/AnthropicText.json | 539 ++++++++++++++++++ .../icons/src/vender/other/AnthropicText.tsx | 16 + .../base/icons/src/vender/other/Openai.json | 80 +++ .../base/icons/src/vender/other/Openai.tsx | 16 + .../base/icons/src/vender/other/index.ts | 2 + .../model-provider-page/model-modal/index.tsx | 4 +- .../model-provider-page/model-name/index.tsx | 2 +- .../model-parameter-modal/stop-sequence.tsx | 0 .../model-parameter-modal/trigger.tsx | 14 +- .../deprecated-model-trigger.tsx | 8 +- .../model-selector/empty-trigger.tsx | 18 +- .../model-selector/feature-icon.tsx | 2 +- .../model-selector/model-trigger.tsx | 17 +- .../model-selector/popup-item.tsx | 10 +- .../model-selector/popup.tsx | 14 +- .../model-selector/rerank-trigger.tsx | 27 - .../provider-icon/index.tsx | 29 +- .../system-model-selector/index.tsx | 22 +- web/context/app-context.tsx | 2 +- 22 files changed, 821 insertions(+), 100 deletions(-) create mode 100644 web/app/components/base/icons/assets/vender/other/anthropic-text.svg create mode 100644 web/app/components/base/icons/assets/vender/other/openai.svg create mode 100644 web/app/components/base/icons/src/vender/other/AnthropicText.json create mode 100644 web/app/components/base/icons/src/vender/other/AnthropicText.tsx create mode 100644 web/app/components/base/icons/src/vender/other/Openai.json create mode 100644 web/app/components/base/icons/src/vender/other/Openai.tsx delete mode 100644 web/app/components/header/account-setting/model-provider-page/model-parameter-modal/stop-sequence.tsx delete mode 100644 web/app/components/header/account-setting/model-provider-page/model-selector/rerank-trigger.tsx diff --git a/web/app/components/base/dropdown/index.tsx b/web/app/components/base/dropdown/index.tsx index 9af2421669..eb2519bbde 100644 --- a/web/app/components/base/dropdown/index.tsx +++ b/web/app/components/base/dropdown/index.tsx @@ -48,16 +48,16 @@ const Dropdown: FC = ({
- +
) } -
+
{ !!items.length && (
@@ -65,7 +65,7 @@ const Dropdown: FC = ({ items.map(item => (
handleSelect(item)} > {item.text} @@ -77,7 +77,7 @@ const Dropdown: FC = ({ } { (!!items.length && !!secondItems?.length) && ( -
+
) } { @@ -87,7 +87,7 @@ const Dropdown: FC = ({ secondItems.map(item => (
handleSelect(item)} > {item.text} diff --git a/web/app/components/base/icons/assets/vender/other/anthropic-text.svg b/web/app/components/base/icons/assets/vender/other/anthropic-text.svg new file mode 100644 index 0000000000..cace17da73 --- /dev/null +++ b/web/app/components/base/icons/assets/vender/other/anthropic-text.svg @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/web/app/components/base/icons/assets/vender/other/openai.svg b/web/app/components/base/icons/assets/vender/other/openai.svg new file mode 100644 index 0000000000..5a9a93bc2e --- /dev/null +++ b/web/app/components/base/icons/assets/vender/other/openai.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/web/app/components/base/icons/src/vender/other/AnthropicText.json b/web/app/components/base/icons/src/vender/other/AnthropicText.json new file mode 100644 index 0000000000..a65ef47747 --- /dev/null +++ b/web/app/components/base/icons/src/vender/other/AnthropicText.json @@ -0,0 +1,539 @@ +{ + "icon": { + "type": "element", + "isRootNode": true, + "name": "svg", + "attributes": { + "width": "90", + "height": "20", + "viewBox": "0 0 90 20", + "fill": "none", + "xmlns": "http://www.w3.org/2000/svg" + }, + "children": [ + { + "type": "element", + "name": "g", + "attributes": { + "clip-path": "url(#clip0_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask0_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M89.375 4.99805H0V14.998H89.375V4.99805Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask0_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask1_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99609H89.375V14.9961H0V4.99609Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask1_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask2_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99414H89.375V14.9941H0V4.99414Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask2_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask3_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask3_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M18.1273 11.9244L13.7773 5.15625H11.4297V14.825H13.4321V8.05688L17.7821 14.825H20.1297V5.15625H18.1273V11.9244Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask4_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask4_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M21.7969 7.02094H25.0423V14.825H27.1139V7.02094H30.3594V5.15625H21.7969V7.02094Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask5_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask5_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M38.6442 9.00994H34.0871V5.15625H32.0156V14.825H34.0871V10.8746H38.6442V14.825H40.7156V5.15625H38.6442V9.00994Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask6_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask6_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M45.3376 7.02094H47.893C48.9152 7.02094 49.4539 7.39387 49.4539 8.09831C49.4539 8.80275 48.9152 9.17569 47.893 9.17569H45.3376V7.02094ZM51.5259 8.09831C51.5259 6.27506 50.186 5.15625 47.9897 5.15625H43.2656V14.825H45.3376V11.0404H47.6443L49.7164 14.825H52.0094L49.715 10.7521C50.8666 10.3094 51.5259 9.37721 51.5259 8.09831Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask7_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask7_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M57.8732 13.0565C56.2438 13.0565 55.2496 11.8963 55.2496 10.004C55.2496 8.08416 56.2438 6.92394 57.8732 6.92394C59.4887 6.92394 60.4691 8.08416 60.4691 10.004C60.4691 11.8963 59.4887 13.0565 57.8732 13.0565ZM57.8732 4.99023C55.0839 4.99023 53.1094 7.06206 53.1094 10.004C53.1094 12.9184 55.0839 14.9902 57.8732 14.9902C60.6486 14.9902 62.6094 12.9184 62.6094 10.004C62.6094 7.06206 60.6486 4.99023 57.8732 4.99023Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask8_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask8_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M69.1794 9.45194H66.6233V7.02094H69.1794C70.2019 7.02094 70.7407 7.43532 70.7407 8.23644C70.7407 9.03756 70.2019 9.45194 69.1794 9.45194ZM69.2762 5.15625H64.5508V14.825H66.6233V11.3166H69.2762C71.473 11.3166 72.8133 10.1564 72.8133 8.23644C72.8133 6.3165 71.473 5.15625 69.2762 5.15625Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask9_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask9_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M86.8413 11.5786C86.4823 12.5179 85.7642 13.0565 84.7837 13.0565C83.1542 13.0565 82.16 11.8963 82.16 10.004C82.16 8.08416 83.1542 6.92394 84.7837 6.92394C85.7642 6.92394 86.4823 7.46261 86.8413 8.40183H89.0369C88.4984 6.33002 86.8827 4.99023 84.7837 4.99023C81.9942 4.99023 80.0195 7.06206 80.0195 10.004C80.0195 12.9184 81.9942 14.9902 84.7837 14.9902C86.8965 14.9902 88.5122 13.6366 89.0508 11.5786H86.8413Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask10_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask10_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M73.6484 5.15625L77.5033 14.825H79.6172L75.7624 5.15625H73.6484Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "mask", + "attributes": { + "id": "mask11_8587_60274", + "style": "mask-type:luminance", + "maskUnits": "userSpaceOnUse", + "x": "0", + "y": "4", + "width": "90", + "height": "11" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M0 4.99219H89.375V14.9922H0V4.99219Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + { + "type": "element", + "name": "g", + "attributes": { + "mask": "url(#mask11_8587_60274)" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M3.64038 10.9989L4.95938 7.60106L6.27838 10.9989H3.64038ZM3.85422 5.15625L0 14.825H2.15505L2.9433 12.7946H6.97558L7.76371 14.825H9.91875L6.06453 5.15625H3.85422Z", + "fill": "currentColor", + "fill-opacity": "0.92" + }, + "children": [] + } + ] + } + ] + } + ] + } + ] + } + ] + }, + { + "type": "element", + "name": "defs", + "attributes": {}, + "children": [ + { + "type": "element", + "name": "clipPath", + "attributes": { + "id": "clip0_8587_60274" + }, + "children": [ + { + "type": "element", + "name": "rect", + "attributes": { + "width": "89.375", + "height": "10", + "fill": "white", + "transform": "translate(0 5)" + }, + "children": [] + } + ] + } + ] + } + ] + }, + "name": "AnthropicText" +} \ No newline at end of file diff --git a/web/app/components/base/icons/src/vender/other/AnthropicText.tsx b/web/app/components/base/icons/src/vender/other/AnthropicText.tsx new file mode 100644 index 0000000000..868cfe5f27 --- /dev/null +++ b/web/app/components/base/icons/src/vender/other/AnthropicText.tsx @@ -0,0 +1,16 @@ +// GENERATE BY script +// DON NOT EDIT IT MANUALLY + +import * as React from 'react' +import data from './AnthropicText.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 = 'AnthropicText' + +export default Icon diff --git a/web/app/components/base/icons/src/vender/other/Openai.json b/web/app/components/base/icons/src/vender/other/Openai.json new file mode 100644 index 0000000000..236f66fcf2 --- /dev/null +++ b/web/app/components/base/icons/src/vender/other/Openai.json @@ -0,0 +1,80 @@ +{ + "icon": { + "type": "element", + "isRootNode": true, + "name": "svg", + "attributes": { + "width": "80", + "height": "22", + "viewBox": "0 0 80 22", + "fill": "none", + "xmlns": "http://www.w3.org/2000/svg" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M25.1152 10.5767C25.1152 14.1738 27.4253 16.6818 30.6264 16.6818C33.8274 16.6818 36.1375 14.1738 36.1375 10.5767C36.1375 6.97961 33.8274 4.47156 30.6264 4.47156C27.4253 4.47156 25.1152 6.97961 25.1152 10.5767ZM34.0254 10.5767C34.0254 13.1507 32.6229 14.8173 30.6264 14.8173C28.6298 14.8173 27.2273 13.1507 27.2273 10.5767C27.2273 8.00263 28.6298 6.3361 30.6264 6.3361C32.6229 6.3361 34.0254 8.00263 34.0254 10.5767Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M42.0868 16.6819C44.5124 16.6819 45.8984 14.6358 45.8984 12.1773C45.8984 9.71871 44.5124 7.67267 42.0868 7.67267C40.9648 7.67267 40.1398 8.11818 39.5953 8.76169V7.83767H37.6152V19.4704H39.5953V15.5928C40.1398 16.2364 40.9648 16.6819 42.0868 16.6819ZM39.5458 11.9298C39.5458 10.2962 40.4698 9.40521 41.6908 9.40521C43.1264 9.40521 43.9019 10.5272 43.9019 12.1773C43.9019 13.8273 43.1264 14.9493 41.6908 14.9493C40.4698 14.9493 39.5458 14.0418 39.5458 12.4413V11.9298Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M51.2545 16.6819C52.987 16.6819 54.3565 15.7743 54.967 14.2563L53.2675 13.6128C53.0035 14.5038 52.228 14.9988 51.2545 14.9988C49.9839 14.9988 49.0929 14.0913 48.9444 12.6063H55.0165V11.9463C55.0165 9.57021 53.68 7.67267 51.172 7.67267C48.6639 7.67267 47.0469 9.63621 47.0469 12.1773C47.0469 14.8503 48.7794 16.6819 51.2545 16.6819ZM51.1555 9.3392C52.4095 9.3392 53.0035 10.1642 53.02 11.1212H49.0434C49.3404 9.94972 50.1324 9.3392 51.1555 9.3392Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M56.5039 16.5004H58.484V11.4182C58.484 10.1807 59.3915 9.52071 60.2825 9.52071C61.3715 9.52071 61.8005 10.2962 61.8005 11.3687V16.5004H63.7806V10.7912C63.7806 8.9267 62.6915 7.67267 60.8765 7.67267C59.7545 7.67267 58.979 8.18418 58.484 8.76169V7.83767H56.5039V16.5004Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M69.5799 4.65308L65.0918 16.5003H67.1873L68.1939 13.7943H73.309L74.332 16.5003H76.4605L71.9724 4.65308H69.5799ZM70.7349 6.99613L72.616 11.9462H68.8869L70.7349 6.99613Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M79.8581 4.6875H77.7461V16.5348H79.8581V4.6875Z", + "fill": "currentColor" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M20.2769 9.00436C20.776 7.50627 20.6041 5.86517 19.8059 4.50251C18.6055 2.41247 16.1924 1.3372 13.8356 1.84321C12.7871 0.662057 11.2808 -0.00964523 9.70154 -2.00271e-05C7.29248 -0.00552014 5.155 1.54551 4.41386 3.83769C2.86626 4.15463 1.53042 5.12334 0.748717 6.49631C-0.460621 8.58085 -0.184928 11.2085 1.43073 12.9961C0.931596 14.4942 1.10348 16.1353 1.90168 17.4979C3.10208 19.588 5.51526 20.6632 7.87206 20.1572C8.91983 21.3384 10.4269 22.0101 12.0061 21.9998C14.4165 22.006 16.5547 20.4535 17.2958 18.1593C18.8434 17.8424 20.1793 16.8737 20.961 15.5007C22.1689 13.4161 21.8925 10.7905 20.2776 9.00298L20.2769 9.00436ZM12.0075 20.5622C11.0429 20.5635 10.1085 20.226 9.36809 19.6079C9.40178 19.59 9.46022 19.5577 9.49803 19.5343L13.8789 17.0043C14.103 16.8771 14.2405 16.6385 14.2391 16.3807V10.2048L16.0906 11.2738C16.1105 11.2835 16.1236 11.3027 16.1264 11.3247V16.4391C16.1236 18.7134 14.2818 20.5574 12.0075 20.5622ZM3.14952 16.7788C2.6662 15.9441 2.49225 14.9658 2.65795 14.0163C2.69026 14.0356 2.74732 14.0707 2.78789 14.094L7.16873 16.6241C7.3908 16.754 7.6658 16.754 7.88856 16.6241L13.2367 13.5358V15.6739C13.2381 15.6959 13.2278 15.7173 13.2106 15.731L8.78233 18.2879C6.80985 19.4236 4.29079 18.7485 3.15021 16.7788H3.14952ZM1.99656 7.21613C2.47782 6.38012 3.23752 5.74073 4.14229 5.40866C4.14229 5.44647 4.14023 5.51316 4.14023 5.55991V10.6207C4.13885 10.8778 4.27636 11.1164 4.4998 11.2436L9.84798 14.3312L7.9965 15.4003C7.97794 15.4127 7.95456 15.4147 7.93393 15.4058L3.50496 12.8469C1.53661 11.707 0.86147 9.18861 1.99587 7.21682L1.99656 7.21613ZM17.2085 10.7561L11.8603 7.66783L13.7118 6.59943C13.7304 6.58706 13.7537 6.585 13.7744 6.59393L18.2033 9.1508C20.1751 10.29 20.851 12.8125 19.7118 14.7843C19.2298 15.6189 18.4708 16.2583 17.5667 16.5911V11.379C17.5688 11.1219 17.432 10.884 17.2092 10.7561H17.2085ZM19.0511 7.98271C19.0187 7.96278 18.9617 7.9284 18.9211 7.90502L14.5403 5.37497C14.3182 5.24503 14.0432 5.24503 13.8204 5.37497L8.47226 8.46329V6.32512C8.47088 6.30311 8.4812 6.2818 8.49838 6.26805L12.9267 3.71325C14.8991 2.57541 17.4209 3.25261 18.5581 5.22578C19.0387 6.05905 19.2126 7.03463 19.0497 7.98271H19.0511ZM7.46574 11.7936L5.61357 10.7245C5.59363 10.7149 5.58057 10.6956 5.57782 10.6736V5.55922C5.5792 3.28218 7.42655 1.43689 9.7036 1.43826C10.6668 1.43826 11.5991 1.77652 12.3395 2.39253C12.3058 2.41041 12.2481 2.44272 12.2096 2.46609L7.82874 4.99615C7.60461 5.12334 7.46711 5.36122 7.46849 5.61904L7.46574 11.7922V11.7936ZM8.47157 9.62519L10.8538 8.24947L13.236 9.6245V12.3752L10.8538 13.7503L8.47157 12.3752V9.62519Z", + "fill": "currentColor" + }, + "children": [] + } + ] + }, + "name": "Openai" +} \ No newline at end of file diff --git a/web/app/components/base/icons/src/vender/other/Openai.tsx b/web/app/components/base/icons/src/vender/other/Openai.tsx new file mode 100644 index 0000000000..cf8d21a449 --- /dev/null +++ b/web/app/components/base/icons/src/vender/other/Openai.tsx @@ -0,0 +1,16 @@ +// GENERATE BY script +// DON NOT EDIT IT MANUALLY + +import * as React from 'react' +import data from './Openai.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 = 'Openai' + +export default Icon diff --git a/web/app/components/base/icons/src/vender/other/index.ts b/web/app/components/base/icons/src/vender/other/index.ts index cb2ca507b4..8ddf5e7a86 100644 --- a/web/app/components/base/icons/src/vender/other/index.ts +++ b/web/app/components/base/icons/src/vender/other/index.ts @@ -1,3 +1,5 @@ +export { default as AnthropicText } from './AnthropicText' export { default as Generator } from './Generator' export { default as Group } from './Group' +export { default as Openai } from './Openai' export { default as ReplayLine } from './ReplayLine' diff --git a/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx index 14b737e0de..c9f8e44c59 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx @@ -35,7 +35,6 @@ import { useLanguage, useProviderCredentialsAndLoadBalancing, } from '../hooks' -import ProviderIcon from '../provider-icon' import { useValidate } from '../../key-validator/hooks' import { ValidatedStatus } from '../../key-validator/declarations' import ModelLoadBalancingConfigs from '../provider-added-card/model-load-balancing-configs' @@ -282,9 +281,8 @@ const ModelModal: FC = ({
-
+
{renderTitlePrefix()}
-
= ({ )) } diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/stop-sequence.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/stop-sequence.tsx deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger.tsx index ba632179d1..2fbc517ec1 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger.tsx @@ -46,8 +46,8 @@ const Trigger: FC = ({ className={cn( 'relative flex items-center px-2 h-8 rounded-lg cursor-pointer', !isInWorkflow && 'border hover:border-[1.5px]', - !isInWorkflow && (disabled ? 'border-[#F79009] bg-[#FFFAEB]' : 'border-[#444CE7] bg-primary-50'), - isInWorkflow && 'pr-[30px] bg-gray-100 border border-gray-100 hover:border-gray-200', + !isInWorkflow && (disabled ? 'border-[#F79009] bg-components-input-bg-disabled' : 'border-[#444CE7] bg-components-input-bg-normal'), + isInWorkflow && 'pr-[30px] bg-components-input-bg-normal border border-components-input-border-hover hover:border-components-input-border-hover', )} > { @@ -71,18 +71,16 @@ const Trigger: FC = ({ { currentModel && ( ) } { !currentModel && ( -
+
{modelId}
) @@ -103,10 +101,10 @@ const Trigger: FC = ({ ) : ( - + ) } - {isInWorkflow && ()} + {isInWorkflow && ()}
) } diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/deprecated-model-trigger.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/deprecated-model-trigger.tsx index f40423d869..e47afa1c4d 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/deprecated-model-trigger.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/deprecated-model-trigger.tsx @@ -4,6 +4,7 @@ import ModelIcon from '../model-icon' import { AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback' import { useProviderContext } from '@/context/provider-context' import Tooltip from '@/app/components/base/tooltip' +import cn from '@/utils/classnames' type ModelTriggerProps = { modelName: string @@ -21,17 +22,14 @@ const ModelTrigger: FC = ({ return (
-
+
{modelName}
diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/empty-trigger.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/empty-trigger.tsx index 0c6d3efa39..ccbf2d8c22 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/empty-trigger.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/empty-trigger.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react' import { RiArrowDownSLine } from '@remixicon/react' import { CubeOutline } from '@/app/components/base/icons/src/vender/line/shapes' +import cn from '@/utils/classnames' type ModelTriggerProps = { open: boolean @@ -12,25 +13,24 @@ const ModelTrigger: FC = ({ }) => { return (
-
- +
+
Select model
- +
) diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/feature-icon.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/feature-icon.tsx index 32bd58d318..e9f59cd38e 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/feature-icon.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/feature-icon.tsx @@ -65,7 +65,7 @@ const FeatureIcon: FC = ({ popupContent={t('common.modelProvider.featureSupported', { feature: ModelFeatureTextEnum.vision })} >
- +
diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/model-trigger.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/model-trigger.tsx index 023c6a5cd2..88c8627187 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/model-trigger.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/model-trigger.tsx @@ -13,6 +13,7 @@ import ModelIcon from '../model-icon' import ModelName from '../model-name' import { AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback' import Tooltip from '@/app/components/base/tooltip' +import cn from '@/utils/classnames' type ModelTriggerProps = { open: boolean @@ -32,13 +33,13 @@ const ModelTrigger: FC = ({ return (
= ({ ) : ( ) } diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/popup-item.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/popup-item.tsx index d62131ac4c..425fc2e34a 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/popup-item.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/popup-item.tsx @@ -64,7 +64,7 @@ const PopupItem: FC = ({ return (
-
+
{model.label[language] || model.label.en_US}
{ @@ -78,7 +78,7 @@ const PopupItem: FC = ({ key={modelItem.model} className={` group relative flex items-center px-3 py-1.5 h-8 rounded-lg - ${modelItem.status === ModelStatusEnum.active ? 'cursor-pointer hover:bg-gray-50' : 'cursor-not-allowed hover:bg-gray-50/60'} + ${modelItem.status === ModelStatusEnum.active ? 'cursor-pointer hover:bg-state-base-hover' : 'cursor-not-allowed hover:bg-state-base-hover-alt'} `} onClick={() => handleSelect(model.provider, modelItem)} > @@ -92,7 +92,7 @@ const PopupItem: FC = ({ /> = ({ /> { defaultModel?.model === modelItem.model && defaultModel.provider === currentProvider.provider && ( - + ) } { modelItem.status === ModelStatusEnum.noConfigure && (
{t('common.operation.add').toLocaleUpperCase()} diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/popup.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/popup.tsx index 1e43439d15..cb9492c4d2 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/popup.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-selector/popup.tsx @@ -39,20 +39,20 @@ const Popup: FC = ({ }).filter(model => model.models.length > 0) return ( -
-
+
+
setSearchText(e.target.value)} @@ -60,7 +60,7 @@ const Popup: FC = ({ { searchText && ( setSearchText('')} /> ) @@ -80,7 +80,7 @@ const Popup: FC = ({ } { !filteredModelList.length && ( -
+
{`No model found for “${searchText}”`}
) diff --git a/web/app/components/header/account-setting/model-provider-page/model-selector/rerank-trigger.tsx b/web/app/components/header/account-setting/model-provider-page/model-selector/rerank-trigger.tsx deleted file mode 100644 index 29afca1196..0000000000 --- a/web/app/components/header/account-setting/model-provider-page/model-selector/rerank-trigger.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import { - RiExternalLinkLine, -} from '@remixicon/react' -import { CubeOutline } from '@/app/components/base/icons/src/vender/line/shapes' - -const ModelTrigger = () => { - return ( -
-
-
- -
-
- Please setup the Rerank model -
-
-
- -
-
- ) -} - -export default ModelTrigger diff --git a/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx b/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx index 768f2c2766..25105b1193 100644 --- a/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx +++ b/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx @@ -1,6 +1,8 @@ import type { FC } from 'react' import type { ModelProvider } from '../declarations' import { useLanguage } from '../hooks' +import { AnthropicText, Openai } from '@/app/components/base/icons/src/vender/other' +import cn from '@/utils/classnames' type ProviderIconProps = { provider: ModelProvider @@ -12,19 +14,30 @@ const ProviderIcon: FC = ({ }) => { const language = useLanguage() - if (provider.icon_large) { + if (provider.provider === 'langgenius/anthropic/anthropic') { return ( - provider-icon +
+ +
+ ) + } + + if (provider.provider === 'langgenius/openai/openai') { + return ( +
+ +
) } return ( -
-
+
+ provider-icon +
{provider.label[language] || provider.label.en_US}
diff --git a/web/app/components/header/account-setting/model-provider-page/system-model-selector/index.tsx b/web/app/components/header/account-setting/model-provider-page/system-model-selector/index.tsx index 2e1e6400d1..46d1fafcc7 100644 --- a/web/app/components/header/account-setting/model-provider-page/system-model-selector/index.tsx +++ b/web/app/components/header/account-setting/model-provider-page/system-model-selector/index.tsx @@ -140,13 +140,13 @@ const SystemModel: FC = ({ -
+
-
+
{t('common.modelProvider.systemReasoningModel.key')} +
{t('common.modelProvider.systemReasoningModel.tip')}
} @@ -162,11 +162,11 @@ const SystemModel: FC = ({
-
+
{t('common.modelProvider.embeddingModel.key')} +
{t('common.modelProvider.embeddingModel.tip')}
} @@ -182,11 +182,11 @@ const SystemModel: FC = ({
-
+
{t('common.modelProvider.rerankModel.key')} +
{t('common.modelProvider.rerankModel.tip')}
} @@ -202,11 +202,11 @@ const SystemModel: FC = ({
-
+
{t('common.modelProvider.speechToTextModel.key')} +
{t('common.modelProvider.speechToTextModel.tip')}
} @@ -222,11 +222,11 @@ const SystemModel: FC = ({
-
+
{t('common.modelProvider.ttsModel.key')} +
{t('common.modelProvider.ttsModel.tip')}
} diff --git a/web/context/app-context.tsx b/web/context/app-context.tsx index 369fe5af19..94bcc81e89 100644 --- a/web/context/app-context.tsx +++ b/web/context/app-context.tsx @@ -125,7 +125,7 @@ export const AppContextProvider: FC = ({ children }) => setCurrentWorkspace(currentWorkspaceResponse) }, [currentWorkspaceResponse]) - const [theme, setTheme] = useState(Theme.light) + const [theme, setTheme] = useState(Theme.dark) const handleSetTheme = useCallback((theme: Theme) => { setTheme(theme) globalThis.document.documentElement.setAttribute('data-theme', theme) From 6d2b2d7810cda30816731f01b679ef75c8e42388 Mon Sep 17 00:00:00 2001 From: JzoNg Date: Fri, 20 Dec 2024 11:27:52 +0800 Subject: [PATCH 3/7] fix number of tool actions --- .../components/plugins/plugin-detail-panel/action-list.tsx | 2 +- web/app/components/tools/provider/detail.tsx | 4 ++-- web/context/app-context.tsx | 2 +- web/i18n/en-US/plugin.ts | 2 +- web/i18n/en-US/tools.ts | 2 +- web/i18n/zh-Hans/plugin.ts | 2 +- web/i18n/zh-Hans/tools.ts | 2 +- 7 files changed, 8 insertions(+), 8 deletions(-) diff --git a/web/app/components/plugins/plugin-detail-panel/action-list.tsx b/web/app/components/plugins/plugin-detail-panel/action-list.tsx index 53c97b3a76..46818d40f5 100644 --- a/web/app/components/plugins/plugin-detail-panel/action-list.tsx +++ b/web/app/components/plugins/plugin-detail-panel/action-list.tsx @@ -59,7 +59,7 @@ const ActionList = ({
- {t('plugin.detailPanel.actionNum', { num: data.length })} + {t('plugin.detailPanel.actionNum', { num: data.length, action: data.length > 1 ? 'actions' : 'action' })} {provider.is_team_authorization && provider.allow_delete && (
handleFormChange(variable, { ...item, type: FormTypeEnum.appSelector } as any)} /> diff --git a/web/app/components/plugins/plugin-detail-panel/app-selector/app-picker.tsx b/web/app/components/plugins/plugin-detail-panel/app-selector/app-picker.tsx index a5be6ffbdd..841663a5b4 100644 --- a/web/app/components/plugins/plugin-detail-panel/app-selector/app-picker.tsx +++ b/web/app/components/plugins/plugin-detail-panel/app-selector/app-picker.tsx @@ -17,6 +17,7 @@ import type { App } from '@/types/app' type Props = { appList: App[] + scope: string disabled: boolean trigger: React.ReactNode placement?: Placement @@ -27,6 +28,7 @@ type Props = { } const AppPicker: FC = ({ + scope, appList, disabled, trigger, @@ -38,8 +40,16 @@ const AppPicker: FC = ({ }) => { const [searchText, setSearchText] = useState('') const filteredAppList = useMemo(() => { - return (appList || []).filter(app => app.name.toLowerCase().includes(searchText.toLowerCase())).filter(app => (app.mode !== 'advanced-chat' && app.mode !== 'workflow') || !!app.workflow) - }, [appList, searchText]) + return (appList || []) + .filter(app => app.name.toLowerCase().includes(searchText.toLowerCase())) + .filter(app => (app.mode !== 'advanced-chat' && app.mode !== 'workflow') || !!app.workflow) + .filter(app => scope === 'all' + || (scope === 'completion' && app.mode === 'completion') + || (scope === 'workflow' && app.mode === 'workflow') + || (scope === 'chat' && app.mode === 'advanced-chat') + || (scope === 'chat' && app.mode === 'agent-chat') + || (scope === 'chat' && app.mode === 'chat')) + }, [appList, scope, searchText]) const getAppType = (app: App) => { switch (app.mode) { case 'advanced-chat': @@ -74,7 +84,7 @@ const AppPicker: FC = ({ -
+
files?: any[] } + scope?: string disabled?: boolean placement?: Placement offset?: OffsetOptions @@ -35,6 +36,7 @@ type Props = { } const AppSelector: FC = ({ value, + scope, disabled, placement = 'bottom', offset = 4, @@ -53,6 +55,7 @@ const AppSelector: FC = ({ return undefined return appList.data.find(app => app.id === value.app_id) }, [appList?.data, value]) + const [isShowChooseApp, setIsShowChooseApp] = useState(false) const handleSelectApp = (app: App) => { const clearValue = app.id !== value?.app_id @@ -103,7 +106,7 @@ const AppSelector: FC = ({ /> -
+
{t('app.appSelector.label')}
= ({ disabled={false} appList={appList?.data || []} onSelect={handleSelectApp} + scope={scope || 'all'} />
{/* app inputs config panel */} From 12c47d80af325001333cbbc9f1ec4ef074135756 Mon Sep 17 00:00:00 2001 From: JzoNg Date: Fri, 20 Dec 2024 12:46:07 +0800 Subject: [PATCH 5/7] support llm tool_parameters --- .../nodes/tool/components/input-var-list.tsx | 80 ++++++++++++++++++- .../components/workflow/nodes/tool/types.ts | 2 +- 2 files changed, 77 insertions(+), 5 deletions(-) diff --git a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx index de3bb2d2fb..76a9b7677b 100644 --- a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx +++ b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx @@ -14,6 +14,9 @@ import VarReferencePicker from '@/app/components/workflow/nodes/_base/components import Input from '@/app/components/workflow/nodes/_base/components/input-support-select-var' import useAvailableVarList from '@/app/components/workflow/nodes/_base/hooks/use-available-var-list' import { VarType } from '@/app/components/workflow/types' +import AppSelector from '@/app/components/plugins/plugin-detail-panel/app-selector' +import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal' + type Props = { readOnly: boolean nodeId: string @@ -48,8 +51,12 @@ const InputVarList: FC = ({ return 'Number' else if (type === FormTypeEnum.file || type === FormTypeEnum.files) return 'Files' - else if (type === FormTypeEnum.select) - return 'Options' + else if (type === FormTypeEnum.appSelector) + return 'AppSelector' + else if (type === FormTypeEnum.modelSelector) + return 'ModelSelector' + else if (type === FormTypeEnum.toolSelector) + return 'ToolSelector' else return 'String' } @@ -71,7 +78,7 @@ const InputVarList: FC = ({ }) onChange(newValue) } - }, [value, onChange, isSupportConstantValue]) + }, [value, onChange]) const handleMixedTypeChange = useCallback((variable: string) => { return (itemValue: string) => { @@ -103,6 +110,43 @@ const InputVarList: FC = ({ } }, [value, onChange]) + const handleAppChange = useCallback((variable: string) => { + return (app: { + app_id: string + inputs: Record + files?: any[] + }) => { + const newValue = produce(value, (draft: ToolVarInputs) => { + draft[variable] = app as any + }) + onChange(newValue) + } + }, [onChange, value]) + const handleModelChange = useCallback((variable: string) => { + return (model: { provider: string; modelId: string; mode?: string }) => { + const newValue = produce(value, (draft: ToolVarInputs) => { + draft[variable] = { + ...draft[variable], + provider: model.provider, + model: model.modelId, + mode: model.mode, + } as any + }) + onChange(newValue) + } + }, [onChange, value]) + const handleModelParamsChange = useCallback((variable: string) => { + return (newParams: Record) => { + const newValue = produce(value, (draft: ToolVarInputs) => { + draft[variable] = { + ...draft[variable], + completion_params: newParams, + } as any + }) + onChange(newValue) + } + }, [onChange, value]) + const [inputsIsFocus, setInputsIsFocus] = useState>({}) const handleInputFocus = useCallback((variable: string) => { return (value: boolean) => { @@ -127,12 +171,16 @@ const InputVarList: FC = ({ type, required, tooltip, + scope, } = schema const varInput = value[variable] const isNumber = type === FormTypeEnum.textNumber const isSelect = type === FormTypeEnum.select const isFile = type === FormTypeEnum.file || type === FormTypeEnum.files - const isString = !isNumber && !isSelect && !isFile + const isAppSelector = type === FormTypeEnum.appSelector + const isModelSelector = type === FormTypeEnum.modelSelector + // const isToolSelector = type === FormTypeEnum.toolSelector + const isString = !isNumber && !isSelect && !isFile && !isAppSelector && !isModelSelector return (
@@ -181,6 +229,30 @@ const InputVarList: FC = ({ filterVar={(varPayload: Var) => varPayload.type === VarType.file || varPayload.type === VarType.arrayFile} /> )} + {isAppSelector && ( + + )} + {isModelSelector && ( + + )} {tooltip &&
{tooltip[language] || tooltip.en_US}
}
) diff --git a/web/app/components/workflow/nodes/tool/types.ts b/web/app/components/workflow/nodes/tool/types.ts index 1ed6f9c373..60b6157f6d 100644 --- a/web/app/components/workflow/nodes/tool/types.ts +++ b/web/app/components/workflow/nodes/tool/types.ts @@ -9,7 +9,7 @@ export enum VarType { export type ToolVarInputs = Record export type ToolNodeType = CommonNodeType & { From cf75e2f0538ab33ef5586e33e8329a9d9734c22d Mon Sep 17 00:00:00 2001 From: JzoNg Date: Fri, 20 Dec 2024 16:36:22 +0800 Subject: [PATCH 6/7] model selector support scope --- .../model-provider-page/model-modal/Form.tsx | 6 +- .../model-parameter-modal/index.tsx | 2 + .../model-selector/index.tsx | 296 ++++++++++++++++++ .../nodes/tool/components/input-var-list.tsx | 13 +- 4 files changed, 307 insertions(+), 10 deletions(-) create mode 100644 web/app/components/plugins/plugin-detail-panel/model-selector/index.tsx diff --git a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx index be10e3a4c0..b886532edb 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx @@ -17,7 +17,7 @@ import cn from '@/utils/classnames' import { SimpleSelect } from '@/app/components/base/select' import Tooltip from '@/app/components/base/tooltip' import Radio from '@/app/components/base/radio' -import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal' +import ModelParameterModal from '@/app/components/plugins/plugin-detail-panel/model-selector' import ToolSelector from '@/app/components/plugins/plugin-detail-panel/tool-selector' import AppSelector from '@/app/components/plugins/plugin-detail-panel/app-selector' import RadioE from '@/app/components/base/radio/ui' @@ -285,6 +285,7 @@ const Form: FC = ({ variable, label, required, + scope, } = formSchema as (CredentialFormSchemaTextInput | CredentialFormSchemaSecretInput) return (
@@ -307,9 +308,8 @@ const Form: FC = ({ completionParams={value[variable]?.completion_params} setModel={model => handleModelChanged(variable, model)} onCompletionParamsChange={params => handleCompletionParamsChange(variable, params)} - hideDebugWithMultipleModel - debugWithMultipleModel={false} readonly={readonly} + scope={scope} /> {fieldMoreInfo?.(formSchema)} {validating && changeKey === variable && } diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx index 79ce65477c..5457b0e677 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx @@ -48,6 +48,7 @@ export type ModelParameterModalProps = { renderTrigger?: (v: TriggerProps) => ReactNode readonly?: boolean isInWorkflow?: boolean + scope?: string } const stopParameterRule: ModelParameterRule = { default: [], @@ -84,6 +85,7 @@ const ModelParameterModal: FC = ({ renderTrigger, readonly, isInWorkflow, + scope = 'text-generation', }) => { const { t } = useTranslation() const { isAPIKeySet } = useProviderContext() diff --git a/web/app/components/plugins/plugin-detail-panel/model-selector/index.tsx b/web/app/components/plugins/plugin-detail-panel/model-selector/index.tsx new file mode 100644 index 0000000000..18fbecea0d --- /dev/null +++ b/web/app/components/plugins/plugin-detail-panel/model-selector/index.tsx @@ -0,0 +1,296 @@ +import type { + FC, + ReactNode, +} from 'react' +import { useMemo, useState } from 'react' +import useSWR from 'swr' +import { useTranslation } from 'react-i18next' +import type { + DefaultModel, + FormValue, + ModelParameterRule, +} from '@/app/components/header/account-setting/model-provider-page/declarations' +import { ModelStatusEnum, ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations' +import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector' +import { + useModelList, +} from '@/app/components/header/account-setting/model-provider-page/hooks' +import ParameterItem from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item' +import type { ParameterValue } from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item' +import Trigger from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger' +import type { TriggerProps } from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger' +import PresetsParameter from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/presets-parameter' +import cn from '@/utils/classnames' +import { + PortalToFollowElem, + PortalToFollowElemContent, + PortalToFollowElemTrigger, +} from '@/app/components/base/portal-to-follow-elem' +import { fetchModelParameterRules } from '@/service/common' +import Loading from '@/app/components/base/loading' +import { useProviderContext } from '@/context/provider-context' +import { TONE_LIST } from '@/config' + +export type ModelParameterModalProps = { + popupClassName?: string + portalToFollowElemContentClassName?: string + isAdvancedMode: boolean + mode: string + modelId: string + provider: string + setModel: (model: { modelId: string; provider: string; mode?: string; features?: string[] }) => void + completionParams: FormValue + onCompletionParamsChange: (newParams: FormValue) => void + renderTrigger?: (v: TriggerProps) => ReactNode + readonly?: boolean + isInWorkflow?: boolean + scope?: string +} +const stopParameterRule: ModelParameterRule = { + default: [], + help: { + en_US: 'Up to four sequences where the API will stop generating further tokens. The returned text will not contain the stop sequence.', + zh_Hans: '最多四个序列，API 将停止生成更多的 token。返回的文本将不包含停止序列。', + }, + label: { + en_US: 'Stop sequences', + zh_Hans: '停止序列', + }, + name: 'stop', + required: false, + type: 'tag', + tagPlaceholder: { + en_US: 'Enter sequence and press Tab', + zh_Hans: '输入序列并按 Tab 键', + }, +} + +const PROVIDER_WITH_PRESET_TONE = ['langgenius/openai/openai', 'langgenius/azure_openai/azure_openai'] +const ModelParameterModal: FC = ({ + popupClassName, + portalToFollowElemContentClassName, + isAdvancedMode, + modelId, + provider, + setModel, + completionParams, + onCompletionParamsChange, + renderTrigger, + readonly, + isInWorkflow, + scope = 'text-generation', +}) => { + const { t } = useTranslation() + const { isAPIKeySet } = useProviderContext() + const [open, setOpen] = useState(false) + const scopeArray = scope.split('&') + const { data: parameterRulesData, isLoading } = useSWR( + (provider && modelId && (scopeArray.includes('text-generation') || scopeArray.includes('all'))) + ? `/workspaces/current/model-providers/${provider}/models/parameter-rules?model=${modelId}` + : null, fetchModelParameterRules, + ) + const { data: textGenerationList } = useModelList(ModelTypeEnum.textGeneration) + const { data: textEmbeddingList } = useModelList(ModelTypeEnum.textEmbedding) + const { data: rerankList } = useModelList(ModelTypeEnum.rerank) + const { data: moderationList } = useModelList(ModelTypeEnum.moderation) + const { data: sttList } = useModelList(ModelTypeEnum.speech2text) + const { data: ttsList } = useModelList(ModelTypeEnum.tts) + + const scopedModelList = useMemo(() => { + const resultList: any[] = [] + if (scopeArray.includes('all')) { + return [ + ...textGenerationList, + ...textEmbeddingList, + ...rerankList, + ...sttList, + ...ttsList, + ...moderationList, + ] + } + if (scopeArray.includes('text-generation')) + return textGenerationList + if (scopeArray.includes('embedding')) + return textEmbeddingList + if (scopeArray.includes('rerank')) + return rerankList + if (scopeArray.includes('moderation')) + return moderationList + if (scopeArray.includes('stt')) + return sttList + if (scopeArray.includes('tts')) + return ttsList + // if (scopeArray.includes('vision')) + // return textGenerationList + return resultList + }, [scopeArray, textGenerationList, textEmbeddingList, rerankList, sttList, ttsList, moderationList]) + + const { currentProvider, currentModel } = useMemo(() => { + const currentProvider = scopedModelList.find(item => item.provider === provider) + const currentModel = currentProvider?.models.find((model: { model: string }) => model.model === modelId) + return { + currentProvider, + currentModel, + } + }, [provider, modelId, scopedModelList]) + + const hasDeprecated = useMemo(() => { + return !currentProvider || !currentModel + }, [currentModel, currentProvider]) + const modelDisabled = useMemo(() => { + return currentModel?.status !== ModelStatusEnum.active + }, [currentModel?.status]) + const disabled = useMemo(() => { + return !isAPIKeySet || hasDeprecated || modelDisabled + }, [hasDeprecated, isAPIKeySet, modelDisabled]) + + const parameterRules: ModelParameterRule[] = useMemo(() => { + return parameterRulesData?.data || [] + }, [parameterRulesData]) + + const handleParamChange = (key: string, value: ParameterValue) => { + onCompletionParamsChange({ + ...completionParams, + [key]: value, + }) + } + + const handleChangeModel = ({ provider, model }: DefaultModel) => { + const targetProvider = scopedModelList.find(modelItem => modelItem.provider === provider) + const targetModelItem = targetProvider?.models.find((modelItem: { model: string }) => modelItem.model === model) + setModel({ + modelId: model, + provider, + mode: targetModelItem?.model_properties.mode as string, + features: targetModelItem?.features || [], + }) + } + + const handleSwitch = (key: string, value: boolean, assignValue: ParameterValue) => { + if (!value) { + const newCompletionParams = { ...completionParams } + delete newCompletionParams[key] + + onCompletionParamsChange(newCompletionParams) + } + if (value) { + onCompletionParamsChange({ + ...completionParams, + [key]: assignValue, + }) + } + } + + const handleSelectPresetParameter = (toneId: number) => { + const tone = TONE_LIST.find(tone => tone.id === toneId) + if (tone) { + onCompletionParamsChange({ + ...completionParams, + ...tone.config, + }) + } + } + + return ( + +
+ { + if (readonly) + return + setOpen(v => !v) + }} + className='block' + > + { + renderTrigger + ? renderTrigger({ + open, + disabled, + modelDisabled, + hasDeprecated, + currentProvider, + currentModel, + providerName: provider, + modelId, + }) + : ( + + ) + } + + +
+
+
+
+ {t('common.modelProvider.model').toLocaleUpperCase()} +
+ +
+ { + !!parameterRules.length && ( +
+ ) + } + { + isLoading && ( +
+ ) + } + { + !isLoading && !!parameterRules.length && ( +
+
{t('common.modelProvider.parameters')}
+ { + PROVIDER_WITH_PRESET_TONE.includes(provider) && ( + + ) + } +
+ ) + } + { + !isLoading && !!parameterRules.length && ( + [ + ...parameterRules, + ...(isAdvancedMode ? [stopParameterRule] : []), + ].map(parameter => ( + handleParamChange(parameter.name, v)} + onSwitch={(checked, assignValue) => handleSwitch(parameter.name, checked, assignValue)} + isInWorkflow={isInWorkflow} + /> + )) + ) + } +
+
+ +
+ + ) +} + +export default ModelParameterModal diff --git a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx index 76a9b7677b..a6da1c35f4 100644 --- a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx +++ b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx @@ -15,7 +15,7 @@ import Input from '@/app/components/workflow/nodes/_base/components/input-suppor import useAvailableVarList from '@/app/components/workflow/nodes/_base/hooks/use-available-var-list' import { VarType } from '@/app/components/workflow/types' import AppSelector from '@/app/components/plugins/plugin-detail-panel/app-selector' -import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal' +import ModelParameterModal from '@/app/components/plugins/plugin-detail-panel/model-selector' type Props = { readOnly: boolean @@ -242,15 +242,14 @@ const InputVarList: FC = ({ popupClassName='!w-[387px]' isAdvancedMode isInWorkflow - provider={(varInput as any).provider} - modelId={(varInput as any).model} - mode={(varInput as any).mode} - completionParams={(varInput as any).completion_params} + provider={(varInput as any)?.provider} + modelId={(varInput as any)?.model} + mode={(varInput as any)?.mode} + completionParams={(varInput as any)?.completion_params} setModel={handleModelChange(variable)} onCompletionParamsChange={handleModelParamsChange(variable)} - hideDebugWithMultipleModel - debugWithMultipleModel={false} readonly={readOnly} + scope={'embedding'} /> )} {tooltip &&
{tooltip[language] || tooltip.en_US}
} From 327eac09e766d8859cb29f6e0245efae19332cf7 Mon Sep 17 00:00:00 2001 From: JzoNg Date: Fri, 20 Dec 2024 16:37:30 +0800 Subject: [PATCH 7/7] fix: scope value --- .../workflow/nodes/tool/components/input-var-list.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx index a6da1c35f4..bfc85e8aa6 100644 --- a/web/app/components/workflow/nodes/tool/components/input-var-list.tsx +++ b/web/app/components/workflow/nodes/tool/components/input-var-list.tsx @@ -249,7 +249,7 @@ const InputVarList: FC = ({ setModel={handleModelChange(variable)} onCompletionParamsChange={handleModelParamsChange(variable)} readonly={readOnly} - scope={'embedding'} + scope={scope} /> )} {tooltip &&
{tooltip[language] || tooltip.en_US}
}