search: Add revision sidebar section
Created by: fkling
This is a possible implementation of the new sidebar section for showing a list of available branches and tags if all search result are from a single repository. However, there are a couple of UX issues that might need to be addressed before we can actually ship these (see the video for examples):
- Clicking on a rev will reset the revision filter input because the sidebar rerenders.
- This could possibly be solved by lifting the inputs up into the sidebar component, but I wonder if there is a better solution.
- If a search has no results, the revision section will disappear (because whether or not to show the section is based on search results. no results => no section).
- This could be solved analyzing the search query to determine whether it contains a
repo:
filter with a "static" value. I'd assume this is a relatively common use case. However, there are still many cases where the section would disappear, for which we probably can't find a solution.
- This could be solved analyzing the search query to determine whether it contains a
https://user-images.githubusercontent.com/179026/129202173-9be0d55b-ba8a-443e-a605-16a55f6810b0.mp4
Update
I made a couple of changes to address the mentioned issue as good as possible. In particular:
-
I'm using
useConnection
instead ofFilteredConnection
and render a custom UI. Now we can use the search input provided bySidebarSection
. I also made the change toSidebarSection
that allows us to better control when to clear the search input (that solves the first issue mentioned above) -
Instead of validating the
repo:
filter value to see if it can only match a single repo, I'm using a more flexible heuristic (with its own drawbacks, more about that later): TheuseLatestRepoName
observes the current query and search/filter results. If the results only contain a single repo and the query contains a singlerepo:
filter it remembers therepo:
filter value as "good". If later we get an empty result but with the samerepo:
filter, we reuse the remembered repo name. The drawback is that we must have observed non-empty results for a single repo before the hook can work for empty results. But on the positive side we don't have to rely on analyzing the structure of a specific value and it will also work when the query does not contain an anchoredrepo:
filter (as long queries with that filter have returned results from a single repo). -
Reordered the sidebar sections to "demote" search references (after talking with @rrhyne)
-
I put this feature behind a feature flag. To test this PR, either use commit https://github.com/sourcegraph/sourcegraph/pull/23835/commits/2ece69f4457448cc5057aaaaeb213e5737606271 or add the feature flag locally with an enabled state in https://sourcegraph.test:3443/api/console
mutation CreateFeatureFlag {
createFeatureFlag(name: "search-sidebar-revisions", value:true){
__typename
}
}
NOTE: I already created the feature flag and enabled it for the Sourcegraph org on sourcegraph.com
Finally, here is a video that shows the new behavior, including loading states and empty states. I added some captions but they disappear too quickly so you might have to pause the video (video editing is new to me ;) )
https://user-images.githubusercontent.com/179026/129419448-05688cf1-bb95-4c2c-981a-1d8a8b8e912a.mp4