feat: Add search capability to the ListPane component to allow users to filter resources, prompts and tools #727
Conversation
…s it for - Resources - Prompts - Tools
There was a problem hiding this comment.
Hi @cameronldroberts thanks for the PR! I tested this locally and it works great, except for one glitch I noticed in narrower columns/panes like in the Resources tab. When I test with the Everything demo server using npx -y @modelcontextprotocol/server-everything@latest and click on the magnifying glass for one of the Resources columns, the search text box overlaps with the heading on the pane. Is there a way we could make the background of the search box not transparent perhaps? Other than that I didn't notice any issues, and it might vary based on resolution.
|
Hey! Thanks for the review. Sorry I didn't notice that, I have my windows quite zoomed out so never noticed it, my bad. I'll try take a look at that today. Thanks |
There was a problem hiding this comment.
I like this functionality, definitely an improvement and will be useful for servers with many tools, resources, and prompts.
I just have a reservation about the search methodology. Currently, you're stringifying the object and searching that, and it can lead to some weird and unexpected results.
For instance, in this case, Resources 1-9 are loaded and entering the number 9 in the search box filters it to Resource 2, 4, 6, 8, and 9. Puzzled about it I eventually realized it was a number in the blob string.
Or here, the letter 'v' is matching 'server', 'validation', 'favorite', and 'provide' in the descriptions. Only one title has a 'v' in it (printEnv).
I think there's less value in searching the entire object than just searching the name field, which all these primitives have. I think it would be less confusing why an item remains in the list.
cliffhall
added
the
waiting on submitter
olaservo
added
waiting on submitter
This PR adds the ability for the user to search their different types of resources they might get back from their MCP server. For example they may want to search on a particular tool name or description and this PR allows them to do that.
Motivation and Context
After using the tool I was finding myself wanting to search for particular tools and I wasn't able to do that. When the MCP server exposes a number of tools it isn't able to render them all on screen so it required me to scroll through them to find the one I was looking for.
This was mainly because I wanted to quickly navigate the tools but as the ListPane tile is used for the other types as well I figured it would be a good place to add the search so it can be used for those types as well.
How Has This Been Tested?
I have tested this by spinning up a dummy MCP server using fastMCP and connecting my MCP inspector to it. This all worked fine and I was able to filter down the results I got back based on my search string. I've attached a screen recording so that you can see this in action. As well as the manual testing I added some UT to cover the new functionality, this component did not have it's own test suite so I've added that with some basic rendering tests as well.
inspector-search-sr.mov
Breaking Changes
Types of changes
Checklist
Additional context
This could be extended to add additional filtering options and/or the ability to control the ordering that the results get displayed. I'm not sure how much additional value that would add so I've not added it as part of this PR but happy to re-visit if people think it's worth doing.