[Pitch] Quick navigation in DocC Render

Typo tolerance would have to be implemented using some distance calculation algorithm like the Levenshtein distance. I did consider this at first, but then I realized that most of the similar features in text editors and IDEs don't include this type of tolerance either. I can't tell for sure if this would impact the app's performance, but it wasn't scoped as part of the project (in terms of what GSoC refers to). We could consider it as part of a future direction tho, I did some research regarding this when I was scoping the proposal for the feature Quick navigation in DocC Render - #12 by sofiaromorales.

I see, that's an interesting observation, I'll be including that behavior in the feature, thanks!

1 Like

This is so cool; really compelling and fun to use!

Small additional thought: I really like having the / icon exposed to help teach people that they can open the UI without using a mouse.

1 Like

[Reposting because the images didn't go through the first time]

Hey Sofía, fantastic work! This feels intuitive and super useful.

Some minor improvement suggestions:

  1. I agree with the concerns listed above on the placement of the "/" button.

  2. It would be awesome if the window height was sized to cut off around half the last result of the list, if there are more results than fit in the view at a single time. This would indicate that there are more results available. A good example of this is Xcode Open Quickly:

  1. There's a lot of padding right now, I'd suggest condensing it a bit to make better use of the available space on the window. I took a quick pass at this to show what I mean:

  1. Another small polish detail, would be nice if the placeholder text color matched the filter's placeholder text color. Looks like right now it's a lighter gray.

Again, fabulous work!

Like @bzamayo mentioned the delay is caused by a debounce on the filter input, initially, I set it to 500ms keeping the same delay as in the sidebar input, but reducing it to 250ms would make the experience faster

I agree that the open modal button should be on the nav bar, but placed on the right hand, I find that most websites keep the upper right for the filter, besides this, adding not only the magnifier icon but keeping the / icon so people knows how to open it with the keyboard.

I do like providing the alternative for people to close the modal using the ESC button, I have seen it on multiple websites, and it has the advantage that is adding a focusable element to perform the action, so instead of removing it I would try to make it smaller so it doesn't take that much space

Great thanks! :smile:

Really great work!

Minor nit:

The subtitle of each result seems to be lowercased (e.g "parsablecommand", "arrayparsingstrategy"). Can we keep its original case?

1 Like

Thank you for all your great comments! Over the past few weeks I've been polishing the feature and making some changes based on your feedback.

Some of these changes include:

  • New button to open the Quick navigation modal, a magnifying glass icon located to the right of the top navigation bar, making the feature more visible and accessible even with the sidebar collapsed
  • Hierarchy of symbols keeping the original case
  • Reduced debounce time for faster query results
  • Minor UI refinements
  • Performance improvements

You can take a look at this updated demo.

This feature was for desktop only, but I'd like to know your thoughts on making this accessible on mobile as well.

Quick navigation is still under code review, but I'll make an update once it has gotten merged into the main codebase.

For now it will only be available under the quickNavigation feature flag, but I hope to see it as part of docc-render by default later on.

Although GSoC is ending next week and the original scope of the project is complete, I plan to continue improving Quick Navigation by working on some additional features, one of these being symbol previews in the modal, similar to Spotlight. If you have other ideas that you would like to see as part of this feature in the near future, feel free to share them :)

Once again, thanks for the feedback!


Thanks for your feedback! Quick Navigation has landed in the main branch :tada:

Currently is under a feature flag, please try it out and let me know what you think of it - this is how you can enable it in your documentation Documentation