feat(BlueprintLibrary): add ability to search by description - AB-852 #1259
Conversation
📝 WalkthroughWalkthroughThe search functionality in BuilderSidebarToolkit.vue has been enhanced to filter tools by both name and description (case-insensitive) rather than name alone. This applies to both the Shared Blueprints branch and general toolkit branch, preserving existing query handling and sorting behavior. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Suggested reviewers
Poem
Pre-merge checks✅ Passed checks (5 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Jira integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
src/ui/src/builder/sidebar/BuilderSidebarToolkit.vue
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (8)
- GitHub Check: build (3.12)
- GitHub Check: build (3.10)
- GitHub Check: build (3.13)
- GitHub Check: build (3.11)
- GitHub Check: build (3.9)
- GitHub Check: tests (firefox)
- GitHub Check: tests (chromium)
- GitHub Check: tests (webkit)
🔇 Additional comments (1)
src/ui/src/builder/sidebar/BuilderSidebarToolkit.vue (1)
274-279: LGTM! Search by description implemented correctly for Shared Blueprints.The filter logic correctly matches both name and description with case-insensitive comparison. The description fallback at line 263 ensures no undefined values.
| .filter( | ||
| (tool) => | ||
| !q || | ||
| tool.name.toLocaleLowerCase().includes(q) || | ||
| tool.description.toLocaleLowerCase().includes(q), | ||
| ) |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
echo "=== Searching for getComponentDefinition implementation ==="
rg -n "getComponentDefinition" -A 8 -B 2 | head -100
echo ""
echo "=== Searching for component definition types ==="
rg -n "ComponentDefinition|interface.*Component|type.*Component" -A 5 | head -150Repository: writer/writer-framework
Length of output: 16981
🏁 Script executed:
#!/bin/bash
echo "=== Reading BuilderSidebarToolkit.vue around lines 300-320 ==="
sed -n '300,320p' src/ui/src/builder/sidebar/BuilderSidebarToolkit.vue
echo ""
echo "=== Searching for getComponentDefinition implementation in writer framework ==="
rg -n "getComponentDefinition.*=" -A 15 | grep -v ".spec" | head -150
echo ""
echo "=== Checking ComponentDefinition TypeScript type ==="
fd -e "ts" -e "tsx" -e "d.ts" | xargs rg -l "interface.*ComponentDefinition|type.*ComponentDefinition" | head -5Repository: writer/writer-framework
Length of output: 7301
🏁 Script executed:
#!/bin/bash
echo "=== Reading more of BuilderSidebarToolkit.vue to see typeList source ==="
sed -n '275,320p' src/ui/src/builder/sidebar/BuilderSidebarToolkit.vue
echo ""
echo "=== Searching for wf.getComponentDefinition implementation ==="
fd -e ts -e tsx | xargs rg -l "export.*getComponentDefinition|getComponentDefinition\s*=" | grep -v spec | grep -v node_modules
echo ""
echo "=== Looking at the wf object initialization ==="
rg -n "getComponentDefinition" src/ui/src/main.ts -A 2 -B 2Repository: writer/writer-framework
Length of output: 1657
🏁 Script executed:
#!/bin/bash
echo "=== Searching for getComponentDefinition in templateMap.ts ==="
cat src/ui/src/core/templateMap.ts
echo ""
echo "=== Searching for getSupportedComponentTypes definition ==="
rg -n "getSupportedComponentTypes" -A 5 -B 2 | head -50
echo ""
echo "=== Checking writerTypes.ts for ComponentDefinition interface ==="
rg -n "interface.*ComponentDefinition|type.*ComponentDefinition" -A 20 src/ui/src/writerTypes.tsRepository: writer/writer-framework
Length of output: 15309
Address TypeScript type safety and add defensive checks for description property.
The code accesses tool.description at line 314 without verifying it exists. While getComponentDefinition() is typed to return a WriterComponentDefinition with a required description: string, the actual implementation can return undefined due to optional chaining (getTemplate(type)?.writer). This type mismatch creates a maintenance risk.
Add optional chaining or a null check when destructuring the definition at line 305:
const { name, description = "", category } = getComponentDefinition(type) ?? {};Or check whether getComponentDefinition result exists before destructuring properties, matching the defensive pattern already used elsewhere in the codebase (e.g., useFieldsErrors.ts line 37).
🤖 Prompt for AI Agents
In src/ui/src/builder/sidebar/BuilderSidebarToolkit.vue around lines 305 to 315,
the code destructures getComponentDefinition(type) without guarding for
undefined and then accesses tool.description in the filter, which can be
undefined; update the destructuring to safely handle a missing definition (e.g.,
assign from getComponentDefinition(type) ?? {} and default description to an
empty string or perform an explicit null check before destructuring) so that
description is always a string when used in the .filter and avoid runtime
errors.
HackerOne Code Security Review🟢 Scan Complete: 1 Issue(s) Here's how the code changes were interpreted and info about the tools used for scanning. 📖 Summary of ChangesThe modification enhances search functionality within the BuilderSidebarToolkit component, extending filtering capabilities to include tool descriptions. This update enables more comprehensive search results across different blueprint categories, potentially improving user experience by allowing more nuanced and detailed component discovery.
ℹ️ Issues DetectedNOTE: These may not require action! Below are unvalidated results from the Analysis Tools that ran during the latest scan for transparency. We investigate each of these for accuracy and relevance before surfacing them as a potential problem. How will I know if something is a problem?
🧰 Analysis tools
⏱️ Latest scan covered changes up to commit 207c545 (latest) |
|
✅ Graham C reviewed all the included code changes and associated automation findings and determined that there were no immediately actionable security flaws. Note that they will continue to be notified of any new commits or comments and follow up as needed throughout the duration of this pull request's lifecycle.
Reviewed with ❤️ by PullRequest |
|
Due to inactivity, PullRequest has cancelled this review job. You can reactivate the code review job from the PullRequest dashboard. |
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.