Elite Dashboard
Elite Dashboard is a Visual Studio Code extension that lets you organize your projects in a speed-dial like manner. Pin your frequently visited folders, files, and SSH remotes onto a dashboard to access them quickly.
Usage
The dashboard is a dedicated UI that can be opened using a command or ctrl + F1 and configured to open automatically. Clicking a project opens it in the current window, while ctrl + click (cmd + click on Mac) opens it in a new window.
Projects are separated into groups and can be assigned a color to find them quickly. Managing the groups and projects is done directly on the dashboard.
Good to know
- You can edit and reorder projects and groups directly on the dashboard.
- To start fresh, run Elite Dashboard: Remove All Projects. A backup of the current dashboard is saved first.
- Emojis may (or may not, depending on your preference) be good icons for projects. You can add them by pressing WIN + . (under Windows) while naming the project.
- You can use gradients as project color, via CSS Gradient functions like linear-gradient and radial-gradient.
- Only colors defined by the theme were used. So the dashboard should always blend nicely into your VSCode design. If not, you can customize them in the settings.
- The extension automatically detects if a project is a Git repository. If so, this is indicated by an icon.
- The filter option can be toggled by ctrl + f or disabled via settings.
Configuration
The dashboard can be configured and customized using the VSCode configuration:
- Projects are stored in the globalState by default (saved on the machine) but can be set to be saved in the settings (to be synced via Settings Sync) instead. Note that by doing so, you remove the possibility of having different dashboards on your synced devices.
- Startup behavior (open always, on empty editor, or never)
- Placement of '+' buttons
- Visibility of project path
- Project tile size
- Filter option's default visibility
- Colors (see below)
By default, the dashboard uses only colors defined by the theme, which was tested against all default themes. If you use a custom theme and see the dashboard's colors unfit, you can change them in the settings (Settings > Dashboard). Following settings can be changed to any CSS color (name, hex, rgba, hsl, var) or left empty (for default):
- Project Card Background
- Project Name Color
- Project Path Color
Importing projects from a file
Run Elite Dashboard: Select Projects File and pick a projects file, or set dashboard.projectsFile to its absolute path (a path starting with ~/ also works). The same command stops importing. Every entry in the file becomes a tile on the dashboard, next to your manually added projects. The file format is defined in the projects file contract. It's usually written by a sync tool, but you can also edit it by hand.
- Imported tiles and groups have an import icon. Hover it to see which file they came from.
- The file is the source of truth. The dashboard imports it at startup, whenever it changes on disk, and when you run Elite Dashboard: Reload Projects File.
- Renaming an imported tile, moving it to another group, renaming its group or changing its color writes the change back to the file. The path can only be changed in the file.
- Deleting an imported tile hides its entry in the file (
hidden: "true") instead of removing it. Run Elite Dashboard: Restore Hidden Projects to bring it back.
- Colors of imported tiles are saved in the file as hex, so names and gradients aren't available for them.
- Entries the dashboard can't use are skipped. A notification tells you how many, and Show details opens the Elite Dashboard output channel with the reasons.
- Clearing the setting, or pointing it at another file, turns the tiles from the old file into manual tiles. Pointing it back at the old file imports its entries again as new tiles, next to those manual tiles.
Separate files per VS Code profile: this setting can only be set in user settings, never in a workspace. To use a different file in each profile (for example internal vs. client work), give each profile its own Settings. Profiles that share the Default profile's settings also share its projects file.
Settings Sync: don't combine this feature with dashboard.storeProjectsInSettings: true. The dashboard data would sync to machines that don't have the projects file configured, where imported tiles turn into manual tiles and that change syncs back. Keep the default storage mode when you use a projects file.
Syncing projects from GitLab
Elite Dashboard: Sync Projects clones and updates every repo of a GitLab group into a folder you choose, and keeps the profile's projects file up to date, so new repos show up as tiles automatically. It's off by default: run Elite Dashboard: Configure Sync to turn it on for a profile and set it up. Only git 2.31 or later needs to be installed.
- Repos that aren't on disk yet are cloned; the others are fetched and fast-forwarded. Repos with uncommitted changes or diverged branches are reported, never changed.
- Repos open in the current window are skipped, so work in progress is never touched. Add repos you never want synced to the source's
skip list.
- Your GitLab token comes from git's credential helper, or you enter it once and it's kept in VS Code's secret storage.
- Self-hosted GitLab with a certificate from a private CA: choose the CA certificate (
.pem / .crt) in Configure Sync → CA certificate. It's trusted for that source only, in addition to the usual CAs, and certificates are still verified.
- Once sync is on, start a sync from the Project Sync button in the status bar, the sync button next to the dashboard's search box, the dashboard tab's title bar, or the Elite Dashboard Sync view in the Explorer, which also lists your sources and the projects file. Each button can be turned off in the settings (
dashboard.sync.showStatusBarButton, …showDashboardButton, …showExplorerView).
To give each area of your work (your company, each client) its own folder, git identity, profile and dashboard, follow the Organizing projects guide.
Changelog
View Changelog
Acknowledgements
