feat: 添加Prompt模板和Prompt商店支持 #268

Nothing1024 · 2023-03-04T06:36:35Z

续feat: 添加prompt模板
因为当时是老版本担心有冲突，所以重新提交PR

目前实现部分：

Prompt模板触发：按'/'键触发模板列表，选中后自动填充对应的模板内容
Prompt模板管理：支持基础的添加、删除、修改、清空操作
Prompt导入导出：支持本地导入和在线导入，导出目前是直接导出JSON文件
模板推荐部分：在线导入部分提供推荐栏，部署者可以根据自己的喜好添加Prompt模板源(修改assets/recommend.json)
简单做了一下移动端自适应

动图演示

PC端相关操作

移动端相关操作

实际场景演示（通过模板快速进行综述整理）

具体细节部分

Prompt模板触发

修复了上次PR的问题（上次的联想是参照value而不是key,这次改过来了）
[上次仍存在问题]使用NAutoComplete实现模板列表弹出与筛选，不过我在调试该组件和NMention组建过程中经常遇到渲染异常的问题，所以只能采取折中方法解决（value当key反渲染label，靠searchOptions进行列表内容绑定等），这个问题在无重复value的情况下不会影响正常使用(管理部分也默认禁止value重复)，可能处理起来也不是很优雅...
当Prompt模板修改时，联想部分需要借助storeToRef进行重新渲染，否则需要重新访问才可以正常读取

Prompt模板管理

目前禁止重复key和重复value出现，防止后期因冲突出现渲染异常问题
清空部分担心大家误触所以加了一个确认(涉及组件Popconfirm)

Prompt导入导出

本地导入是粘贴JSON内容直接导入，JSON规范最后会附上
在线导入是直接下载JSON文件读取，所以还是建议用户在下载时注意检查来源是否异常
简单做了检测（JSON是否能正常导入，JSON对应的key和value是否存在）

模板推荐部分

修改assets/recommend.json

这里我加了一个临时的推荐项用作参考（无利益相关），如果认为不当可以删除自己配置

其他可能需要注意的问题

我算是前端门外汉，因为整理论文时没有趁手的ChatGPT第三方工具，所以就一时心血来潮尝试做了一下，实现逻辑看起来应该会很菜，所以还是以提供思路为主，希望能帮上忙
我对TS的类型声明没有进行过系统学习，所以在项目文件中可能用了很多的as never和any，如果有重大影响的话，还是希望作者和相关的贡献者大佬能帮忙修复一下（我也确实该进行系统学习了...）
Prompt模板的存储逻辑和移动端自适应都是参考了项目内其他组件的设计，照猫画虎，可能有很大的优化空间

附

JSON导入导出部分

[{
	"key": "test2",
	"value": "1"
}]

模板推荐部分

参考格式：

[
  {
    "key": "awesome-chatgpt-prompts-zh",
    "desc": "ChatGPT 中文调教指南",
    "downloadUrl": "https://raw.githubusercontent.com/Nothing1024/chatgpt-prompt-collection/main/awesome-chatgpt-prompts-zh.json",
    "url": "https://github.com/PlexPt/awesome-chatgpt-prompts-zh"
  }
]

Nothing1024 · 2023-03-04T06:58:47Z

如果PC相关操作涉及的动图无法正常显示，可以直接访问
Peek 2023-03-04 14-00.gif

Chanzhaoyu · 2023-03-04T07:09:45Z

你这个功能特色到可以出大版本

Nothing1024 · 2023-03-04T07:48:19Z

感谢鼓励，我这算是抛砖引玉吧。
我实现的时候因为自己缺乏系统学习，可能在具体的逻辑实现和性能优化处理上做的不那么漂亮，有很多优化的空间。
如果能帮上忙的话就太好了。

AndroidRaper · 2023-03-04T14:11:53Z

真的是太棒了，令人兴奋地功能

helperAI · 2023-03-05T09:16:47Z

非常棒

quzard · 2023-03-09T12:53:49Z

这个pr什么时候合入，挺有用的

Cp0204 · 2023-03-10T06:58:01Z

赞~！

zhuxindong · 2023-03-10T07:48:12Z

希望早日合入主分支

* chore: change docs * feat: 添加 Prompt 模板和 Prompt 商店支持 (Chanzhaoyu#268) * feat: 添加Prompt模板和Prompt商店支持 * feat: well done --------- Co-authored-by: Redon <790348264@qq.com> * feat: 设置添加关闭按钮 * chore: format * chore: 2.10.4 * chore: cover * fix: 更新JSON导入检查 (Chanzhaoyu#523) * feat: Improve zh-TW locale (Chanzhaoyu#511) * fix: cors in auth_secret_key model (Chanzhaoyu#499) * fix: 修改最大行数与官方保持一致 (Chanzhaoyu#502) * chore: rename environment variables files * docs: update README.md about .env file * feat: support long reply * chore: upgrade chatgpt package and set long reply to false default * chore: set long reply to false default * fix: change maxRows to 8 * feat: mobile max row --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * feat: support linux command line proxy standard (Chanzhaoyu#308) * feat: support linux command line proxy standard with env HTTPS_PROXY and ALL_PROXY * chore: update docs for linux command linux proxy standard * fix: Prompt商店在线导入可以导入两种recommend.json里提到的模板 (Chanzhaoyu#516) (Chanzhaoyu#521) * fix(PromptStore): import prompt template using different dict keys * chore(PromptStore): clear url field after downloading * feat: 仓库添加翻译 * feat: 仓库查询筛选 * feat: 调整界面 * chore: update deps * feat: improve zh-TW locale, translate new strings (Chanzhaoyu#542) * feat: 语言设定改为下拉框选择 * feat: 修改 Prompt Store 移动端样式 * chore: docs change * feat: 权限输入框改为密码类型 * fix: 清空上下文时不应该重置会话标题 * chore: docs change * chore: optimize dockerfile to speed up building and reduce docker image size (Chanzhaoyu#520) * chore: v2.10.5 * fix: 修复导入、导出错误 * fix: inverted parameter for before each function (Chanzhaoyu#585) * fix: 🐛 fix scroll bar style (Chanzhaoyu#617) * fix: typo (Chanzhaoyu#636) * perf: 优化移动端 prompt 商店样式 (Chanzhaoyu#608) * feat: 修改移动端 prompt 商店样式 * add: 修改移动端 prompt 商店样式 * perf: 清理代码 --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * chore: extract proxy setup code into reusable function (Chanzhaoyu#583) * perf: 记录上下文设定保存到本地 * perf: 优化部份判断 * docs: 移除 docker-compose.yml 省略 * feat: show api balance (Chanzhaoyu#582) * feat: show api balance * Update index.ts * 保留小数点后五位 * perf: 判断优化 --------- Co-authored-by: Redon <790348264@qq.com> * chore: update deps and lint fix * feat: session 返回接口方式做显示判断 * fix: highlight.js 控制台兼容性警告 * chore: v2.10.6 * fix: 回退 chatgpt 版本导致的代理失效 * fix: 添加 usingContext 缺省 * chore: v2.10.7 * feat: 查询余额使用 API_BASE_URL 参数 * feat: 渲染的链接新窗口打开 * perf: config 接口添加权限验证 * fix: 手动重置异常的 loading * feat: 添加用于显示回复消息原文的选项 (Chanzhaoyu#672) * feat: 添加显示用于原文的选项 * chore: 修复暗色主题下文本颜色问题给输入和输出气泡添加了 css 类,用来处理在暗色主题下聊天气泡的文本颜色 * feat: 用户输入不应该被渲染，防止 xss --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * feat: 新增限流功能 (Chanzhaoyu#718) * 请求速率限制 * perf: 优化代码 --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * feat: 添加角色设定预留API 设定页(Chanzhaoyu#768) * add systemMessage * perf: 优化代码和类型 * perf: 补全翻译和为以后做准备 --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * perf: 重置回答时滚动定位至该回答 (Chanzhaoyu#781) * chore: 重置回答时滚动定位至该回答 * perf: format code --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * perf: scrollToBottom 改成 scrollToBottomIfAtBottom (Chanzhaoyu#771) * feat: 更新依赖并兼容已存在的代理 * feat: 当用gpt-4的API 时增加可用的 Max Tokens (Chanzhaoyu#729) * fix: 用GPT-4 API时增加max token * style: eslint fix --------- Co-authored-by: Redon <790348264@qq.com> * feat: Create start.cmd (Chanzhaoyu#656) 在windows下也可以运行 * chore(vsc-debug): 增加 visual-studio-code 的 debug 启动文件 (Chanzhaoyu#296) * fix line end with new-line in some backend (Chanzhaoyu#474) * fix line end with new-line in some backend In backend with golang (like https://github.com/sashabaranov/go-openai), the responseText always has '\n'. * feat: 补全遗漏 --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * feat: 增加 ChatGPTUnofficialProxyAPI 的模型自定义配置 (Chanzhaoyu#632) * feat: 增加 ChatGPTUnofficialProxyAPI 的模型自定义配置(Chanzhaoyu#618) * perf: 修改判断 --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> * chore: 显示原文时使用 .whitespace-pre-wrap (Chanzhaoyu#779) 显示 ChatGPT 输出的原文时保留空格和换行 * feat: PWA 默认不开启 * feat: 切换 history 时自动聚焦输入框 (Chanzhaoyu#735) * feat: 修改 scrollToBottom 行为(当滚动条在底部或发送问题时才会进入自动滚动,滚轮向上滚动会中止自动滚动,方便复制和查看之前的代码; 切换 history 时自动聚焦输入框,方便直接输入文字,不用再次去点击输入框;) * chore: 通过eslint检查 * perf: 清理重复功能 --------- Co-authored-by: Redon <790348264@qq.com> * perf: 网络连接时 500 自动跳转到主页 * docs: fix docker port to private (Chanzhaoyu#802) * feat: add zh-TW prompts in the Promt Store (Chanzhaoyu#796) * fix: prompt store 样式问题 * chore: v2.10.8 * fix: 重置时应该移除本地储存 * fix: PWA 未添加的问题 (Chanzhaoyu#807) Co-authored-by: bingo235 <> * fix: 移动端新建会话关闭侧边栏 (Chanzhaoyu#813) * perf: 移动端删除 chat 时，侧边栏应该收起 * fix: ESM error (Chanzhaoyu#826) * perf: 自动焦点时移动端上的不便 * fix: 移动端焦点不触发的问题 * perf: 本地地址 * fix: 反向代理限流失效 (Chanzhaoyu#863) https://docs.colyseus.io/zh_hk/colyseus/how-to/rate-limit/ 使用nginx限流会只识别为服务器ip，需启用trust proxy --------- Co-authored-by: ChenZhaoYu <790348264@qq.com> Co-authored-by: Nothing1024 <78358913+Nothing1024@users.noreply.github.com> Co-authored-by: Peter Dave Hello <hsu@peterdavehello.org> Co-authored-by: Yige <a@wyr.me> Co-authored-by: Eason <tobewhatwewant@gmail.com> Co-authored-by: 吴杉(Shan Wu) <Shan.Wu.1995@gmail.com> Co-authored-by: Wisdom <pdsu.wwz@foxmail.com> Co-authored-by: Hayden Chen <hayden.chen.b612@gmail.com> Co-authored-by: 碎花爱洋裙 <44236581+lizhongyuan3@users.noreply.github.com> Co-authored-by: CornerSkyless <573196853@qq.com> Co-authored-by: Kirk Lin <linkirk@163.com> Co-authored-by: pzcn <sdustpedro@gmail.com> Co-authored-by: Yi <32430186+yilozt@users.noreply.github.com> Co-authored-by: xiaozhu <501801307@qq.com> Co-authored-by: quzard <1191890118@qq.com> Co-authored-by: 舜岳 <1277952981@qq.com> Co-authored-by: 吴杉(Shan Wu) <Shan.Wu@ut.ee> Co-authored-by: vulgate <vulgate@qq.com> Co-authored-by: KeepRunning <ChandlerVer5@gmail.com> Co-authored-by: Liut <Eagle.L@gmail.com> Co-authored-by: hncboy <619452863@qq.com> Co-authored-by: Allen <987425154@qq.com> Co-authored-by: 东子 <16423601+kilvn@users.noreply.github.com> Co-authored-by: Bing <bingo235@users.noreply.github.com> Co-authored-by: Kid <44045911+kidonng@users.noreply.github.com> Co-authored-by: gitgitgogogo <gitgitgogogo@users.noreply.github.com>

* feat: 添加Prompt模板和Prompt商店支持 * feat: well done --------- Co-authored-by: Redon <790348264@qq.com>

* first pass: copy from Chanzhaoyu/chatgpt-web#268 * prompt store works * update

swuecho · 2023-06-11T06:07:16Z

我是来感谢作者牛逼的, 一个pr 整了那么多功能. 我抄的时候都没想到这么完整.

fix: Failed to resolve component NButton

feat: 添加Prompt模板和Prompt商店支持

891ba81

Nothing1024 mentioned this pull request Mar 4, 2023

feat: 添加prompt模板 #180

Closed

Chanzhaoyu added 2 commits March 11, 2023 15:23

Merge branch 'main' into main

336c787

feat: well done

f294002

Chanzhaoyu merged commit 00ade41 into Chanzhaoyu:main Mar 11, 2023

Nothing1024 mentioned this pull request Mar 12, 2023

[Improvements] recommend.json 里的URL来自两个作者的仓库（自定义在线模板） #516

Closed

jingChen55 pushed a commit to jingChen55/chatgpt-web that referenced this pull request Mar 27, 2023

feat: 添加 Prompt 模板和 Prompt 商店支持 (Chanzhaoyu#268)

b79a054

* feat: 添加Prompt模板和Prompt商店支持 * feat: well done --------- Co-authored-by: Redon <790348264@qq.com>

jingChen55 pushed a commit to jingChen55/chatgpt-web that referenced this pull request Mar 27, 2023

feat: 添加 Prompt 模板和 Prompt 商店支持 (Chanzhaoyu#268)

af20e8a

* feat: 添加Prompt模板和Prompt商店支持 * feat: well done --------- Co-authored-by: Redon <790348264@qq.com>

suikodev referenced this pull request in AstraSurge/gpteams Mar 27, 2023

feat: 添加 Prompt 模板和 Prompt 商店支持 (#268)

1372728

* feat: 添加Prompt模板和Prompt商店支持 * feat: well done --------- Co-authored-by: Redon <790348264@qq.com>

swuecho mentioned this pull request May 2, 2023

Keep up with original project features(chatgpt-web) swuecho/chat#285

Closed

swuecho added a commit to swuecho/chat that referenced this pull request May 28, 2023

first pass: copy from Chanzhaoyu/chatgpt-web#268

4dd3547

swuecho mentioned this pull request May 28, 2023

Prompt store swuecho/chat#319

Merged

swuecho added a commit to swuecho/chat that referenced this pull request May 28, 2023

Prompt store (#319)

238371d

* first pass: copy from Chanzhaoyu/chatgpt-web#268 * prompt store works * update

EvanDbg pushed a commit to EvanDbg/chatgpt-web that referenced this pull request Jun 26, 2023

Merge pull request Chanzhaoyu#268 from Fanlu91/fix_button

af2f07b

fix: Failed to resolve component NButton

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: 添加Prompt模板和Prompt商店支持 #268

feat: 添加Prompt模板和Prompt商店支持 #268

Nothing1024 commented Mar 4, 2023

Nothing1024 commented Mar 4, 2023

Chanzhaoyu commented Mar 4, 2023

Nothing1024 commented Mar 4, 2023

AndroidRaper commented Mar 4, 2023

helperAI commented Mar 5, 2023

quzard commented Mar 9, 2023

Cp0204 commented Mar 10, 2023

zhuxindong commented Mar 10, 2023

swuecho commented Jun 11, 2023

feat: 添加Prompt模板和Prompt商店支持 #268

feat: 添加Prompt模板和Prompt商店支持 #268

Conversation

Nothing1024 commented Mar 4, 2023

目前实现部分：

动图演示

具体细节部分

Prompt模板触发

Prompt模板管理

Prompt导入导出

模板推荐部分

其他可能需要注意的问题

附

JSON导入导出部分

模板推荐部分

Nothing1024 commented Mar 4, 2023

Chanzhaoyu commented Mar 4, 2023

Nothing1024 commented Mar 4, 2023

AndroidRaper commented Mar 4, 2023

helperAI commented Mar 5, 2023

quzard commented Mar 9, 2023

Cp0204 commented Mar 10, 2023

zhuxindong commented Mar 10, 2023

swuecho commented Jun 11, 2023