VSCode拡張 Git Graph の設定を調べる

VSCodeとGitを組み合わせて仕事をされている方は多いと思います。
そんな人たちに人気の拡張機能はいくつかありますが、今日はそのうちの一つ`Git Graph`について、普段私が使っていない機能を確認していこうと思います。
Git Graphは以下から配布されています。

[Git Graph - Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph)

ほぼ初期設定で使っている私です。
**ほぼすべての設定を普段使っていない**と言っても過言ではないので、
今回のこの記事は初心者向けということになるかもしれません。

## 今回調べる設定項目
拡張機能の説明、英文ということもあり読んでいる人は多くはない気がしますが、
どんな機能があるかは、そこにつらつら書かれています。

ダイアログのチェックボックスの初期値とかいろいろ変更できますが、
なんか便利そうな5項目をピックアップして見ていこうと思います。

- Context Menu Actions Visibility
- Custom Branch Glob Patterns
- Custom Emoji Shortcode Mappings
- Fetch And Prune
- Fetch And Prune Tags

### Context Menu Actions Visibility
設定項目名： `git-graph.contextMenuActionsVisibility`

これは右クリックメニューに不要な項目があれば非表示にできる機能です
設定するには直接`settings.json`を弄ります。

例えばこんな感じ
```json:settings.json
"git-graph.contextMenuActionsVisibility": {
    "branch": { 
        "rebase": false,
        "createArchive": false,
        "checkout": false
    },
    "commit": {
        "checkout": false
    }
}
```

上記例は実験のために適当です。さすがにcheckoutを消すと操作性が悪いですね。
これをやると、ブランチを右クリックしたときのメニューは以下のようになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/024a4194-d148-6e96-cda2-e54ce603e9bc.png)

しっかり消えてます。
Git Graph経由で使うことが無い項目は消してしまうのもいいですね。

あと、どんな項目が設定できるのか？という点ですが、
初期設定から変更する項目だけ追記すれば良いようです。

項目は下記です
<details><summary>初期設定一覧</summary>

```json
{
    "branch": {
        "checkout": true,
        "rename": true,
        "delete": true,
        "merge": true,
        "rebase": true,
        "push": true,
        "createPullRequest": true,
        "createArchive": true,
        "selectInBranchesDropdown": true,
        "unselectInBranchesDropdown": true,
        "copyName": true
    },
    "commit": {
        "addTag": true,
        "createBranch": true,
        "checkout": true,
        "cherrypick": true,
        "revert": true,
        "drop": true,
        "merge": true,
        "rebase": true,
        "reset": true,
        "copyHash": true,
        "copySubject": true
    },
    "remoteBranch": {
        "checkout": true,
        "delete": true,
        "fetch": true,
        "merge": true,
        "pull": true,
        "createPullRequest": true,
        "createArchive": true,
        "selectInBranchesDropdown": true,
        "unselectInBranchesDropdown": true,
        "copyName": true
    },
    "stash": {
        "apply": true,
        "createBranch": true,
        "pop": true,
        "drop": true,
        "copyName": true,
        "copyHash": true
    },
    "tag": {
        "viewDetails": true,
        "delete": true,
        "push": true,
        "createArchive": true,
        "copyName": true
    },
    "uncommittedChanges": {
        "stash": true,
        "reset": true,
        "clean": true,
        "openSourceControlView": true
    }
}
```
</details>

### Custom Branch Glob Patterns
設定項目名： `git-graph.customBranchGlobPatterns`
任意のglobパターンのブランチ表示フィルタを追加できます。

以下の感じで追記を行います。
```json:settings.json
"git-graph.customBranchGlobPatterns": [
    {"name": "Feature Requests", "glob": "*/feature/*"},
    {"name": "Develop", "glob": "*/develop"}
]
```

すると、画面上部のドロップダウンリストに登場してきます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/4f1fa0eb-7aa7-d5c3-99c1-9394ba2137e8.png)
この機能を使う前提でブランチ戦略をくみ上げるのも良いかもしれません。
工夫次第でチームの生産性を改善できそうです。

以下、globパターンの参考
- [Visual Studio Code Glob Patterns Reference](https://code.visualstudio.com/docs/editor/glob-patterns)
- [Wikipedia](https://ja.wikipedia.org/wiki/%E3%82%B0%E3%83%AD%E3%83%96)

### Custom Emoji Shortcode Mappings
設定項目名： `git-graph.customEmojiShortcodeMappings`
任意のカスタムコードに絵文字をマッピングできます。

以下の感じで設定します
```json:settings.json
"git-graph.customEmojiShortcodeMappings": [
    {"shortcode": ":iine:", "emoji":"👍"},
    {"shortcode": ":syuri:", "emoji":"🔧"}
]
```
カスタムコードはコロンで括る必要がありそうです。無いとうまく動きませんでした。

これを設定したうえで、糞コミットを入れてみます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/afb4a329-e138-d26b-6bd6-2cc549611a3b.png)
これはひどいメッセージですね
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/def180f3-60bf-615d-2642-732d051341c5.png)
しっかり絵文字になりました

Windows10や11では `Winキー+.` のショートカットから絵文字を直接入力する方がいいんじゃないかという気がしないでもないですが、諸般の事情により絵文字を入力することがそもそも困難・面倒、絵文字が使えない環境へ配慮必要というような状況に置かれているなら、活用を考えてもいいかもしれませんね。

### Fetch And Prune
設定項目名： `git-graph.repository.fetchAndPrune`

リモート側に存在するブランチが削除されたときに追跡をやめる機能のON/OFFを設定
ボタンを押してフェッチを行うときに裏で実行するコマンドが 
`git fetch --all` から`git fetch --all --prune` に変わります。

たとえば、複数人で開発していたり、複数環境を使って開発していたりすると、
リモートのブランチの情報が残り続けるということが起きます。

例えば以下の状況
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/d85dd0d0-1797-9c90-6a01-c6d1ac542173.png)
自分ではない誰かがブランチ`patch-1`を作り、プルリクマージ、ブランチ削除という作業をやった時。
リモート側は削除されていますが、単にフェッチするだけだとローカルリポジトリ内には残り続けます。

この仕様に助けられることもありますが、不要であることが明確ならば削除するのが良いです。

以下の設定を有効にします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/6bc60452-dad4-5141-16ef-d2a3530542bf.png)
そして画面右上のこのボタンを押します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/811f5d5f-2c42-dd4c-294d-6a99a879fe91.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/248663/5fba6501-816d-2ec3-6125-74b69556a954.png)
消えました。

VSCodeのgitの設定でも同様の項目があったりしますが、こちらは**ボタンを押したときのみ**動くので、
使い分けみたいなことは考えても良いかもしれません。

プロジェクトの性質や、自身の職責に合わせて要否が変わると思うので、考慮して選ぶと良いかと思います。


### Fetch And Prune Tags
設定項目名： `git-graph.repository.fetchAndPruneTags`

Fetch And Prune(`git-graph.repository.fetchAndPrune`)をONにしないとこのオプションは使えません。

実行されるコマンドが、
`git fetch --all` から`git fetch --all --prune --prune-tags`に変わります

先ほどはリモートブランチの削除に追従してローカル側のブランチ情報も削除するものでしたが、
こちらはタグで同様の処理を行います。

頻繁にタグを作ったり消したりが発生する運用スタイルを行う場合は特に必要かなという気がします。

## まとめ
いろいろ設定項目を眺めて、活用法がありそうなものを並べてはみましたが、
この記事を書きながら、ほとんど初期設定で困ることは無い気がしてきました。

唯一、**Custom Branch Glob Patterns** は活用の幅が広そうに感じました。
ブランチの命名規則を決めておき、それと組み合わせることで、複雑なブランチ戦略へ対応可能になる思います。
リポジトリ戦略にmonorepo方式を選択したりするとブランチの作りが独特で複雑になるかもしれません。
そういう場合に威力を発揮する・・・ような気がします。


以上になります。
ここまで読んでいただきありがとうございました。