fix(webui): unify search input clear behavior#6017
fix(webui): unify search input clear behavior#6017Soulter merged 2 commits intoAstrBotDevs:masterfrom
Conversation
dosubot
bot
added
the
size:S
Summary of ChangesHello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request unifies the behavior of search input fields throughout the web UI. The primary goal is to enhance user experience by providing a consistent and robust mechanism for clearing search queries, both visually through a clear button and programmatically by ensuring search logic correctly handles empty or null input states. Highlights
Changelog
Activity
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
dosubot
bot
added
the
area:webui
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hey - 我已经留下了一些总体反馈：
- 你在
CommandFilters.vue中引入了normalizeSearchQuery，但在其他地方则使用内联的(value || '')或typeof val === 'string' ? val : ''。建议将这种标准化逻辑集中到一个共享的工具函数中，或者至少在这些组件之间使用同一个辅助函数，以确保行为真正保持一致。
给 AI Agent 的提示
Please address the comments from this code review:
## Overall Comments
- You’ve introduced `normalizeSearchQuery` in `CommandFilters.vue` but elsewhere use inline `(value || '')` or `typeof val === 'string' ? val : ''`; consider centralizing this normalization in a shared utility or at least using the same helper across these components to keep the behavior truly consistent.帮我变得更有用！请在每条评论上点 👍 或 👎，我会根据你的反馈改进后续的代码审查。
Original comment in English
Hey - I've left some high level feedback:
- You’ve introduced
normalizeSearchQueryinCommandFilters.vuebut elsewhere use inline(value || '')ortypeof val === 'string' ? val : ''; consider centralizing this normalization in a shared utility or at least using the same helper across these components to keep the behavior truly consistent.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- You’ve introduced `normalizeSearchQuery` in `CommandFilters.vue` but elsewhere use inline `(value || '')` or `typeof val === 'string' ? val : ''`; consider centralizing this normalization in a shared utility or at least using the same helper across these components to keep the behavior truly consistent.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request enhances various search input fields across the dashboard, including command filters, model search, configuration search, knowledge base search, long-term memory search, and plugin search, by adding a clearable button. To prevent potential runtime errors where clearing an input could result in a null value being passed to functions expecting a string (e.g., .trim(), .toLowerCase()), the changes also introduce logic to normalize search queries to empty strings if they are null. The review comments highlight that adding clearable without explicit null handling for configSearchKeyword, and searchQuery in both KnowledgeBase.vue and LongTermMemory.vue could lead to crashes, recommending normalization to an empty string for these cases.
dashboard/src/views/ConfigPage.vue
Outdated
| @@ -16,6 +16,7 @@ | |||
| v-model="configSearchKeyword" | |||
There was a problem hiding this comment.
Adding clearable can cause configSearchKeyword to become null when the input is cleared. This is likely to cause a crash in the child component AstrBotCoreConfigWrapper if it doesn't handle null values for its search-keyword prop. To prevent this and to be consistent with other changes in this PR, you should normalize the cleared value to an empty string.
:model-value="configSearchKeyword"
@update:model-value="configSearchKeyword = $event ?? ''"
| @@ -356,7 +356,7 @@ | |||
| <v-text-field v-model="searchQuery" :label="tm('search.queryLabel')" | |||
There was a problem hiding this comment.
Adding clearable can cause searchQuery to become null, which will lead to a crash in searchKnowledgeBase when calling .trim(). To prevent this, you should handle the null value by normalizing it to an empty string.
<v-text-field :model-value="searchQuery" @update:model-value="searchQuery = $event ?? ''" :label="tm('search.queryLabel')"
| <v-text-field v-model="searchMemoryUserId" :label="tm('search.userIdLabel')" variant="outlined" density="compact" hide-details | ||
| class="mb-2"></v-text-field> | ||
| class="mb-2" clearable></v-text-field> | ||
| <v-text-field v-model="searchQuery" :label="tm('search.queryLabel')" variant="outlined" density="compact" hide-details |
There was a problem hiding this comment.
Adding clearable to this text field can cause searchQuery to become null, which will lead to a crash in searchMemory() when .trim() is called. To prevent this, you should handle the null value by normalizing it to an empty string.
<v-text-field :model-value="searchQuery" @update:model-value="searchQuery = $event ?? ''" :label="tm('search.queryLabel')" variant="outlined" density="compact" hide-details
|
@sourcery-ai review |
There was a problem hiding this comment.
Hey - 我在这里给出了一些整体性的反馈：
- 在多个组件中有相当多重复的
:model-value和@update:model-value="foo = normalizeTextInput($event)"绑定逻辑；可以考虑抽取一个小的可复用 composable 或封装组件，用于标准化搜索输入字段，以减少样板代码并保持行为一致。 - 在某些地方，你会在输入时做一次标准化，然后在真正使用这个值之前（例如 KnowledgeBase 和 LongTermMemory 中的
searchQuery）又做了一次标准化；你可以只在其中一层做标准化，从而避免重复调用，并让数据流更清晰。
给 AI Agents 的提示
Please address the comments from this code review:
## Overall Comments
- There’s quite a bit of repeated `:model-value` + `@update:model-value="foo = normalizeTextInput($event)"` wiring across components; consider extracting a small reusable composable or wrapper component for normalized search fields to reduce boilerplate and keep behavior consistent.
- In some places you normalize on input and again right before using the value (e.g. `searchQuery` in KnowledgeBase and LongTermMemory); you could simplify by relying on normalization in only one of those layers to avoid redundant calls and make the data flow clearer.帮我变得更有用！请在每条评论上点 👍 或 👎，我会根据这些反馈改进后续的代码评审。
Original comment in English
Hey - I've left some high level feedback:
- There’s quite a bit of repeated
:model-value+@update:model-value="foo = normalizeTextInput($event)"wiring across components; consider extracting a small reusable composable or wrapper component for normalized search fields to reduce boilerplate and keep behavior consistent. - In some places you normalize on input and again right before using the value (e.g.
searchQueryin KnowledgeBase and LongTermMemory); you could simplify by relying on normalization in only one of those layers to avoid redundant calls and make the data flow clearer.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- There’s quite a bit of repeated `:model-value` + `@update:model-value="foo = normalizeTextInput($event)"` wiring across components; consider extracting a small reusable composable or wrapper component for normalized search fields to reduce boilerplate and keep behavior consistent.
- In some places you normalize on input and again right before using the value (e.g. `searchQuery` in KnowledgeBase and LongTermMemory); you could simplify by relying on normalization in only one of those layers to avoid redundant calls and make the data flow clearer.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
* fix(webui): unify search input clear behavior * fix: centralize search input normalization
2 participants
统一webui搜索框清除行为，补充几处缺失
Modifications / 改动点
仅前端修改
dashboard/src/components/extension/componentPanel/composables/useCommandFilters.ts
dashboard/src/components/extension/componentPanel/index.vue
dashboard/src/components/provider/ProviderModelsPanel.vue
dashboard/src/composables/useProviderSources.ts
dashboard/src/views/ConfigPage.vue
dashboard/src/views/alkaid/KnowledgeBase.vue
dashboard/src/views/alkaid/LongTermMemory.vue
dashboard/src/views/extension/InstalledPluginsTab.vue
dashboard/src/views/extension/MarketPluginsTab.vue
Screenshots or Test Results / 运行截图或测试结果
Checklist / 检查清单
requirements.txt和pyproject.toml文件相应位置。/ I have ensured that no new dependencies are introduced, OR if new dependencies are introduced, they have been added to the appropriate locations inrequirements.txtandpyproject.toml.Summary by Sourcery
通过规范文本值并启用统一的可清除搜索字段，在多个 WebUI 视图中统一并强化搜索输入处理。
Bug Fixes:
null或非字符串值时，导致搜索和过滤逻辑出错的问题。Enhancements:
Original summary in English
Summary by Sourcery
Unify and harden search input handling across multiple WebUI views by normalizing text values and enabling consistent clearable search fields.
Bug Fixes:
Enhancements:
Bug 修复：
功能增强：
Original summary in English
Summary by Sourcery
通过规范文本值并启用统一的可清除搜索字段，在多个 WebUI 视图中统一并强化搜索输入处理。
Bug Fixes:
null或非字符串值时，导致搜索和过滤逻辑出错的问题。Enhancements:
Original summary in English
Summary by Sourcery
Unify and harden search input handling across multiple WebUI views by normalizing text values and enabling consistent clearable search fields.
Bug Fixes:
Enhancements: