VSCode Bindings to Toggle File Explorer

I published an extension the other day that tries to replicate the NERDTree menu and in the screen cast I did for the post I navigate to and around the file explorer menu via the keyboard without explaining how I setup my key bindings to do that.

To open the file explorer I setup a binding through the Vim plugin. In order to toggle it closed, I had to set it up through the non-Vim key bindings as the Vim key bindings don’t trigger from the file explorer menu. To toggle the file explorer open, I use the following:

// settings.json

        {
            "before": [
                "leader",
                "e",
                "w"
            ],
            "after": [],
            "commands": [
                {
                    "command": "workbench.files.action.focusFilesExplorer",
                    "args": []
                }
            ]
        },

To be able to toggle this closed when the file explorer is open, I use the following:

// keybindings.json

{
  "key": ", e w", 
  "command": "workbench.action.toggleSidebarVisibility", 
  "when": "filesExplorerFocus && !editorTextFocus
},

I believe VSCode doesn’t match the ‘w’ here (i.e. “, e” will trigger the toggle), but I left it in so it’s easier for me to find if I’m searching this file for the binding.

The second part of my setup is the ability to navigate up and down the file explorer list and I do this with the following settings:

    {
        "key": "j",
        "command": "list.focusDown",
        "when": "explorerViewletVisible && filesExplorerFocus && !inputFocus"
    },
    {
        "key": "k",
        "command": "list.focusUp",
        "when": "explorerViewletVisible && filesExplorerFocus && !inputFocus"
    },

Here’s a quick screen cast showing this in action: