How I Built a Virtual Folder Tree from Flat Filenames — No Files Moved, No Symlinks, Just 300 Lines of TypeScript

My project grew to 340 files in a single directory. All of them were flat and in the root. The AI agent loved this layout, as it eliminated path ambiguity and made files easily reachable with a single read_file call. However, I found it frustrating to scroll through 340 files to find the specific one I needed. My brain didn't rely on grep, so I decided to create a solution.

I developed a VSCode and IntelliJ plugin called Logical Folders. This plugin displays flat files as a virtual directory tree without moving any files or creating symlinks. The hierarchy is purely visual, keeping the files in their original state on disk. The core of the plugin is a function called parsePath. It splits a filename on a separator and keeps the extension attached to the last segment. For example, auth_login_handler.ts becomes [auth, login, handler.ts].

When you right-click on auth/login/ and create a new handler.ts file, the plugin reassembles the segments into auth_login_handler.ts and writes the flat file back to disk. The virtual tree is a representation of the flat files, not the actual truth of the disk. To build the virtual tree, VSCode's TreeDataProvider interface requires a getChildren(element?) function.

I scanned the entire workspace once, parsed every file path, and inserted them into a tree of LogicalNode objects. This virtual directory tree allows me to navigate the 340 flat files as if they were organized in a hierarchical structure, without actually rearranging the files on my disk.