Feat: 显示插件列表时可选隐藏前缀 #1681
Closed
Feat: 显示插件列表时可选隐藏前缀 #1681
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ExtensionMarketplace.vue 组件的更新类图classDiagram
class ExtensionMarketplace {
<<VueComponent>>
+showPluginFullName: boolean
+pluginMarketData: Plugin[]
+trimExtensionName(): void
+getPluginMarket(): void
+getExtensions(): void
}
class Plugin {
<<DataStructure>>
+name: string
+trimmedName: string
+desc: string
+author: string
+stars: number
+updated_at: string
+tags: string[]
+repo: string
+logo: string
+installed: boolean
}
ExtensionMarketplace "1" -- "*" Plugin : uses
MessageStat.vue 组件的更新类图classDiagram
class MessageStat {
<<VueComponent>>
+chartOptions: Object
+fetchData(): void
+updateChartData(): void
}
class CustomizerStore {
+uiTheme: string
}
MessageStat ..> CustomizerStore : uses (for chartOptions.tooltip.theme)
文件级别更改
提示和命令与 Sourcery 互动
自定义您的体验访问您的 dashboard 以：
获得帮助
Original review guide in EnglishReviewer's GuideImplements an extension name trim feature in the marketplace view and applies a set of minor UI, theming, and import-path fixes across multiple components. Sequence Diagram for Populating and Processing Plugin Market DatasequenceDiagram
participant ExtensionMarketplaceVue as Component
participant CommonStoreService as DataService
participant PluginMarketDataArray as "Component.pluginMarketData"
ExtensionMarketplaceVue->>DataService: getPluginCollections()
activate DataService
DataService-->>ExtensionMarketplaceVue: rawPluginData
deactivate DataService
ExtensionMarketplaceVue->>ExtensionMarketplaceVue: this.pluginMarketData = rawPluginData
ExtensionMarketplaceVue->>PluginMarketDataArray: Calls trimExtensionName()
activate PluginMarketDataArray
loop For each plugin in pluginMarketData
PluginMarketDataArray->>PluginMarketDataArray: Read plugin.name
PluginMarketDataArray->>PluginMarketDataArray: Apply trimming logic (e.g., remove "astrbot_plugin_")
PluginMarketDataArray->>PluginMarketDataArray: Set plugin.trimmedName
end
deactivate PluginMarketDataArray
ExtensionMarketplaceVue->>ExtensionMarketplaceVue: Uses processed pluginMarketData for display (conditionally showing name or trimmedName based on showPluginFullName)
Updated Class Diagram for ExtensionMarketplace.vue ComponentclassDiagram
class ExtensionMarketplace {
<<VueComponent>>
+showPluginFullName: boolean
+pluginMarketData: Plugin[]
+trimExtensionName(): void
+getPluginMarket(): void
+getExtensions(): void
}
class Plugin {
<<DataStructure>>
+name: string
+trimmedName: string
+desc: string
+author: string
+stars: number
+updated_at: string
+tags: string[]
+repo: string
+logo: string
+installed: boolean
}
ExtensionMarketplace "1" -- "*" Plugin : uses
Updated Class Diagram for MessageStat.vue ComponentclassDiagram
class MessageStat {
<<VueComponent>>
+chartOptions: Object
+fetchData(): void
+updateChartData(): void
}
class CustomizerStore {
+uiTheme: string
}
MessageStat ..> CustomizerStore : uses (for chartOptions.tooltip.theme)
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
嘿 @Kwicxy - 我已经查看了你的更改，它们看起来很棒！
这是我在审查期间查看的内容
- 🟡 一般问题：发现 6 个问题
- 🟢 安全性：一切看起来都不错
- 🟢 测试：一切看起来都不错
- 🟢 复杂性：一切看起来都不错
- 🟢 文档：一切看起来都不错
帮助我更有用！请点击每个评论上的 👍 或 👎，我将使用反馈来改进你的评论。
Original comment in English
Hey @Kwicxy - I've reviewed your changes and they look great!
Here's what I looked at during the review
- 🟡 General issues: 6 issues found
- 🟢 Security: all looks good
- 🟢 Testing: all looks good
- 🟢 Complexity: all looks good
- 🟢 Documentation: all looks good
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
| console.log(this.pluginMarketData); | ||
| this.pluginMarketData.forEach(plugin => { | ||
| if (plugin.name) { | ||
| let name = plugin.name.trim().toLowerCase(); |
There was a problem hiding this comment.
问题： 将修剪后的插件名称转换为小写会丢失原始大小写
仅使用小写进行前缀检测，然后从原始名称中切片以在 trimmedName 中保留正确的大小写。
Original comment in English
issue: Lowercasing trimmed plugin names loses original casing
Use lowercase only for prefix detection, then slice from the original name to keep the correct casing in trimmedName.
| <v-col cols="12" md="12" style="padding: 0px;"> | ||
| <v-data-table :headers="pluginMarketHeaders" :items="pluginMarketData" item-key="name" | ||
| :loading="loading_" v-model:search="marketSearch" :filter-keys="filterKeys"> | ||
| <template v-slot:item.name="{ item }"> | ||
| <div class="d-flex align-center" style="overflow-x: scroll;"> | ||
| <div class="d-flex align-center" style="overflow-x: auto; scrollbar-width: thin; scrollbar-track-color: transparent;"> |
There was a problem hiding this comment.
问题： 跨浏览器滚动条样式属性是非标准的
这些属性的浏览器支持有限。为了更广泛的兼容性，请使用带有供应商前缀的伪元素或更通用的解决方案。
Original comment in English
issue: Cross-browser scrollbar styling properties are non-standard
These properties have limited browser support. For broader compatibility, use vendor-prefixed pseudo-elements or a more universal solution.
| }}</v-chip> | ||
| <span v-if="item.tags.length === 0">-</span> | ||
| <v-chip v-for="tag in item.tags" :key="tag" color="primary" size="x-small"> | ||
| {{ tag }}</v-chip> | ||
| </template> |
There was a problem hiding this comment.
问题： 仅包含图标的按钮缺少可访问的标签
请添加一个可访问的标签，例如 aria-label、v-tooltip 或可见文本，以确保屏幕阅读器可以识别按钮的用途。
Original comment in English
issue: Icon-only buttons lack accessible labels
Please add an accessible label, such as an aria-label, v-tooltip, or visible text, to ensure screen readers can identify the button's purpose.
| @@ -129,7 +130,7 @@ export default { | |||
| } | |||
| }, | |||
| tooltip: { | |||
| theme: 'light', | |||
| theme: useCustomizerStore().uiTheme==='PurpleTheme' ? 'light' : 'dark', | |||
There was a problem hiding this comment.
问题（bug 风险）： 工具提示主题属性对主题更改无反应
将主题选择逻辑移至计算属性或观察程序中，以确保工具提示在 uiTheme 更改时更新。
Original comment in English
issue (bug_risk): Tooltip theme prop not reactive to theme changes
Move the theme selection logic into a computed property or watcher to ensure the tooltip updates when uiTheme changes.
| this.checkAlreadyInstalled(); | ||
| this.checkUpdate() | ||
| }); | ||
| }, | ||
|
|
||
| trimExtensionName() { | ||
| console.log(this.pluginMarketData); |
There was a problem hiding this comment.
吹毛求疵： 删除剩余的调试 console.log
应删除实用程序方法中的调试日志或使用调试标志进行控制，以避免使生产输出混乱。
Original comment in English
nitpick: Remove leftover debugging console.log
Debug logs in utility methods should be removed or controlled with a debug flag to avoid cluttering production output.
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | ||
| localStorage.setItem("uiTheme", "PurpleTheme"); | ||
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 |
There was a problem hiding this comment.
吹毛求疵： 关于动态默认主题的剩余 TODO
请通过实施动态主题检测或在问题中跟踪它来解决此 TODO，然后删除内联注释。
Original comment in English
nitpick: Leftover TODO about dynamic default theme
Please address this TODO by either implementing dynamic theme detection or tracking it in an issue, then remove the inline comment.
Comment on lines
13
to
16
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | ||
| localStorage.setItem("uiTheme", "PurpleTheme"); | ||
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 | ||
| return 'PurpleTheme'; | ||
| } else return theme; |
There was a problem hiding this comment.
建议（代码质量）： 对 ifs、whiles 等使用块花括号（use-braces）
Suggested change
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | |
| localStorage.setItem("uiTheme", "PurpleTheme"); | |
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 | |
| return 'PurpleTheme'; | |
| } else return theme; | |
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | |
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 | |
| return 'PurpleTheme'; | |
| } else { | |
| return theme; | |
| } | |
解释
建议始终使用花括号并创建显式语句块。使用允许的语法仅编写单个语句可能会导致非常混乱的情况，尤其是在随后开发人员可能会添加另一个语句而忘记添加花括号的情况下（这意味着这不会包含在条件中）。
Original comment in English
suggestion (code-quality): Use block braces for ifs, whiles, etc. (use-braces)
Suggested change
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | |
| localStorage.setItem("uiTheme", "PurpleTheme"); | |
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 | |
| return 'PurpleTheme'; | |
| } else return theme; | |
| if (!theme || !(['PurpleTheme', 'PurpleThemeDark'].includes(theme))) { | |
| localStorage.setItem("uiTheme", "PurpleTheme"); // todo: 这部分可以根据vuetify.ts的默认主题动态调整 | |
| return 'PurpleTheme'; | |
| } else { | |
| return theme; | |
| } | |
Explanation
It is recommended to always use braces and create explicit statement blocks.Using the allowed syntax to just write a single statement can lead to very confusing
situations, especially where subsequently a developer might add another statement
while forgetting to add the braces (meaning that this wouldn't be included in the condition).
|
记得把暗黑主题的issue close了 |
Damn!怎么没赶上release |
Kwicxy
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Motivation
插件市场表格中 插件名称字段过长 一堆滚动条的话不好看
考虑对插件名称中的固定前缀部分（astrbot_plugin_）在显示时进行删减以改善可读性
Modifications
ExtensionMarketplace.vue:
showPluginFullName字段控制是否显示完整名称trimExtensionName()方法对前缀进行删减，新增键trimmedName，不修改原name显示完整名称按钮用于切换其他：
Check
requirements.txt和pyproject.toml文件相应位置。Sourcery 总结
在插件市场中，可以裁剪扩展名称中固定的前缀，并提供一个开关来切换显示完整名称。同时，对仪表盘组件进行了一些小的 UI 和主题增强。
新功能：
增强：
Original summary in English
Summary by Sourcery
Trim fixed prefixes from extension names in the plugin marketplace with a toggle for full names, and apply minor UI and theming enhancements across dashboard components.
New Features:
Enhancements: