Storybook: Better search

Created on 13 May 2020  路  13Comments  路  Source: storybookjs/storybook

Is your feature request related to a problem? Please describe.
Hi!

We have hundreds of components in our company's storybook, but we find that there are a lot of struggles when developers/designers are trying to find components that are relevant to them.
A common complaint during our quarterly dev survey ends up being "storybook is great, but really hard to search"

We use the custom story sort as we have a "UI" directory that we actually want to float to the top of our tree structure, as they represent our main shared component library (over say, product specific components)

However, we find that the current fuzzy search ends up being far noisier than we actually want, which means that some search queries end up being totally ineffective.

Some examples:
dropdown should ideally pop up our UI dropdown component, not a product specific one
image

button doesn't actually find button, and the accordion component doesn't seem to have anything that actually relates
image

Example, where we want to search for an "icon" but our actual icon component is at the bottom of the list
image

Describe the solution you'd like
I would like to opt-out of using the fuse fuzzy search library and implement our own search, picking and choosing the terms that we'd want to search on for each story as opposed to the defaults here https://github.com/storybookjs/storybook/blob/master/lib/ui/src/components/sidebar/treeview/utils.js#L154

Ideally, this would come in the form of a new storybook option to define my own filter function, with the note that we would have to handle our own memoization/performance.
This should more-or-less match the same function signature already provided, given a dataset and filter

Then, the custom storysort should also be provided a new parameter for filter to provide more information than just a, b in case we want to rank different search results based on the filtered value.

Describe alternatives you've considered
We've considered:

  • rolling our own "storybook" in house (but following the storybook api for compatibility)
  • renaming our stories to have more keywords/match the search better (we can't do this because we use storyshots extensively, and it would cause snapshot updates throughout our entire codebase, as well as make our storynames really noisy)

Are you able to assist bring the feature to reality?
yes, I can! would be happy to discuss options :)

Additional context
Add any other context or screenshots about the feature request here.

P1 feature request search todo tracked

Most helpful comment

Plan is for me to work on this late August.

All 13 comments

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

@shilman would adding this to the 6.1 search milestone indicate this would be a reasonable thing to add?

As mentioned in the original post body, happy to contribute so long as the general idea sounds sane! :)

@ehzhang we're planning to overhaul search in 6.1 and I'd like to think about it as part of that larger body of work. I added it to the milestone to flag it for discussion and would love to have you involved in the design (and implementation) of the new search. we're thinking about things like story tags / faceted search for dealing with large storybooks, but are still in the throes of getting 6.0 out the door. Giving a custom sort function sounds reasonable, but I'd like to consider it in the context of the new UX. cc @ghengeveld @domyen

Exciting to hear! Happy to be a part of those conversations :)

@ehzhang Check this out: https://twitter.com/GHengeveld/status/1235622895910629378?s=20

Should be in SB 6.1.

Note this is still fuze fuzzy search but with better settings so it doesn't yield those odd results, at least not at the top.

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

Plan is for me to work on this late August.

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

Still planned for late August/early September.

Wasn't this fixed back in Storybook v5.3.x?

This issue seems to be very similar to the fuzzy search behaviour that I experienced in 5.2.x.

Now when I've recently updated from 5.3.17 to 6.0.17 the search seems to catch more or less every component/story I have... 馃

Any updates on this one? We're struggling over here with search providing meaningful results. Anything I can do to help?

Yes, @ghengeveld is making great progress on this as we speak. We should have an early prerelease version to try out in a week or two.

Jeepers creepers!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.1.0-alpha.21 containing PR #12601 that references this issue. Upgrade today to try it out!

You can find this prerelease on the @next NPM tag.

Closing this issue. Please re-open if you think there's still more to do.

Was this page helpful?
0 / 5 - 0 ratings