diff --git a/README.md b/README.md index 8fbf677c1216..01e4792b1357 100644 --- a/README.md +++ b/README.md @@ -152,6 +152,8 @@ e-commerce platform data access, and various third-party services. +[Learn More →](./docs/Usage/Plugins.md) + > \[!TIP] > > To aid developers in joining this ecosystem, we provide comprehensive development resources in the [🧩 Plugin System](#-plugins) section. diff --git a/README.zh-CN.md b/README.zh-CN.md index 60cbc633755e..fe023134d064 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -133,7 +133,9 @@ LobeChat 支持文字转语音(Text-to-Speech,TTS)和语音转文字(Spe LobeChat 的插件生态系统是其核心功能的重要扩展,它极大地增强了 ChatGPT 的实用性和灵活性。通过利用插件,ChatGPT 能够实现实时信息的获取和处理,例如自动获取最新新闻头条,为用户提供即时且相关的资讯。 此外,这些插件不仅局限于新闻聚合,还可以扩展到其他实用的功能,如快速检索文档、获取电商平台数据、以及其他各式各样的第三方服务。 - + + +[了解更多 →](./docs/Usage/Plugins.zh-CN.md) > \[!TIP] > diff --git a/docs/Usage/Plugins.md b/docs/Usage/Plugins.md new file mode 100644 index 000000000000..b9da778eed57 --- /dev/null +++ b/docs/Usage/Plugins.md @@ -0,0 +1,53 @@ +# Plugin Usage + +The plugin system is a key element in expanding the capabilities of the assistant in LobeChat. You can enhance the assistant's abilities by enabling a variety of plugins. + +Watch the following video to quickly get started with using LobeChat plugins: + + + +## Plugin Store + +You can access the Plugin Store by navigating to "Extension Tools" -> "Plugin Store" in the chat toolbar. + +![Plugin Store](https://github.com/lobehub/lobe-chat/assets/28616219/ab4e60d0-1293-49ac-8798-cb29b3b789e6) + +The Plugin Store contains plugins that can be directly installed and used in LobeChat. + +![Plugin Store](https://github.com/lobehub/lobe-chat/assets/28616219/d7a5d821-116f-4be6-8a1a-38d81a5ea0ea) + +## Using Plugins + +After installing a plugin, simply enable it under the current assistant to use it. + +![Enable Plugin](https://github.com/lobehub/lobe-chat/assets/28616219/76ab1ae7-a4f9-4285-8ebd-45b90251aba1) + +## Plugin Configuration + +Some plugins may require specific configurations, such as API keys. + +After installing a plugin, you can click on "Settings" to enter the plugin's settings and fill in the required configurations: + +![Plugin Settings](https://github.com/lobehub/lobe-chat/assets/28616219/10eb3023-4528-4b06-8092-062e7b3865cc) + +![Plugin Settings](https://github.com/lobehub/lobe-chat/assets/28616219/ab2e4c25-4b11-431b-9266-442d8b14cb41) + +## Installing Custom Plugins + +If you wish to install a plugin that is not available in the LobeChat Plugin Store, such as a custom LobeChat plugin you developed, you can click on "Custom Plugins" to install it: + +[Custom Plugin Installation](https://github.com/lobehub/lobe-chat/assets/28616219/034a328c-8465-4499-8f93-fdcdb03343cd) + +Additionally, LobeChat's plugin mechanism is compatible with ChatGPT plugins, allowing you to easily install corresponding ChatGPT plugins. + +If you want to try installing custom plugins on your own, you can use the following links: + +- `Custom Lobe Plugin` Mock Credit Card: [Mock Credit Card Plugin](https://lobe-plugin-mock-credit-card.vercel.app/manifest.json) +- `ChatGPT Plugin` Access Links: [Access Links Plugin](https://www.accesslinks.ai/.well-known/ai-plugin.json) + +![Custom Plugin](https://github.com/lobehub/lobe-chat/assets/28616219/bb9cd00f-b20c-4d7b-9c60-b921d350e319) +![Custom Plugin](https://github.com/lobehub/lobe-chat/assets/28616219/bdeb678e-6502-4667-86b1-504221ee7ded) + +## Developing Plugins + +If you want to develop a LobeChat plugin on your own, feel free to refer to the [Lobe Plugin Development Guide](https://chat-plugin-sdk.lobehub.com/guides/intro) to expand the possibilities of your AI assistant! diff --git a/docs/Usage/Plugins.zh-CN.md b/docs/Usage/Plugins.zh-CN.md new file mode 100644 index 000000000000..c4d477228e9f --- /dev/null +++ b/docs/Usage/Plugins.zh-CN.md @@ -0,0 +1,59 @@ +# 插件使用 + +插件体系是 LobeChat 中扩展助理的能力的关键要素,你可以通过为助手启用各式各样的插件来增强助手的各项能力。 + +查看以下视频,快速上手使用 LobeChat 插件: + +https://github.com/lobehub/lobe-chat/assets/28616219/94d4c312-1699-4e24-8782-138883678c9e + + +## 插件商店 + +你可以在会话工具条中的 「扩展工具」 -> 「插件商店」,进入插件商店。 + +![820shots_so](https://github.com/lobehub/lobe-chat/assets/28616219/ab4e60d0-1293-49ac-8798-cb29b3b789e6) + +插件商店中会在 LobeChat 中可以直接安装并使用的插件。 + +![image](https://github.com/lobehub/lobe-chat/assets/28616219/d7a5d821-116f-4be6-8a1a-38d81a5ea0ea) + + +## 使用插件 + +安装完毕插件后,只需在当前助手下开启插件即可使用。 + +![809shots_so](https://github.com/lobehub/lobe-chat/assets/28616219/76ab1ae7-a4f9-4285-8ebd-45b90251aba1) + + +## 插件配置 + +部分插件可能需要你进行相应的配置,例如 API Key 等。 + +你可以在安装插件后,点击设置进入插件的设置填写配置: + +![image](https://github.com/lobehub/lobe-chat/assets/28616219/10eb3023-4528-4b06-8092-062e7b3865cc) + +![image](https://github.com/lobehub/lobe-chat/assets/28616219/ab2e4c25-4b11-431b-9266-442d8b14cb41) + + +## 安装自定义插件 + +如果你希望安装一个不在 LobeChat 插件商店中的插件,例如自己开发的 LobeChat,你可以点击「自定义插件」进行安装: + + +https://github.com/lobehub/lobe-chat/assets/28616219/034a328c-8465-4499-8f93-fdcdb03343cd + +此外,LobeChat 的插件机制兼容了 ChatGPT 的插件,因此你可以一键安装相应的 ChatGPT 插件。 + +如果你希望尝试自行安装自定义插件,你可以使用以下链接来尝试: +- `自定义 Lobe 插件` Mock Credit Card:https://lobe-plugin-mock-credit-card.vercel.app/manifest.json +- `ChatGPT 插件` Access Links:https://www.accesslinks.ai/.well-known/ai-plugin.json + + +![image](https://github.com/lobehub/lobe-chat/assets/28616219/bb9cd00f-b20c-4d7b-9c60-b921d350e319) +![image](https://github.com/lobehub/lobe-chat/assets/28616219/bdeb678e-6502-4667-86b1-504221ee7ded) + + +## 开发插件 + +如果你希望自行开发一个 LobeChat 的插件,欢迎查阅 [Lobe 插件开发指南](https://chat-plugin-sdk.lobehub.com/zh-CN/guides/intro) 以扩展你的AI智能助手的可能性边界! diff --git a/scripts/readmeWorkflow/const.ts b/scripts/readmeWorkflow/const.ts index b5d667fbed49..054443c8a337 100644 --- a/scripts/readmeWorkflow/const.ts +++ b/scripts/readmeWorkflow/const.ts @@ -1,6 +1,6 @@ export interface DataItem { author: string; - createAt: string; + createdAt: string; homepage: string; identifier: string; meta: { avatar: string; description: string; tags: string[]; title: string }; diff --git a/scripts/readmeWorkflow/syncAgentIndex.ts b/scripts/readmeWorkflow/syncAgentIndex.ts index 8f364d682465..157ad72ebbf6 100644 --- a/scripts/readmeWorkflow/syncAgentIndex.ts +++ b/scripts/readmeWorkflow/syncAgentIndex.ts @@ -16,7 +16,7 @@ const genAgentTable = (data: DataItem[], lang: string) => { url: MARKET_URL, }), ), - `By **${genLink(item.author, item.homepage)}** on **${item.createAt}**`, + `By **${genLink(item.author, item.homepage)}** on **${(item as any).createAt}**`, ].join('
'), [item.meta.description, genTags(item.meta.tags)].join('
'), ]); diff --git a/scripts/readmeWorkflow/syncPluginIndex.ts b/scripts/readmeWorkflow/syncPluginIndex.ts index 0b5064ef2404..316ca8d35141 100644 --- a/scripts/readmeWorkflow/syncPluginIndex.ts +++ b/scripts/readmeWorkflow/syncPluginIndex.ts @@ -9,7 +9,7 @@ const genPluginTable = (data: DataItem[], lang: string) => { const content = data.map((item) => [ [ genLink(item.meta.title, PLGUIN_URL), - `By **${item.author}** on **${item.createAt}**`, + `By **${item.author}** on **${item.createdAt}**`, ].join('
'), genLink(item.homepage.split('github.com/')[1], item.homepage), [item.meta.description, genTags(item.meta.tags)].join('
'), diff --git a/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/Settings.tsx b/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/Settings.tsx index e5670a94fa6a..e9183dfe24cf 100644 --- a/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/Settings.tsx +++ b/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/Settings.tsx @@ -2,8 +2,8 @@ import { ActionIcon } from '@lobehub/ui'; import { LucideSettings } from 'lucide-react'; import { memo, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import PluginDetailModal from 'src/features/PluginDetailModal'; +import PluginDetailModal from '@/features/PluginDetailModal'; import { pluginHelpers, useToolStore } from '@/store/tool'; import { pluginSelectors } from '@/store/tool/selectors';