Intelli Explorer

Intelli Explorer is a VS Code extension for teams that need faster file navigation in growing codebases.

It gives you two complementary views:

• File Hierarchy for the real folder structure.
• Smart Groups for semantic grouping by language, pattern, module, and extension.

Why This Extension Matters

As projects scale, the default explorer becomes slower for intent-based navigation.

Common pain points:

• You know the kind of file you need, but not where it lives.
• You need all controllers, DTOs, guards, or tests across modules now.
• You are migrating by extension and must locate hotspots quickly.
• New team members struggle to map architecture from folder names only.

Intelli Explorer keeps your architecture modular while giving you multiple navigation perspectives.

Visual Product Tour

Smart Groups: Flat vs Folder Presentation

Real Engineering Use Cases

Presets and Project-Level Personalization

Core Features

1) File Hierarchy

A classic tree view for exact filesystem navigation.

Best for:

• Creating and moving files in known folders.
• Verifying relative structure quickly.
• Infra/config workflows where physical path context is critical.

2) Smart Groups

A configurable tree that reorganizes files by intent.

Supported dimensions:

• language
• pattern
• module
• extension

Supported file presentations:

• flat
• folders

Additional visual controls:

• counts per group/folder
• themed icon accents for faster scanning

Built-In Presets

Use Configure Smart Groups... in the Smart Groups toolbar to switch instantly:

• Language -> Pattern
• Module -> Pattern
• Module -> Extension
• Extension -> Pattern
• Extension Only
• Module Only
• Flat (No Grouping)

Use Case Playbook

Commands

Configuration Reference

All settings can be saved per project in .vscode/settings.json.

Example: Production-Friendly Workspace Profile

{
  "intelliExplorer.smartGroups.groupBy": ["module", "pattern"],
  "intelliExplorer.smartGroups.fileView": "folders",
  "intelliExplorer.smartGroups.moduleDepth": 1,
  "intelliExplorer.smartGroups.showCounts": true,
  "intelliExplorer.smartGroups.colorfulIcons": true
}

Example: Migration/Audit Profile

{
  "intelliExplorer.smartGroups.groupBy": ["extension", "pattern"],
  "intelliExplorer.smartGroups.fileView": "flat",
  "intelliExplorer.smartGroups.moduleDepth": 1,
  "intelliExplorer.smartGroups.showCounts": true,
  "intelliExplorer.smartGroups.colorfulIcons": true
}

Supported Pattern Categories

Smart Groups includes broad pattern detection, including:

• Controllers, Services, Models, Interfaces, DTOs, Repositories
• Middleware, Guards, Pipes, Interceptors, Decorators, Filters
• Modules, Routes, Components, Pages, Layouts, Hooks
• Stores, Actions, Reducers, Selectors, Effects, Sagas
• Utils, Constants, Config, Validators, Schemas, Enums
• Migrations, Seeds, Factories, Events, Jobs, Commands, Queries, Handlers

Supported Language Categories

Out-of-the-box coverage includes:

• TypeScript/TSX
• JavaScript/JSX/MJS/CJS
• CSS/SCSS/SASS/Less/Stylus
• HTML/XML/SVG
• JSON/YAML/TOML/INI/ENV
• Python, Go, Rust, Java, Kotlin, C/C++, C#, PHP, Ruby
• Shell scripts
• Markdown/Text docs
• SQL, GraphQL, Prisma, Proto

Unknown extensions are still grouped into readable fallback categories.

Installation

From VS Code Marketplace

1. Open Extensions (Ctrl+Shift+X / Cmd+Shift+X).
2. Search Intelli Explorer.
3. Install.

From VSIX

code --install-extension intelli-explorer-0.1.0.vsix

Build From Source

git clone https://github.com/Joangeldelarosa/intelli-explorer.git
cd intelli-explorer
npm install
npm run compile
npm run package
code --install-extension intelli-explorer-0.1.0.vsix

After install, run Developer: Reload Window.

Quick Start Flow

1. Open Intelli Explorer in Activity Bar.
2. Keep File Hierarchy for path-based navigation.
3. Open Smart Groups and choose Configure Smart Groups....
4. Pick preset based on your current task.
5. Toggle List/Folders depending on context density.
6. Toggle Extension Grouping during migration or audit moments.

Visual Brand Assets

These assets are generated and versioned in-repo:

• resources/brand-icon.svg
• resources/icon.png
• resources/activitybar-icon.svg
• docs/assets/*.png

Regenerate with:

npm run assets:build

Development

Prerequisites

Setup

git clone https://github.com/Joangeldelarosa/intelli-explorer.git
cd intelli-explorer
npm install

Common Scripts

npm run compile
npm run watch
npm run lint
npm test
npm run icon:png
npm run assets:build
npm run package
npm run clean

Debugging

1. Open project in VS Code.
2. Press F5 to launch Extension Development Host.
3. Keep watch mode running for rapid iteration.

Performance Notes

• File scanning excludes heavy directories (node_modules, .git, out, dist, build).
• Refresh is debounced to avoid noisy rebuilds.
• Groups update on file create/change/delete events.

Security and Privacy

• Intelli Explorer runs locally in VS Code.
• No external service is required for core grouping/navigation behavior.
• No telemetry pipeline is required for core operation.

Troubleshooting

Smart Groups is empty

• Ensure a workspace folder is open.
• Ensure files have extensions.
• Run Refresh.

Colors are not obvious in my theme

• Ensure intelliExplorer.smartGroups.colorfulIcons is true.
• Try a higher-contrast theme for stronger icon visibility.

I want a single grouping mode only

{
  "intelliExplorer.smartGroups.groupBy": ["module"]
}

I want no grouping

{
  "intelliExplorer.smartGroups.groupBy": [],
  "intelliExplorer.smartGroups.fileView": "flat"
}

CI/CD

CI validates lint, compile, and tests on push/PR. Release workflow packages VSIX and can publish to Marketplace with configured credentials.

Contributing

See CONTRIBUTING.md for contribution and workflow guidelines.

License

MIT © Joangel de la Rosa