trekhleb / vscode-search-tree

πŸ”Ž (Draft!) VSCode extension to show the search results in a tree view

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

vscode-search-tree

πŸ”Ž (Draft!) VSCode extension to show the search results in a tree view

The work on this extension is on-pause for now since VSCode team has put the #20224 issue into their "Aug-2022 iteration" #157454 to "Explore showing search results as a tree view". If this will be done in a VSCode core it would be ideal solution and this extension won't be needed.

Issue

Currently, the search results in VSCode cannot be grouped in a Tree View structure. See microsoft/vscode#20224.

Let me quote some folks:

  • "holy shβˆ—t, how can this still be missing after 5 years... back to eclipse it is" - fm-swe [1]
  • "Unfortunately no." - leo-diehl [2]

Suggestion

Add a possibility to show search results in a tree view, for faster and less overwhelming information lookup.

Current state of the plugin

The code is super-raw, not optimized and not tested. Basically it is not ready to be published as of now.

However, here is what was done currently

Extension demo

  • Custom "Search Tree" view container in a side-bar
  • Custom command via Cmd+Shift+P: "Search Tree: Search"
  • Custom Input dialog for the search query
  • Custom hotkey: Ctrl+Shift+F
  • Custom search engine: via fast-find-in-files package
  • Tree view provider was used
    • Custom numbers (of search results)
    • "Native" file icons
  • Open the file line in the code browser
  • Auto-scroll to and auto-highlight the found text
Search results as a List Search results as a Tree
Search results as a List Search results as a Tree

Implementation issues

It is not clear (not possible, or at least not documented) how to do the following:

ToDo

  • Make the Search Tree to be a part of Search view container
  • Auto-focus on the Search Tree view when pressing Ctrl+Shift+F
  • In-place (non-popup) input field
  • Collapse/Expand all
  • Light/Dark mode icons
  • Search in specific folders (via regexp)
  • Search in specific files (via regexp)
  • Optimize search engine for large amount of files

Developing

Install dependencies

npm install

Run the extension in the development mode in VSCode

"Run and Debug" β†’ "Run Extension"

Docs

About

πŸ”Ž (Draft!) VSCode extension to show the search results in a tree view


Languages

Language:TypeScript 100.0%