Visual Project Manager

A Projects page that opens instead of the classic Welcome page, with pinned and recently opened projects, search by name or #tag, and a more accessible Side Bar.

Projects page in a dark theme: search box, tag chips, Pinned and Recent projects

_{Light theme} _{Search by #tag} _{High Contrast theme}

Visual Project Manager is a fork of Project Manager by Alessandro Fragnani. All of the original features (Favorites, Tags, auto-detection of Git/Mercurial/SVN/VS Code/any folders, Status Bar, Profiles, Remotes) come from that project, and it is distributed under the same GPLv3 license. Many thanks to Alessandro and all Project Manager contributors.

What's new in this fork

Projects page

Opens on startup instead of the VS Code Welcome page, also as a new tab when VS Code reopens your last project (setting projectManager.home.showOnStartup: always (default), emptyWindow or never)
Opens fast: the extension starts with VS Code, the page opens before any project scan, and the last projects are displayed from a cache while fresh data loads
Pinned projects at the top, followed by the Recent local projects (from the VS Code Open Recent history, local folders and workspaces only)
One search box: type a project name, or #tag to filter by tag. Tag chips can also be used as a filter
Pin/unpin, open in a new window and edit tags right from each row
Command Project Manager: Open Projects Page (Ctrl+Alt+H / Cmd+Alt+H)

Automatic tags

Nobody wants to tag dozens of projects by hand, so tags are suggested automatically (shown as ✨ suggested until you accept them with the A key, the ✨ button, or the Edit Tags picker):

50 categories (what the project is about): Data Analysis, Machine Learning, Generative AI, Mobile Development, Full Stack, Game Development, DevOps, Event Management, Competition / Kaggle...
90 technologies: Python, Jupyter, TypeScript, React, Flutter, FastAPI, Pandas, PyTorch, Docker, PostgreSQL...
Decided by rules, from the files (*.ipynb → Jupyter, pubspec.yaml → Flutter), the dependencies and Python imports (pandas → Pandas, Data Analysis), and the words of the folder name or README title (AI Engineer Program → Artificial Intelligence). Rules can also combine tags (Frontend + Backend → Full Stack) or exclude them (a React Native app is not a website)
At most 3 categories (the most specific first) and 6 technologies per project
Everything runs locally, in a few milliseconds per project: only file names, dependencies and the README start are read, and nothing leaves your computer
Edit the rules with Project Manager: Edit Automatic Tag Decisions. Setting: projectManager.autoTags.enabled

Tags on GitHub

Tags can be shared with everybody through GitHub topics (the tags displayed on a repository page, and used by the GitHub search):

Use Sync Tags with GitHub Topics (the ☁ button or the G key in the Projects page, the project context menu in the Side Bar, or the Command Palette for the current folder)
Reading is automatic: the topics of a public repository are suggested as ✨ tags, without signing in (refreshed once a day; setting projectManager.autoTags.gitHubTopics)
Publishing only shares technologies and categories (Python, Jupyter, Data Analysis...), because topics are public. Personal tags like Work or a customer name always stay private
Tags become topics (Data Analysis → data-analysis, C# → csharp) and topics become tags. Nothing is ever removed
You always confirm what will be added before anything is written to GitHub. It signs in with the smallest permission (public_repo); the permission for private repositories is only requested for a private repository

A new Pinned view at the top of the Side Bar
A new Search view, which filters the Pinned and Favorites views by name, #tag and tag chips
Pin/unpin projects with the inline button, or from the context menu

Accessibility

Everything works with the keyboard only:

Key	Action
`/`	Focus the search box
`↑` `↓` / `Home` `End`	Move between projects
`←` `→`	Move between the actions of a project (new window, pin, tags)
`Enter` / `Ctrl+Enter`	Open the project / open it in a new window
`Esc`	Clear the search

Proper labels and roles for screen readers, and the number of results is announced while you type
Colors come from the active theme, so light, dark and High Contrast themes are supported. Focus is always visible
Honors the reduce motion preference of the operating system

Bundled with vscode-icons

Installing Visual Project Manager also installs vscode-icons (an Extension Pack dependency), created and maintained by the vscode-icons team and licensed under the MIT License. You can uninstall or disable it independently at any time.

Development

git clone https://github.com/dogiergin/visual-project-manager.git
cd visual-project-manager
npm install
npm run build          # or: npm run watch
npm test

Press F5 in VS Code to launch the Extension Development Host
The UI of the Projects page and of the Side Bar Search view lives in media/ (plain HTML/CSS/JS, themed with VS Code CSS variables)
After a visual change, run npm run screenshots to update the images in images/screenshots/ used by this README

Migrating from Project Manager

Both extensions register the same commands and settings, so uninstall or disable Project Manager before using Visual Project Manager
Your projectManager.* settings keep working, and your saved projects (projects.json) are copied automatically on the first run
Pinned projects are stored with an extra "pinned": true field in projects.json, which the original extension simply ignores

Credits

Project Manager by Alessandro Fragnani - GPLv3. If you find this extension useful, please consider supporting the original author as well:

Project Manager is an extension created for Visual Studio Code. If you find it useful, please consider supporting it.
vscode-icons by the vscode-icons team - MIT

Project Manager features

The sections below come from the original Project Manager documentation and still apply to Visual Project Manager.

It helps you to easily access your projects, no matter where they are located. Don't miss those important projects anymore.

You can define your own Projects (also called Favorites), or choose for auto-detect Git, Mercurial or SVN repositories, VSCode folders, or any other folder.

Here are some of the features that Project Manager provides:

Save any folder or workspace as a Project
Auto-detect Git, Mercurial or SVN repositories
Organize your projects using Tags
Open projects in the same or new window
Identify deleted/renamed projects
A Status Bar which identifies the current project
A dedicated Side Bar

Features

Available Commands

Project Manager: Save Project Save the current folder/workspace as a new project
Project Manager: Edit Project Edit your projects manually (projects.json)
Project Manager: List Projects to Open List all saved/detected projects and pick one
Project Manager: List Projects to Open in New Window List all saved/detected projects and pick one to be opened in New Window
Project Manager: Filter Projects by Tag Filter the Favorite projects by selected tags

Manage your projects

Save Project

You can save the current folder/workspace as a Project at any time. You just need to type its name.

Save

It suggests a name to you automatically :)

Edit Projects

For easier customization of your project list, you can edit the projects.json file, directly inside Code. Just execute Project Manager: Edit Projects and the projects.json file is opened. Simple as this:

[
    {
        "name": "Pascal MI",
        "rootPath": "c:\\PascalProjects\\pascal-menu-insight",
        "tags": [],
        "enabled": true,
        "profile": "Delphi"
    },
    {
        "name": "Bookmarks",
        "rootPath": "$home\\Documents\\GitHub\\vscode-bookmarks",
        "tags": [
            "Personal",
            "VS Code"
        ],
        "enabled": true,
        "profile": "VSCode"
    },
    {
        "name": "Numbered Bookmarks",
        "rootPath": "~\\Documents\\GitHub\\vscode-numbered-bookmarks",
        "tags": [
            "Personal",
            "VS Code"
        ],
        "enabled": false,
        "profile": "VSCode"
    }
]

You can use ~ or $home while defining any path. It will be replaced by your HOME folder.

Be sure that the JSON file is well-formed. Otherwise, Project Manager will not be able to open it, and an error message like this should appear. In this case, you should use the Open File button to fix it.

Corrupted

Access

List Projects to Open

Shows your projects and select one to open.

List Projects to Open in New Window

Just like List Projects but always opening in New Window.

Keyboard Focused Users

If you are a keyboard focused user and uses Vim like keyboard navigation, you can navigate thru the project list with your own keybindings.

Just use the when clause "inProjectManagerList", like:

    {
        "key": "cmd+j",
        "command": "workbench.action.quickOpenSelectNext",
        "when": "inProjectManagerList && isMac"
    },
    {
        "key": "cmd+shift+j",
        "command": "workbench.action.quickOpenSelectPrevious",
        "when": "inProjectManagerList && isMac"
    },
    {
        "key": "ctrl+j",
        "command": "workbench.action.quickOpenSelectNext",
        "when": "inProjectManagerList && (isWindows || isLinux)"
    },
    {
        "key": "ctrl+shift+j",
        "command": "workbench.action.quickOpenSelectPrevious",
        "when": "inProjectManagerList && (isWindows || isLinux)"
    }

Working with Remotes

The extension support Remote Development scenarios, and you may choose how to use it, depending on your needs

I access Remotes, but most of my work is Local

This is the regular scenario, and that's why you don't need to do anything special for the extension to work. It works out of the box.

When installed locally, you can save any Container, SSH, WSL or Codespaces projects as Favorites. Each one will have its own icon to be properly identified, and when you select them, VS Code will open the remote automatically.

It just works

But what if I do most of my work on Remotes

If you normally connect to remotes (like SSH/WSL) and would like to save Favorite projects on that remote, or to be able to auto-detect repos located on that remote, you must activate/install the extension to work on remotes.

You just have to add the lines below on your User Settings.

    "remote.extensionKind": {
        "dogiergin.visual-project-manager": [
            "workspace"
        ]
    },

More details on VS Code documentation

Available Settings

You can choose how your projects are sorted

Saved: The order that you saved the projects
Name: The name that you typed for the project
Path: The full path of the project
Recent: The recently used projects

    "projectManager.sortList": "Name"

List

Choose if the project list must be grouped by its kind (Favorites, Git, Mercurial, SVN and VS Code).

    "projectManager.groupList": true

Should the current project be removed from the list? (false by default)

    "projectManager.removeCurrentProjectFromList": true

Should identify invalid paths on project list? (true by default)

    "projectManager.checkInvalidPathsBeforeListing": false

Should support symlinks on baseFolders? (false by default)

    "projectManager.supportSymlinksOnBaseFolders": true

Should show the parent folder info when projects with same name are detected? (false by default)

    "projectManager.showParentFolderInfoOnDuplicates": true

Filter Projects Through Full Path (false by default)

    "projectManager.filterOnFullPath": true

Custom projects file (projects.json) location

If you intend to share projects between Stable and Insider installations, or if you store your settings in different locations (cloud services), you can indicate an alternative location (folder path) for the projects.json file.

    "projectManager.projectsLocation": "C:\\Users\\myUser\\AppData\\Roaming\\Code\\User"

You can use ~ or $home while defining the folder path. It will be replaced by your HOME folder.

Automatic Detection of Projects (Git , Mercurial , SVN and VSCode )

    "projectManager.git.baseFolders": [
        "c:\\Projects\\code",
        "d:\\MoreProjects\\code-*",
        "$home\\personal-coding"
    ]

Indicates folders or glob patterns to search for projects

    "projectManager.git.ignoredFolders": [
        "node_modules", 
        "out", 
        "typings", 
        "test",
        "fork*"
    ],

Indicates folders or glob patterns to be ignored when searching for projects

    "projectManager.git.maxDepthRecursion": 4

Define how deeps it should search for projects

Exclude the base folders themselves from the auto-detected projects list (false by default)

    "projectManager.any.excludeBaseFoldersFromResults": true

When enabled, the Any base folders configured in projectManager.any.baseFolders are not returned as projects themselves, only their matching subfolders are.

Should ignore projects found inside other projects? (false by default)

    "projectManager.ignoreProjectsWithinProjects": true

Cache automatically detected projects (true by default)

    "projectManager.cacheProjectsBetweenSessions": false

Display the Project Name in Status Bar (true by default)

    "projectManager.showProjectNameInStatusBar": true

Open projects in New Window when clicking in status bar (false by default)

    "projectManager.openInNewWindowWhenClickingInStatusBar": true

Indicates if the New Window command should open the project in current window, when empty (always by default)
- always: Whenever you call the Open in New Window command, it will open in the current window, if empty
- onlyUsingCommandPalette: Only open in the current window if you use the Command Palette
- onlyUsingSideBar: Only open in the current window if you use the Side Bar
- never: Works as today. The Open in New Window command will always open in New Window

    "projectManager.openInCurrentWindowIfEmpty": "always"

Indicates the list of tags you can use to organize your projects (Personal and Work by default)

    "projectManager.tags": [
        "Personal", 
        "Work",
        "VS Code",
        "Learning"
    ]

Controls how tag groups in the Favorites view are expanded or collapsed, and whether their state is remembered (startExpanded by default)
- alwaysExpanded: Tag groups are always expanded
- alwaysCollapsed: Tag groups are always collapsed
- startExpanded: Tag groups start expanded and remember your last expand/collapse state
- startCollapsed: Tag groups start collapsed and remember your last expand/collapse state

    "projectManager.tags.collapseItems": "startExpanded"

Show the current Git branch name for projects ("never" by default)

    "projectManager.git.showBranchName": "never"

Supported values:

"never": Never display the Git branch name
"onlyInSideBar": Display the Git branch name only in the Side Bar
"onlyInCommandPalette": Display the Git branch name only in the Command Palette
"always": Display the Git branch name in all locations

Available Colors

Choose the foreground color to highlight the current project in the Side Bar

    "workbench.colorCustomizations": {
      "projectManager.sideBar.currentProjectHighlightForeground": "#e13015"  
    }

The Project Manager extension has its own Side Bar, with a variety of commands to improve your productivity.

Side Bar

Project Tags - View and Filter

Starting in v12.3, you can now organize your Projects with Tags.

You can define your custom tags (via projectManager.tags setting), define multiple tags for each project, and filter the projects based on their tags.

Extension API

If you are an extension developer and would like to interact with the Project Manager extension, you can use its public API.

First, you must add an extensionDependencies entry in your package.json file:

  "extensionDependencies": [
    "dogiergin.visual-project-manager"
  ],

Then, retrieve the extension instance with vscode.extensions.getExtension("dogiergin.visual-project-manager") in your source code, to be able to use the methods that the extension exposes.

import { ProjectManagerPublicApi } from './api/projectManager/api';

async function useProjectManagerApi() {
    const projectManagerApi = <ProjectManagerPublicApi>vscode.extensions.getExtension('dogiergin.visual-project-manager')?.exports;

    await projectManagerApi.saveProject("My Project", "/path/to/project", ["work"], "Default");
}

The contract is defined at /api/api.d.ts.

More details on VS Code Extension API reference

Installation and Configuration

You should follow the official documentation to:

License

GPL-3.0 with VS Code Extension Host API Exception

See NOTICE.md for the third-party attributions.

Visual Project Manager

E.Doğukan ERGİN

Visual Project Manager

What's new in this fork

Projects page

Automatic tags

Tags on GitHub

Side Bar

Accessibility

Bundled with vscode-icons

Development

Migrating from Project Manager

Credits

Project Manager features

Features

Available Commands

Manage your projects

Save Project

Edit Projects

Access

List Projects to Open

List Projects to Open in New Window

Keyboard Focused Users

Working with Remotes

I access Remotes, but most of my work is Local

But what if I do most of my work on Remotes

Available Settings

Available Colors

Side Bar

Project Tags - View and Filter

Extension API

Installation and Configuration

License