【AIエディタ改造録】使いにくい標準チャット履歴を克服!macOSメール風3カラム拡張機能『Convo Mail』を自作した全記録
作成日:
更新日:

【AIエディタ改造録】使いにくい標準チャット履歴を克服!macOSメール風3カラム拡張機能『Convo Mail』を自作した全記録


🔧 論旨

VS Code や Antigravity IDE で毎日 AI と壁打ちしながら開発・執筆を進めていると、数週間でチャット履歴が何百件にも膨れ上がります。ところが標準の履歴ポップアップ(Search all convos...)は 「勝手についた英語タイトルを後から変えられない」「数件以外は『Show more…』で強制折りたたみされる」「会話本文の全文検索ができない」 という三重苦を抱えており、過去の大切な議論を探すたびにストレスが溜まります。

本記事では、ローカルに保存されている会話ログ(SQLite および JSONL)を活用し、macOS 純正『メール(Mail.app)』そっくりの常時 3 カラム表示・ワンクリックピン留め・自由な日本語タイトル変更・全文インクリメンタル検索を備えた専用 VS Code 拡張機能『Convo Mail』を AI と一緒に自作した全工程と、実装でハマった落とし穴の解決策を解説します。
🔧 合わせて読みたい深まる関連情報
🔧 対象となる方
  • AI エディタ(Antigravity IDE や VS Code 系環境)の 標準チャット履歴が探しにくく、「あの時の解決策どこだっけ?」と毎回迷子になっている方

  • 勝手に命名された英語の会話タイトルを 自分にとって分かりやすい日本語タイトルに書き換えてピン留め整理したい方

  • エディタ本体のコアファイルを無理に書き換えてアップデートで壊すのではなく、安全なローカル拡張機能(Webview + ローカルサーバー)として自分好みの管理画面を統合したい方

  • ダークモードでのリンク文字潰れやポート重複(EADDRINUSE)、クリップボード連携などの 実戦的なトラブル対処法 を知りたい方

吹出しアイコン

毎日 AI と相談しながら作業しとると、あっという間にチャット履歴が 200 件、300 件になるんじゃ。じゃが標準の履歴ボタンを押しても、似たような英語のタイトルがズラッと並ぶばかりで名前も変えられんし、「前に KaTeX の数式エラーを直した会話」を探そうにも本文検索すらできんのじゃよ……!

吹出しアイコン

すごくよく分かります!しかも画像生成などの裏方サブエージェントが動いた履歴まで一緒に混ざってしまうと、本当に見たいメインの対話がどんどん下に埋もれてしまいますよね。でも安心してください、実は会話データはすべて Mac の中に綺麗な形式で保存されているので、macOS のメールアプリみたいに一覧と中身が常時並んで見える専用マネージャー を自分で作れてしまうんです!


標準のチャット履歴ポップアップが抱える4つの不満

自動英語タイトルが変えられず過去ログが迷子

まず「そもそも標準の履歴ポップアップ自体を設定でカスタマイズできないのか?」とエディタ内部のフロントエンド実装を調査しました。その結果、標準ポップアップには次の仕様がハードコード(固定実装)されていることが分かりました。

  1. タイトルの自動命名・リネーム UI なし : 会話開始時に AI が自動で付けたタイトル(英語になりがち)がそのまま固定され、ユーザーが後から日本語の分かりやすい名前に変更する欄がありません。
  2. collapseLargeGroups: true による強制折りたたみ : 履歴が増えると直近の数件以外は Show 97 more... のように自動で折りたたまれ、毎回クリックして展開する手間が発生します。
  3. ホバー時しか出ない 1 件ずつの削除ボタン : 不要なテスト会話をまとめて整理したくても、行にマウスカーソルを乗せた時だけ右端にゴミ箱アイコンが出る仕様で、一括アーカイブができません。
  4. 検索対象が「タイトル文字列の部分一致」のみ : これが最大の弱点です。「あのコマンドを実行した会話」「あのエラーが出た時のやり取り」を本文から横断検索することができません。

強制折りたたみとタイトル検索のみの限界

ここで「エディタ本体の JavaScript ファイルに直接パッチを当てて折りたたみを解除する」という荒技も技術的には可能ですが、それをやると エディタの自動アップデートが来るたびに上書きされて元に戻ってしまう(最悪の場合、署名検証エラーで起動しなくなる) という致命的な弱点があります。

一方、会話ログの実体データ(発言テキスト、AI の回答、思考プロセス、ツール実行履歴)は、すべて手元の Mac 内(~/.gemini/ 配下の SQLite データベースおよび transcript.jsonl)に構造化データとして保存されています。「本体を壊さず、このローカルデータを読み取って macOS 純正メールのような 3 カラム画面で表示すれば、アップデートにも 100% 影響されない最強の履歴ツールになる!」という結論に至りました。


macOSメール風3カラム履歴ツールの設計と機能

一覧と本文が常時並ぶ3カラムと全文検索

目指したのは、わざわざ 1 件ずつ開いたり閉じたりしなくて済む 「macOS の『メール(Mail.app)』そのままの操作感」 です。完成した『Convo Mail』の画面構成は以下の 3 カラムになっています。

カラム位置役割と表示内容実装した快適ポイント
左ペイン(フォルダ列)「すべての会話」「📌 ピン留め」「📅 今日」「🕒 直近7日間」「🗑️ アーカイブ」の切り替えサブエージェント等の裏方ログに埋もれず、見たい期間のメイン会話だけをワンクリックで絞り込み可能。
中央ペイン(スレッド一覧)会話タイトル、更新日時、最初の質問プレビュー、メッセージ数、ピン留め星マーク(★)強制折りたたみゼロ!スクロールだけで何百件でも高速に見渡せ、⌘ + F で 本文まで含めた全文インクリメンタル検索 が瞬時に走る。
右ペイン(常時プレビュー)選択中の会話の全やり取り(自分の質問、AI の回答、実行コマンド、思考プロセス)ポップアップではなく常時右側に全文が開いているため、上下キーやクリックでメールをめくる感覚で過去ログを拾い読みできる。

外部メタデータJSONによるピン留めと改名保存

「タイトルを自由な日本語に変えたい」「よく見返す神回チャットを一番上にピン留めしたい」という要望を実現する際も、エディタ純正の SQLite データベース自体は絶対に直接書き換えない(読み取り専用にする) という安全設計を徹底しました。

純正データベースを外部から勝手に書き換えると、エディタ本体とロック競合を起こしたり、後述する「IDE 側の検索連携」が動かなくなったりするからです。代わりに、ピン留め状態・日本語のカスタムタイトル・アーカイブ状態だけを独立した軽量ファイル(convo_user_metadata.json)へ即時保存し、画面表示時に純正ログとマージする二層構造にしました。これなら純正データを 1 ビットも傷つけずに、何度再起動しても自分が付けた日本語タイトルとピン留めが永久に維持されます。


エディタ拡張機能としての統合と実装の落とし穴

ダークモードの文字潰れとポート重複の自動回避

最初は npm run convos(または日本語エイリアス npm run チャット履歴)でブラウザが開くローカルツールとして作り始めましたが、さらに使い勝手を極めるため、VS Code / Antigravity エディタ自身のネイティブ拡張機能 として組み込みました。

  • 左端アクティビティバーの「📨」専用アイコン からいつでもサイドバー検索&フルタブ 3 カラム表示を展開
  • 画面下ステータスバーの $(mail) チャット履歴 ボタン からもワンクリック起動
  • ソースコードはワークスペース内の tools/antigravity-convo-mail-ext/ に置き、拡張機能フォルダへシンボリックリンクを張ることで修正がリアルタイム反映される構成

実際に毎日使いながら潰した 3 つのリアルな実装トラブルと解決策 も共有しておきます。

🔧 🔧 自作ツール開発で実際に踏んだ3つの罠と解決コードの要点
  1. ダークモードでリンク文字が背景に沈んで読めない罠 : 暗い背景(#2b2b36)の上で Markdown のリンクを表示すると、ブラウザ標準の濃い青色(#0000ee)が当たって背景と同化し、文字が真っ黒に潰れてしまいました。CSS で未訪問・訪問済みリンクともに高輝度のスカイブルー(#60a5fa)やゴールド系、本文を #f8fafc(ほぼ純白)へ明示指定することで、5K モニターでもくっきり読める視認性を確保しました。

  2. 2 回目起動時のポート重複エラー(EADDRINUSE)回避 : バックグラウンドですでにポート 4567 のローカルサーバーが動いている時に再度コマンドを叩くと、Error: listen EADDRINUSE で異常終了してしまいます。server.on('error') で EADDRINUSE を検知した際はエラー終了せず、「既存サーバーが稼働中」と判断してそのまま対象ページを開くフェイルセーフ処理を入れました。

  3. カスタム日本語名と IDE 標準ピッカーの検索不一致 : 履歴ツール上でタイトルを「ブログ高速化の相談」と日本語にリネームした後、「🚀 IDEで開く」ボタンを押してその日本語タイトルをクリップボードにコピーしても、IDE 本体の Search all convos... 側は「元の英語タイトル」しか知らないためヒットしません!そこで「🚀 IDEで開く」を押した瞬間だけ、裏で保持している IDE 純正タイトル(先頭の ★ や 📌 記号も正規表現で除去した純粋な文字列) をクリップボードへ入れ、同時に vscode.commands.executeCommand('conversationPicker.showConversationPicker') で公式ピッカーを自動起動する連携を実装しました。

// extension.js(『🚀 IDEで開く』押下時の純正タイトル逆引き&ピッカー自動起動)
function handleOpenInIde(convoId, title) {
  if (!convoId && !title) return;

  // リネーム後の日本語名ではなく、IDE側データベースの純正タイトルを優先取得して記号を除去
  const ideTitle = getIdeTitle(convoId);
  let searchText = (ideTitle || (typeof title === 'string' ? title : '')).split('\n')[0].trim();
  searchText = searchText.replace(/^[★☆📌\s]+/, '').trim();
  const textToCopy = searchText || convoId;

  if (textToCopy) {
    vscode.env.clipboard.writeText(textToCopy);
  }

  // エディタ標準の会話選択ピッカーを自動で開き、⌘+V だけで即ジャンプ可能にする
  vscode.commands.executeCommand('conversationPicker.showConversationPicker');
}

公式ピッカー自動起動とローカル限定通信の守り

最後にセキュリティ面で絶対に忘れてはならない鉄則があります。こうした自分専用のローカル管理サーバーを Node.js 等で立てる際、server.listen(4567) のようにポート番号だけを書いてホスト名を省略すると、環境によっては 0.0.0.0(同じ Wi-Fi や LAN 内の他の端末からも覗ける状態)で待ち受けてしまう危険があります。

大切な会話ログを扱うローカルサーバーは、必ず server.listen(4567, '127.0.0.1')(ループバックアドレス限定バインド) を明示し、自分自身の Mac 内部からしか物理的にアクセスできないよう隔離することが鉄則です。

吹出しアイコン

左の封筒マークをポチッと押すだけで、大事な会話に★マークを付けて日本語の名前で整理整頓できるでちぃ!もう過去ログの海で溺れないでちね!


まとめ:不便なUIはAIと一緒に自分専用へ作り変える

既製品のアプリの「ちょっとした使いにくさ」も、昔なら我慢して使い続けるしかありませんでした。しかし今は、隣にいる AI に「標準履歴のここが不便だから、macOS のメールみたいな 3 カラム画面でピン留めと日本語リネームができる拡張機能を作ろう」と相談すれば、わずか数十分で自分専用の快適なコックピットが手に入ります。

  • 純正データベースは読み取り専用で守り、ピン留めや日本語リネームは別 JSON で安全に永続化する
  • ローカル管理サーバーは必ず 127.0.0.1 限定バインドにして外部からのアクセスを遮断する
  • ダークモードの配色コントラストや EADDRINUSE などのエッジケースを実機で丁寧に潰す

毎日何十回も触る画面だからこそ、小さな引っかかりを自分好みに解消したときの爽快感は格別です。ぜひ身近な「ここがもうちょっと便利だったらいいのに」から、自分専用ツールの DIY に挑戦してみてください!

お気に入りの場所で気持ちよさそうに丸くなって眠るノルウェージャンフォレストキャット

▲ 探し物の時間がゼロになれば、そのぶんゆっくり休憩する時間も増えます