Comments (4)
Hey @fredboyle @Spone, sorry for the ridiculously slow progress on this, life has been a bit mad recently.
I've had a bit of a play with adding in the full path lookup to the filter matching and testing it in a few projects. Even in really big nested directory structures it doesn't feel like it adds a lot of noise to the results at all. In fact it just feels a lot more intuitive - it should probably just have been like this all along!
So I've made the change and will get it out in the next release, hopefully today. I am not going to go down the route of adding a checkbox or config setting because honestly I think it's just better this way. @fredboyle thank you for prompting me to take another look at it :)
I'm wondering if we could try replicating the fuzzy-matching behavior of Github "go to file" feature or VS Code's Ctrl+P / "search file by name" feature. Maybe as a separate UI that opens a floating search bar at the top of the screen:
@Spone yeah that would be a nice addition, although would be more of a 'search' rather than a 'filter' (i.e. for finding one very specific item rather than just filtering out surrounding items) so I don't think it would be a direct replacement. But some sort of command/search box thing would be great in the future.
from lookbook.
This change has just been released in v2.1.0 so I'm going to go ahead and close this issue down. But if you run into any issues with it just let me know.
from lookbook.
Hey @fredboyle 👋
So, this is actually the intended behaviour :) The filter matches against scenario and preview labels (only), and then displays the tree of folders/modules down to those the matched previews/scenarios. The placeholder text "Filter previews by name..." is supposed to hint at that behaviour although I'm not sure it really helps much!
The idea behind this was to reduce the number of matches and so be able to filter quickly down to specific previews without lots of noise from matching path segments. This obviously works well if you have a specific preview/scenario name in mind, but if you are looking for a folder of previews then it doesn't work at all, which is clearly not great - and actually something I've personally been getting caught out with a lot recently too.
So whilst this isn't really a bug (from my point of view anyway) it's definitely something that could and should be improved. So there are a few options:
- Replace the existing filter behaviour with one that matches against path segments as well as preview/scenario names
- Provide a config setting to optionally include path segments in the filter
- Add a checkbox (or some other control) in the UI somewhere close to the filter box to allow users to toggle on/off the path matching behaviour
Options 2) and 3) would require deciding what should be the default setting.
I'm probably most in favour of option 3 personally (with the default to include path segments) but I'm going to do a bit of testing on a few of my projects to see how much additional 'noise' is actually generated with the path matching enabled - it was an assumption I made when first implementing the search without much evidence so it may well be that just keeping it simple and going with option 1 is actually fine.
I think some highlighting of the matched letters in the sidebar labels would also be nice although when I last had a stab at implementing that it proved to be a bit of a headache...
I'll have a bit of a play to see how best to improve the experience and let you know as/when I have something to test out. And if you have any other suggestions in the meantime just let me know :)
from lookbook.
I'm wondering if we could try replicating the fuzzy-matching behavior of Github "go to file" feature or VS Code's Ctrl+P / "search file by name" feature. Maybe as a separate UI that opens a floating search bar at the top of the screen:
I quite like being able to launch a search from a keyboard shortcut instead of having to click in a search box.
from lookbook.
Related Issues (20)
- Add the ability to hide a nested within a group. HOT 3
- Cannot choose display options in an embedded preview HOT 4
- Support better errors / web console instead of rescuing errors in Lookbook HOT 2
- undefined method `strftime' for nil:NilClass with nil datetime HOT 1
- Hidden scenarios within groups are not accessible via their URL
- Swap the order of Previews and Pages sections HOT 4
- Ability to search within pages section HOT 3
- X-Frame-Options always set to deny HOT 8
- Can't draw templates that require instance variables HOT 5
- Lookbook overrides ViewComponent `show_previews` config depending on load order HOT 3
- ActionView::Template::Error occurs when trying to render a template file with a partial HOT 5
- FEA: Support for Mailer Previews HOT 1
- Support configurable frame ancestors for embeds HOT 2
- Documentation request: mention support for Phlex in the README HOT 5
- Previews not rendering nested components HOT 2
- Better integration with Phlex HOT 1
- Version requirement for listen gem is not specified, and wrong version error is suppressed HOT 1
- Syntax error reporting in Lookbook HOT 2
- Sharing View Component Previews Across Multiple Projects Without Duplicating Files
- Enlarge search field clear button
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from lookbook.