diff --git a/app/components/chat.tsx b/app/components/chat.tsx index e39bc74a9..dad1933ac 100644 --- a/app/components/chat.tsx +++ b/app/components/chat.tsx @@ -728,12 +728,18 @@ export function ChatActions(props: { {showPlugins(currentProviderName, currentModel) && ( <ChatAction - onClick={() => setShowPluginSelector(true)} + onClick={() => { + if (pluginStore.getAll().length == 0) { + navigate(Path.Plugins); + } else { + setShowPluginSelector(true); + } + }} text={Locale.Plugin.Name} icon={<PluginIcon />} /> )} - {showPluginSelector && showPlugins(currentProviderName, currentModel) && ( + {showPluginSelector && ( <Selector multiple defaultSelectedValue={chatStore.currentSession().mask?.plugin} diff --git a/app/components/plugin.tsx b/app/components/plugin.tsx index b847ad78e..6f0b37107 100644 --- a/app/components/plugin.tsx +++ b/app/components/plugin.tsx @@ -1,6 +1,7 @@ import { useDebouncedCallback } from "use-debounce"; import OpenAPIClientAxios from "openapi-client-axios"; import yaml from "js-yaml"; +import { PLUGINS_REPO_URL } from "../constant"; import { IconButton } from "./button"; import { ErrorBoundary } from "./error"; @@ -14,6 +15,7 @@ import DeleteIcon from "../icons/delete.svg"; import EyeIcon from "../icons/eye.svg"; import ConfirmIcon from "../icons/confirm.svg"; import ReloadIcon from "../icons/reload.svg"; +import GithubIcon from "../icons/github.svg"; import { Plugin, usePluginStore, FunctionToolService } from "../store/plugin"; import { @@ -129,6 +131,15 @@ export function PluginPage() { </div> <div className="window-actions"> + <div className="window-action-button"> + <a + href={PLUGINS_REPO_URL} + target="_blank" + rel="noopener noreferrer" + > + <IconButton icon={<GithubIcon />} bordered /> + </a> + </div> <div className="window-action-button"> <IconButton icon={<CloseIcon />} @@ -162,6 +173,26 @@ export function PluginPage() { </div> <div> + {plugins.length == 0 && ( + <div + style={{ + display: "flex", + margin: "60px auto", + alignItems: "center", + justifyContent: "center", + }} + > + {Locale.Plugin.Page.Find} + <a + href={PLUGINS_REPO_URL} + target="_blank" + rel="noopener noreferrer" + style={{ marginLeft: 16 }} + > + <IconButton icon={<GithubIcon />} bordered /> + </a> + </div> + )} {plugins.map((m) => ( <div className={styles["mask-item"]} key={m.id}> <div className={styles["mask-header"]}> diff --git a/app/constant.ts b/app/constant.ts index cd5c79b25..90557c16c 100644 --- a/app/constant.ts +++ b/app/constant.ts @@ -3,6 +3,7 @@ import path from "path"; export const OWNER = "ChatGPTNextWeb"; export const REPO = "ChatGPT-Next-Web"; export const REPO_URL = `https://github.com/${OWNER}/${REPO}`; +export const PLUGINS_REPO_URL = `https://github.com/${OWNER}/NextChat-Awesome-Plugins`; export const ISSUE_URL = `https://github.com/${OWNER}/${REPO}/issues`; export const UPDATE_URL = `${REPO_URL}#keep-updated`; export const RELEASE_URL = `${REPO_URL}/releases`; diff --git a/app/locales/cn.ts b/app/locales/cn.ts index 742f85952..33e368f69 100644 --- a/app/locales/cn.ts +++ b/app/locales/cn.ts @@ -537,6 +537,7 @@ const cn = { SubTitle: (count: number) => `${count} 个插件`, Search: "搜索插件", Create: "新建", + Find: "您可以在Github上找到优秀的插件:", }, Item: { Info: (count: number) => `${count} 方法`, diff --git a/app/locales/en.ts b/app/locales/en.ts index 13b3fe5e6..403b9b687 100644 --- a/app/locales/en.ts +++ b/app/locales/en.ts @@ -545,6 +545,7 @@ const en: LocaleType = { SubTitle: (count: number) => `${count} plugins`, Search: "Search Plugin", Create: "Create", + Find: "You can find awesome plugins on github: ", }, Item: { Info: (count: number) => `${count} method`,