VSCode拡張に設定機能を付ける

hashrock

Kivi向けに設定項目を追加したいのである。追加したいのは下記:

DENO_KV_FETCH_SIZE: listの一度にロードする数
DENO_KV_PREVIEW_VALUE: listにvalueのプレビューを表示するかどうか

hashrock

UXガイドラインがここ。

実際はContribution pointに設定値を列挙するだけっぽいかな。

hashrock

これでいいのかな？

    "configuration": {
      "title": "Kivi",
      "properties": {
        "kivi.listFetchSize": {
          "type": "number",
          "default": 100,
          "description": "The number of keys to fetch at a time."
        },
        "kivi.previewValue": {
          "type": "boolean",
          "default": true,
          "description": "Whether to preview values in the explorer."
        }
      }
    }
  },

hashrock

UIはできたみたい。

あとはどうロードするか。

hashrock

相変わらず見づらいVSCodeのAPI Doc:

Workspace configulationの説明は良さそうかも。

hashrock

ダメ元でwebviewから直接configを参照できないか確認

  //@ts-ignore
  const config = vscode.workspace.getConfiguration("kivi").get("previewValue");
  console.log("Config:kivi.previewValue", config);

無論だめ

hashrock

そもそもWebviewで const vscode = acquireVsCodeApi(); させてもらえるけどこれどういう制約があるんだろ。確認してみる。

postMessageとgetState / setStateはさせてもらえるらしい。stateってextensionHost側と共有できるんだろうか？まあいいや

hashrock

どちらかというとsetStateはwebviewの状態保持のために使う感じかなあ。webviewはいつdisposeされてもおかしくないので。extensionHostと共有されている可能性は低そう。

これで設定値はpostMessageで取ってくるのが安牌かなあと思った。

hashrock

ちなみにpostMessageでのextensionHost <-> webviewのやり取りなんだけど、こんな感じで抽象化している。

こういうのもっと一般的なやり方ないのかな？

hashrock

OK, だいたい動いた