feat: add GPT3Tokenizer #90

[orangelckc]

No description provided.

[orangelckc]

目前只做了实时计算+显示，还需要再超过token限制时，给用户提示的交互设计，我没什么思路，可以讨论看看 @bilibili-ayang @l1m2e

[ayangweb]

这个代码补丁增加了一个新的依赖项"gpt3-tokenizer"。代码本身没有看到任何明显的问题或潜在风险，但是我们建议确保这个新依赖项与现有依赖项兼容，并且它没有引入不必要的安全漏洞。如果可以，建议使用版本控制来跟踪这些依赖项的变化，并对代码进行自动测试以确保其正确性。

[ayangweb]

这段代码的更改主要是在依赖中添加了一个名为"gpt3-tokenizer"的包，并将tauri-plugin-store-api更新到了最新版本"d21d55684ad444d8cba322f0013e1b2b7e0630a7"。其他更改似乎只是升级了一些依赖的版本。

关于"gpt3-tokenizer"包，它的版本为1.1.5，引擎要求Node.js版本必须大于等于12。它还依赖于"array-keyed-map"包，版本为2.1.3。

总体来说，这个代码补丁看起来没有明显的错误风险。如果你想提出改进建议，可以考虑添加更详细的注释，以使代码更易于理解和维护。

[ayangweb]

这段代码中有一些问题：

1. sessionDataList变量被定义了两次，需要删除其中一个。
2. getOpenAICreditApi方法没有返回任何值，需要添加返回类型。
3. getAiMessage方法有很多不必要的代码和逻辑。比如，使用useSessionStore()和useSettingsStore()的方式不正确。此外，在处理过程中存在重复的逻辑和未定义的变量等问题。
4. getOpenAIKey方法中，当apiKey和VITE_OPEN_AI_API_KEY都不存在时，会显示警告信息并返回false。但是，警告信息没有指定位置，并且没有提供足够的上下文信息。

以下是一些改进建议：

1. 删除多余或不必要的代码和逻辑。
2. 在处理错误时，应该提供更详细的错误信息，以便更容易地找到问题。
3. 尽可能使用传统的函数调用方式而不是Vue组件式API。
4. 在所有方法中添加参数类型和返回类型。
5. 确保所有依赖项都已正确导入。

最后，需要注意的是，这只是对代码的简要检查，可能还有其他潜在的问题或错误。

[ayangweb]

这段代码的主要功能是在聊天界面上方显示预估将要消耗的 token 数量。以下是我的建议和注意事项：

• 在 watch 中异步调用 getMemoryList() 可能会导致性能问题，建议使用 computed 来缓存记忆列表。
• 在 watch 中计算 token 数量可能会频繁触发，建议使用 debounce 或者 throttle 来减少计算次数。
• 变量命名不太规范，例如 memroyList 应该改为 memoryList。
• 变量定义时最好初始化一个默认值，例如 const tokenUsage = ref(0)。
• 在模板中，可以将 v-if 移到外层元素上，这样可以避免渲染无用的 DOM 元素。例如：

<div v-if="textAreaValue.length || isMemory" class="function text-6 relative flex justify-end">
  <div v-if="textAreaValue.length" class="left-1/5 text-4 -translate-1/2 absolute top-1/2">
    {{ isMemory ? '记忆模式:' : '' }}预计消耗 {{ tokenUsage }} TK
  </div>
  <!-- ... -->
</div>

[ayangweb]

这段代码主要是一个聊天应用中的一些功能实现。以下是我的建议：

• 第 2 行和第 3 行的导入语句应该按照字母顺序排列，以提高可读性。
• 第 4 行的 MarkdownIt 库应该使用 const 声明，因为它不会被重新分配。
• 第 5 行的 MarkdownItHighlight 库应该使用 const 声明，因为它不会被重新分配。
• 第 6 行的类型导入应该放在其他导入的下面，并且应该按字母顺序排列。
• 第 7 行的 estimateTokens 函数应该使用 const 声明，因为它不会被重新分配。
• 第 12 行的 handleScroll 函数应该使用 const 声明，因为它不会被重新分配。
• 第 16 行的 calcToken 函数应该使用 const 声明，因为它不会被重新分配。
• 在 calcToken 函数中，可以尝试使用更具体的类型而不是 any 类型来描述 item 参数和 sessionDataList 中的数据类型，以避免潜在的类型错误。
• 在 calcToken 函数中，如果无法解决类型问题，则可以考虑将其转换为 JavaScript 函数并在调用时忽略 TypeScript 错误。
• 在第 28 行中，应该考虑使用模板字符串来构建返回值，以提高代码可读性。
• 第 30 行中的 is_memory 属性应该使用 === 进行比较，以避免类型转换错误。
• 在第 46 行中，Avatar 组件应该使用 const 声明，因为它不会被重新分配。
• 在第 51 行中，可以考虑使用模板字符串来构建返回值，以提高代码可读性。
• 在第 56 行中，class 属性应该使用模板字符串来计算动态类名，以提高代码可读性。

[ayangweb]

这段代码看起来很简短，只是在一个导出语句中添加了一个新的模块 openai。

由于我无法查看 openai 模块的实现，因此我无法判断是否存在潜在的错误风险。但是，我可以提供一些一般性的建议：

• 确保 openai 模块已经通过单元测试和集成测试，以确保其正确性和稳定性。
• 如果你是团队中的唯一开发者，请确保其他人知道你添加了这个新模块。如果有多个开发者，最好使用源代码管理工具（如 Git）来跟踪更改。
• 如果这个模块与其他模块有依赖关系，请确保你更新了所有需要更新的依赖项。
• 如果这个模块是公共模块，并且将被其他人使用，请确保文档和注释清晰明了，以便其他人能够理解它的用途和如何使用它。

希望这些建议能对你有所帮助！

[ayangweb]

这段代码主要实现了一个与OpenAI交互的聊天机器人。以下是我的简要代码审查：

• 第2行：MessageData和SessionData类型似乎未在此文件中定义。
• 第4-6行：引入了GPT3Tokenizer，用于将字符串编码为token。
• 第9-15行：estimateTokens函数使用GPT3Tokenizer对输入字符串进行编码，并返回所需的token数量。
• 第18-37行：getMemoryList函数从数据库中获取最近5条消息，以便在聊天历史记录中显示。其中使用了useSettingsStore和useSessionStore两个自定义hook。
• 第40-55行：getOpenAIKey函数尝试从应用程序设置或环境变量中获取OpenAI API密钥，并向用户发出警告消息，如果无法找到API密钥。
• 第58-91行：getAiMessage函数实现了聊天机器人的主要逻辑。它处理用户输入并调用OpenAI API以生成回复消息。它还添加了角色描述和记忆列表，并将所有消息存储在会话数据中。该函数使用了多个自定义hook，包括useRoleStore、useSessionStore和storeToRefs。
• 第93-95行：export语句导出了getOpenAIKey函数。
• 第97-101行：export语句导出了getAiMessage函数。

这段代码看起来比较清晰，但是需要注意以下几点：

• 第2行中未定义的类型需要在代码库的其他文件中定义。
• 该代码使用了多个自定义hook。如果这些hook不正确地实现或使用，可能会导致代码出现问题。
• 没有提供足够的注释和文档来帮助其他开发人员理解这段代码的目的和实现方式。
• 该代码似乎没有进行单元测试，因此可能存在潜在的错误和漏洞。