Simple extension for lazygit integration in vscode

[tom-pollak]

https://marketplace.visualstudio.com/items?itemName=TomPollak.lazygit-vscode

• toggle window with cmd+shift+l
• runs "natively" as a tab in the main editor window, rather than in the integrated terminal bottom panel
• toggling hides and shows the tab, rather than quitting and restarting each time
• feedback is welcome!

[tom-pollak]

lazygit-vscode-demo.mp4

[stefanhaller]

This is quite nice, thanks!

One thing that I would wish for is that when I activate lazygit, it automatically hides the side bar and the bottom panel (as if pressing Command-B and Command-J if they are open), and ideally remembers the state and restores it again when you hide lazygit.

(Would you prefer feedback like this as an issue in your repo?)

[stefanhaller]

OK, here's a PR: tom-pollak/lazygit-vscode#1

It doesn't yet remember the visibility of the side bar and panel, I couldn't figure out how to do that. But I find this to be an improvement already.

[tom-pollak]

that was a problem in the previous version, but I thought I fixed it recently. I might of messed of publishing/versioning, so I've pushed a new 0.0.6 release that should definitely have the fixed changes. lmk if your still experiencing the bug

[HoT-1]

https://marketplace.visualstudio.com/items?itemName=ChaitanyaShahare.lazygit

[HoT-1]

The extension above does the same, has been in existence for some time, works well and already has some reach.
Maybe @tom-pollak would consider to join forces rather than starting a new extension.

P.S.: I'm not associated with the extension in any way.

[stefanhaller]

OK, thanks for the additional info. I have to disagree though, the extension only provides a small subset of the functionality that Tom's extension provides.

[tom-pollak]

I did try this extension, but IME (biased) it just boils down maximising the terminal bottom-panel and runs lazygit && exit. This also ran into problems for me when you had more than one terminal open.

As I use lazygit as my primary git ui, I wanted a more "native" window dedicated to lazygit, which you can toggle or just access as a tab or quick open. I don't think this is compatible with the above extension.

[tom-pollak]

If you give this extension a try lmk what you think. you can even click e or o from the files pane in lazygit to open the file as a tab in the vscode window. makes the experience quite clean.

[stefanhaller]

you can even click e or o from the files pane in lazygit to open the file as a tab in the vscode window

To be fair though, that doesn't have anything to do with your extension. Everybody running lazygit in a VS Code terminal gets that feature.

I was going to comment on that section in your README, btw, and then forgot: I recommend to use e, not o, because e can even jump to the correct line when you use it in the staging panel, and o can't. o was meant to be used to open files in the same way as when you double-click them in the Finder, so it's mainly meant for image files or things like that.

[stefanhaller]

@tom-pollak The recent update to 0.1.4 made things significantly worse for me:

• on every first use I get the error Uncaught error: lazygitpath is undefined!. Second time it works.
• The options to auto-hide side bar and panel are broken. They work when the lazygit is not running yet, but if it is, they no longer work.

Honestly I don't understand why you made all these changes. Caching the config and reloading it if it has changed is unnecessary; just query the individual configs every time you need them (like you did before), they always reflect the current setting, no need to cache and reload. I'd be curious to know what you were trying to improve with this.

[tom-pollak]

sorry about that! this was mainly so I could give a custom config (so I can use nvim on cli, vscode with the extension with e), and things started to get a bit messy. might of gone a little overboard though.

anyway I've undone the autohide changes, so auto-hide should be working, and the onetime undefined error should also be taken care of in v0.1.5

I think this extension should be pretty much complete (if these changes fix your issues) lmk if your still encountering the problems in 0.1.5

[stefanhaller]

this was mainly so I could give a custom config

But for that, reloading of the extension doesn't help if the config changed. You'll need to reload lazygit for changes to take effect; reloading the extension doesn't do that. I'd just leave that up to the user to quit lazygit and hit Command-Shift-L again when they change the custom config path.

[tom-pollak]

I refactored loading config settings out to loadConfig (rather than querying settings directly in createWindow).

then I went and added a small oldConfig === newConfig check when loading the new config because we don't need to reload if the configs the same (skips fs.existsSync, and I don't want to give "Custom config file not found at ${globalConfig.configPath}" warnings every time the window is opened, just on setting changes)

this shouldn't reload the whole extension? just the config each time window is created as you said

[stefanhaller]

Seems to work fine again, thanks for the quick fix! I still don't understand why you need the added complexity of caching and reloading the config, but that's your choice. 😄)

[tom-pollak]

no worries, I'll stop messing with it now 😁

[jondkinney]

I'll have to check out this extension to see if it can improve upon my non-extension workflow detailed below.

I ended up just using this to keep it pretty similar to what I use in neovim

settings.json

    "vim.normalModeKeyBindingsNonRecursive": [
        {
            "before": [
                "<leader>",
                "g",
                "g"
            ],
            "commands": [
                "workbench.action.closeSidebar",
                "workbench.action.closeAuxiliaryBar",
                "workbench.action.toggleMaximizedPanel",
                "terminal.focus",
                {
                    "command": "workbench.action.terminal.sendSequence",
                    "args": {
                        "text": "lazygit\r" // note there is NO secondary `&& exit\r` here so that the <ctrl-g> (below) can do its thing and we end up in a better overall editor state for panels and file explorer, etc. and with the terminal still running after lazygit exits rather than fully exiting out of the terminal, which by the way still doesn't toggleMaximizedPanel, annoyingly.
                    }
                }
            ]
        },      
    ]

keybindings.json

[
  {
    "key": "ctrl+g", // force the panel to minimize
    "command": "runCommands",
    "args": {
      "commands": [
        "workbench.action.focusActiveEditorGroup", // some sort of hack to actually force the panel to minimize
        "workbench.files.action.focusFilesExplorer", // we're in a weird nothing is focused state when the panel is minimized in this way, so focus the explorer
        "list.select", // finally select the file in the explorer to return our cursor to the editor where it started
        "workbench.action.togglePanel", // optional, but I like it hidden when coming back from lazygit. Comment this out and it'll show but in the minimized bottom view.
      ]
    }
  },
]

This supports the somewhat weird edge case where you've maximized the panel (perhaps to do some terminal stuff) then you hide it with <cmd+j> (but it's still set to be maximized if you un-hide it) and then you open lazygit with the <leader>gg command above, and when you press q to quit out of lazygit, then press <ctrl-g> and this is able to minimize the panel consistently regardless of whether it was previously maximized or not. Without a few of these commands in the keybindings.json the toggleMaximizedPanel setting would just switch back and forth and be annoying.

PS I came here to see if we could fix the highlight color of the selected file in the lazygit file tree. It's too opaque and makes it really hard to see the current staged/unstaged color/status of the file the cursor is on. Anyone have any ideas about that in vscode?

Here's how it looks in terminal (ghostty)

And here's how it looks inside the vscode terminal

[jondkinney]

Thanks @tom-pollak, I'm definitely going to grab the plugin!

Though one of the biggest nits is the contrast ratio enforcement and highlighted line color. It looks like in your video it has the same issue where the selected file in the tree or diff chunk in the changes panel is harder to read in vscode's built-in terminal than a regular terminal.

I'm definitely not setting any lazygit settings differently between terminal and vscode's terminal as far as highlighted/selected line color, so something is doing/changing that automatically. I'd love to find where that setting is to adjust it to not be that blue.

I did find this https://code.visualstudio.com/docs/terminal/basics#_why-are-the-colors-in-the-terminal-not-correct

Which says to set "terminal.integrated.minimumContrastRatio": 1 and it definitely helps! You can see the colors again, but the blue highlighted focus line/bar is still not the color I want 🤔

With the defaults it looks like this...

But if you change "terminal.integrated.minimumContrastRatio": 1 at least we can see the red and green again!

Changing the contrast to 1 definitely makes lazygit workable in vscode again. Without that setting the diff colors are quite hard to work with IMO (ironically...). But I'd love if anyone knows how to change that blue selection color!

[tom-pollak]

https://github.com/jesseduffield/lazygit/blob/master/docs/Config.md#highlighting-the-selected-line

https://github.com/jesseduffield/lazygit/blob/master/docs/Config.md#:~:text=selectedLineBgColor%3A%0A%20%20%20%20%20%20%2D%20blue

you should change it from the default blue

[stefanhaller]

You can change the selection color to any hex color you want by putting this in your lazygit config:

gui:
  theme:
    selectedLineBgColor:
      - "#FF8822"

[jondkinney]

Shoot! Thanks guys! I didn't realize that something in my neovim setup must be customizing the lazygit color scheme and that it looks identical to the vscode screenshots above when launched outside of neovim in Ghostty. I mistakenly thought it was something that vscode was doing to alter the defaults. Thanks a ton for pointing me to the obvious (and documented) solution! 🤦‍♂️ Maybe this will help the next person who didn't read the docs like me 😬🤞.

I found where the theme I'm seeing is being defined as well: https://github.com/AstroNvim/AstroNvim/blob/70a8a10bbf356d290f83219e4f2e739a2134e7b5/CHANGELOG.md?plain=1#L37

https://github.com/AstroNvim/AstroNvim/blob/70a8a10bbf356d290f83219e4f2e739a2134e7b5/lua/astronvim/plugins/_astroui.lua#L110

[jondkinney]

Here's where I ended up to match the nord theme that I have going on in vscode. These settings were lifted from observations of their application in the nord theme inside of AstroNvim's lazygit theme/config.

gui:
  theme:
    activeBorderColor:
      - "#D8DEE9" # Nord's lighter gray for active border
    inactiveBorderColor:
      - "#4C566A" # Nord's darker gray, barely visible against background
    selectedLineBgColor:
      - "#434C5E" # Nord's slightly lighter shade for selected lines
    searchingActiveBorderColor:
      - "#88C0D0" # Nord's bright blue for currently selected search result
    optionsTextColor:
      - "#EBCB8B" # Nord's yellow for other search matches
os:
  editPreset: 'vscode'

Yielding this look: