feat: add token show switch #102
Conversation
| @@ -56,7 +56,7 @@ | |||
| - **Windows**: Windows 7 - Windows 11 | |||
| - **Linux**: x64 | |||
|
|
|||
| <img src='./images/theme.gif' alt='theme' /> | |||
| <img src='./images/theme.gif' /> | |||
| <img src='./images/home.png' /> | |||
| <img src='./images/settings.png' /> | |||
| <img src='./images/role-1.png' /> | |||
There was a problem hiding this comment.
这段代码补丁主要修改了几个图片的引用路径，并更新了支持的操作系统信息。
代码风格看起来整洁，没有明显的bug风险。但是可以考虑一下以下改进建议：
- 第一个图片标签的alt属性为空，可以加上一些有意义的文本来提高可访问性。
- 可以将重复使用的图片路径定义为常量或变量，这样方便更改和维护。
- 如果需要支持更多操作系统，可以将操作系统列表单独定义为一个数组或枚举类型，这样方便扩展。
| @@ -409,7 +409,7 @@ checksum = "baf1de4339761588bc0619e3cbc0120ee582ebb74b53b4efbf79117bd2da40fd" | |||
|
|
|||
| [[package]] | |||
| name = "chat_gpt" | |||
| version = "0.0.7" | |||
| version = "1.0.0" | |||
| dependencies = [ | |||
| "serde", | |||
| "serde_json", | |||
There was a problem hiding this comment.
这段代码是一个Rust 的 Cargo.toml 文件的补丁。根据补丁，我们可以看到以下更改：
- 将 chat_gpt 库的版本从 0.0.7 升级到 1.0.0.
- 没有改变依赖项。
从这个补丁来看，没有明显的错误风险。关于如何进一步提高代码质量的建议包括：
- 如果可能的话，在更新库的版本时，请查看官方文档，以了解所有新特性和已知问题。
- 如果对应用程序的其他部分有任何影响，则进行全面测试，以确保没有引入新问题。
| @@ -1,6 +1,6 @@ | |||
| [package] | |||
| name = "chat_gpt" | |||
| version = "0.0.7" | |||
| version = "1.0.0" | |||
| description = "ChatGPT-Desktop" | |||
| authors = ["orangelckc", "bilibili-ayang"] | |||
| license = "MIT" | |||
There was a problem hiding this comment.
这段代码是针对一个名为 "chat_gpt" 的包进行版本控制和描述等的设置。从代码看来，这里将原先的版本号 "0.0.7" 更新为了 "1.0.0"。除此之外，其中还有作者和许可证信息的设置。目前代码看上去没有发现明显的问题或潜在风险，建议可以提交更新。
|
|
||
| onMounted(async () => { | ||
| appName.value = await getName() | ||
| }) | ||
| </script> | ||
|
|
||
| <template> |
There was a problem hiding this comment.
这段代码主要实现了一个基于multiavatar库的头像组件，并引入了@tauri-apps/api/app中的getName函数来获取应用程序名称。以下是一些关于此代码段的潜在问题和改进建议：
- 由于该应用程序使用了引入的多个库，因此需要确保这些库都是最新版本，以避免不必要的漏洞风险。
- 在computed函数中使用了props.value参数，需要确保传递到组件的值符合预期，否则可能导致意外行为。
- 如果无法获得应用程序名称，则会导致头像计算出错。可以考虑添加错误处理或默认值。
- onMounted钩子用于在挂载后异步获取应用程序名称。但是请注意，在获取之前组件可能渲染。可以考虑添加加载状态或使用v-if等条件性渲染。
- 可以考虑为头像组件添加更多属性，例如尺寸、形状、颜色等，以增强其可定制性。
- 对于性能优化，可以尝试将多次调用的multiAvatar函数结果缓存起来，以避免重复计算。
希望这些反馈对您有所帮助。
| <span class="text-gray text-xs">{{ calcToken(item) }}</span> | ||
| <span class="text-gray text-xs" v-if="isTokenUsage"> | ||
| {{ calcToken(item) }} | ||
| </span> | ||
| </div> | ||
| <div | ||
| class="relative flex w-[calc(100%-8rem)] flex-col gap-2" |
There was a problem hiding this comment.
这段代码的修改没有明显的错误风险，但可以提出以下改进建议：
-
可以为代码中新增的变量
isTokenUsage提供一个更清晰的命名，以便于其他开发人员理解其作用。 -
在对
sessionDataList和currentSession进行 watch 时，可以考虑添加更具体的监听事件，以减少不必要的计算。 -
可以尝试使用模板字符串等语法糖来组织代码，使其更加简洁易读。例如，将
class="relative flex w-[calc(100%-8rem)] flex-col gap-2"改写为:class="relative flex w-[calc(100% - ${width}px)] flex-col gap-2"。
总体而言，这段代码风格良好，逻辑清晰，并且没有明显的潜在错误。
| > | ||
| <img src="@/assets/image/qq.png" width="32" /> | ||
| QQ群 | ||
| </a> | ||
| </div> | ||
|
|
||
| <div class="flex flex-col gap-3" v-if="contributors.length"> |
There was a problem hiding this comment.
这段代码的主要功能是在网页中添加一些链接和按钮，同时增加了一个复制信息和复制QQ群号的功能。以下是我的一些建议:
-
copyInfo函数在写完文件后没有进行错误处理，应该在函数最后添加 try-catch 语句来捕获错误并输出错误信息。 -
Message.success函数没有找到定义，可能是自定义的组件或者库里的函数，需要查看其实现来确定其是否存在潜在问题。 -
copyQQGroup函数只简单地将群号复制到剪贴板中，没有提供任何反馈或者指导用户如何加入群组。可以考虑使用window.open()函数打开 QQ 群组页面。 -
对于
<a>标签中的文字内容，建议使用可描述性的文本，而非简单的“复制信息”。这样可以使得用户更容易理解这个链接的作用，并且也是无障碍设计的基本要求之一。 -
对于
<img>标签中的alt属性，应该添加适当的说明文本，以确保无障碍性和搜索引擎优化。 -
在第65行的
<div>标签中，建议在class属性中添加flex-wrap来确保元素能够正确地换行。 -
最后，建议添加注释来帮助其他开发人员更好地理解代码，例如函数的作用和参数等。
| 填写代理地址后，请点击<span class="mark cursor-pointer" @click="refresh" | ||
| >重启</span | ||
| > | ||
| </span> | ||
| </li> | ||
|
|
||
| <li v-show="proxy.bypass"> |
There was a problem hiding this comment.
这段代码主要是一个Vue组件的代码片段，它从一个名为settingsStore的对象中获取一些设置，同时还包括切换主题和重新加载页面的函数。
在模板中，这个组件渲染了一个开关控件，用于启用或禁用代理。如果启用代理，则会显示一个提示，告诉用户需要填写代理地址并点击“重启”按钮才能使代理生效。
对于这段代码的代码审查和改进建议，建议考虑以下几点：
storeToRefs()方法没有引入，可能是自定义的方法，需要进一步确认实现细节和是否存在潜在风险。- 在
<template>标签下方的JavaScript代码中，需要添加export default {...}导出组件。 - 组件名称应该以大写字母开头，符合Vue组件命名规范。
- 在生成带有参数的URL时，建议使用encodeURIComponent()函数处理参数，以防止特殊字符造成的问题。
- 在提示用户重启代理时，建议使用更明确的文本，例如“保存更改后，请重新加载页面才能使代理生效。”
|
|
||
| <li> | ||
| <i>Token 用量:</i> | ||
| <a-switch v-model="isTokenUsage" type="round" /> | ||
| </li> | ||
|
|
||
| <li> |
There was a problem hiding this comment.
这段代码的功能是使用Vue.js框架实现一个交互式设置页面。以下是我的代码审查建议：
- 代码补丁中的第一部分没有问题。
- 建议添加注释和文档来描述watch函数中的逻辑。
- 没有看到storeToRefs()函数被定义，它可能是自定义函数或来自于其他库或框架，需要确保其正确性。
- 建议添加类型注释来指定变量和函数的数据类型。
- 在第6行中，推荐使用const关键字声明totalCredit和usedCredit变量，因为它们在整个组件中都没有重新赋值。
- 第8-14行代码可以优化成一个计算属性(computed property)。
- 第16行代码中，推荐使用template字面量(template literals)来包含多行文本内容。
- 第22行代码中，建议使用模板字符串(template string)来将变量与字符串拼接起来。
- 第38-44行代码可以使用v-for循环来更简洁地实现列表渲染。
以上是我的代码审查建议，希望能对你有所帮助。
| const db = await Database.load( | ||
| `sqlite:${await configDir()}/${import.meta.env.VITE_CONFIG_PATH}/${dbFile}` | ||
| ) | ||
| const db = await Database.load(`sqlite:${await appConfigDir()}/${dbFile}`) | ||
|
|
||
| /** | ||
| * sql 的字符串参数需要在加一个冒号 |
There was a problem hiding this comment.
这段代码看起来比较简单，有以下一些改进和潜在风险：
- 改进：变量名称
configDir被更改为appConfigDir，这使得代码更加清晰易懂。 - 风险：没有检查数据库文件是否存在。如果文件不存在，则会自动创建它。这可能会导致无法访问的问题。
- 改进：使用一个
.env文件跟踪不同的环境，并且根据当前的 dev/prod 环境来选择合适的数据库文件。这个实现方式很好。 - 风险：没有捕获数据库加载错误的异常。如果出现问题，程序可能会崩溃。可以考虑添加一些异常处理来提高代码的健壮性。
总体而言，这段代码看起来符合预期，但是可以通过添加更多的异常处理来提高代码的稳定性。
| @@ -147,7 +151,8 @@ export const useSettingsStore = defineStore( | |||
| 'isMemory', | |||
| 'isRememberPosition', | |||
| 'proxy', | |||
| 'modalParams' | |||
| 'modalParams', | |||
| 'isTokenUsage' | |||
| ] | |||
| } | |||
| } | |||
There was a problem hiding this comment.
这段代码中，定义了一个名为 useSettingsStore 的 export const。该函数返回一个包含多个属性的对象。
首先，这个函数使用 defineStore 方法来创建一个响应式仓库。在该仓库中，有多个状态变量和方法：
isMemory、isRememberPosition、proxy、modalParams和isTokenUsage五个响应式状态变量。setMemory、setRememberPosition、setProxy、setModalParams和toggleTheme五个修改状态变量的方法。resetAll方法将所有状态变量重置为默认值。registerKey和unregisterAll是用于绑定和解绑快捷键的方法。toJSON方法会将所有状态变量转成 JSON 格式，并返回一个新对象。其中，isMemory、isRememberPosition、proxy和modalParams四个状态变量被包含在结果中。
需要注意的是，在函数的第一部分，添加了一个新的响应式状态变量 isTokenUsage。该变量的初始值为 false。此外，modalParams 对象也新增了一个属性 max_tokens，其初始值为 2000。
整体来看，代码逻辑较为简单，没有明显的 bug 风险。如果想要改进的话，可以考虑为每个状态变量编写对应的 getter 和 setter 方法，增强代码的可读性和可维护性。
| @@ -37,7 +37,7 @@ export const getOpenAIKey = () => { | |||
| const { apiKey } = useSettingsStore() | |||
|
|
|||
| if (!apiKey) { | |||
| Message.warning('请先填写 OpenAi API Key') | |||
| Message.warning('请先填写 OpenAi API KEY') | |||
| return false | |||
| } | |||
|
|
|||
There was a problem hiding this comment.
这段代码看起来是用于处理文本数据的。代码中使用了一个叫做"gpt3-tokenizer"的库，用于对文本进行分词处理。
在代码审查方面，似乎没有特别大的安全风险。不过可以注意到第37行的警告信息有个拼写错误，将"KEY"写成了"Key"。可能需要修正一下。
同时，可以建议增加一些注释或者函数命名等方式，以提高代码可读性。比如说，在函数getOpenAIKey中，不太清楚变量useSettingsStore具体是从哪里引入的。如果有注释或者较为详细的函数命名会更好。
| message(errorMessage, { | ||
| title: import.meta.env.VITE_APP_NAME, | ||
| title: appName, | ||
| type: 'error' | ||
| }) | ||
| } |
There was a problem hiding this comment.
这段代码看起来没有明显的错误风险。下面是一些建议：
-
函数
dialogErrorMessage似乎只用到了@tauri-apps/api/dialog和@tauri-apps/api/app这两个模块中的函数。因此，可以考虑将这些导入语句移到函数内部，以减少不必要的全局导入。 -
如果
dialogErrorMessage函数中的错误信息需要进行国际化处理，可以考虑引入国际化库并使用相应的 API 来输出本地化的错误信息。 -
对于
getName()函数，应该注意其是否会返回null或者其他非预期的值。如果可能存在这种情况，需要添加必要的错误处理，例如抛出异常或者使用默认值等。
希望对你有所帮助，祝你编码愉快！
No description provided.